/* Onest — единственный шрифт сайта. Размещён на нашем сервере (без запросов к Google Fonts).
   Источник: github.com/google/fonts (ofl/onest), © The Onest Project Authors, SIL Open Font License 1.1
   (assets/fonts/OFL-Onest.txt). Статические начертания 400/600/700, подмножество: латиница + кириллица + знаки. */
@font-face {
  font-family: "Onest";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/onest-400.woff2) format("woff2");
}
@font-face {
  font-family: "Onest";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(assets/fonts/onest-600.woff2) format("woff2");
}
@font-face {
  font-family: "Onest";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(assets/fonts/onest-700.woff2) format("woff2");
}
/* Inter Tight — шрифт заголовков (H1/H2). © The Inter Project Authors, SIL OFL 1.1 (assets/fonts/OFL-InterTight.txt).
   Источник: github.com/google/fonts (ofl/intertight). Статическое 800, подмножество латиница + кириллица. */
@font-face {
  font-family: "Inter Tight";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(assets/fonts/intertight-800.woff2) format("woff2");
}

/* Midas Digital — дизайн-система (ТЗ п. 4). Один шрифт Onest, тёмная тема, золото только в акцентах. */
:root {
  --bg: #07080D;
  --surface: #10121A;
  --surface-2: #161924;
  --border: rgba(255, 255, 255, 0.08);
  --border-hover: rgba(255, 255, 255, 0.16);
  --text: #F2F0EA;
  --text-muted: #A3A7B3;
  --gold: #D4B06A;
  --gold-hover: #E2C384;
  --gold-soft: rgba(212, 176, 106, 0.12);
  --gold-fill: #D4B06A;
  --gold-fill-hover: #E2C384;
  --gold-line: rgba(212, 176, 106, .35);
  --border-strong: rgba(255, 255, 255, .28);
  --danger: #C26B5A;
  --danger-strong: #E08C77;
  --placeholder: #7D8290;
  --on-gold: #14110A;
  --error: #F08A7E;
  --success: #8FD6A4;
  --radius: 16px;
  --header-h: 72px;
  --pad: 24px;
  --section: 120px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --font: "Onest", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Inter Tight", "Onest", system-ui, sans-serif;
}
@media (max-width: 767px) {
  :root { --pad: 20px; --section: 72px; --header-h: 64px; }
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 16px); -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font);
  font-size: 17px;
  line-height: 1.6;
  color: var(--text);
  background: var(--bg);
  font-variant-numeric: lining-nums;
  font-feature-settings: "lnum" 1;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  min-height: 100vh;
}
img, svg, canvas { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
button, input, textarea { font: inherit; color: inherit; }
b, strong { font-weight: 600; color: var(--text); }
.tnum { font-variant-numeric: lining-nums tabular-nums; }
.nw { white-space: nowrap; }
[hidden] { display: none !important; }

h1, h2, h3 { text-wrap: balance; letter-spacing: -0.02em; line-height: 1.15; color: var(--text); }
h1 { font-weight: 800; }
h1, h2 { font-family: var(--font-display); font-variant-numeric: lining-nums; }
h2 { font-weight: 800; font-size: clamp(34px, 4.6vw, 60px); letter-spacing: -0.03em; line-height: 1; }
h3 { font-weight: 600; font-size: 20px; letter-spacing: -0.01em; line-height: 1.3; }
p { text-wrap: pretty; }

:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; border-radius: 6px; }

.skip {
  position: absolute; left: 12px; top: -60px; z-index: 200;
  background: var(--gold); color: var(--on-gold); padding: 10px 16px; border-radius: 999px; font-weight: 600;
}
.skip:focus { top: 12px; }

/* 4.10 звёздный фон */
.stars { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; }
main, .footer { position: relative; z-index: 1; }

/* 4.5 контейнер */
.container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 var(--pad); }
.narrow { max-width: 880px; }

/* типографика секций */
.eyebrow {
  font-size: 13px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--gold); margin-bottom: 16px;
}
.section { padding: var(--section) 0; }
.section + .section { padding-top: 0; }
.process + .section { padding-top: calc(var(--section) * .6); }
.section__head { max-width: 760px; margin-bottom: 48px; }
.section__lead { margin-top: 16px; color: var(--text-muted); font-size: 18px; }
.muted-sm { font-size: 14px; color: var(--text-muted); }

/* 4.8 кнопки */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 52px; padding: 0 28px; border-radius: 999px;
  font-size: 16px; font-weight: 600; line-height: 1; white-space: nowrap;
  border: 1px solid transparent; cursor: pointer;
  transition: background-color .2s var(--ease), border-color .2s var(--ease), color .2s var(--ease), opacity .2s;
}
.btn--primary { background: var(--gold-fill); color: var(--on-gold); box-shadow: 0 4px 16px rgba(0, 0, 0, .3); }
.btn--primary:hover { background: var(--gold-fill-hover); }
.btn--secondary { background: transparent; color: var(--text); border-color: var(--border-hover); }
.btn--secondary:hover { border-color: var(--border-strong); }
.btn--sm { height: 44px; padding: 0 20px; font-size: 15px; }
.btn--block { width: 100%; }
.btn[disabled], .btn[aria-disabled="true"] { opacity: .5; cursor: not-allowed; }
.btn-row { display: flex; flex-wrap: wrap; gap: 12px; }
.btn-row .btn { min-width: 220px; }

/* 4.7 карточки */
.card {
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 32px; transition: border-color .2s var(--ease);
}
.card:hover { border-color: var(--border-hover); }
.card h3 { margin-top: 12px; }
.card__text { margin-top: 12px; color: var(--text-muted); }
.card__btn { margin-top: 24px; }
.card--col { display: flex; flex-direction: column; }
.card__note {
  margin-top: auto; padding-top: 16px; border-top: 1px solid var(--border);
  font-size: 14px; color: var(--text-muted);
}
.card--col .list { margin-bottom: 24px; }
@media (max-width: 767px) { .card { padding: 24px; } }

.tag {
  display: inline-block; font-size: 12px; font-weight: 600; letter-spacing: .04em;
  color: var(--gold); background: var(--gold-soft); padding: 5px 10px; border-radius: 999px; line-height: 1.3;
}

.grid { display: grid; gap: 24px; }
.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1023px) { .grid--3 { grid-template-columns: 1fr; } }
@media (max-width: 767px) { .grid--2 { grid-template-columns: 1fr; } }

.list { margin-top: 16px; display: grid; gap: 10px; }
.list li { position: relative; padding-left: 20px; color: var(--text); }
.list li::before {
  content: ""; position: absolute; left: 0; top: .62em; width: 6px; height: 6px; border-radius: 50%; background: var(--gold);
}

/* 6. шапка */
.header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100; height: var(--header-h);
  background: rgba(7, 8, 13, .85); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
}
.header__row { height: 100%; display: flex; align-items: center; gap: 24px; }
.logo { font-weight: 700; font-size: 18px; letter-spacing: .14em; color: var(--text); display: inline-flex; align-items: baseline; gap: 6px; min-height: 44px; align-items: center; }
.logo span { color: var(--gold); font-weight: 400; letter-spacing: .14em; }
.header__nav { display: flex; gap: 4px; margin-left: auto; }
.header__nav a { padding: 12px 12px; font-size: 15px; color: var(--text-muted); border-radius: 8px; transition: color .2s; }
.header__nav a:hover { color: var(--text); }
.header__actions { display: flex; align-items: center; gap: 16px; }
.header__phone { font-weight: 600; font-size: 15px; padding: 12px 0; white-space: nowrap; }
.header__phone:hover { color: var(--gold-hover); }
.icon-btn {
  display: none; width: 44px; height: 44px; align-items: center; justify-content: center;
  border-radius: 999px; border: 1px solid var(--border-hover); background: transparent; cursor: pointer; color: var(--text);
}
.burger { position: relative; width: 18px; height: 12px; }
.burger i { position: absolute; left: 0; right: 0; height: 2px; background: currentColor; border-radius: 2px; transition: transform .25s var(--ease), top .25s var(--ease); }
.burger i:first-child { top: 1px; }
.burger i:last-child { top: 9px; }
.header__burger[aria-expanded="true"] .burger i:first-child { top: 5px; transform: rotate(45deg); }
.header__burger[aria-expanded="true"] .burger i:last-child { top: 5px; transform: rotate(-45deg); }
@media (max-width: 1099px) { .header__phone { display: none; } }
@media (max-width: 959px) {
  .header__nav, .header__cta { display: none; }
  .header__actions { margin-left: auto; gap: 8px; }
  .icon-btn { display: inline-flex; }
}
.mmenu {
  position: fixed; inset: var(--header-h) 0 0 0; z-index: 99; background: var(--bg);
  display: flex; flex-direction: column; justify-content: space-between; padding: 24px var(--pad) 32px; overflow-y: auto;
}
.mmenu[hidden] { display: none; }
.mmenu__nav { display: flex; flex-direction: column; }
.mmenu__nav a { font-size: 24px; font-weight: 600; padding: 14px 0; border-bottom: 1px solid var(--border); }
.mmenu__foot { display: grid; gap: 16px; margin-top: 32px; }
.mmenu__phone { font-size: 22px; font-weight: 600; padding: 8px 0; }
body.menu-open { overflow: hidden; }

/* 7. hero — крупный заголовок слева, текст и кнопки справа */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.hero {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: min(100svh, 960px); display: flex; align-items: center;
  padding: calc(var(--header-h) + 56px) 0 96px;
  /* статичный фон: он же вид при prefers-reduced-motion и без WebGL */
  background:
    radial-gradient(55% 65% at 80% 62%, rgba(212, 176, 106, .20), transparent 70%),
    radial-gradient(35% 45% at 95% 18%, rgba(226, 195, 132, .10), transparent 70%),
    radial-gradient(60% 55% at 55% 108%, rgba(150, 110, 50, .22), transparent 70%),
    var(--bg);
}
.hero > .container { position: relative; z-index: 1; }
/* мягкие тёмные «подложки» под текстом — чтобы золото за ними не съедало контраст */
.hero__head, .hero__side { position: relative; }
.hero__head::before, .hero__side::before {
  content: ""; position: absolute; inset: -16% -9%; z-index: -1; pointer-events: none;
  background: rgba(7, 8, 13, .92); border-radius: 48px; filter: blur(34px);
}
.hero .hero__lead { color: #C4C8D0; }
.hero .hero__trust { color: #B4B8C2; }
.hero__fx { position: absolute; inset: -3%; z-index: -3; width: 106%; height: 106%; opacity: 0; filter: blur(10px); transition: opacity 1.4s var(--ease); pointer-events: none; }
.hero.fx-on .hero__fx { opacity: 1; }
/* затемнение за текстом (контраст ≥ 4.5:1) + плавный переход в следующую секцию + зерно */
.hero__veil {
  position: absolute; inset: 0; z-index: -2; pointer-events: none;
  background:
    radial-gradient(ellipse 50% 55% at 26% 56%, rgba(7, 8, 13, .45), transparent 80%),
    radial-gradient(ellipse 40% 48% at 76% 54%, rgba(7, 8, 13, .4), transparent 80%),
    linear-gradient(180deg, rgba(7, 8, 13, .6) 0, rgba(7, 8, 13, 0) 18%, rgba(7, 8, 13, 0) 80%, var(--bg) 100%);
}
.hero::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: url(assets/grain.webp) repeat; background-size: 96px 96px; opacity: .07; mix-blend-mode: overlay;
}
.hero__grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 32px 56px; align-items: end; }
.hero__title { font-size: clamp(56px, 7.6vw, 104px); font-weight: 800; letter-spacing: -0.03em; line-height: .95; }
.hero__title-vis { display: block; }
.hero__gold { display: block; color: var(--gold); }
.rot { display: inline-grid; vertical-align: top; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }
.rot__w { grid-area: 1 / 1; transform: translateY(105%); opacity: 0; transition: transform .7s var(--ease), opacity .5s var(--ease); }
.rot__w.is-on { transform: translateY(0); opacity: 1; }
.rot__w.is-out { transform: translateY(-105%); opacity: 0; }
.rot-static { display: none; }
.hero__side { padding-bottom: 10px; }
.hero__lead { font-size: 18px; color: var(--text-muted); max-width: 520px; }
.hero__cta { margin-top: 32px; }
.hero__cta .btn { min-width: 0; flex: 1 1 200px; }
@media (min-width: 768px) { .hero__cta:has(> .btn:nth-child(3)) .btn--primary { flex-basis: 100%; } }   /* три кнопки: заявка на всю ширину, мессенджеры — парой */
.hero__trust { margin-top: 22px; font-size: 14px; color: var(--text-muted); }
@media (max-width: 1023px) {
  .hero { padding: calc(var(--header-h) + 40px) 0 200px; min-height: 100svh; align-items: flex-start; }
  .hero__veil {
    background:
      linear-gradient(180deg, rgba(7, 8, 13, .45) 0, rgba(7, 8, 13, .12) 30%, rgba(7, 8, 13, 0) 80%, var(--bg) 100%);
  }
  .hero__head::before, .hero__side::before { inset: -8% -3% -6%; background: rgba(7, 8, 13, .8); filter: blur(22px); }
  .hero__side::before { inset: -6% -4% -16%; background: rgba(7, 8, 13, .84); }
  .hero .hero__trust { color: #C8CCD4; }
  .hero .eyebrow, .hero .hero__lead, .hero .hero__trust { text-shadow: 0 0 2px rgba(7, 8, 13, 1), 0 0 6px rgba(7, 8, 13, .95), 0 1px 16px rgba(7, 8, 13, .95), 0 0 32px rgba(7, 8, 13, .85); }
  .hero__title { text-shadow: 0 0 4px rgba(7, 8, 13, .8), 0 2px 26px rgba(7, 8, 13, .9); }
  .hero__grid { grid-template-columns: 1fr; align-items: start; }
  .hero__side { padding-bottom: 0; }
}
@media (max-width: 767px) {
  .hero__title { font-size: clamp(40px, 12.4vw, 56px); }
  .hero__lead { font-size: 17px; }
  .btn-row { flex-direction: column; }
  .btn-row .btn { width: 100%; min-width: 0; flex: none; }
}
@media (prefers-reduced-motion: reduce) {
  .rot { display: none; }
  .rot-static { display: inline; }
}

/* 8. кейсы — компактная карточка в две колонки: скриншот ~45% слева, текст справа */
.case { display: grid; gap: 0; padding: 0; border-radius: 24px; overflow: hidden; }
.case.has-media { grid-template-columns: minmax(0, 40fr) minmax(0, 60fr); align-items: stretch; }
.case__media {
  position: relative; display: block; overflow: hidden; background: var(--surface-2);
  height: 100%; min-height: 240px; border-right: 1px solid var(--border);
}
.case__media img, .case__media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: left top; transform: scale(1); transition: transform .9s var(--ease); }
.case__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(7,8,13,0) 55%, rgba(7,8,13,.7) 100%); pointer-events: none; }
.case__ov { position: absolute; left: 18px; bottom: 16px; z-index: 2; font-family: var(--font-display); font-weight: 800; font-size: 18px; letter-spacing: -0.02em; line-height: 1; color: #fff; }
.case__arrow {
  position: absolute; right: 14px; bottom: 12px; z-index: 2; width: 56px; height: 56px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center; background: var(--text); color: var(--bg);
  transition: background-color .3s var(--ease), color .3s var(--ease);
}
.case__arrow svg { transform: rotate(-45deg); transition: transform .45s var(--ease); }
.case__media:hover img, .case__media:hover video, .case__media:focus-visible img { transform: scale(1.035); }
.case__media:hover .case__arrow, .case__media:focus-visible .case__arrow { background: var(--gold); color: var(--on-gold); }
.case__media:hover .case__arrow svg, .case__media:focus-visible .case__arrow svg { transform: rotate(0); }
.case__media:focus-visible { outline: 2px solid var(--gold); outline-offset: -4px; }
.case__body { padding: 24px 28px; align-self: center; }
.case__title { font-size: 22px; }
.case__brand { margin-top: 4px; color: var(--text-muted); font-size: 15px; }
.case__dl { margin-top: 18px; display: grid; grid-template-columns: max-content 1fr; gap: 8px 20px; font-size: 15px; }
.case__dl dt { font-size: 13px; font-weight: 600; color: var(--text-muted); padding-top: 2px; }
.case__dl dd { color: var(--text); }
.case__actions { margin-top: 20px; display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.case__domain { font-size: 14px; color: var(--text-muted); }
.cases__formats { margin-top: 24px; }
.cases__formats .card { border-radius: 24px; }
@media (max-width: 1023px) {
  .case.has-media { grid-template-columns: 1fr; }
  .case__media { height: auto; min-height: 0; max-height: none; aspect-ratio: 16 / 10; border-right: 0; border-bottom: 1px solid var(--border); }
}
@media (max-width: 767px) {
  .case { border-radius: 20px; }
  .case__arrow { width: 56px; height: 56px; }
  .case__body { padding: 24px; }
  .case__dl { grid-template-columns: 1fr; gap: 4px; }
  .case__dl dd { margin-bottom: 10px; }
  .case__actions .btn { width: 100%; }
}

/* 9. услуги */
.flagship { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; margin-bottom: 24px; }
.flagship h3 { font-size: 28px; }
.flagship .btn { margin-top: 28px; }
.flagship__price { margin-top: 16px; font-size: 22px; font-weight: 600; }
.flagship__label { font-size: 13px; font-weight: 600; color: var(--text-muted); }
.flagship__list { padding-left: 48px; border-left: 1px solid var(--border); }
@media (max-width: 767px) {
  .flagship { grid-template-columns: 1fr; gap: 28px; }
  .flagship__list { padding-left: 0; border-left: 0; padding-top: 24px; border-top: 1px solid var(--border); }
  .flagship .btn { width: 100%; }
}
.benefits { margin-top: 64px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.benefits li::before { content: ""; display: block; width: 32px; height: 1px; background: var(--gold); margin-bottom: 20px; }
.benefits h3 { font-size: 18px; font-weight: 600; }
.benefits p { margin-top: 8px; color: var(--text-muted); }
@media (max-width: 767px) { .benefits { grid-template-columns: 1fr; margin-top: 48px; } }

/* 10. аудит */
.risk h3 { margin-bottom: 12px; }
.risk p { color: var(--text-muted); }
.risk p + p { margin-top: 10px; }
.audit__foot { margin-top: 32px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; }
.audit__foot p { max-width: 620px; }
@media (max-width: 767px) { .audit__foot .btn { width: 100%; } }

/* 11. как работаем — мобильный/по умолчанию: вертикальный список с линией слева */
.process__viewport { position: relative; }
.process__progress { display: none; }
.steps { display: grid; grid-template-columns: 1fr; gap: 32px; position: relative; padding-left: 32px; }
.steps::before { content: ""; position: absolute; left: 6px; top: 8px; bottom: 8px; width: 1px; background: var(--gold); opacity: .3; }
.step { position: relative; }
.step__dot { position: absolute; left: -32px; top: 4px; width: 13px; height: 13px; border-radius: 50%; background: var(--bg); border: 1px solid var(--gold); }
.step__num { font-size: 14px; font-weight: 600; color: var(--gold); }
.step h3 { margin-top: 6px; font-size: 20px; }
.step p { margin-top: 8px; color: var(--text-muted); font-size: 15px; max-width: 420px; }
.step__chat { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-top: 16px; }
.bubble {
  display: inline-block; max-width: 280px; padding: 10px 16px; border-radius: 18px; font-size: 15px; line-height: 1.35;
  background: var(--surface-2); border: 1px solid var(--border); color: var(--text);
}
.bubble__ok { display: inline-block; width: 5px; height: 10px; margin-left: 8px; border: solid var(--gold); border-width: 0 2px 2px 0; transform: rotate(45deg) translateY(-2px); }
.bubble--them { border-bottom-left-radius: 6px; }
.bubble--us { align-self: flex-start; background: var(--gold-soft); border-color: rgba(212, 176, 106, .28); color: var(--text); border-bottom-left-radius: 6px; }
.process__foot { margin-top: 40px; }

/* десктоп ≥1024: закреплённая сцена, этапы едут вбок при прокрутке (включает script.js классом .is-pinned) */
@media (min-width: 1024px) {
  .process.is-pinned { padding: 0; }
  .process.is-pinned .process__pin { position: sticky; top: var(--header-h); height: calc(100vh - var(--header-h)); overflow: hidden; display: flex; align-items: center; }
  .process.is-pinned .process__inner { width: 100%; }
  .process.is-pinned .section__head { margin-bottom: 40px; }
  .process.is-pinned .process__progress { display: block; position: absolute; left: 0; right: 0; top: 6px; height: 1px; background: rgba(212, 176, 106, .2); }
  .process.is-pinned .process__progress span { display: block; height: 100%; background: var(--gold); transform-origin: 0 50%; transform: scaleX(0); }
  .process.is-pinned .steps { display: flex; gap: 0; padding-left: 0; width: max-content; will-change: transform; }
  .process.is-pinned .steps::before { display: none; }
  .process.is-pinned .step { width: 400px; flex: none; padding-right: 56px; padding-top: 32px; }
  .process.is-pinned .step__dot { left: 0; top: 0; }
  .process.is-pinned .step.is-reached .step__dot { background: var(--gold); }
  .process.is-pinned .step h3 { font-family: var(--font-display); font-weight: 800; font-size: 34px; letter-spacing: -0.03em; }
  .process.is-pinned .step__chat { min-height: 110px; margin-top: 24px; }
  .process.is-pinned .bubble { opacity: 0; transform: translateY(14px) scale(.96); transform-origin: 0 100%; transition: opacity .45s var(--ease), transform .45s var(--ease); }
  .process.is-pinned .bubble.is-on { opacity: 1; transform: none; }
  .process.is-pinned .process__foot { margin-top: 32px; }
}

/* 12. кому подходим */
.fit { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.fit li { position: relative; padding-left: 22px; font-size: 18px; }
.fit li::before { content: ""; position: absolute; left: 0; top: .6em; width: 8px; height: 8px; border-radius: 50%; background: var(--gold); }
@media (max-width: 767px) { .fit { grid-template-columns: 1fr; gap: 20px; } }

/* 13. FAQ */
.faq { border-top: 1px solid var(--border); }
.faq__item { border-bottom: 1px solid var(--border); }
.faq__item[hidden] { display: none; }
.faq__q { font-size: 18px; font-weight: 600; }
.faq__q button {
  width: 100%; min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 24px;
  padding: 18px 0; background: none; border: 0; text-align: left; cursor: pointer; font-weight: 600; letter-spacing: -0.01em;
}
.faq__q button:hover { color: var(--gold-hover); }
.faq__icon { position: relative; flex: none; width: 20px; height: 20px; transition: transform .3s var(--ease); }
.faq__icon::before, .faq__icon::after { content: ""; position: absolute; left: 50%; top: 50%; background: var(--gold); border-radius: 1px; }
.faq__icon::before { width: 16px; height: 2px; margin: -1px 0 0 -8px; }
.faq__icon::after { width: 2px; height: 16px; margin: -8px 0 0 -1px; }
.faq__q button[aria-expanded="true"] .faq__icon { transform: rotate(45deg); }
.faq__a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .3s var(--ease); }
.faq__a.is-open { grid-template-rows: 1fr; }
.faq__inner { overflow: hidden; }
.faq__inner p { padding: 0 44px 24px 0; color: var(--text-muted); }

/* 14. контакты */
.contact { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 24px; align-items: stretch; }
@media (max-width: 959px) { .contact { grid-template-columns: 1fr; } }
.field { margin-bottom: 20px; }
.field__label { display: block; font-size: 14px; font-weight: 600; margin-bottom: 8px; }
.field__opt { font-weight: 400; color: var(--text-muted); }
.field input, .field textarea {
  width: 100%; min-height: 52px; padding: 14px 16px; border-radius: 12px;
  background: var(--surface-2); border: 1px solid var(--border); color: var(--text); font-size: 16px;
  transition: border-color .2s;
}
.field textarea { resize: vertical; min-height: 112px; }
.field input::placeholder, .field textarea::placeholder { color: #7D8290; }
.field input:hover, .field textarea:hover { border-color: var(--border-hover); }
.field input:focus, .field textarea:focus { outline: none; border-color: var(--gold); }
.field input:focus-visible, .field textarea:focus-visible { outline: 2px solid var(--gold); outline-offset: 1px; }
.field.has-error input { border-color: var(--error); }
.field__error { min-height: 0; font-size: 13px; color: var(--error); margin-top: 6px; }
.field__error:empty { display: none; }
.lead__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.check { margin: 4px 0 24px; }
.check__input { position: absolute; opacity: 0; width: 20px; height: 20px; margin: 0; }
.check__label { display: flex; gap: 12px; align-items: flex-start; font-size: 14px; color: var(--text-muted); cursor: pointer; }
.check__label a { color: var(--text); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--border-hover); }
.check__label a:hover { color: var(--gold-hover); }
.check__box {
  flex: none; width: 20px; height: 20px; margin-top: 1px; border-radius: 5px;
  background: var(--surface-2); border: 1px solid var(--border-hover); position: relative; transition: background-color .15s, border-color .15s;
}
.check__box::after {
  content: ""; position: absolute; left: 6px; top: 2px; width: 6px; height: 11px;
  border: solid var(--on-gold); border-width: 0 2px 2px 0; transform: rotate(45deg); opacity: 0;
}
.check__input:checked + .check__label .check__box { background: var(--gold); border-color: var(--gold); }
.check__input:checked + .check__label .check__box::after { opacity: 1; }
.check__input:focus-visible + .check__label .check__box { outline: 2px solid var(--gold); outline-offset: 3px; }

.lead__status { margin-top: 12px; font-size: 14px; }
.lead__status:empty { display: none; }
.lead__status.is-error { color: var(--error); }
.lead__status a { text-decoration: underline; text-underline-offset: 3px; }
.lead__hint { margin-top: 12px; font-size: 14px; color: var(--text-muted); }
.lead__success { text-align: left; padding: 8px 0; }
.lead__success:focus { outline: none; }
.lead__success-mark { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 50%; background: var(--gold-soft); color: var(--gold); }
.lead__success h3 { margin-top: 16px; font-size: 24px; }
.lead__success p { margin: 8px 0 24px; color: var(--text-muted); }

.contact__side { display: flex; flex-direction: column; }
.contact__side > h3 { margin-top: 0; }
.contact__rows { margin-top: 24px; display: grid; gap: 22px; }
.contact__row { display: flex; gap: 16px; align-items: flex-start; }
.contact__icon { flex: none; width: 44px; height: 44px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--border); color: var(--gold); }
.contact__val { display: flex; flex-direction: column; }
.contact__label { font-size: 13px; color: var(--text-muted); }
.contact__phone { white-space: nowrap; font-size: 24px; font-weight: 600; line-height: 1.3; min-height: 44px; display: inline-flex; align-items: center; }
.contact__phone2 { white-space: nowrap; font-size: 16px; color: var(--text-muted); min-height: 44px; display: inline-flex; align-items: center; }
.contact__phone:hover, .contact__phone2:hover, .contact__link:hover { color: var(--gold-hover); }
.contact__link { font-size: 18px; font-weight: 600; padding: 8px 0; }
.contact__text { font-size: 16px; padding-top: 4px; }
@media (max-width: 400px) { .contact__side { padding: 24px 20px; } .contact__row { gap: 12px; } .contact__phone { font-size: 22px; } }

/* глобус (оставлен по решению заказчика; без рамки, ленивая загрузка) */
.globe { margin-top: auto; padding-top: 24px; }
.globe__stage {
  position: relative; width: 100%; max-width: 380px; aspect-ratio: 1 / 1; margin: 0 auto;
  touch-action: pan-y; user-select: none; -webkit-user-select: none;
}
.globe__stage.is-live { touch-action: none; }
.globe__fallback, .globe__canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.globe__fallback { object-fit: contain; }
.globe__canvas { opacity: 0; transition: opacity .6s var(--ease); cursor: grab;
  -webkit-mask-image: radial-gradient(closest-side, #000 86%, transparent 100%);
  mask-image: radial-gradient(closest-side, #000 86%, transparent 100%); }
.globe__stage.is-loaded .globe__canvas { opacity: 1; }
.globe__stage.is-loaded .globe__fallback { opacity: 0; transition: opacity .6s; }
.globe__stage.is-dragging .globe__canvas { cursor: grabbing; }
.globe__start {
  position: absolute; left: 50%; bottom: 8px; transform: translateX(-50%); z-index: 5;
  min-height: 44px; padding: 0 18px; border-radius: 999px; font-size: 14px; font-weight: 600;
  background: rgba(7, 8, 13, .8); border: 1px solid var(--border-hover); cursor: pointer; white-space: nowrap;
}
.globe__start[hidden] { display: none; }
.globe__caption { margin-top: 12px; text-align: center; font-size: 14px; color: var(--text-muted); }
.orbit__countries { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.orbit__country {
  position: absolute; left: 0; top: 0; font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  color: rgba(255, 255, 255, .92); white-space: nowrap; text-shadow: 0 0 6px rgba(0,0,0,.95), 0 1px 2px #000;
  opacity: 0; transition: opacity .2s;
}
.orbit__country.is-hidden, .orbit__pin.is-hidden { opacity: 0 !important; visibility: hidden; }
.orbit__pin { position: absolute; left: 0; top: 0; z-index: 4; pointer-events: none; display: flex; flex-direction: column; align-items: center; gap: 6px; opacity: 0; transition: opacity .2s; }
.orbit__pin-mark { position: relative; width: 22px; height: 22px; display: grid; place-items: center; }
.orbit__pin-radar { position: absolute; inset: 0; border-radius: 50%; border: 1px solid rgba(226, 195, 132, .6); animation: pinRadar 2.4s ease-out infinite; }
.orbit__pin-radar--delay { animation-delay: 1.2s; }
@keyframes pinRadar { 0% { transform: scale(.35); opacity: .85; } 100% { transform: scale(2.1); opacity: 0; } }
.orbit__pin-diamond { width: 9px; height: 9px; background: var(--gold); transform: rotate(45deg); border-radius: 1px; }
.orbit__pin-text { display: flex; flex-direction: column; align-items: center; gap: 2px; text-shadow: 0 0 8px rgba(0,0,0,.9), 0 1px 2px #000; white-space: nowrap; }
.orbit__pin-city { font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.orbit__pin-studio { font-size: 10px; font-weight: 400; color: var(--gold-hover); }

/* 15. футер */
.footer { border-top: 1px solid var(--border); padding: 56px 0 48px; }
.footer__grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 32px; }
.footer__col { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; font-size: 15px; }
.footer__col a:not(.logo) { padding: 10px 0; color: var(--text); }
.footer__col a:not(.logo):hover { color: var(--gold-hover); }
.footer__title { font-size: 13px; font-weight: 600; color: var(--text-muted); margin-bottom: 4px; }
.footer__muted { color: var(--text-muted); }
@media (max-width: 767px) { .footer__grid { grid-template-columns: 1fr; } }

/* юридические страницы и 404 */
.legal-header .header__row { justify-content: space-between; }
.legal-back { color: var(--text-muted); font-size: 15px; padding: 12px 0; }
.legal-back:hover { color: var(--text); }
.legal { max-width: 880px; padding: calc(var(--header-h) + 64px) var(--pad) 96px; margin: 0 auto; }
.legal h1 { font-size: clamp(30px, 4.5vw, 44px); margin-bottom: 12px; }
.legal__meta { color: var(--text-muted); font-size: 14px; }
.legal__lead { color: var(--text-muted); margin-top: 20px; }
.legal__toc { margin-top: 32px; padding: 24px 32px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); }
.legal__toc ol { list-style: decimal; padding-left: 20px; columns: 2 16rem; column-gap: 32px; }
.legal__toc li { margin: 4px 0; color: var(--text-muted); }
.legal__toc a { color: var(--text); }
.legal section { margin-top: 40px; }
.legal h2 { font-size: 22px; font-weight: 600; margin-bottom: 12px; }
.legal p, .legal li { color: var(--text-muted); font-size: 16px; }
.legal p + p { margin-top: 10px; }
.legal ul.legal__list { margin: 10px 0; }
.legal ul.legal__list > li { position: relative; padding-left: 20px; margin: 6px 0; }
.legal ul.legal__list > li::before { content: ""; position: absolute; left: 0; top: .62em; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); }
.legal a:not(.btn) { color: var(--text); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--border-hover); }
.legal a:not(.btn):hover { color: var(--gold-hover); }
.legal__card { margin-top: 12px; padding: 24px 28px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); }
.legal__card dl { display: grid; grid-template-columns: minmax(9rem, max-content) 1fr; gap: 6px 20px; font-size: 15px; }
.legal__card dt { color: var(--text-muted); }
.legal__card dd { color: var(--text); }
.legal__table { width: 100%; border-collapse: collapse; margin-top: 12px; font-size: 15px; }
.legal__table th, .legal__table td { text-align: left; vertical-align: top; padding: 10px 12px; border-bottom: 1px solid var(--border); color: var(--text-muted); }
.legal__table th { color: var(--text); font-weight: 600; font-size: 14px; }
.legal__after-table { margin-top: 12px; }
.legal__note { margin-top: 40px; }
.legal__actions { margin-top: 32px; }
@media (max-width: 767px) {
  .legal__card dl { grid-template-columns: 1fr; gap: 2px; }
  .legal__card dd { margin-bottom: 8px; }
  .legal__toc { padding: 20px; }
  .legal__table { display: block; overflow-x: auto; }
}
.notfound { min-height: 70vh; display: flex; flex-direction: column; justify-content: center; padding: calc(var(--header-h) + 64px) 0 96px; }
.notfound__code { font-size: 14px; font-weight: 600; letter-spacing: .12em; color: var(--gold); }
.notfound h1 { font-size: clamp(32px, 5vw, 52px); margin-top: 12px; }
.notfound p { margin-top: 16px; color: var(--text-muted); max-width: 560px; }
.notfound .btn-row { margin-top: 32px; }


/* бегущая строка */
.marquee { position: relative; z-index: 1; overflow: hidden; padding: 28px 0; border-block: 1px solid var(--border); background: var(--bg); user-select: none; }
.marquee__track { display: flex; width: max-content; will-change: transform; }
.marquee__set { display: flex; align-items: center; flex: none; }
.marquee__w {
  font-family: var(--font-display); font-weight: 800; font-size: clamp(52px, 8.4vw, 132px);
  line-height: 1; letter-spacing: -0.03em; text-transform: uppercase; white-space: nowrap; color: var(--text);
}
.marquee__w.is-outline { color: transparent; -webkit-text-stroke: 1.5px rgba(212, 176, 106, .85); }
.marquee__dot { flex: none; width: .22em; height: .22em; margin: 0 .5em; border-radius: 50%; background: var(--gold); font-size: clamp(52px, 8.4vw, 132px); }
@media (max-width: 767px) { .marquee { padding: 18px 0; } .marquee__w.is-outline { -webkit-text-stroke-width: 1px; } }

/* ===== 13. 152-ФЗ ===== */
/* пакет */
.pkg { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 40px; margin-top: 24px; border-radius: 24px; }
.pkg h3 { font-size: 28px; }
.pkg__price { margin-top: 18px; font-family: var(--font-display); font-weight: 800; font-size: 40px; letter-spacing: -0.03em; line-height: 1; color: var(--gold); }
.pkg__extra { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--border); font-size: 15px; color: var(--text-muted); }
.pkg__cta { margin-top: 24px; }
.pkg__cta .btn { min-width: 0; }
.pkg__get { padding-left: 40px; border-left: 1px solid var(--border); }
.pkg__get-title.pkg__get-title { margin-top: 0; font-size: 18px; }
.tiles { margin-top: 16px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.tile { display: grid; grid-template-columns: 40px 1fr; column-gap: 12px; padding: 16px; border-radius: 14px; background: var(--surface-2); border: 1px solid var(--border); }
.tile__icon { grid-row: span 2; width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; background: var(--gold-soft); color: var(--gold); }
.tile__t { font-weight: 600; font-size: 15px; line-height: 1.3; }
.tile__d { margin-top: 4px; font-size: 13px; line-height: 1.45; color: var(--text-muted); }
.pkg__warranty { margin-top: 16px; display: flex; gap: 10px; align-items: flex-start; font-size: 15px; }
.pkg__shield { color: var(--gold); flex: none; margin-top: 2px; }
@media (max-width: 1023px) {
  .pkg { grid-template-columns: 1fr; gap: 28px; }
  .pkg__get { padding-left: 0; border-left: 0; padding-top: 28px; border-top: 1px solid var(--border); }
}
@media (max-width: 767px) {
  .tiles { grid-template-columns: 1fr; }
  .pkg__price { font-size: 34px; }
  .pkg__cta { flex-direction: column; }
  .pkg__cta .btn { width: 100%; }
}

/* было — стало */
.ba { margin-top: 24px; padding: 32px; border-radius: 24px; border: 1px solid var(--border); background: var(--surface); }
.ba__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 16px; }
.ba__head h3 { font-size: 22px; }
.ba__grid { margin-top: 24px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.ba__tag { display: inline-block; font-size: 12px; font-weight: 600; letter-spacing: .04em; padding: 5px 10px; border-radius: 999px; }
.ba__tag--bad { color: var(--danger); background: rgba(194, 107, 90, .14); }
.ba__tag--good { color: var(--gold); background: var(--gold-soft); }
.mini { margin-top: 14px; display: grid; gap: 10px; padding: 20px; border-radius: 14px; background: var(--bg); border: 1px solid var(--border); pointer-events: none; user-select: none; }
.mini__field { display: block; height: 40px; padding: 10px 12px; border-radius: 9px; background: var(--surface-2); border: 1px solid var(--border); font-size: 14px; color: var(--placeholder); }
.mini__check { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; color: var(--text-muted); line-height: 1.4; }
.mini__box { flex: none; width: 16px; height: 16px; margin-top: 1px; border-radius: 4px; border: 1px solid var(--border-hover); background: var(--surface-2); position: relative; }
.mini__box.is-checked { background: var(--danger); border-color: var(--danger); }
.mini__box.is-checked::after { content: ""; position: absolute; left: 5px; top: 1px; width: 4px; height: 9px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.mini__policy { font-size: 13px; color: var(--text-muted); line-height: 1.4; }
.mini__link { color: var(--text); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--border-hover); }
.mini__btn { display: flex; align-items: center; justify-content: center; height: 40px; border-radius: 999px; font-size: 14px; font-weight: 600; background: var(--surface-2); color: var(--text-muted); }
.mini__btn--gold { background: var(--gold-fill); color: var(--on-gold); }
.ba__notes { margin-top: 14px; display: grid; gap: 6px; font-size: 14px; }
.ba__notes li { position: relative; padding-left: 22px; color: var(--text-muted); }
.ba__notes li::before { position: absolute; left: 0; top: 0; font-weight: 700; }
.ba__notes--bad li::before { content: "×"; color: var(--danger); }
.ba__notes--good li::before { content: ""; left: 3px; top: .3em; width: 5px; height: 10px; border: solid var(--gold); border-width: 0 2px 2px 0; transform: rotate(45deg); }
@media (max-width: 767px) {
  .ba { padding: 24px 20px; }
  .ba__grid { grid-template-columns: 1fr; }
}

/* самопроверка + таймлайн */
.check152__grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 24px; align-items: start; }
.quiz { border-radius: 24px; min-height: 340px; display: flex; flex-direction: column; }
.quiz__top { display: flex; align-items: center; gap: 16px; }
.quiz__count { font-size: 14px; font-weight: 600; color: var(--gold); white-space: nowrap; }
.quiz__bar { flex: 1; height: 2px; background: var(--gold-line); border-radius: 2px; overflow: hidden; }
.quiz__bar span { display: block; height: 100%; background: var(--gold); transform-origin: 0 50%; transform: scaleX(0); transition: transform .4s var(--ease); }
.quiz__body { margin-top: 28px; display: flex; flex-direction: column; flex: 1; }
.quiz__text { font-family: var(--font-display); font-weight: 800; font-size: clamp(22px, 2.4vw, 30px); letter-spacing: -0.02em; line-height: 1.2; }
.quiz__text:focus { outline: none; }
.quiz__text:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
.quiz__answers { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 10px; }
.quiz__a {
  min-width: 112px; height: 52px; padding: 0 24px; border-radius: 999px; cursor: pointer;
  background: var(--surface-2); border: 1px solid var(--border-hover); font-weight: 600; font-size: 16px;
  transition: background-color .2s var(--ease), border-color .2s var(--ease), color .2s var(--ease);
}
.quiz__a:hover { border-color: var(--gold); }
.quiz__a[aria-pressed="true"] { background: var(--gold-soft); border-color: var(--gold); color: var(--gold-hover); }
.quiz__back { margin-top: auto; align-self: flex-start; padding: 12px 0 0; min-height: 44px; background: none; border: 0; cursor: pointer; color: var(--text-muted); font-size: 15px; }
.quiz__back:hover { color: var(--text); }
.quiz__result { margin-top: 20px; }
.quiz__level { font-family: var(--font-display); font-weight: 800; font-size: clamp(26px, 3vw, 36px); letter-spacing: -0.03em; line-height: 1.1; color: var(--gold); }
.quiz__level:focus { outline: none; }
.quiz__result.is-high .quiz__level { color: var(--danger-strong); }
.quiz__summary { margin-top: 14px; color: var(--text-muted); }
.quiz__gaps { margin-top: 12px; display: grid; gap: 8px; }
.quiz__gaps li { position: relative; padding-left: 22px; }
.quiz__gaps li::before { content: ""; position: absolute; left: 2px; top: .62em; width: 8px; height: 8px; border-radius: 50%; border: 2px solid var(--danger-strong); }
.quiz__cta { margin-top: 24px; }
.quiz__cta .btn { min-width: 0; }
.quiz__note { margin-top: 14px; }
.tl { padding: 32px; border-radius: 24px; border: 1px solid var(--border); background: var(--surface); }
.tl__title { font-size: 20px; }
.tl__list { margin-top: 20px; position: relative; display: grid; gap: 22px; padding-left: 24px; }
.tl__list::before { content: ""; position: absolute; left: 4px; top: 8px; bottom: 8px; width: 1px; background: var(--gold-line); }
.tl__item { position: relative; }
.tl__item::before { content: ""; position: absolute; left: -24px; top: 6px; width: 9px; height: 9px; border-radius: 50%; background: var(--gold); }
.tl__date { display: block; font-weight: 700; color: var(--gold); font-size: 15px; }
.tl__item p { margin-top: 4px; font-size: 15px; color: var(--text-muted); }
@media (max-width: 1023px) { .check152__grid { grid-template-columns: 1fr; } }
@media (max-width: 767px) {
  .quiz { min-height: 0; }
  .quiz__answers { display: grid; grid-template-columns: 1fr 1fr 1fr; }
  .quiz__a { min-width: 0; padding: 0 8px; }
  .quiz__cta { flex-direction: column; }
  .quiz__cta .btn { width: 100%; }
  .tl { padding: 24px; }
}

/* бесплатная экспресс-проверка + чек-лист */
.express { margin-top: 24px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; border-radius: 24px; }
.express__title { font-family: var(--font-display); font-weight: 800; font-size: clamp(28px, 3vw, 40px); letter-spacing: -0.03em; line-height: 1.05; }
.express__result { margin-top: 16px; padding: 14px 16px; border-radius: 12px; background: var(--gold-soft); font-size: 15px; }
.express__cta { margin-top: 24px; }
.express__note { margin-top: 12px; }
.express__list { padding-left: 40px; border-left: 1px solid var(--border); }
.express__label { font-weight: 600; }
.express__toggle { margin-top: 14px; }
.cl { margin-top: 16px; counter-reset: cl; display: grid; gap: 10px; font-size: 15px; }
.cl li { counter-increment: cl; position: relative; padding-left: 34px; color: var(--text); line-height: 1.45; }
.cl li::before { content: counter(cl); position: absolute; left: 0; top: 0; width: 24px; text-align: right; font-weight: 600; color: var(--gold); }
.cl.is-collapsible li:nth-child(n+6) { display: none; }
.cl.is-collapsible.is-open li { display: list-item; }
.cl.is-collapsible:not(.is-open) { -webkit-mask-image: linear-gradient(#000 60%, transparent); mask-image: linear-gradient(#000 60%, transparent); }
.express__pdf { margin-top: 16px; }
@media (max-width: 1023px) {
  .express { grid-template-columns: 1fr; gap: 28px; }
  .express__list { padding-left: 0; border-left: 0; padding-top: 28px; border-top: 1px solid var(--border); }
}
@media (max-width: 767px) { .express__cta .btn { width: 100%; } }

/* мы начинаем с себя */
.own { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 40px; align-items: center; border-radius: 24px; }
.own__title.own__title { margin-top: 0; font-family: var(--font-display); font-weight: 800; font-size: clamp(24px, 2.6vw, 34px); letter-spacing: -0.03em; line-height: 1.1; }
.own__link { display: inline-flex; align-items: center; min-height: 44px; margin-top: 12px; color: var(--gold); font-weight: 600; }
.own__link:hover { color: var(--gold-hover); }
.own__list { display: grid; gap: 12px; }
.own__list li { display: flex; gap: 12px; align-items: flex-start; }
.own__ck { flex: none; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: var(--gold-soft); color: var(--gold); margin-top: 1px; }
@media (max-width: 767px) { .own { grid-template-columns: 1fr; gap: 20px; } }

/* поле «Что нужно» */
.select { position: relative; display: block; }
.select::after { content: ""; position: absolute; right: 18px; top: 50%; width: 8px; height: 8px; margin-top: -6px; border: solid var(--text-muted); border-width: 0 2px 2px 0; transform: rotate(45deg); pointer-events: none; }
.select select {
  width: 100%; min-height: 52px; padding: 12px 44px 12px 16px; border-radius: 12px; appearance: none; -webkit-appearance: none;
  background: var(--surface-2); border: 1px solid var(--border); color: var(--text); font: inherit; font-size: 16px; cursor: pointer;
}
.select select:hover { border-color: var(--border-hover); }
.select select:focus { outline: none; border-color: var(--gold); }
.select select:focus-visible { outline: 2px solid var(--gold); outline-offset: 1px; }
.select option { background: var(--surface-2); color: var(--text); }

/* липкая панель на мобильном */
.mbar { display: none; }
@media (max-width: 767px) {
  .mbar {
    display: flex; gap: 10px; align-items: center; position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
    padding: 10px var(--pad) calc(10px + env(safe-area-inset-bottom));
    background: rgba(7, 8, 13, .92); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-top: 1px solid var(--border);
    transform: translateY(110%); visibility: hidden; transition: transform .3s var(--ease), visibility 0s linear .3s;
  }
  .mbar.is-on { transform: none; visibility: visible; transition: transform .3s var(--ease), visibility 0s; }
  .mbar__cta { flex: 1; height: 48px; padding: 0 16px; }
  .mbar .mbar__tel { display: inline-flex; flex: none; width: 48px; height: 48px; background: var(--surface-2); }
  body.has-mbar .footer { padding-bottom: calc(48px + 72px + env(safe-area-inset-bottom)); }
}

/* посадочная 152-ФЗ */
.hero__title--fz { font-size: clamp(44px, 6.2vw, 84px); }
@media (max-width: 767px) { .hero__title--fz { font-size: clamp(34px, 9.6vw, 46px); } }


/* ===== Светлые зоны: холодный «технологичный» светлый фон скруглёнными панелями поверх тёмного.
   Золото на светлом — только заливка основных кнопок и тонкие акцентные линии; мелкий текст и цены — графит. ===== */
.zone--light {
  --bg: #F4F5F7; --surface: #FFFFFF; --surface-2: #F0F2F5;
  --border: rgba(14, 17, 22, .08); --border-hover: rgba(14, 17, 22, .16); --border-strong: rgba(14, 17, 22, .28);
  --text: #0E1116; --text-muted: #5A606B; --placeholder: #5A606B;
  --gold: #0E1116; --gold-hover: #0E1116; --gold-soft: rgba(14, 17, 22, .055); --gold-line: rgba(14, 17, 22, .14);
  --accent-line: #C9A45C;
  --danger: #A63D47; --danger-strong: #A63D47;
  position: relative; z-index: 1; margin: 0 12px; border-radius: 28px; background: var(--bg); color: var(--text);
}
.zone--light + .section, .section + .zone--light { margin-top: 0; }
.zone--light .card, .zone--light .tl, .zone--light .ba { background: rgba(255, 255, 255, .9); }
.zone--light .card, .zone--light .tl, .zone--light .ba { box-shadow: 0 1px 2px rgba(14, 17, 22, .04), 0 10px 30px -12px rgba(30, 41, 59, .12); }
.zone--light .card:hover { border-color: var(--border-hover); }
.zone--light .btn--primary { box-shadow: 0 6px 18px -6px rgba(30, 41, 59, .25); }
.zone--light .eyebrow { color: var(--text-muted); }
.zone--light .tag { color: var(--text); background: rgba(14, 17, 22, .06); }
.zone--light .list li::before, .zone--light .tl__item::before { background: #0E1116; }
.zone--light .benefits li::before { background: var(--accent-line); }
.zone--light .quiz__bar span { background: var(--accent-line); }
.zone--light .tile__icon, .zone--light .own__ck { background: #EEF0F3; color: #0E1116; }
.zone--light .ba__tag--good { color: #0E1116; background: rgba(14, 17, 22, .07); }
.zone--light .ba__tag--bad { color: var(--danger); background: rgba(166, 61, 71, .09); }
.zone--light .ba__notes--good li::before { border-color: #0E1116; }
.zone--light .quiz__a[aria-pressed="true"] { background: #0E1116; border-color: #0E1116; color: #FFFFFF; }
.zone--light .quiz__a:hover { border-color: #0E1116; }
.zone--light .express__result { background: #EEF0F3; }
.zone--light .pkg__price { color: var(--text); }
.zone--light .flagship__list, .zone--light .pkg__get, .zone--light .express__list { border-color: var(--border); }
.zone--light ::selection { background: rgba(120, 145, 180, .28); }
@media (max-width: 767px) { .zone--light { margin: 0 6px; border-radius: 22px; } }

/* ===== v6: «живые» светлые зоны ===== */
@property --ang { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
/* 1. чертёжная сетка + точки (очень низкий контраст), края панели гаснут */
.zone--light { isolation: isolate; }
/* фон панели — «стекло после дождя»: статичная подложка (она же вид до загрузки WebGL),
   поверх — общий canvas rain-fx.js, прилипающий к верху экрана внутри панели */
.zone__bg {
  position: absolute; inset: 0; z-index: -1; pointer-events: none; border-radius: inherit;
  clip-path: inset(0 round 28px);
  background:
    radial-gradient(28% 22% at 18% 12%, rgba(255, 255, 255, .85), transparent 70%),
    radial-gradient(24% 18% at 84% 30%, rgba(213, 222, 235, .55), transparent 70%),
    radial-gradient(30% 20% at 70% 70%, rgba(255, 255, 255, .7), transparent 70%),
    radial-gradient(26% 18% at 22% 86%, rgba(213, 222, 235, .5), transparent 70%),
    linear-gradient(180deg, #EEF1F4, #F7F8FA 50%, #EEF1F4);
}
.zone__rain { position: sticky; top: 0; display: block; width: 100%; height: 100vh; opacity: 0; transition: opacity 1s var(--ease); }
.zone__rain.is-on { opacity: 1; }
@media (max-width: 767px) { .zone__bg { clip-path: inset(0 round 22px); } }
/* текст прямо на панели — мягкая белая «вуаль», чтобы капли не мешали читать */
.zone--light .section__head { position: relative; }
.zone--light .section__head::before {
  content: ""; position: absolute; inset: -28px -40px; z-index: -1; pointer-events: none;
  background: rgba(247, 248, 250, .86); border-radius: 40px; filter: blur(18px);
}
.zone--light .fit, .zone--light .faq { position: relative; }
.zone--light .fit::before, .zone--light .faq::before {
  content: ""; position: absolute; inset: -14px -24px; z-index: -1; pointer-events: none;
  background: rgba(247, 248, 250, .88); border-radius: 32px; filter: blur(14px);
}
/* мягкое золотое свечение за курсором (создаётся из script.js, двигается transform-ом) */
.zone__glow {
  position: absolute; left: 0; top: 0; z-index: -1; width: 760px; height: 760px; margin: -380px 0 0 -380px;
  border-radius: 50%; pointer-events: none; opacity: 0; transition: opacity .5s var(--ease);
  background:
    radial-gradient(closest-side, rgba(255, 255, 255, .75), rgba(200, 212, 230, .22) 55%, transparent 100%);
  will-change: transform;
}
.zone--light.is-glow .zone__glow { opacity: 1; }
/* переход тёмное ↔ светлое: золотой «рассвет» над краем панели + панель поднимается (script.js) */
.zone--light { box-shadow: 0 -50px 120px -60px rgba(200, 214, 235, .22), 0 50px 120px -60px rgba(200, 214, 235, .16); transform-origin: 50% 0; }
.zone--light.is-rise { will-change: transform; }

/* 2. карточки: бегущая золотая рамка + прожектор + лёгкий 3D-наклон (только мышь, см. script.js) */
.fx-card { position: relative; isolation: isolate; }
.fx-card::before, .fx-card::after { content: ""; position: absolute; pointer-events: none; border-radius: inherit; opacity: 0; transition: opacity .35s var(--ease); }
.fx-card::before {
  inset: 0; z-index: -1;
  background: radial-gradient(420px circle at var(--cx, 50%) var(--cy, 50%), rgba(150, 172, 205, .10), transparent 62%);
}
.fx-card::after {
  inset: -1px; z-index: 2; padding: 1.5px;
  background: conic-gradient(from var(--ang), transparent 0 58%, rgba(201, 164, 92, .5) 70%, #C9A45C 78%, #C9A45C 84%, transparent 94%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
}
.fx-card.is-hot::before, .fx-card.is-hot::after { opacity: 1; }
.zone--light .fx-card.is-hot { border-color: rgba(201, 164, 92, .38); }
.fx-card.is-hot::after { animation: fx-sweep 2.6s linear infinite; }
/* тач: карточка в центре экрана мягко светится, тап — вспышка */
.fx-card.is-lit::after { opacity: 1; animation: fx-sweep 3.2s linear infinite; background: conic-gradient(from var(--ang), transparent 0 40%, rgba(150, 165, 185, .25) 56%, #A9B4C4 72%, #DCE3EC 79%, #A9B4C4 86%, transparent 97%); }
.fx-card.is-lit::before { opacity: .8; background: radial-gradient(130% 70% at 50% 0%, rgba(150, 172, 205, .10), transparent 70%); }
.fx-card.is-tap::before { opacity: 1; background: radial-gradient(260px circle at var(--cx, 50%) var(--cy, 50%), rgba(150, 172, 205, .18), transparent 65%); transition: opacity .1s; }
@keyframes fx-sweep { to { --ang: 360deg; } }
.zone--light .fx-card.is-tilt.is-tilt {
  transform: perspective(1000px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateZ(0);
  transition: transform .18s ease-out, border-color .2s var(--ease), box-shadow .3s var(--ease);
  box-shadow: 0 2px 4px rgba(14, 17, 22, .04), 0 24px 50px -22px rgba(30, 41, 59, .28);
}
.zone--light .fx-card.is-untilt { transition: transform .5s var(--ease), border-color .2s var(--ease), box-shadow .3s var(--ease); }
.faq__item.fx-card { border-radius: 14px; }
.faq__item.fx-card::before, .faq__item.fx-card::after { inset: 0 -18px; }

/* 3. счётчики цен */
.cu { font-variant-numeric: tabular-nums; }

/* 4. самопроверка: толще и «живее» полоса прогресса */
.zone--light .quiz__bar { height: 4px; background: rgba(14, 17, 22, .08); border-radius: 4px; }
.zone--light .quiz__bar span {
  background: linear-gradient(90deg, #C9A45C, #E2C384 60%, #C9A45C); background-size: 200% 100%;
  border-radius: 4px; transition: transform .6s cubic-bezier(.22, 1.2, .36, 1); animation: fx-bar 2.4s linear infinite;
}
@keyframes fx-bar { to { background-position: -200% 0; } }
.quiz__count [data-quiz-n] { display: inline-block; }
.quiz__body, .quiz__result { will-change: auto; }

/* 6. заголовки светлых зон: слово за словом */
.js-words .w-h .w { display: inline-block; opacity: 0; transform: translateY(.45em); filter: blur(4px); transition: opacity .6s var(--ease), transform .7s var(--ease), filter .6s var(--ease); }
.js-words .w-h.is-words .w { opacity: 1; transform: none; filter: none; }

/* 5. появление при прокрутке (только если script.js включил .js-reveal; reduced-motion — без анимации) */
.js-reveal .reveal { opacity: 0; transform: translateY(24px); transition: opacity .8s var(--ease), transform .8s var(--ease), border-color .2s var(--ease); }
.js-reveal .reveal.is-in { opacity: 1; transform: none; }

/* 17.5 reduced motion */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
