/* «Включи систему» — главная.
   Цвета и базовые классы — в brand-tokens.css, здесь раскладка, ритм и поведение. */

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: hidden; }
body { background: #04060D; overflow-x: hidden; }
img { display: block; }
/* <picture> — только выбор формата (AVIF → WebP → фолбэк): в раскладке его нет, img ведёт себя как без обёртки */
picture { display: contents; }
::selection { background: rgba(94, 200, 248, 0.3); }

/* ==================== СИСТЕМА СТРАНИЦЫ ====================
   Один контейнер на всю страницу — 1400/64, как у первого экрана: левый край
   текста совпадает от hero до футера. 820 — только ширина текстовой колонки. */

.wrap { max-width: 87.5rem; margin: 0 auto; padding: 0 4rem; }

.sec { position: relative; padding: 6rem 0; }
.sec--dark { padding: 6rem 0 6.25rem; }
.sec__wrap { max-width: 87.5rem; margin: 0 auto; padding: 0 4rem; }
/* соседние секции внахлёст на 1px: граница на дробном пикселе иначе просвечивает тёмным фоном страницы */
.sec + .sec { margin-top: -1px; }
.sec + main > .sec:first-child, main + .sec { margin-top: -1px; }   /* тот же стык, когда секции обёрнуты в <main> */
.col-text { max-width: 51.25rem; margin-left: auto; margin-right: auto; }

/* Две роли H2: акты страницы и рабочие секции */
.h2-a { font-size: 2.5rem; line-height: 1.16; }
.h2-b { font-size: 2rem; line-height: 1.2; }

/* --- единственный поток на странице --- */
@keyframes flow  { to { stroke-dashoffset: -18 } }
@keyframes flowY { to { background-position: 0 1.125rem } }

.flow {
  stroke-dasharray: 3 6;
  stroke-linecap: round;
  animation: flow 1.6s linear infinite;
}

/* Секции стыкуются ровной границей: без градиентов и без сквозной нити.
   --ground — грунт секции: на нём лежат кольца на концах связок. */
.sec { --ground: var(--concrete); }

/* --- появление секций: один язык для всех тринадцати --- */
.js-rv .rv { opacity: 0; transform: translateY(1rem); }
.js-rv .rv.is-in {
  opacity: 1; transform: none;
  transition: opacity var(--t-scene) var(--ease), transform var(--t-scene) var(--ease);
}

@media (prefers-reduced-motion: reduce) {
  .js-rv .rv { opacity: 1 !important; transform: none !important; }
}

/* ==================== БЛОК 1 — HERO ==================== */

.hero {
  --hero-h: max(100vh, 41.25rem);
  --card-right: 2.125rem;
  position: relative;
  padding: 0;
  height: var(--hero-h);
  overflow: hidden;
  background: #04060D;
}

.hero__stage { position: absolute; inset: 0; }

/* Сцена: фото и голограмма — два бокса с одинаковой геометрией,
   left/width у <img> и у обёртки <svg> внутри всегда совпадают. */
.scene {
  position: absolute;
  /* якорь кадрирования: точка (65%, 36%) кадра всегда попадает в ту же точку блока,
     поэтому голограмма не уезжает за край при любой ширине/высоте экрана */
  left: 65%;
  top: 36%;
  transform: translate(-65%, -36%);
  width: max(100%, calc(var(--hero-h) * 1.7788));
  aspect-ratio: var(--scene-ratio);
  overflow: hidden;
}
.scene--media { z-index: 0; }
.scene--holo { z-index: 2; pointer-events: none; }

.frame {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
}
.frame.is-active { opacity: 1; visibility: visible; }
.scene--holo .frame.is-active { animation: holoFlicker 9s linear infinite; }

.frame__img,
.frame__holo { position: absolute; top: 0; bottom: 0; height: 100%; }
.frame__img { object-fit: cover; width: 100%; color: transparent; }   /* пока кадр ниши догружается, alt-текст поверх сцены не показываем */
.frame__holo { overflow: hidden; }
.frame__holo svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }

/* прорисовка контуров */
.draw { stroke-dasharray: 1; stroke-dashoffset: 1; }
.frame.is-active .draw { animation: draw var(--dur, .6s) var(--ease) var(--d, 0s) forwards; }
.fadeIn { opacity: 0; }
.frame.is-active .fadeIn { animation: fadeIn var(--t-scene) var(--ease) var(--d, 0s) forwards; }

/* сканирующая линия */
.scan { position: absolute; inset: 0; overflow: hidden; z-index: 1; }
.scan > span {
  display: block; width: 100%; height: 8.125rem;
  background: linear-gradient(180deg, rgba(140,215,250,0) 0%, rgba(140,215,250,0.03) 42%, rgba(170,228,255,0.08) 50%, rgba(140,215,250,0.03) 58%, rgba(140,215,250,0) 100%);
  animation: scanY 9s linear infinite;
}

/* единый цветокор */
.veil { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.veil--tint { background: rgba(13, 32, 66, 0.26); }
.veil--left {
  background: linear-gradient(90deg,
    rgba(4,7,14,0.88) 0%, rgba(4,7,14,0.84) 12%, rgba(4,7,14,0.72) 24%,
    rgba(4,7,14,0.54) 34%, rgba(4,7,14,0.34) 43%, rgba(4,7,14,0.18) 52%,
    rgba(4,7,14,0.06) 58%, rgba(4,7,14,0) 70%);
}
.veil--bottom {
  background: linear-gradient(180deg,
    rgba(4,7,14,0.42) 0%, rgba(4,7,14,0.1) 18%, rgba(4,7,14,0) 46%,
    rgba(4,7,14,0.28) 74%, rgba(4,7,14,0.7) 100%);
}
.veil--flash {
  z-index: 3; background: #04060D; opacity: 0;
  transition: opacity var(--t-micro) var(--ease);
}
.veil--flash.is-on { opacity: .65; }

/* HUD-метки на кадре */
.hud-label {
  position: absolute;
  z-index: 2;
  opacity: 0;
  padding: 0.5rem 1rem;
  background: rgba(9, 17, 30, 0.62);
  border-color: rgba(94, 200, 248, 0.4);
  transition: border-color var(--t-micro) var(--ease), box-shadow var(--t-micro) var(--ease);
}
.frame.is-active .hud-label { animation: labelIn var(--t-scene) var(--ease) var(--d, 0s) forwards; }
.hud-label__main { font-size: 0.625rem; letter-spacing: 0.2em; color: #D6EEFD; }
.hud-label__sub { margin-top: 0.5rem; display: flex; align-items: center; gap: 0.5rem; }
.hud-label .dot { width: 0.3125rem; height: 0.3125rem; border-radius: 50%; background: var(--holo); flex: none; }
.hud-label .chip {
  font-size: 0.5625rem; letter-spacing: 0.18em; color: var(--holo-bright);
  background: rgba(15, 111, 216, 0.06);
  border: 1px solid rgba(15, 111, 216, 0.3);
  border-radius: var(--r-panel);
  padding: 0.5rem 0.75rem;
  white-space: nowrap;
}

.hud-label.is-flash {
  border-color: rgba(159, 224, 255, 0.95);
  box-shadow: 0 0 0 1px rgba(94, 200, 248, 0.35), 0 0 1.375rem rgba(94, 200, 248, 0.28);
}
.hud-label.is-flash .chip { animation: chipBlink 1.4s steps(1, end) 2; }
@keyframes chipBlink { 0%, 100% { opacity: 1 } 50% { opacity: .25 } }

/* навигация */
.nav {
  position: absolute; top: 0; left: 0; right: 0; z-index: 6;
  width: 100%; max-width: 87.5rem; margin: 0 auto;
  padding: 1.5rem 4rem;
  display: flex; align-items: center; gap: 2rem;
  isolation: isolate;
}
/* Подложка под меню: сцена hero заходит под шапку, меню остаётся читаемым.
   Только absolute внутри hero — с fixed она затемняла бы каждую секцию при скролле.
   По горизонтали дотягивается до краёв окна и на экранах шире 1400. */
.hero .nav::before {
  content: "";
  position: absolute; z-index: -1;
  left: 0; right: 0; top: 0;
  height: 9.375rem;
  margin: 0 calc(-1 * max(4rem, (100vw - 87.5rem) / 2 + 4rem));
  background: linear-gradient(180deg, rgba(4,7,14,.92) 0%, rgba(4,7,14,.78) 44%, rgba(4,7,14,.4) 74%, rgba(4,7,14,0) 100%);
  pointer-events: none;
}
.nav__links a, .nav__cta, .switch__btn { min-height: 2.5rem; }
.nav__logo { display: flex; align-items: center; flex: none; }
.nav__logo svg { height: 2.5rem; width: auto; display: block; }
.nav__links { margin-left: auto; display: flex; align-items: center; gap: 1.5rem; }
.nav__links a { display: flex; align-items: center; color: #B7C6DB; font-size: 0.875rem; transition: color var(--t-micro) var(--ease); }
.nav__links a:hover { color: var(--holo-bright); }
.nav__cta {
  border: 1px solid rgba(94, 200, 248, 0.45);
  color: #CDE9FB !important;
  display: flex; align-items: center;
  font-size: 0.875rem; font-weight: 500;
  white-space: nowrap;
  padding: 0.5rem 1rem; border-radius: var(--r-cta);
  transition: border-color var(--t-micro) var(--ease), color var(--t-micro) var(--ease);
}
.nav__cta:hover { border-color: rgba(159, 224, 255, 0.8); color: #FFFFFF !important; }

/* «Войти» — для текущих пользователей: контур нейтральнее, чем у экскурсии */
.nav__links .nav__login {
  display: inline-flex; align-items: center;
  border: 1px solid #2A3A55;
  border-radius: 0.5625rem;
  padding: 0.5625rem 1rem;
  color: #DCE7F4;
  font-size: 0.875rem; font-weight: 500;
  white-space: nowrap;
  transition: border-color var(--t-micro) var(--ease), background var(--t-micro) var(--ease), color var(--t-micro) var(--ease);
}
.nav__links .nav__login:hover {
  border-color: rgba(94, 200, 248, 0.5);
  background: rgba(94, 200, 248, 0.08);
  color: #FFFFFF;
}

/* текстовая колонна */
.hero__content {
  position: relative; z-index: 4;
  width: 100%; max-width: 87.5rem; margin: 0 auto;
  padding: 9.375rem 4rem 6rem;
  height: 100%;
  display: flex; align-items: center;
}
.hero__col { width: 46%; min-width: 28.75rem; max-width: 37.5rem; }
.switch { max-width: 100%; }

.switch__caption { font-size: 0.625rem; letter-spacing: 0.2em; color: #8298B7; }
.switch {
  margin: 0.5rem 0 1.5rem;
  display: inline-flex;
  flex-wrap: wrap;                     /* четвёртый сегмент переносится, если не влез */
  border: 1px solid rgba(94, 200, 248, 0.35);
  border-radius: var(--r-cta);
  overflow: hidden;
  background: rgba(8, 15, 28, 0.42);
  backdrop-filter: blur(0.375rem);
}
.switch__btn {
  font-family: var(--font-sans);
  font-size: 0.875rem; font-weight: 500; line-height: 1.2;
  white-space: nowrap;
  padding: 0.5rem 1rem;
  border: 0; border-left: 1px solid rgba(94, 200, 248, 0.22);
  background: transparent; color: #7E93B4;
  cursor: pointer;
  transition: color var(--t-micro) var(--ease), background var(--t-micro) var(--ease);
}
.switch__btn:first-child { border-left: 0; }
.switch__btn:hover { color: #A9C3E0; }
.switch__btn.is-active { background: rgba(94, 200, 248, 0.14); color: #CDE9FB; }

.hero h1 { margin: 0; color: #EDF3FB; }
.hero h1 span { color: var(--holo); }
.hero__lead { margin: 1rem 0 0; font-size: 1.0625rem; line-height: 1.6; color: var(--text-dim); max-width: 29.375rem; text-wrap: pretty; }
.hero__action { margin-top: 2rem; display: flex; flex-direction: column; gap: 1rem; align-items: flex-start; }
.hero__action .mono { font-size: 0.5625rem; letter-spacing: 0.18em; }

/* фигура Кузьмича */
.kuz-fig {
  position: absolute; right: 1.875rem; bottom: 0; z-index: 3;
  height: 62%; width: auto;
  filter: drop-shadow(0 0.625rem 1.875rem rgba(8, 16, 30, 0.18));
  pointer-events: none;
}

/* карточка Кузьмича */
.kuz-card {
  position: absolute; right: var(--card-right); bottom: 1.5rem; z-index: 4;
  width: 18.75rem;
  background: rgba(9, 17, 30, 0.68);
  border: 1px solid rgba(94, 200, 248, 0.32);
  backdrop-filter: blur(0.625rem);
  border-radius: var(--r-card);
  padding: 1rem;                 /* компактная: карточка не должна перекрывать HUD-метки кадра */
}
.kuz-card > i { position: absolute; width: 0.625rem; height: 0.625rem; border: 0 solid var(--holo-bracket); }
.kuz-card > i:nth-of-type(1) { top: -1px; left: -1px; border-top-width: 1.5px; border-left-width: 1.5px; }
.kuz-card > i:nth-of-type(2) { top: -1px; right: -1px; border-top-width: 1.5px; border-right-width: 1.5px; }
.kuz-card > i:nth-of-type(3) { bottom: -1px; left: -1px; border-bottom-width: 1.5px; border-left-width: 1.5px; }
.kuz-card > i:nth-of-type(4) { bottom: -1px; right: -1px; border-bottom-width: 1.5px; border-right-width: 1.5px; }

.kuz-card__link { position: absolute; right: calc(100% - 1.875rem); bottom: calc(100% - 1.875rem); width: 11.25rem; height: 8.125rem; overflow: visible; opacity: .85; }

.kuz-card__pulse { offset-path: path('M176 126 H84 L34 44 H6'); offset-rotate: 0deg; opacity: 0; }
.kuz-card.is-pulsing .kuz-card__pulse { animation: pulseRun .9s linear forwards; }
@keyframes pulseRun {
  0%   { offset-distance: 0%;   opacity: 0 }
  15%  { opacity: 1 }
  85%  { opacity: 1 }
  100% { offset-distance: 100%; opacity: 0 }
}

.kuz-card__head { display: flex; align-items: center; gap: 1rem; }
.kuz-card__avatar {
  width: 2.375rem; height: 2.375rem; flex: none; border-radius: 50%;
  border: 1px solid rgba(94, 200, 248, 0.35);
  /* аватар 2.375rem: фигура во всю высоту шириной 6.5rem → хватает файла 19.5rem (×3), а не 28.25rem */
  background-image: url('assets/img/kuzmich-web-312.webp');
  background-image: image-set(url('assets/img/kuzmich-web-312.avif') type('image/avif'), url('assets/img/kuzmich-web-312.webp') type('image/webp'));
  background-repeat: no-repeat;
  background-size: 6.5rem auto;
  background-position: -2.1875rem -0.1875rem;
  background-color: #0E1A2C;
}
.kuz-card__id { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.kuz-card__name { font-size: 0.875rem; font-weight: 600; color: #E6EEF9; }
.kuz-card__id .mono { font-size: 0.5625rem; letter-spacing: 0.18em; color: #6B82A4; }

.kuz-card__voice { margin-top: 1rem; display: flex; align-items: center; gap: 1rem; }
.kuz-card__play {
  width: 1.875rem; height: 1.875rem; flex: none; border-radius: 50%;
  border: 1px solid rgba(94, 200, 248, 0.5);
  display: flex; align-items: center; justify-content: center;
}
.kuz-card__play svg { width: 0.5625rem; height: 0.6875rem; }
.wave { flex: 1; display: flex; align-items: center; gap: 2px; height: 1.625rem; color: #6FBFEA; overflow: hidden; transition: color var(--t-base) var(--ease); }
.wave.is-hot { color: var(--holo-bright); }
.wave > span { width: 0.1562rem; flex: none; background: currentColor; border-radius: 2px; transform-origin: center; animation: wf 1.15s ease-in-out infinite alternate; }
.kuz-card__time { font-size: 0.5625rem; color: #9FC6E8; flex: none; letter-spacing: 0.18em; }

.kuz-card__text { margin-top: 1rem; font-size: 0.875rem; line-height: 1.45; color: #C9D6E8; }
.kuz-card__meta { margin-top: 0.5rem; font-size: 0.5625rem; letter-spacing: 0.18em; color: #5E7796; }

/* невысокие экраны: карточка ещё ниже и короче, чтобы метки кадра оставались открытыми */
@media (min-width: 901px) and (max-height: 780px) {
  .kuz-card { bottom: 1rem; }
  .kuz-card__meta { display: none; }
  .kuz-card__text { margin-top: 0.5rem; }
}
.kuz-card__status {
  margin-top: 0.5rem; font-size: 0.5625rem; letter-spacing: 0.18em; color: #8FD8FF;
  opacity: 0; transition: opacity var(--t-base) var(--ease);
}
.kuz-card__status.is-on { opacity: 1; }

/* ==================== БЛОК 2 — УРОВНИ → МЕССЕНДЖЕР ====================
   Одна секция из четырёх актов: шапка → три уровня → тёмный кадр «В итоге» →
   «мессенджер ничего не помнит» и финальная плита. Светлая часть без теней,
   свечений и уголков — ритм держат волосяные линии и крупный кегль.
   Контейнер — общий для страницы (.sec__wrap), чтобы левый край совпадал с hero. */

.levels {
  --lv-ink: #0B1220;
  --lv-text: #1B2A42;
  --lv-soft: #66788F;
  --lv-mid: #4C5C72;
  --lv-mono: #9AAABE;
  --lv-line: #E4EAF2;
  --lv-accent: #0F6FD8;
  --lv-bad: #DC3D48;
  --lv-field: 4rem;          /* поле контейнера: тёмный кадр выходит на всю ширину */
  --ground: var(--surface);

  background: #FFFFFF;
  padding: 5.5rem 0;           /* нижнее поле — у секции: отступ плиты не выпадает за её край */
}

.levels h2, .levels h3 { text-transform: none; text-wrap: pretty; font-weight: 600; margin: 0; }

/* --- акт 1 — шапка --- */
.lv-head { padding-bottom: 4rem; }
.lv-kicker { font-size: 0.625rem; letter-spacing: 0.24em; color: var(--lv-accent); white-space: nowrap; }
.lv-title {
  margin-top: 1rem;
  max-width: 58.75rem;
  font-size: 3.25rem; line-height: 1.08; letter-spacing: -0.03em;
  color: var(--lv-ink);
}
.lv-sub {
  margin: 1.5rem 0 0;
  max-width: 38.75rem;
  font-size: 1.1875rem; line-height: 1.5;
  color: var(--lv-soft);
  text-wrap: pretty;
}
.lv-sub b { font-weight: 600; color: var(--lv-ink); }

/* --- акт 2 — три уровня: редакторская сетка --- */
.lv {
  display: grid;
  grid-template-columns: 7rem minmax(0, 1fr) 26.25rem;
  gap: 3.5rem;
  align-items: center;
  padding: 2.75rem 0;
  border-top: 1px solid var(--lv-line);
}
.lv:last-child { border-bottom: 1px solid var(--lv-line); }

.lv__num { display: flex; flex-direction: column; gap: 0.75rem; align-self: start; }
.lv__digit {
  font-family: var(--font-mono);
  font-size: 4rem; line-height: 0.9; font-weight: 700; letter-spacing: -0.04em;
  color: #C9D5E2;
}
.lv__flag { font-size: 0.5625rem; letter-spacing: 0.18em; color: var(--lv-bad); white-space: nowrap; }

.lv__text { min-width: 0; }
.lv__name { font-size: 1.25rem; line-height: 1.3; letter-spacing: -0.015em; color: var(--lv-ink); }
.lv__quote {
  margin: 1rem 0 0;
  max-width: 38.75rem;
  font-size: 1.625rem; line-height: 1.38; letter-spacing: -0.015em;
  color: var(--lv-text);
  text-wrap: pretty;
}
.lv__fact { margin: 1rem 0 0; max-width: 35rem; font-size: 1rem; line-height: 1.55; color: var(--lv-soft); text-wrap: pretty; }
.lv__verdict { margin: 1rem 0 0; font-size: 1rem; line-height: 1.5; font-weight: 600; color: var(--lv-bad); text-wrap: pretty; }

.lv__photo { aspect-ratio: 4 / 3; border-radius: 0.75rem; overflow: hidden; background: #E9EEF4; }
.lv__photo img { width: 100%; height: 100%; object-fit: cover; }

/* --- акт 3 — тёмный кадр «В итоге»: на всю ширину контейнера --- */
.lv-frame {
  position: relative;
  margin: 6rem calc(-1 * var(--lv-field)) 0;
  min-height: 32.5rem;
  display: flex; align-items: center;
  overflow: hidden;
  background: var(--lv-ink);
}
.lv-frame__photo {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: 70% 45%;
}
.lv-frame__veil { position: absolute; inset: 0; pointer-events: none; }
.lv-frame__veil--tint { background: rgba(13, 32, 66, 0.42); }
.lv-frame__veil--left {
  background: linear-gradient(90deg, rgba(4,7,14,0.96) 0%, rgba(4,7,14,0.88) 46%, rgba(4,7,14,0.45) 72%, rgba(4,7,14,0.25) 100%);
}
.lv-frame__veil--bottom {
  background: linear-gradient(180deg, rgba(4,7,14,0.45) 0%, rgba(4,7,14,0) 40%, rgba(4,7,14,0.5) 100%);
}
.lv-frame__content { position: relative; z-index: 1; padding: 5.5rem var(--lv-field); }
.lv-frame__kicker { font-size: 0.625rem; letter-spacing: 0.24em; color: #9FDFFF; white-space: nowrap; }
.lv-frame__title {
  margin-top: 1rem;
  max-width: 51.25rem;
  font-size: 3.5rem; line-height: 1.08; letter-spacing: -0.03em;
  color: #F2F7FD;
}
.lv-frame__title span { color: #1E7EE6; }
.lv-frame__text { margin: 1.5rem 0 0; max-width: 32.5rem; font-size: 1.1875rem; line-height: 1.55; color: #C9D8EA; text-wrap: pretty; }

/* --- акт 4 — «сделали → что произошло» --- */
.lv-reg { padding-top: 6rem; }
.lv-reg__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; padding-bottom: 2rem; }
.lv-reg__title { max-width: 45rem; font-size: 2.75rem; line-height: 1.1; letter-spacing: -0.028em; color: var(--lv-ink); }
.lv-reg__title span { color: var(--lv-bad); }
.lv-reg__legend { font-size: 0.625rem; letter-spacing: 0.2em; color: var(--lv-mono); white-space: nowrap; padding-bottom: 0.375rem; }

.lv-reg__row {
  display: grid;
  grid-template-columns: minmax(12.5rem, 0.9fr) 7.5rem minmax(17.5rem, 1.4fr);
  gap: 0 1.5rem;
  align-items: center;
  padding: 1.625rem 0;
  border-top: 1px solid var(--lv-line);
}
.lv-reg__row:last-child { border-bottom: 1px solid var(--lv-line); }
.lv-reg__did { font-size: 1.375rem; line-height: 1.3; font-weight: 600; color: var(--lv-ink); }
.lv-reg__link { width: 7.5rem; height: 0.75rem; display: block; overflow: visible; }
.lv-reg__link .flow { fill: none; stroke: rgba(15, 111, 216, 0.4); stroke-width: 1.2; }
.lv-reg__link circle { fill: var(--lv-bad); }
.lv-reg__got { font-size: 1.375rem; line-height: 1.3; color: var(--lv-mid); text-wrap: pretty; }
.lv-reg__got b { font-weight: 600; color: var(--lv-ink); }
.lv-reg__got b.is-bad { color: var(--lv-bad); }

/* --- финальная плита: сообщение → запись в системе --- */
.lv-plate {
  margin: 4rem 0 0;
  background: #F6F7F9;
  border-radius: 1rem;
  padding: 3.5rem;
  display: flex; align-items: center; gap: 3.5rem; flex-wrap: wrap;
}
.lv-plate__manifest {
  flex: 1 1 28.75rem; max-width: 45rem; margin: 0;
  font-size: 2.5rem; line-height: 1.16; font-weight: 600; letter-spacing: -0.025em;
  color: var(--lv-ink);
  text-wrap: pretty;
}
.lv-plate__manifest span { color: var(--lv-accent); }

.lv-chain { flex: 0 1 23.75rem; min-width: 0; display: flex; flex-direction: column; gap: 0.875rem; }
.lv-chain__msg {
  align-self: flex-end;
  max-width: 92%;
  background: var(--lv-accent);
  color: #FFFFFF;
  font-size: 0.875rem; line-height: 1.45;
  border-radius: 0.75rem 0.75rem 0.25rem 0.75rem;
  padding: 0.75rem 1rem;
  text-wrap: pretty;
}
.lv-chain__tick { align-self: center; display: flex; flex-direction: column; align-items: center; }
.lv-chain__tick i { display: block; width: 1px; height: 1.125rem; background: rgba(15, 111, 216, 0.45); }
.lv-chain__tick b { display: block; width: 0.3125rem; height: 0.3125rem; border-radius: 50%; background: var(--lv-accent); }

.lv-rec {
  position: relative;
  background: #FFFFFF;
  border: 1px solid rgba(15, 111, 216, 0.35);
  border-radius: 0.375rem;
  padding: 1rem 1.125rem;
}
.lv-rec > i { position: absolute; width: 0.75rem; height: 0.75rem; border: 0 solid rgba(15, 111, 216, 0.6); }
.lv-rec > i:nth-of-type(1) { top: -1px; left: -1px; border-top-width: 1.5px; border-left-width: 1.5px; }
.lv-rec > i:nth-of-type(2) { top: -1px; right: -1px; border-top-width: 1.5px; border-right-width: 1.5px; }
.lv-rec > i:nth-of-type(3) { bottom: -1px; left: -1px; border-bottom-width: 1.5px; border-left-width: 1.5px; }
.lv-rec > i:nth-of-type(4) { bottom: -1px; right: -1px; border-bottom-width: 1.5px; border-right-width: 1.5px; }
.lv-rec__head { display: flex; align-items: center; gap: 0.5rem; }
.lv-rec__dot { width: 0.3125rem; height: 0.3125rem; flex: none; border-radius: 50%; background: var(--lv-accent); }
.lv-rec__label { font-size: 0.5938rem; letter-spacing: 0.18em; color: var(--lv-accent); white-space: nowrap; }
/* колонка меток — не уже 6rem и по самой длинной («Ответственный»), значения на одной вертикали */
.lv-rec__rows { margin: 0.875rem 0 0; display: grid; grid-template-columns: minmax(6rem, max-content) minmax(0, 1fr); gap: 0.5rem 0.75rem; align-items: baseline; }
.lv-rec__rows div { display: contents; }
.lv-rec__rows dt { font-size: 0.5625rem; letter-spacing: 0.18em; color: var(--lv-mono); white-space: nowrap; }
.lv-rec__rows dd { margin: 0; font-size: 0.875rem; line-height: 1.4; color: var(--lv-text); }
.lv-rec__rows dd.is-status { color: var(--lv-accent); }

/* --- мобайл --- */
@media (max-width: 1400px) { .levels { --lv-field: 2.5rem; } }
@media (max-width: 900px)  { .levels { --lv-field: 1.25rem; } }

@media (max-width: 1040px) {
  .lv { grid-template-columns: 1fr; gap: 1.5rem; }
  .lv__num { flex-direction: row; align-items: baseline; gap: 1rem; }
  .lv__photo { max-width: 22.5rem; }
}

@media (max-width: 760px) {
  .lv-title { font-size: 2.25rem; }
  .lv-frame__title { font-size: 2.125rem; }
  .lv-frame__content { padding-top: 4rem; padding-bottom: 4rem; }
  .lv-reg__title { font-size: 1.875rem; }
  .lv-plate__manifest { font-size: 1.75rem; flex-basis: 100%; }
  .lv__quote { font-size: 1.3125rem; }
  .lv-reg__row { grid-template-columns: 1fr; gap: 0.5rem; }
  .lv-reg__link { display: none; }
  .lv-reg__did, .lv-reg__got { font-size: 1.1875rem; }
  .lv-plate { padding: 2rem 1.5rem; gap: 2rem; }
  .lv-chain { flex-basis: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .lv-reg__link .flow { animation: none; }
}

/* ==================== БЛОК 2.5 — ЗНАКОМСТВО С КУЗЬМИЧОМ ====================
   Мост между «тремя уровнями» и тёмным «Первое в мире решение»: читатель знакомится
   с Кузьмичом до того, как увидит его в работе. Фон — полутон между светлым и тёмным,
   чтобы не перебивать кульминацию. Контейнер общий для страницы (.sec__wrap). */

@keyframes orbit { 0%, 100% { opacity: 0.5 } 50% { opacity: 1 } }

.meet {
  --meet-ink: #0B1220;
  --meet-text: #4C5C72;
  --meet-line: #DFE6EE;
  --meet-accent: #0F6FD8;
  --ground: #EDF0F5;

  background: #EDF0F5;
  padding: 5.5rem 0;
}
.meet h2, .meet h3 { text-transform: none; text-wrap: pretty; margin: 0; }

/* --- 1. шапка + персонаж --- */
.meet-hero {
  display: grid;
  grid-template-columns: minmax(20rem, 1fr) minmax(18.75rem, 0.78fr);
  gap: 4rem;
  align-items: center;
}
.meet-hero__text { min-width: 0; }
.meet-kicker { font-size: 0.625rem; letter-spacing: 0.24em; color: var(--meet-accent); white-space: nowrap; }
.meet-title { margin-top: 1rem; max-width: 41.25rem; font-size: 3rem; line-height: 1.1; font-weight: 600; letter-spacing: -0.03em; color: var(--meet-ink); }
.meet-title span { color: var(--meet-accent); }
.meet-lead { margin: 1.5rem 0 0; max-width: 35rem; font-size: 1.3125rem; line-height: 1.45; color: var(--meet-text); text-wrap: pretty; }
.meet-lead b { font-weight: 600; color: var(--meet-ink); }

/* персонаж внутри контура системы: орбиты с модулями, канал в мессенджер выходит наружу */
.meet-kuz {
  position: relative;
  min-height: 26.25rem;
  display: flex; align-items: flex-end; justify-content: center;
}
.meet-kuz__orbits {
  position: absolute; left: 50%; top: 50%;
  width: 26.25rem; height: 26.25rem; max-width: 100%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.meet-kuz__orbits circle { fill: none; stroke-width: 1; }
.meet-kuz__orbits circle:first-child { stroke: rgba(15, 111, 216, 0.16); }
.meet-kuz__orbits circle:last-child  { stroke: rgba(15, 111, 216, 0.1); }

.meet-mod {
  position: absolute; z-index: 1;
  transform: translate(-50%, -50%);
  background: #FFFFFF;
  border: 1px solid var(--meet-line);
  border-radius: 0.4375rem;
  padding: 0.4375rem 0.75rem;
  font-size: 0.625rem; letter-spacing: 0.12em;
  color: #40658F;
  white-space: nowrap;
  animation: orbit 4s ease-in-out infinite;
}

.meet-kuz__img {
  position: relative; z-index: 2;
  height: 23.75rem; width: auto;
  filter: drop-shadow(0 1rem 2rem rgba(11, 18, 32, 0.16));
}

.meet-kuz__tg {
  position: absolute; z-index: 3;
  right: -0.375rem; bottom: 1.5rem;
  display: flex; align-items: center; gap: 0.625rem;
  background: #FFFFFF;
  border: 1px solid var(--meet-line);
  border-radius: 0.75rem 0.75rem 0.25rem 0.75rem;
  box-shadow: 0 0.625rem 1.625rem rgba(11, 18, 32, 0.08);
  padding: 0.625rem 0.875rem 0.625rem 0.625rem;
}
.meet-kuz__play { flex: none; width: 1.5rem; height: 1.5rem; border-radius: 50%; background: var(--meet-accent); display: flex; align-items: center; justify-content: center; }
.meet-kuz__play svg { width: 0.5rem; height: 0.625rem; display: block; }
.meet-kuz__play path { fill: #FFFFFF; }
.meet-kuz__wave { display: flex; align-items: center; gap: 0.1875rem; height: 1.125rem; }
.meet-kuz__wave b { display: block; width: 0.1375rem; border-radius: 1.1px; background: #7FA6CE; transform-origin: center; animation: wf 1.1s ease-in-out infinite alternate; }
.meet-kuz__wave b:nth-child(2) { animation-delay: .1s; }
.meet-kuz__wave b:nth-child(3) { animation-delay: .2s; }
.meet-kuz__wave b:nth-child(4) { animation-delay: .3s; }
.meet-kuz__wave b:nth-child(5) { animation-delay: .4s; }
.meet-kuz__label { font-size: 0.5625rem; letter-spacing: 0.16em; color: #66788F; }

/* --- 2. четыре тезиса: одна плита на волосяных швах --- */
.meet-grid {
  margin-top: 4rem;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
  background: var(--meet-line);
  border: 1px solid var(--meet-line);
  border-radius: 0.75rem;
  overflow: hidden;
}
.meet-cell { background: #FFFFFF; padding: 1.625rem 1.5rem 1.75rem; min-width: 0; }
.meet-cell__num { font-size: 0.5625rem; letter-spacing: 0.2em; color: #9AAABE; }
.meet-cell__title { margin-top: 0.75rem; font-size: 1.1875rem; line-height: 1.25; font-weight: 600; letter-spacing: -0.015em; color: var(--meet-ink); }
.meet-cell__text { margin: 0.75rem 0 0; font-size: 0.9375rem; line-height: 1.55; color: var(--meet-text); text-wrap: pretty; }

/* --- 3. мост в следующий блок --- */
.meet-bridge { margin-top: 3.5rem; display: flex; align-items: flex-start; gap: 1rem; }
.meet-bridge__dot { flex: none; width: 0.375rem; height: 0.375rem; margin-top: 1rem; border-radius: 50%; background: var(--meet-accent); animation: dotPulse 2.4s ease-in-out infinite; }
.meet-bridge__text { margin: 0; max-width: 56.25rem; font-size: 2.125rem; line-height: 1.22; font-weight: 600; letter-spacing: -0.025em; color: var(--meet-ink); text-wrap: pretty; }
.meet-bridge__text span { color: var(--meet-accent); }

/* --- адаптив --- */
@media (max-width: 1040px) {
  .meet-hero { grid-template-columns: 1fr; gap: 2.5rem; }
  .meet-kuz { width: 100%; max-width: 32.5rem; margin: 0 auto; }
  .meet-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 760px) {
  .meet-title { font-size: 2.125rem; }
  .meet-lead { font-size: 1.125rem; }
  .meet-kuz { min-height: 21.25rem; }
  .meet-kuz__img { height: 18.75rem; }
  .meet-kuz__tg { right: 0; }
  /* модули у краёв орбиты не должны выходить за экран */
  .meet-mod { font-size: 0.5625rem; padding: 0.375rem 0.625rem; }
  .meet-mod:nth-of-type(1) { left: 18% !important; }
  .meet-mod:nth-of-type(2) { left: 80% !important; }
  .meet-mod:nth-of-type(3) { left: 16% !important; }
  .meet-mod:nth-of-type(4) { left: 84% !important; }
  .meet-grid { grid-template-columns: 1fr; }
  .meet-bridge__text { font-size: 1.625rem; }
  .meet-bridge__dot { margin-top: 0.75rem; }
}

@media (prefers-reduced-motion: reduce) {
  .meet-mod, .meet-kuz__wave b, .meet-bridge__dot { animation: none; }
  .meet-mod { opacity: 1; }
}

/* ==================== БЛОК 3 — ГОЛОС → ЭКРАН СИСТЕМЫ ====================
   Доказательство к блоку 2: слева лента голосовых от сотрудников, справа реальный
   экран системы, где эти слова уже стали данными. Светится только HUD.
   Контейнер — общий для страницы (.sec__wrap), левый край совпадает с hero. */

@keyframes ringPulse { 0%, 100% { opacity: 0.55 } 50% { opacity: 1 } }

.solution {
  --sol-ink: #0B1220;
  --sol-panel: #101B2E;
  --sol-line: #1C2A44;
  --sol-mono: #5E7796;
  --sol-dim: #7E93B4;
  --sol-white: #F2F7FD;

  position: relative;
  background: var(--sol-ink);
  padding: 5.5rem 0;
  overflow: clip;              /* не hidden: иначе у экрана не сработает sticky */
}
.solution__wrap { position: relative; z-index: 1; }
.solution h2 { text-transform: none; text-wrap: pretty; margin: 0; }

/* --- шапка --- */
.sol-head {
  position: relative;
  display: flex; align-items: flex-end; justify-content: space-between; gap: 3rem;
  padding-bottom: 4rem;
}
.sol-head__glow {
  position: absolute; right: -7.5rem; top: -12.5rem;
  width: 42.5rem; height: 42.5rem;
  background: radial-gradient(50% 50% at 50% 50%, rgba(74, 180, 235, 0.12) 0%, rgba(74, 180, 235, 0) 70%);
  pointer-events: none;
}
.sol-head__text { position: relative; flex: 1 1 auto; min-width: 0; }
.sol-kicker { font-size: 0.625rem; letter-spacing: 0.24em; color: #5EC8F8; white-space: nowrap; }
.sol-title {
  margin-top: 1rem;
  max-width: 53.75rem;
  font-size: 3.25rem; line-height: 1.08; font-weight: 600; letter-spacing: -0.03em;
  color: var(--sol-white);
}
.sol-title span { color: #1E7EE6; }
.sol-lead { margin: 1.5rem 0 0; max-width: 38.75rem; font-size: 1.1875rem; line-height: 1.5; color: #8FA2BE; text-wrap: pretty; }
.sol-lead b { font-weight: 600; color: var(--sol-white); }


/* --- легенда --- */
.sol-legend {
  display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; flex-wrap: wrap;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--sol-line);
}
.sol-legend__said { font-size: 0.625rem; letter-spacing: 0.2em; color: #5EC8F8; white-space: nowrap; }
.sol-legend__screen { font-size: 0.625rem; letter-spacing: 0.2em; color: var(--sol-mono); white-space: nowrap; }

/* --- сцена --- */
.sol-scene {
  display: grid;
  grid-template-columns: minmax(18.75rem, 0.62fr) minmax(0, 1fr);
  gap: 3rem;
  align-items: center;           /* иначе под экраном пустота */
  padding-top: 2.25rem;
}

/* лента голосовых */
.sol-feed { display: flex; flex-direction: column; gap: 0.625rem; min-width: 0; }
.vo {
  display: block; width: 100%;
  min-height: 2.75rem;
  text-align: left;
  font-family: inherit;
  cursor: pointer;
  background: transparent;
  border: 1px solid var(--sol-line);
  border-radius: 0.875rem 0.875rem 0.875rem 0.25rem;
  padding: 0.8125rem 1.125rem;
  transition: background .3s var(--ease), border-color .3s var(--ease), padding .3s var(--ease);
}
.vo:hover { border-color: #2A3A55; }
.vo:focus-visible { outline: 2px solid rgba(94, 200, 248, 0.6); outline-offset: 2px; }

.vo__top { display: flex; align-items: baseline; justify-content: space-between; gap: 0.75rem; }
.vo__role { font-size: 0.5625rem; letter-spacing: 0.2em; color: var(--sol-mono); white-space: nowrap; transition: color .3s var(--ease); }
.vo__time { font-size: 0.6875rem; letter-spacing: 0.06em; color: var(--sol-mono); }

.vo__wave {
  display: flex; align-items: center; gap: 0.75rem;
  height: 0; margin-top: 0;
  overflow: hidden;
  transition: height .3s var(--ease), margin-top .3s var(--ease);
}
.vo__play {
  flex: none; width: 1.625rem; height: 1.625rem; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--sol-line);
  background: transparent;
  transition: background .3s var(--ease), border-color .3s var(--ease);
}
.vo__play svg { width: 0.5rem; height: 0.625rem; display: block; }
.vo__play path { fill: var(--sol-mono); transition: fill .3s var(--ease); }
.vo__bars { flex: 1; display: flex; align-items: center; gap: 0.1875rem; height: 1.625rem; overflow: hidden; }
.vo__bars b { display: block; flex: none; width: 0.15rem; border-radius: 1.2px; background: #2A3A55; transform-origin: center; transition: background .3s var(--ease); }

.vo__line {
  display: block;
  margin-top: 0.5rem;
  font-size: 1.0312rem; line-height: 1.4; font-weight: 500;
  color: var(--sol-dim);
  text-wrap: pretty;
  transition: font-size .3s var(--ease), color .3s var(--ease), margin-top .3s var(--ease);
}

.vo.is-active {
  background: var(--sol-panel);
  border-color: rgba(94, 200, 248, 0.45);
  padding: 1.125rem 1.25rem;
  cursor: default;
}
.vo.is-active .vo__role { color: #5EC8F8; }
.vo.is-active .vo__wave { height: 1.625rem; margin-top: 0.75rem; }
.vo.is-active .vo__play { background: #0F6FD8; border-color: #0F6FD8; }
.vo.is-active .vo__play path { fill: #FFFFFF; }
.vo.is-active .vo__bars b { background: #6FBFEA; animation: wf 1.15s ease-in-out infinite alternate; }
.vo.is-active .vo__line { margin-top: 0.875rem; font-size: 1.3125rem; color: var(--sol-white); }

/* разнос фаз волны, чтобы штрихи не прыгали хором */
.vo__bars b:nth-child(3n+1) { animation-delay: 0s; }
.vo__bars b:nth-child(3n+2) { animation-delay: .12s; }
.vo__bars b:nth-child(3n)   { animation-delay: .24s; }

/* экран системы */
.sol-screen { position: sticky; top: 2rem; min-width: 0; }
.sol-browser {
  border-radius: 0.625rem;
  border: 1px solid #22334F;
  background: #0E1727;
  box-shadow: 0 1.5rem 3.75rem rgba(4, 10, 22, 0.5);
  overflow: hidden;
}
.sol-browser__bar {
  display: flex; align-items: center; gap: 1rem;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid #16233A;
}
.sol-browser__dots { display: flex; gap: 0.375rem; flex: none; }
.sol-browser__dots i { display: block; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: #243248; }
.sol-browser__section { font-size: 0.5625rem; letter-spacing: 0.16em; color: var(--sol-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: opacity .3s var(--ease); }
.sol-browser__live { margin-left: auto; display: flex; align-items: center; gap: 0.5rem; font-size: 0.5625rem; letter-spacing: 0.16em; color: var(--sol-dim); white-space: nowrap; }
.sol-browser__pulse { width: 0.3125rem; height: 0.3125rem; flex: none; border-radius: 50%; background: #5EC8F8; animation: ringPulse 2.4s var(--ease) infinite; }
.sol-browser__img { display: block; width: 100%; height: auto; }
/* второй экран лежит поверх первого и проявляется, когда активна реплика с data-screen="act" */
.sol-browser__screen { position: relative; }
.sol-browser__img--alt { position: absolute; inset: 0; height: 100%; object-fit: cover; opacity: 0; transition: opacity var(--t-base) var(--ease); }
.sol-browser__screen[data-screen="act"] .sol-browser__img--alt[data-screen="act"] { opacity: 1; }
.sol-browser__screen[data-screen="task"] .sol-browser__img--alt[data-screen="task"] { opacity: 1; }
.sol-browser__screen[data-screen="kp"] .sol-browser__img--alt[data-screen="kp"] { opacity: 1; }
.sol-browser__screen[data-screen="pay"] .sol-browser__img--alt[data-screen="pay"] { opacity: 1; }

.sol-result { margin: 1.125rem 0 0; display: flex; align-items: flex-start; gap: 0.75rem; max-width: 35rem; font-size: 1.0625rem; line-height: 1.5; color: #B6C5DB; text-wrap: pretty; }
.sol-result__dot { width: 0.3125rem; height: 0.3125rem; flex: none; margin-top: 0.625rem; border-radius: 50%; background: #5EC8F8; }
#solResult { transition: opacity .3s var(--ease); }
.sol-scene.is-swap #solResult,
.sol-scene.is-swap .sol-browser__section { opacity: 0; }

/* --- финальная плита --- */
.sol-plate {
  margin-top: 4rem;
  background: var(--sol-panel);
  border-radius: 1rem;
  padding: 3.5rem;
  display: flex; align-items: center; justify-content: space-between; gap: 3.5rem; flex-wrap: wrap;
}
.sol-plate__text { margin: 0; font-size: 2.5rem; line-height: 1.16; font-weight: 600; letter-spacing: -0.025em; color: var(--sol-white); text-wrap: pretty; }
.sol-plate__text span { color: #5EC8F8; }
.sol-plate__cta {
  display: inline-flex; align-items: center; min-height: 2.75rem;
  border: 1px solid rgba(94, 200, 248, 0.45);
  border-radius: 0.5625rem;
  padding: 1rem 1.875rem;
  font-size: 1rem; font-weight: 600;
  color: #CDE9FB;
  white-space: nowrap;
  transition: border-color var(--t-micro) var(--ease), color var(--t-micro) var(--ease);
}
.sol-plate__cta:hover { border-color: rgba(159, 224, 255, 0.85); color: #FFFFFF; }

/* --- адаптив --- */
@media (max-width: 1040px) {
  .sol-head { flex-direction: column-reverse; align-items: flex-start; gap: 2rem; }
  .sol-head__glow { right: auto; left: -10rem; top: -10rem; }
  .sol-scene { grid-template-columns: 1fr; gap: 2rem; }
  .sol-screen { position: static; }
}

@media (max-width: 760px) {
  .sol-title { font-size: 2.25rem; }
  .sol-lead { font-size: 1.0625rem; }
  .vo.is-active .vo__line { font-size: 1.3125rem; }
  .sol-plate { padding: 2rem 1.5rem; gap: 2rem; }
  .sol-plate__text { font-size: 1.75rem; }
  .sol-plate__cta { white-space: normal; width: 100%; justify-content: center; text-align: center; }
  .sol-legend__screen { white-space: normal; }
}

/* на телефоне в шапке «браузера» не хватает места на обе подписи — прячем «Обновлено само»,
   иначе название раздела обрезается многоточием */
@media (max-width: 480px) {
  .sol-browser__live { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .vo.is-active .vo__bars b, .sol-browser__pulse { animation: none; }
  .vo, .vo * { transition: none !important; }
}

/* ==================== БЛОК 4 — ОДНА СИСТЕМА, ДВА ВХОДА ====================
   Светлый ответ на «вы продаёте чат-бота»: два равных входа в одну систему.
   Колонны, а не карточки: ни рамок, ни теней, ни брекетов, ни пунктиров —
   связь держат разделители. Контейнер общий для страницы (.sec__wrap). */

.duo {
  --two-ink: #0B1220;
  --two-text: #4C5C72;
  --two-line: #DFE6EE;
  --two-accent: #0F6FD8;
  --ground: var(--concrete);

  background: #F6F7F9;
  padding: 5.5rem 0;
}
.duo h2, .duo h3 { text-transform: none; text-wrap: pretty; margin: 0; }

/* --- 1. шапка --- */
.two-head {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; flex-wrap: wrap;
  padding-bottom: 3.5rem;
}
.two-head__text { flex: 1 1 35rem; min-width: 0; }
.two-kicker { font-size: 0.625rem; letter-spacing: 0.24em; color: var(--two-accent); white-space: nowrap; }
.two-title { margin-top: 1rem; font-size: 3.25rem; line-height: 1.08; font-weight: 600; letter-spacing: -0.03em; color: var(--two-ink); }
.two-title span { color: var(--two-accent); }
.two-lead { margin: 1.25rem 0 0; max-width: 40rem; font-size: 1.6875rem; line-height: 1.4; letter-spacing: -0.015em; color: var(--two-text); text-wrap: pretty; }
.two-lead b { font-weight: 600; color: var(--two-ink); }

.two-base { flex: none; display: flex; align-items: center; gap: 0.625rem; padding-bottom: 0.5rem; }
.two-base__dot { width: 0.375rem; height: 0.375rem; border-radius: 50%; background: var(--two-accent); animation: dotPulse 2.4s ease-in-out infinite; }
.two-base__label { font-size: 0.625rem; letter-spacing: 0.18em; color: #6D7F97; white-space: nowrap; }

/* --- 2. два входа --- */
.two-cols {
  display: grid; grid-template-columns: 1fr 1fr; gap: 4rem;
  border-top: 1px solid var(--two-line);
}
.two-col { padding: 2.5rem 0 2.75rem; min-width: 0; display: flex; flex-direction: column; }
.two-col + .two-col { border-left: 1px solid var(--two-line); padding-left: 4rem; }

.two-col__top { display: flex; align-items: center; gap: 1rem; }
.two-col__icon { flex: none; width: 2.375rem; height: 2.375rem; }
.two-col__icon svg { width: 2.375rem; height: 2.375rem; display: block; }
.two-col__title { font-size: 1.5625rem; line-height: 1.25; font-weight: 600; letter-spacing: -0.018em; color: var(--two-ink); }

.two-chips { margin-top: 1.25rem; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.two-chip {
  font-family: var(--font-mono);
  font-size: 0.6875rem; letter-spacing: 0.08em;
  color: #40658F;
  background: rgba(15, 111, 216, 0.06);
  border: 1px solid rgba(15, 111, 216, 0.28);
  border-radius: 0.375rem;
  padding: 0.375rem 0.75rem;
  white-space: nowrap;
}

.two-points { margin: 1.625rem 0 1.75rem; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 0.875rem; }
.two-points li { display: flex; align-items: baseline; gap: 0.75rem; }
.two-points__dash { flex: none; width: 0.875rem; height: 1px; background: #9AAABE; transform: translateY(-0.375rem); }
.two-points li span:last-child { max-width: 27.5rem; font-size: 1.0625rem; line-height: 1.5; color: var(--two-text); text-wrap: pretty; }

/* артефакты каналов */
/* артефакт прижат к низу колонны: у обеих колонн он встаёт на одну линию */
.two-voice {
  margin-top: auto; max-width: 25rem;
  display: flex; align-items: center; gap: 0.875rem;
  background: #FFFFFF;
  border: 1px solid var(--two-line);
  border-radius: 0.875rem 0.875rem 0.875rem 0.25rem;
  padding: 0.75rem 1rem;
}
.two-voice__play { flex: none; width: 1.75rem; height: 1.75rem; border-radius: 50%; background: var(--two-accent); display: flex; align-items: center; justify-content: center; }
.two-voice__play svg { width: 0.5625rem; height: 0.6875rem; display: block; }
.two-voice__play path { fill: #FFFFFF; }
.two-voice__wave { flex: 1; display: flex; align-items: center; gap: 0.25rem; height: 1.5rem; }
.two-voice__wave b { display: block; width: 0.15rem; border-radius: 1.2px; background: #7FA6CE; transform-origin: center; animation: wf 1.1s ease-in-out infinite alternate; }
.two-voice__wave b:nth-child(1)  { animation-delay: 0s; }
.two-voice__wave b:nth-child(2)  { animation-delay: .06s; }
.two-voice__wave b:nth-child(3)  { animation-delay: .12s; }
.two-voice__wave b:nth-child(4)  { animation-delay: .18s; }
.two-voice__wave b:nth-child(5)  { animation-delay: .24s; }
.two-voice__wave b:nth-child(6)  { animation-delay: .30s; }
.two-voice__wave b:nth-child(7)  { animation-delay: .36s; }
.two-voice__wave b:nth-child(8)  { animation-delay: .42s; }
.two-voice__wave b:nth-child(9)  { animation-delay: .48s; }
.two-voice__wave b:nth-child(10) { animation-delay: .54s; }
.two-voice__wave b:nth-child(11) { animation-delay: .60s; }
.two-voice__wave b:nth-child(12) { animation-delay: .66s; }
.two-voice__time { flex: none; font-size: 0.6875rem; letter-spacing: 0.06em; color: #66788F; }

.two-web {
  margin-top: auto; max-width: 25rem;
  display: flex; align-items: center; gap: 1rem;
  background: #FFFFFF;
  border: 1px solid var(--two-line);
  border-radius: 0.5rem;
  padding: 0.875rem 1rem;
}
.two-web__dots { flex: none; display: flex; gap: 0.3125rem; }
.two-web__dots i { display: block; width: 0.4375rem; height: 0.4375rem; border-radius: 50%; background: #DCE3EC; }
.two-web__rows { flex: 1; display: flex; flex-direction: column; gap: 0.375rem; }
.two-web__rows i { display: block; height: 0.3125rem; border-radius: 0.1875rem; background: #E4EAF2; }
.two-web__rows i:first-child { width: 72%; }
.two-web__rows i:last-child { width: 46%; }
.two-web__label { flex: none; font-size: 0.625rem; letter-spacing: 0.18em; color: #66788F; white-space: nowrap; }

/* --- 3. связка и экран системы --- */
.two-proof {
  display: grid; grid-template-columns: minmax(17.5rem, 0.52fr) minmax(0, 1fr); gap: 3.5rem;
  align-items: stretch;
  border-top: 1px solid var(--two-line);
  padding-top: 3rem;
}
.two-proof__text { display: flex; flex-direction: column; min-width: 0; }
.two-proof__label { font-size: 0.625rem; letter-spacing: 0.2em; color: var(--two-accent); white-space: nowrap; }
.two-proof__lead { margin: 1rem 0 2rem; max-width: 26.25rem; font-size: 1.5rem; line-height: 1.36; letter-spacing: -0.015em; color: #33435C; text-wrap: pretty; }
.two-proof__lead b { font-weight: 600; color: var(--two-ink); }

/* прижат к низу: кнопка заканчивается на одной линии с нижним краем скриншота */
.two-proof__end { margin-top: auto; padding-top: 1.75rem; border-top: 1px solid var(--two-line); }
.two-proof__final { margin: 0; font-size: 1.9375rem; line-height: 1.18; font-weight: 600; letter-spacing: -0.022em; color: var(--two-ink); text-wrap: pretty; }
.two-proof__final span { color: var(--two-accent); }
.two-proof__cta {
  display: inline-flex; align-items: center; min-height: 2.75rem;
  margin-top: 1.5rem;
  background: var(--two-accent);
  border-radius: 0.5625rem;
  padding: 1.0625rem 2rem;
  font-size: 1rem; font-weight: 600;
  color: #FFFFFF;
  white-space: nowrap;
  transition: background var(--t-micro) var(--ease);
}
.two-proof__cta:hover { background: #1E7EE6; color: #FFFFFF; }

.two-window {
  align-self: start;
  margin: 0;
  border-radius: 0.75rem;
  border: 1px solid #D8E0EA;
  background: #FFFFFF;
  box-shadow: 0 1.25rem 3rem rgba(11, 18, 32, 0.08);
  overflow: hidden;
  min-width: 0;
}
.two-window__bar { display: flex; align-items: center; gap: 1rem; padding: 0.8125rem 1.125rem; border-bottom: 1px solid #E4EAF2; }
.two-window__dots { flex: none; display: flex; gap: 0.375rem; }
.two-window__dots i { display: block; width: 0.5625rem; height: 0.5625rem; border-radius: 50%; background: #DCE3EC; }
.two-window__section { font-size: 0.5625rem; letter-spacing: 0.16em; color: #6D7F97; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.two-window__live { margin-left: auto; display: flex; align-items: center; gap: 0.5rem; font-size: 0.5625rem; letter-spacing: 0.16em; color: #6D7F97; white-space: nowrap; }
.two-window__pulse { width: 0.3125rem; height: 0.3125rem; flex: none; border-radius: 50%; background: var(--two-accent); animation: dotPulse 2.4s ease-in-out infinite; }
.two-window__img { display: block; width: 100%; height: auto; }

/* --- адаптив --- */
@media (max-width: 1040px) {
  .two-cols, .two-proof { grid-template-columns: 1fr; gap: 0; }
  /* сброс десктопного разделителя второй колонны: иначе текст уезжает вправо и висит обрубок линии */
  [data-two] > div + div, [data-two] > figure { border-left: 0 !important; padding-left: 0 !important; }
  .two-col + .two-col { border-top: 1px solid var(--two-line); }
  .two-proof { gap: 2.5rem; }
  .two-proof__end { margin-top: 2rem; }
}

@media (max-width: 760px) {
  .two-title { font-size: 2.25rem; }
  .two-lead { font-size: 1.5rem; }
  .two-col__title { font-size: 1.3125rem; }
  .two-proof__lead { font-size: 1.3125rem; }
  .two-proof__final { font-size: 1.625rem; }
  .two-proof__cta { width: 100%; justify-content: center; white-space: normal; text-align: center; }
  .two-window__live { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .two-base__dot, .two-window__pulse, .two-voice__wave b { animation: none; }
}

/* ==================== БЛОК 5 — ВЕСЬ КОНТУР: ШЕСТЬ МОДУЛЕЙ ====================
   Тёмный масштаб после светлых «двух входов»: шесть модулей закрывают весь
   управленческий контур. Реестром, как уровни в блоке 2 и сценарии в блоке 3:
   ни плиток-карточек, ни пунктирных коннекторов. Контейнер общий (.sec__wrap). */

.sys {
  --sys-line: #1C2A44;
  --sys-white: #F2F7FD;
  --sys-text: #B6C5DB;
  --sys-mono: #7E93B4;

  position: relative;
  background: #0B1220;
  padding: 5.5rem 0;
  overflow: clip;
}
.sys__wrap { position: relative; z-index: 1; }
.sys h2, .sys h3 { text-transform: none; text-wrap: pretty; margin: 0; }

/* --- 1. шапка --- */
.mods-head {
  position: relative;
  display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; flex-wrap: wrap;
  padding-bottom: 3.5rem;
}
.mods-head__glow {
  position: absolute; right: -5rem; top: -11.25rem;
  width: 40rem; height: 40rem;
  background: radial-gradient(50% 50% at 50% 50%, rgba(74, 180, 235, 0.1) 0%, rgba(74, 180, 235, 0) 70%);
  pointer-events: none;
}
.mods-head__text { position: relative; flex: 1 1 35rem; min-width: 0; }
.mods-kicker { font-size: 0.625rem; letter-spacing: 0.24em; color: #5EC8F8; white-space: nowrap; }
.mods-title { margin-top: 1rem; max-width: 52.5rem; font-size: 3.25rem; line-height: 1.08; font-weight: 600; letter-spacing: -0.03em; color: var(--sys-white); }
.mods-title span { color: #1E7EE6; }
.mods-lead { margin: 1.25rem 0 0; max-width: 41.25rem; font-size: 1.6875rem; line-height: 1.4; letter-spacing: -0.015em; color: #8FA2BE; text-wrap: pretty; }
.mods-lead b { font-weight: 600; color: var(--sys-white); }

.mods-base { position: relative; flex: none; display: flex; align-items: center; gap: 0.625rem; padding-bottom: 0.5rem; }
.mods-base__dot { width: 0.375rem; height: 0.375rem; border-radius: 50%; background: #5EC8F8; animation: dotPulse 2.4s ease-in-out infinite; }
.mods-base__label { font-size: 0.625rem; letter-spacing: 0.18em; color: var(--sys-mono); white-space: nowrap; }

/* --- 2. реестр модулей --- */
.mods-list { border-top: 1px solid var(--sys-line); }
.mods-row {
  display: grid;
  grid-template-columns: 8.25rem minmax(15rem, 0.72fr) minmax(0, 1fr);
  gap: 2.5rem;
  align-items: baseline;
  padding: 2.125rem 0;
  border-bottom: 1px solid var(--sys-line);
}
.mods-row__num { font-size: 2.125rem; font-weight: 700; letter-spacing: -0.02em; color: rgba(94, 200, 248, 0.32); }
.mods-row__title { font-size: 1.625rem; line-height: 1.2; font-weight: 600; letter-spacing: -0.02em; color: var(--sys-white); }
.mods-row__flow { margin-top: 0.75rem; font-size: 0.5938rem; letter-spacing: 0.18em; color: #5E7796; }
.mods-row__text { margin: 0; max-width: 35rem; font-size: 1.0625rem; line-height: 1.55; color: var(--sys-text); text-wrap: pretty; }

/* --- 3. финальная плита --- */
.mods-plate {
  margin-top: 4rem;
  background: #101B2E;
  border-radius: 1rem;
  padding: 3.5rem;
  display: flex; align-items: center; gap: 3.5rem; flex-wrap: wrap;
}
.mods-plate__text { flex: 1 1 32.5rem; min-width: 0; }
.mods-plate__meta { display: flex; align-items: center; gap: 0.75rem; }
.mods-plate__wave { display: flex; align-items: center; gap: 0.1875rem; height: 1.25rem; }
.mods-plate__wave b { display: block; width: 0.1375rem; border-radius: 1.1px; background: #5EC8F8; transform-origin: center; animation: wf 1.1s ease-in-out infinite alternate; }
.mods-plate__wave b:nth-child(2) { animation-delay: .15s; }
.mods-plate__wave b:nth-child(3) { animation-delay: .3s; }
.mods-plate__wave b:nth-child(4) { animation-delay: .45s; }
.mods-plate__wave b:nth-child(5) { animation-delay: .6s; }
.mods-plate__label { font-size: 0.625rem; letter-spacing: 0.22em; color: var(--sys-mono); white-space: nowrap; }
.mods-plate__title { margin-top: 1rem; max-width: 42.5rem; font-size: 2.125rem; line-height: 1.18; font-weight: 600; letter-spacing: -0.025em; color: var(--sys-white); }
.mods-plate__title span { color: #5EC8F8; }
.mods-plate__lead { margin: 1rem 0 0; max-width: 37.5rem; font-size: 1.0625rem; line-height: 1.55; color: var(--sys-text); text-wrap: pretty; }

.mods-plate__end { flex: 0 1 auto; display: flex; flex-direction: column; align-items: flex-start; gap: 1.125rem; }
.mods-plate__final { margin: 0; font-size: 1.3125rem; line-height: 1.3; font-weight: 600; color: var(--sys-white); text-wrap: pretty; }
.mods-plate__cta {
  display: inline-flex; align-items: center; min-height: 2.75rem;
  border: 1px solid rgba(94, 200, 248, 0.45);
  border-radius: 0.5625rem;
  padding: 1rem 1.875rem;
  font-size: 1rem; font-weight: 600;
  color: #CDE9FB;
  white-space: nowrap;
  transition: border-color var(--t-micro) var(--ease), color var(--t-micro) var(--ease);
}
.mods-plate__cta:hover { border-color: rgba(159, 224, 255, 0.85); color: #FFFFFF; }

/* --- адаптив --- */
@media (max-width: 1040px) {
  /* в колонке flex-basis начинает работать как высота — сбрасываем, иначе под шапкой пустота */
  .mods-head { flex-direction: column; align-items: flex-start; gap: 1.5rem; }
  .mods-head__text, .mods-plate__text { flex: 0 0 auto; }
  .mods-row { grid-template-columns: 1fr; gap: 0.75rem; align-items: start; }
  .mods-row__title { font-size: 1.4375rem; }
  .mods-row__text { max-width: none; }
  .mods-plate { flex-direction: column; align-items: flex-start; gap: 2rem; }
}

@media (max-width: 760px) {
  .mods-title { font-size: 2.25rem; }
  .mods-lead { font-size: 1.4375rem; }
  .mods-plate { padding: 2rem 1.5rem; }
  .mods-plate__title { font-size: 1.75rem; }
  .mods-plate__cta { width: 100%; justify-content: center; white-space: normal; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  .mods-base__dot, .mods-plate__wave b { animation: none; }
}

/* ==================== БЛОК 7 — ЗАМЕСТИТЕЛЬ ДИРЕКТОРА ====================
   Блок для того, кто платит: одна конструкция «спросил голосом → получил сводку
   цифрами». Кейс про воровство — последний раздел того же листа, а не отдельная
   плита. Красный только в метке риска. Контейнер общий (.sec__wrap). */

.own {
  --own-ink: #0B1220;
  --own-text: #4C5C72;
  --own-line: #DFE6EE;
  --own-accent: #0F6FD8;
  --ground: var(--concrete);

  background: #F6F7F9;
  padding: 5.5rem 0;
}
.own h2, .own h3 { text-transform: none; text-wrap: pretty; margin: 0; }

/* --- 1. шапка --- */
.own-head { padding-bottom: 2.75rem; }
.own-kicker { font-size: 0.625rem; letter-spacing: 0.24em; color: var(--own-accent); white-space: nowrap; }
.own-title { margin-top: 1rem; max-width: 56.25rem; font-size: 3.125rem; line-height: 1.08; font-weight: 600; letter-spacing: -0.03em; color: var(--own-ink); }
.own-title span { color: var(--own-accent); }
.own-lead { margin: 1.25rem 0 0; max-width: 41.25rem; font-size: 1.625rem; line-height: 1.4; letter-spacing: -0.015em; color: var(--own-text); text-wrap: pretty; }
.own-lead b { font-weight: 600; color: var(--own-ink); }

/* --- 2. сцена --- */
.own-scene {
  display: grid; grid-template-columns: minmax(17.5rem, 0.5fr) minmax(0, 1fr); gap: 3.5rem;
  align-items: start;
  border-top: 1px solid var(--own-line);
  padding-top: 2.5rem;
}

/* лента голосовых вопросов */
.own-ask { min-width: 0; }
.own-ask__label { font-size: 0.625rem; letter-spacing: 0.2em; color: var(--own-accent); white-space: nowrap; }
.own-q {
  margin-top: 0.75rem;
  background: #FFFFFF;
  border: 1px solid var(--own-line);
  border-radius: 0.875rem 0.875rem 0.875rem 0.25rem;
  padding: 0.9375rem 1.0625rem;
}
.own-ask__label + .own-q { margin-top: 1rem; }
.own-q__player { display: flex; align-items: center; gap: 0.75rem; }
.own-q__play { flex: none; width: 1.625rem; height: 1.625rem; border-radius: 50%; background: var(--own-accent); display: flex; align-items: center; justify-content: center; }
.own-q__play svg { width: 0.5rem; height: 0.625rem; display: block; }
.own-q__play path { fill: #FFFFFF; }
.own-q__wave { flex: 1; display: flex; align-items: center; gap: 0.1875rem; height: 1.25rem; }
.own-q__wave b { display: block; width: 0.1375rem; border-radius: 1.1px; background: #7FA6CE; transform-origin: center; animation: wf 1.15s ease-in-out infinite alternate; }
.own-q__wave b:nth-child(2) { animation-delay: .08s; }
.own-q__wave b:nth-child(3) { animation-delay: .16s; }
.own-q__wave b:nth-child(4) { animation-delay: .24s; }
.own-q__wave b:nth-child(5) { animation-delay: .32s; }
.own-q__wave b:nth-child(6) { animation-delay: .40s; }
.own-q__wave b:nth-child(7) { animation-delay: .48s; }
.own-q__wave b:nth-child(8) { animation-delay: .56s; }
.own-q__wave b:nth-child(9) { animation-delay: .64s; }
.own-q__time { flex: none; font-size: 0.625rem; letter-spacing: 0.08em; color: #9AAABE; }
.own-q__text { margin: 0.75rem 0 0; font-size: 1.125rem; line-height: 1.35; font-weight: 600; letter-spacing: -0.012em; color: var(--own-ink); text-wrap: pretty; }

.own-chips { margin-top: 1.375rem; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.own-chip {
  font-family: var(--font-mono);
  font-size: 0.6562rem; letter-spacing: 0.08em;
  color: #40658F;
  background: rgba(15, 111, 216, 0.06);
  border: 1px solid rgba(15, 111, 216, 0.28);
  border-radius: 0.375rem;
  padding: 0.375rem 0.6875rem;
  white-space: nowrap;
}

/* лист сводки */
.own-sheet {
  position: sticky; top: 2rem;
  min-width: 0;
  background: #FFFFFF;
  border: 1px solid #D8E0EA;
  border-radius: 0.75rem;
  padding: 2rem 2.25rem;
  box-shadow: 0 1.25rem 3rem rgba(11, 18, 32, 0.08);
}
.own-sheet__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; padding-bottom: 1.125rem; border-bottom: 1px solid #E4EAF2; }
.own-sheet__title { font-size: 0.625rem; letter-spacing: 0.2em; color: #6D7F97; white-space: nowrap; }
.own-sheet__live { display: flex; align-items: center; gap: 0.5rem; font-size: 0.5625rem; letter-spacing: 0.16em; color: var(--own-accent); white-space: nowrap; }
.own-sheet__dot { width: 0.3125rem; height: 0.3125rem; flex: none; border-radius: 50%; background: var(--own-accent); animation: dotPulse 2.4s ease-in-out infinite; }

.own-answer { padding: 1.375rem 0; border-bottom: 1px solid #E4EAF2; }
.own-answer__label { font-size: 0.5625rem; letter-spacing: 0.18em; color: #9AAABE; }
.own-answer__text { margin: 0.625rem 0 0; max-width: 37.5rem; font-size: 1.125rem; line-height: 1.5; color: #33435C; text-wrap: pretty; }

/* кейс — последний раздел того же листа */
.own-risk { padding-top: 1.375rem; }
.own-risk__meta { display: flex; align-items: center; gap: 0.5rem; }
.own-risk__dot { width: 0.375rem; height: 0.375rem; flex: none; border-radius: 50%; background: #DC3D48; animation: dotPulse 2.4s ease-in-out infinite; }
.own-risk__label { font-size: 0.5625rem; letter-spacing: 0.18em; color: #DC3D48; white-space: nowrap; }
.own-risk__title { margin-top: 0.75rem; font-size: 1.3125rem; line-height: 1.28; font-weight: 600; letter-spacing: -0.015em; color: var(--own-ink); }
.own-risk__text { margin: 0.75rem 0 0; max-width: 38.75rem; font-size: 1.0312rem; line-height: 1.55; color: var(--own-text); text-wrap: pretty; }
.own-risk__text b { font-weight: 600; color: var(--own-ink); }

/* --- 3. подвал: цена --- */
.own-price {
  display: flex; align-items: center; justify-content: space-between; gap: 3.5rem; flex-wrap: wrap;
  margin-top: 3.5rem;
  border-top: 1px solid var(--own-line);
  padding-top: 2.25rem;
}
.own-price__group { display: flex; align-items: center; gap: 1.75rem; flex-wrap: wrap; }
.own-price__label { font-size: 0.5938rem; letter-spacing: 0.2em; color: #9AAABE; white-space: nowrap; }
.own-price__label--hot { color: var(--own-accent); }
.own-price__sum { margin-top: 0.625rem; font-family: var(--font-mono); font-size: 1.875rem; font-weight: 700; letter-spacing: -0.02em; color: #C3CFDC; white-space: nowrap; }
.own-price__sep { width: 1.625rem; height: 1px; background: #C3CFDC; }
.own-price__row { margin-top: 0.625rem; display: flex; align-items: center; gap: 0.875rem; }
.own-price__value { font-size: 1.875rem; line-height: 1.1; font-weight: 600; letter-spacing: -0.022em; color: var(--own-ink); }
.own-price__cups { display: flex; align-items: center; gap: 0.25rem; }
.own-price__cups svg { width: 1.25rem; height: 1.4375rem; display: block; }
.own-price__cta {
  display: inline-flex; align-items: center; min-height: 2.75rem;
  background: var(--own-accent);
  border-radius: 0.5625rem;
  padding: 1.0625rem 2rem;
  font-size: 1rem; font-weight: 600;
  color: #FFFFFF;
  white-space: nowrap;
  transition: background var(--t-micro) var(--ease);
}
.own-price__cta:hover { background: #1E7EE6; color: #FFFFFF; }

/* --- адаптив --- */
@media (max-width: 1040px) {
  .own-scene { grid-template-columns: 1fr; gap: 2rem; }
  .own-sheet { position: static; }
  .own-price { flex-direction: column; align-items: flex-start; gap: 2rem; }
  /* чёрточка между ценами при переносе на две строки повисает в конце первой — без неё */
  .own-price__sep { display: none; }
  .own-price__group { gap: 1.5rem 2.5rem; }
}

@media (max-width: 760px) {
  .own-title { font-size: 2.125rem; }
  .own-lead { font-size: 1.375rem; }
  .own-sheet { padding: 1.5rem; }
  .own-price__group { flex-direction: column; align-items: flex-start; gap: 1.25rem; }
  .own-price__value, .own-price__sum { font-size: 1.5rem; }
  /* чашки идут сразу за словом «день», а не висят у правого края, когда фраза переносится */
  .own-price__row { display: block; }
  .own-price__cups { display: inline-flex; vertical-align: middle; margin-left: 0.625rem; }
  .own-price__cta { width: 100%; justify-content: center; white-space: normal; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  .own-q__wave b, .own-sheet__dot, .own-risk__dot { animation: none; }
}

/* ==================== БЛОК 8 — ПЯТЬ РЕЗУЛЬТАТОВ ====================
   Рациональное резюме: пять ударов равного веса, реестром — той же конструкцией,
   что модули в блоке 5. Ни плиток, ни голограмм. Контейнер общий (.sec__wrap). */

.build {
  --res-line: #1C2A44;
  --res-white: #F2F7FD;
  --res-text: #B6C5DB;

  position: relative;
  background: #0B1220;
  padding: 5.5rem 0;
  overflow: clip;
}
.build__wrap { position: relative; z-index: 1; }
.build h2, .build h3 { text-transform: none; text-wrap: pretty; margin: 0; }

/* --- 1. шапка --- */
.res-head {
  position: relative;
  display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; flex-wrap: wrap;
  padding-bottom: 3.25rem;
}
.res-head__glow {
  position: absolute; left: -8.75rem; top: -11.25rem;
  width: 38.75rem; height: 38.75rem;
  background: radial-gradient(50% 50% at 50% 50%, rgba(74, 180, 235, 0.1) 0%, rgba(74, 180, 235, 0) 70%);
  pointer-events: none;
}
.res-head__text { position: relative; flex: 1 1 35rem; min-width: 0; }
.res-kicker { font-size: 0.625rem; letter-spacing: 0.24em; color: #5EC8F8; white-space: nowrap; }
.res-title { margin-top: 1rem; max-width: 51.25rem; font-size: 3.25rem; line-height: 1.08; font-weight: 600; letter-spacing: -0.03em; color: var(--res-white); }
.res-title span { color: #1E7EE6; }
.res-lead { margin: 1.25rem 0 0; max-width: 40rem; font-size: 1.6875rem; line-height: 1.4; letter-spacing: -0.015em; color: #8FA2BE; text-wrap: pretty; }
.res-lead b { font-weight: 600; color: var(--res-white); }

.res-count { position: relative; flex: none; display: flex; align-items: center; gap: 0.625rem; padding-bottom: 0.5rem; }
.res-count__dot { width: 0.375rem; height: 0.375rem; border-radius: 50%; background: #5EC8F8; animation: dotPulse 2.4s ease-in-out infinite; }
.res-count__label { font-size: 0.625rem; letter-spacing: 0.18em; color: #7E93B4; white-space: nowrap; }

/* --- 2. реестр --- */
.res-list { border-top: 1px solid var(--res-line); }
.res-row {
  display: grid;
  grid-template-columns: 8.25rem minmax(15rem, 0.78fr) minmax(0, 1fr);
  gap: 2.5rem;
  align-items: baseline;
  padding: 2.25rem 0;
  border-bottom: 1px solid var(--res-line);
}
.res-row__num { font-size: 2.125rem; font-weight: 700; letter-spacing: -0.02em; color: rgba(94, 200, 248, 0.32); }
.res-row__title { font-size: 1.8125rem; line-height: 1.18; font-weight: 600; letter-spacing: -0.022em; color: var(--res-white); }
.res-row__body { min-width: 0; }
.res-row__text { margin: 0; max-width: 35rem; font-size: 1.0625rem; line-height: 1.55; color: var(--res-text); text-wrap: pretty; }

/* контраст «минуты против недель»: весь приём — в длине полос */
.res-bars { margin-top: 1.25rem; max-width: 32.5rem; display: flex; flex-direction: column; gap: 0.75rem; }
.res-bar { display: flex; align-items: center; gap: 0.75rem; }
.res-bar__label { flex: 0 0 6rem; font-size: 0.5625rem; letter-spacing: 0.16em; color: #5E7796; }
.res-bar__label--on { color: #9FDFFF; }
.res-bar__line { height: 0.375rem; border-radius: 0.1875rem; }
.res-bar__line--on { flex: none; width: 2.125rem; background: #5EC8F8; }
.res-bar__line--off { flex: 1; background: #22334F; }
.res-bar__value { flex: none; font-size: 0.75rem; letter-spacing: 0.08em; color: #8FA2BE; white-space: nowrap; }
.res-bar__value--on { color: #DFEDFA; }

/* --- 3. финал --- */
.res-final {
  display: flex; align-items: center; justify-content: space-between; gap: 3.5rem; flex-wrap: wrap;
  padding-top: 3.5rem;
}
.res-final__text { margin: 0; max-width: 45rem; font-size: 2.125rem; line-height: 1.18; font-weight: 600; letter-spacing: -0.025em; color: var(--res-white); text-wrap: pretty; }
.res-final__text span { color: #5EC8F8; }
.res-final__cta {
  display: inline-flex; align-items: center; min-height: 2.75rem;
  border: 1px solid rgba(94, 200, 248, 0.45);
  border-radius: 0.5625rem;
  padding: 1rem 1.875rem;
  font-size: 1rem; font-weight: 600;
  color: #CDE9FB;
  white-space: nowrap;
  transition: border-color var(--t-micro) var(--ease), color var(--t-micro) var(--ease);
}
.res-final__cta:hover { border-color: rgba(159, 224, 255, 0.85); color: #FFFFFF; }

/* --- адаптив --- */
@media (max-width: 1040px) {
  /* в колонке flex-basis работает как высота — сбрасываем, иначе под шапкой пустота */
  [data-head] { flex-direction: column; align-items: flex-start; gap: 1.5rem; }
  [data-head] > div { flex: 0 0 auto; width: 100%; }
  [data-head] > div + div { width: auto; }
  .res-row { grid-template-columns: 1fr; gap: 0.75rem; align-items: start; }
  .res-row__title { font-size: 1.625rem; }
  .res-row__text { max-width: none; }
  .res-final { flex-direction: column; align-items: flex-start; gap: 2rem; }
}

@media (max-width: 760px) {
  .res-title { font-size: 2.25rem; }
  .res-lead { font-size: 1.4375rem; }
  .res-final__text { font-size: 1.75rem; }
  .res-final__cta { width: 100%; justify-content: center; white-space: normal; text-align: center; }
  .res-bar__label { flex-basis: 4.5rem; }
}

@media (prefers-reduced-motion: reduce) {
  .res-count__dot { animation: none; }
}

/* ==================== БЛОК 9 — ИНТЕГРАЦИИ С ПОСТАВЩИКАМИ ====================
   Заимствованное доверие: федеральные бренды рядом, цены обновляются каждый день.
   Конструкция — тот же реестр, что модули в блоке 5 и результаты в блоке 8:
   ни сходящихся кривых, ни схем. Контейнер общий (.sec__wrap). */

.sup {
  --sup-ink: #0B1220;
  --sup-text: #4C5C72;
  --sup-line: #DFE6EE;
  --sup-accent: #0F6FD8;
  --ground: var(--concrete);

  background: #F6F7F9;
  padding: 5.5rem 0;
}
.sup h2, .sup h3 { text-transform: none; text-wrap: pretty; margin: 0; }

/* --- 1. шапка --- */
.sup-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; flex-wrap: wrap; padding-bottom: 3rem; }
.sup-head__text { flex: 1 1 40rem; min-width: 0; }
.sup-kicker { font-size: 0.625rem; letter-spacing: 0.24em; color: var(--sup-accent); white-space: nowrap; }
.sup-title { margin-top: 1rem; max-width: 51.25rem; font-size: 3.125rem; line-height: 1.08; font-weight: 600; letter-spacing: -0.03em; color: var(--sup-ink); }
.sup-title span { color: var(--sup-accent); }
.sup-lead { margin: 1.25rem 0 0; max-width: 41.25rem; font-size: 1.625rem; line-height: 1.4; letter-spacing: -0.015em; color: var(--sup-text); text-wrap: pretty; }
.sup-lead b { font-weight: 600; color: var(--sup-ink); }

.sup-fresh { flex: none; display: flex; align-items: center; gap: 0.625rem; padding-bottom: 0.5rem; }
.sup-fresh__dot { width: 0.375rem; height: 0.375rem; border-radius: 50%; background: var(--sup-accent); animation: dotPulse 2.4s ease-in-out infinite; }
.sup-fresh__label { font-size: 0.625rem; letter-spacing: 0.18em; color: #6D7F97; white-space: nowrap; }

/* --- 2. реестр поставщиков --- */
.sup-list { border-top: 1px solid var(--sup-line); }
.sup-row {
  display: grid;
  grid-template-columns: 8.25rem minmax(15rem, 0.78fr) minmax(0, 1fr);
  gap: 2.5rem;
  align-items: center;
  padding: 1.75rem 0;
  border-bottom: 1px solid var(--sup-line);
}
/* логотип вписывается по контуру: ничего не обрезается и не растягивается */
.sup-row__logo {
  width: 100%; max-width: 8.25rem; height: 4rem;
  background: #FFFFFF;
  border: 1px solid var(--sup-line);
  border-radius: 0.375rem;
  display: flex; align-items: center; justify-content: center;
  padding: 0.625rem 0.75rem;
  box-sizing: border-box;
}
.sup-row__logo img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.sup-row__name { font-size: 1.75rem; line-height: 1.15; font-weight: 600; letter-spacing: -0.022em; color: var(--sup-ink); }
.sup-row__meta { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; min-width: 0; }
.sup-row__cat { font-size: 0.625rem; letter-spacing: 0.18em; color: #6D7F97; }
.sup-row__state { display: flex; align-items: center; gap: 0.5rem; font-size: 0.625rem; letter-spacing: 0.14em; color: var(--sup-accent); white-space: nowrap; }
.sup-row__dot { width: 0.3125rem; height: 0.3125rem; flex: none; border-radius: 50%; background: var(--sup-accent); }

/* --- 3. подвал --- */
.sup-foot { display: flex; align-items: center; justify-content: space-between; gap: 3rem; padding-top: 2.75rem; }
.sup-foot__line { flex: 1; height: 1px; background: var(--sup-line); }
.sup-foot__text { margin: 0; max-width: 26.25rem; font-size: 1.0625rem; line-height: 1.5; color: var(--sup-text); text-wrap: pretty; }
.sup-foot__text b { font-weight: 600; color: var(--sup-ink); }

/* --- адаптив --- */
@media (max-width: 1040px) {
  .sup-row { grid-template-columns: 1fr; gap: 1rem; align-items: start; }
  .sup-row__name { font-size: 1.5625rem; }
  .sup-row__meta { justify-content: flex-start; gap: 1rem; }
  /* в столбик линия-выноска дублировала бы нижнюю границу списка — двойной черты быть не должно */
  .sup-foot { flex-direction: column; align-items: flex-start; gap: 0; padding-top: 2rem; }
  .sup-foot__line { display: none; }
  .sup-foot__text { max-width: none; }
}

@media (max-width: 760px) {
  .sup-title { font-size: 2.125rem; }
  .sup-lead { font-size: 1.375rem; }
}

@media (prefers-reduced-motion: reduce) {
  .sup-fresh__dot { animation: none; }
}

/* ==================== БЛОК 10 — ВНЕДРЕНИЕ ПОД КЛЮЧ: ДВА СПИСКА ДЕЛ ====================
   Снимает страх «купим — и бросят с настройками». Весь приём — в длине списков:
   тринадцать пунктов у нас против одного у клиента. Ни дорожек, ни шевронов,
   ни пунктиров. Контейнер общий для страницы (.sec__wrap). */

.impl {
  --impl-ink: #0B1220;
  --impl-text: #4C5C72;
  --impl-line: #DFE6EE;
  --impl-accent: #0F6FD8;
  --ground: var(--concrete);

  background: #F6F7F9;
  padding: 5.5rem 0;
}
.impl h2, .impl h3 { text-transform: none; text-wrap: pretty; margin: 0; }

/* --- 1. шапка --- */
.impl-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; flex-wrap: wrap; padding-bottom: 3rem; }
.impl-head__text { flex: 1 1 40rem; min-width: 0; }
.impl-kicker { font-size: 0.625rem; letter-spacing: 0.24em; color: var(--impl-accent); white-space: nowrap; }
.impl-title { margin-top: 1rem; max-width: 53.75rem; font-size: 3.125rem; line-height: 1.08; font-weight: 600; letter-spacing: -0.03em; color: var(--impl-ink); }
.impl-title span { color: var(--impl-accent); }
.impl-lead { margin: 1.25rem 0 0; max-width: 42.5rem; font-size: 1.625rem; line-height: 1.4; letter-spacing: -0.015em; color: var(--impl-text); text-wrap: pretty; }
.impl-lead b { font-weight: 600; color: var(--impl-ink); }

.impl-tag { flex: none; display: flex; align-items: center; gap: 0.625rem; padding-bottom: 0.5rem; }
.impl-tag__dot { width: 0.375rem; height: 0.375rem; border-radius: 50%; background: var(--impl-accent); animation: dotPulse 2.4s ease-in-out infinite; }
.impl-tag__label { font-size: 0.625rem; letter-spacing: 0.18em; color: #6D7F97; white-space: nowrap; }

/* --- 2. два списка --- */
.impl-lists {
  display: grid; grid-template-columns: minmax(0, 1.42fr) minmax(17.5rem, 1fr); gap: 4rem;
  align-items: start;
  border-top: 1px solid var(--impl-line);
  padding-top: 2.5rem;
}
.impl-col { min-width: 0; }
.impl-col--you { border-left: 1px solid var(--impl-line); padding-left: 4rem; }

.impl-col__head { display: flex; align-items: baseline; gap: 1.125rem; padding-bottom: 1.125rem; }
.impl-col--we .impl-col__head { border-bottom: 2px solid var(--impl-accent); }
.impl-col--you .impl-col__head { border-bottom: 2px solid #C3CFDC; }
.impl-col__title { font-size: 2.5rem; line-height: 1; font-weight: 700; letter-spacing: -0.03em; white-space: nowrap; }
.impl-col--we .impl-col__title { color: var(--impl-accent); }
.impl-col--you .impl-col__title { color: var(--impl-ink); }
.impl-col__count { font-size: 0.8125rem; letter-spacing: 0.12em; color: #9AAABE; white-space: nowrap; }

.impl-stage { margin-top: 1.75rem; }
.impl-stage__head { display: flex; align-items: baseline; gap: 0.875rem; }
.impl-stage__num { font-size: 0.625rem; letter-spacing: 0.16em; color: #B3C0D1; }
.impl-stage__title { font-size: 1.5rem; line-height: 1.2; font-weight: 600; letter-spacing: -0.02em; color: var(--impl-ink); }

.impl-points { margin: 0.875rem 0 0; padding: 0 0 0 2.125rem; list-style: none; display: flex; flex-direction: column; gap: 0.5625rem; }
.impl-points li { display: flex; align-items: flex-start; gap: 0.625rem; }
.impl-points li span { font-size: 1rem; line-height: 1.45; color: var(--impl-text); text-wrap: pretty; }

.impl-check { flex: none; width: 0.875rem; height: 0.875rem; margin-top: 0.25rem; fill: none; stroke: var(--impl-accent); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.impl-check--big { width: 1rem; height: 1rem; margin-top: 0.5rem; stroke-width: 2; }

/* правая колонна: один пункт крупнее любого из тринадцати */
.impl-one { margin-top: 1.75rem; display: flex; align-items: flex-start; gap: 0.75rem; }
.impl-one span { font-size: 2rem; line-height: 1.18; font-weight: 600; letter-spacing: -0.024em; color: var(--impl-ink); text-wrap: pretty; }

.impl-after { margin: 1.375rem 0 0; padding-top: 1.375rem; border-top: 1px solid var(--impl-line); font-size: 1.0625rem; line-height: 1.55; color: var(--impl-text); text-wrap: pretty; }
.impl-after b { font-weight: 600; color: var(--impl-ink); }

.impl-cta {
  display: inline-flex; align-items: center; min-height: 2.75rem;
  margin-top: 2rem;
  background: var(--impl-accent);
  border-radius: 0.5625rem;
  padding: 1.0625rem 2rem;
  font-size: 1rem; font-weight: 600;
  color: #FFFFFF;
  white-space: nowrap;
  transition: background var(--t-micro) var(--ease);
}
.impl-cta:hover { background: #1E7EE6; color: #FFFFFF; }

/* цитата основателя: портрет маленький и круглый, иначе колонка рвётся */
.impl-quote { margin: 3.5rem 0 0; padding-top: 2rem; border-top: 1px solid var(--impl-line); }
.impl-quote__text { margin: 0; font-size: 1.3125rem; line-height: 1.42; letter-spacing: -0.015em; color: var(--impl-ink); text-wrap: pretty; }
.impl-quote__author { display: flex; align-items: center; gap: 0.875rem; margin-top: 1.25rem; }
.impl-quote__photo { flex: none; width: 3.25rem; height: 3.25rem; border-radius: 50%; object-fit: cover; object-position: center 8%; }
.impl-quote__name { font-size: 0.875rem; line-height: 1.4; color: #66788F; }
.impl-quote__name span { color: #9AAABE; }

/* --- адаптив --- */
@media (max-width: 1040px) {
  /* шапка в столбик: метка уходит под текст на всю ширину, а не висит справа */
  .impl-head { flex-direction: column; align-items: flex-start; gap: 1.5rem; }
  .impl-head .impl-head__text, .impl-head .impl-tag { flex: 0 0 auto; width: 100%; padding-bottom: 0; }
  .impl-lists { grid-template-columns: 1fr; gap: 2.5rem; }
  .impl-col--you { border-left: 0; padding-left: 0; border-top: 1px solid var(--impl-line); padding-top: 2.25rem; }
}

@media (max-width: 760px) {
  .impl-title { font-size: 2.125rem; }
  .impl-lead { font-size: 1.375rem; }
  .impl-col__title { font-size: 2.125rem; }
  .impl-one span { font-size: 1.875rem; }
  .impl-cta { width: 100%; justify-content: center; white-space: normal; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  .impl-tag__dot { animation: none; }
}

/* ==================== БЛОК 12 — ЧАСТЫЕ ВОПРОСЫ ====================
   Реестр возражений во всю ширину контента: закрытая строка — линия и вопрос,
   раскрытая — белая карточка с синей линией. Состояние читается по фону, линии и знаку,
   цвет вопроса не меняется. Ни пунктира, ни шевронов; финала у блока нет. */

.faq {
  --faq-ink: #0B1220;
  --faq-text: #4C5C72;
  --faq-line: #DFE6EE;
  --faq-accent: #0F6FD8;
  --ground: var(--concrete);

  background: #F6F7F9;
  padding: 5.5rem 0;
}
.faq h2, .faq h3 { text-transform: none; text-wrap: pretty; margin: 0; }

/* --- 1. шапка --- */
.faq-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 3rem; flex-wrap: wrap; padding-bottom: 3rem; }
.faq-head__text { flex: 1 1 40rem; min-width: 0; }
.faq-kicker { font-size: 0.625rem; letter-spacing: 0.24em; color: var(--faq-accent); white-space: nowrap; }
.faq-title { margin-top: 1rem; max-width: 51.25rem; font-size: 3.125rem; line-height: 1.08; font-weight: 600; letter-spacing: -0.03em; color: var(--faq-ink); }
.faq-title span { color: var(--faq-accent); }
.faq-lead { margin: 1.25rem 0 0; max-width: 41.25rem; font-size: 1.625rem; line-height: 1.4; letter-spacing: -0.015em; color: var(--faq-text); text-wrap: pretty; }
.faq-lead b { font-weight: 600; color: var(--faq-ink); }

.faq-tag { flex: none; display: flex; align-items: center; gap: 0.625rem; padding-bottom: 0.5rem; }
.faq-tag__dot { width: 0.375rem; height: 0.375rem; border-radius: 50%; background: var(--faq-accent); animation: dotPulse 2.4s ease-in-out infinite; }
.faq-tag__label { font-size: 0.625rem; letter-spacing: 0.18em; color: #6D7F97; white-space: nowrap; }

/* --- 2. гармошка --- */
.faq-list { margin: 0; padding: 0; list-style: none; border-bottom: 1px solid var(--faq-line); }   /* замыкающая линия реестра */
.faq-row {
  --faq-bleed: 1.75rem;   /* открытая карточка выходит за края реестра — контент остаётся на своей оси */
  border-top: 1px solid var(--faq-line);
  background: transparent;
  transition: background var(--t-base) var(--ease), border-color var(--t-base) var(--ease), box-shadow var(--t-base) var(--ease);
}
.faq-row.is-open {
  margin: 0 calc(-1 * var(--faq-bleed)); padding: 0 var(--faq-bleed);
  background: var(--surface);
  border-top-color: transparent; border-radius: 0.875rem;
  box-shadow: inset 0 0 0 1px rgba(15, 111, 216, 0.22), 0 1.125rem 2.75rem rgba(11, 18, 32, 0.07);
}
.faq-row.is-open + .faq-row { border-top-color: transparent; }
.faq-list:has(> .faq-row.is-open:last-child) { border-bottom-color: transparent; }
.faq-row__h { font-size: inherit; font-weight: inherit; line-height: inherit; letter-spacing: normal; }

.faq-q {
  position: relative;
  display: block; width: 100%;
  margin: 0; padding: 1.875rem 0;
  background: transparent; border: 0;
  font: inherit; color: inherit; text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.faq-row.is-open .faq-q { padding-bottom: 1.25rem; }
.faq-q:focus-visible { outline: 2px solid rgba(15, 111, 216, 0.55); outline-offset: -2px; }

/* призрачная цифра стоит в левом поле строки; контент сдвинут, чтобы она не легла под метку */
.faq-q__num {
  position: absolute; left: 0; top: 1.125rem;
  width: 3.25rem;
  font-family: var(--font-mono); font-size: 3.25rem; line-height: 1; font-weight: 700;
  color: rgba(15, 111, 216, 0.07);
  pointer-events: none;
  transition: color var(--t-base) var(--ease);
}
.faq-row.is-open .faq-q__num { color: rgba(15, 111, 216, 0.16); }

.faq-q__body { display: flex; align-items: flex-start; gap: 1.5rem; padding-left: 4.75rem; }
.faq-q__main { flex: 1 1 auto; min-width: 0; display: block; }
.faq-q__tag { display: block; font-size: 0.5938rem; letter-spacing: 0.2em; color: #9AAABE; white-space: nowrap; transition: color var(--t-base) var(--ease); }
.faq-row.is-open .faq-q__tag { color: var(--faq-accent); }
.faq-q__text { display: block; margin-top: 0.75rem; max-width: 47.5rem; font-size: 1.5625rem; line-height: 1.28; font-weight: 600; letter-spacing: -0.02em; color: var(--faq-ink); text-wrap: pretty; }

/* знак: плюс поворачивается в крестик */
.faq-q__sign {
  flex: none; display: flex; align-items: center; justify-content: center;
  width: 2.125rem; height: 2.125rem; margin-top: 0.875rem;
  border: 1px solid #C9D5E2; border-radius: 50%;
  background: transparent; color: #66788F;
  transition: transform var(--t-base) var(--ease), background var(--t-base) var(--ease), border-color var(--t-base) var(--ease), color var(--t-base) var(--ease);
}
.faq-q__sign svg { display: block; width: 0.875rem; height: 0.875rem; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; }
.faq-q:hover .faq-q__sign { border-color: var(--faq-accent); }
.faq-row.is-open .faq-q__sign { background: var(--faq-accent); border-color: var(--faq-accent); color: #FFFFFF; transform: rotate(45deg); }

/* ответ выровнен по вопросу; первая фраза — суть, её видно без чтения абзаца */
.faq-a { display: none; padding: 0 5.75rem 2.125rem 4.75rem; }
.faq-row.is-open .faq-a { display: block; }
.faq-a p { margin: 0; max-width: 47.5rem; font-size: 1.125rem; line-height: 1.6; color: var(--faq-text); text-wrap: pretty; }
.faq-a b { font-weight: 600; color: var(--faq-ink); }

@media (max-width: 1040px) {
  .faq-head { flex-direction: column; align-items: flex-start; gap: 1.5rem; }
  .faq-head .faq-head__text, .faq-head .faq-tag { flex: 0 0 auto; width: 100%; padding-bottom: 0; }
}

@media (max-width: 760px) {
  .faq-title { font-size: 2.25rem; }
  .faq-lead { font-size: 1.375rem; }
  .faq-row { --faq-bleed: 0.875rem; }
  .faq-q__num { width: 2.5rem; font-size: 2.5rem; }
  .faq-q__body { padding-left: 3.375rem; gap: 1rem; }
  .faq-q__text { font-size: 1.3125rem; }
  .faq-a { padding-left: 3.375rem; padding-right: 2.25rem; }   /* текст ответа не упирается в правый край карточки */
}

@media (prefers-reduced-motion: reduce) {
  .faq-tag__dot { animation: none; }
}

/* ==================== БЛОК 13 — ФИНАЛЬНЫЙ CTA + ДОРОЖНАЯ КАРТА ====================
   Последний шаг без риска: рядом с кнопкой лежит настоящая страница документа,
   который клиент получит. Тот же кино-кадр, каким страница открылась.
   Контейнер — кадр 1400/64 (.wrap), как у hero.
   Стоит между блоком 11 и частыми вопросами: воздух над кадром даёт нижнее поле блока 11,
   под кадром — верхнее поле вопросов, своих полей у секции нет. */

.final { --ground: var(--concrete); background: #F6F7F9; padding: 0; }

.cta-frame {
  position: relative;
  border-radius: 0.25rem;
  overflow: hidden;
  background: #0B1220;
}
.cta-frame__photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; }
.cta-frame__veil { position: absolute; inset: 0; pointer-events: none; }
.cta-frame__veil--tint { background: rgba(13, 32, 66, 0.42); }
.cta-frame__veil--left { background: linear-gradient(90deg, rgba(4,7,14,.95) 0%, rgba(4,7,14,.88) 34%, rgba(4,7,14,.42) 72%, rgba(4,7,14,.2) 100%); }
.cta-frame__veil--bottom { background: linear-gradient(180deg, rgba(4,7,14,.5) 0%, rgba(4,7,14,0) 38%, rgba(4,7,14,.55) 100%); }
.cta-frame__content { position: relative; z-index: 1; padding: 5.5rem 4.5rem 6rem; }
.final h2, .final h3 { text-transform: none; text-wrap: pretty; margin: 0; }

/* --- 1. шапка --- */
.cta-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 3rem; flex-wrap: wrap; }
.cta-head__text { flex: 1 1 40rem; min-width: 0; }
.cta-kicker { display: flex; align-items: center; gap: 0.75rem; }
.cta-kicker__wave { display: flex; align-items: center; gap: 0.1875rem; height: 1.25rem; }
.cta-kicker__wave b { display: block; width: 0.1375rem; border-radius: 1.1px; background: #5EC8F8; transform-origin: center; animation: wf 1.1s ease-in-out infinite alternate; }
.cta-kicker__wave b:nth-child(2) { animation-delay: .15s; }
.cta-kicker__wave b:nth-child(3) { animation-delay: .3s; }
.cta-kicker__wave b:nth-child(4) { animation-delay: .45s; }
.cta-kicker__wave b:nth-child(5) { animation-delay: .6s; }
.cta-kicker__label { font-size: 0.625rem; letter-spacing: 0.24em; color: #5EC8F8; white-space: nowrap; }
.cta-title { margin-top: 1rem; max-width: 47.5rem; font-size: 3.125rem; line-height: 1.08; font-weight: 600; letter-spacing: -0.03em; color: #F2F7FD; }
.cta-lead { margin: 1.125rem 0 0; max-width: 38.75rem; font-size: 1.4375rem; line-height: 1.45; letter-spacing: -0.015em; color: #C9D8EA; text-wrap: pretty; }
.cta-lead b { font-weight: 600; color: #FFFFFF; }

.cta-free { flex: none; display: flex; align-items: center; gap: 0.625rem; padding-bottom: 0.5rem; }
.cta-free__dot { width: 0.375rem; height: 0.375rem; border-radius: 50%; background: #5EC8F8; animation: dotPulse 2.4s ease-in-out infinite; }
.cta-free__label { font-size: 0.625rem; letter-spacing: 0.18em; color: #8FA6C4; white-space: nowrap; }

/* --- 2. сцена --- */
.cta-scene {
  display: grid; grid-template-columns: minmax(17.5rem, 0.72fr) minmax(0, 1.28fr); gap: 3.5rem;
  align-items: center;
  margin-top: 3rem;
  padding-top: 2.75rem;
  border-top: 1px solid rgba(159, 224, 255, 0.16);
}

.cta-steps { min-width: 0; }
.cta-step { display: flex; align-items: baseline; gap: 0.875rem; padding: 1.125rem 0; border-bottom: 1px solid rgba(159, 224, 255, 0.12); }
.cta-step__num { flex: none; font-size: 0.625rem; letter-spacing: 0.16em; color: #6B82A4; }
.cta-step__text { font-size: 1.1875rem; line-height: 1.4; color: #DFEDFA; text-wrap: pretty; }

.cta-action { margin-top: 2.25rem; display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; }
.cta-action__btn {
  display: inline-flex; align-items: center; min-height: 2.75rem;
  background: #0F6FD8;
  border-radius: 0.5625rem;
  padding: 1.125rem 2.125rem;
  font-size: 1.0625rem; font-weight: 600;
  color: #FFFFFF;
  white-space: nowrap;
  transition: background var(--t-micro) var(--ease);
}
.cta-action__btn:hover { background: #1E7EE6; color: #FFFFFF; }
.cta-action__note { font-size: 0.6875rem; letter-spacing: 0.16em; color: #8FA6C4; }

/* --- страница документа: реплика страницы 07 диагностики --- */
.doc {
  transform: rotate(-0.8deg);
  background: #F6F7F9;
  border-radius: 0.625rem;
  padding: 1.625rem 1.875rem 1.5rem;
  box-shadow: 0 1.875rem 4.375rem rgba(4, 10, 22, 0.55);
  min-width: 0;
}
.doc__top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.doc__brand { display: flex; align-items: center; gap: 0.625rem; min-width: 0; }
.doc__mark {
  flex: none; width: 1.375rem; height: 1.375rem; border-radius: 0.3125rem;
  background: linear-gradient(160deg, #1478E2, #0A5CBB);
  display: flex; align-items: center; justify-content: center;
  font-size: 0.5rem; font-weight: 700; color: #FFFFFF;
}
.doc__company { font-size: 0.5312rem; letter-spacing: 0.18em; color: #9AAABE; }
.doc__badge { flex: none; display: flex; align-items: center; gap: 0.4375rem; border: 1px solid rgba(15, 111, 216, 0.3); border-radius: 0.375rem; padding: 0.3125rem 0.625rem; }
.doc__badge .mono { font-size: 0.5312rem; letter-spacing: 0.14em; color: #40658F; white-space: nowrap; }
.doc__badge-dot { width: 0.25rem; height: 0.25rem; flex: none; border-radius: 50%; background: #0F6FD8; }

.doc__title { margin-top: 1.375rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.doc__title-left { font-size: 0.5625rem; font-weight: 700; letter-spacing: 0.2em; color: #0B1220; }
.doc__title-right { display: flex; align-items: center; gap: 0.625rem; }
.doc__seven { font-size: 0.5625rem; letter-spacing: 0.2em; color: #9AAABE; white-space: nowrap; }
.doc__page { background: #16223C; border-radius: 1.25rem; padding: 0.1875rem 0.5625rem; font-size: 0.5312rem; font-weight: 700; letter-spacing: 0.1em; color: #FFFFFF; }

.doc__h { margin-top: 0.625rem; font-size: 1.4375rem; line-height: 1.2; font-weight: 700; letter-spacing: -0.022em; color: #0B1220; }

.doc__steps { margin-top: 1.125rem; }
.doc-step {
  display: grid; grid-template-columns: 1.625rem 6.5rem minmax(0, 1fr); gap: 0.75rem;
  align-items: center;
  padding: 0.5625rem 0.75rem;
  border-top: 1px solid #E4EAF2;
}
.doc-step__num { font-size: 0.6562rem; font-weight: 700; letter-spacing: 0.06em; color: #8E9DB1; }
.doc-step__name { font-size: 0.8438rem; font-weight: 700; color: #0B1220; white-space: nowrap; }
.doc-step__text { font-size: 0.75rem; line-height: 1.4; color: #66788F; text-wrap: pretty; }
.doc-step--on { background: #2E6BE6; border-radius: 0.375rem; border-top-color: transparent; }
.doc-step--on .doc-step__num { color: rgba(255, 255, 255, 0.75); }
.doc-step--on .doc-step__name { color: #FFFFFF; }
.doc-step--on .doc-step__text { color: rgba(255, 255, 255, 0.88); }

.doc__tabs { margin-top: 1.25rem; padding-top: 0.875rem; border-top: 1px solid #E4EAF2; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.doc-tab { font-size: 0.5rem; letter-spacing: 0.12em; color: #8E9DB1; background: #FFFFFF; border: 1px solid #DFE6EE; border-radius: 0.3125rem; padding: 0.25rem 0.5rem; white-space: nowrap; }

/* --- адаптив --- */
@media (max-width: 1040px) {
  /* в колоночном флексе flex-basis становится высотой — сбрасываем, иначе под лидом дыра */
  .cta-head[data-head] { flex-direction: column; align-items: flex-start; gap: 1.5rem; }
  .cta-head[data-head] > div { flex: 0 0 auto !important; width: 100% !important; }
  .cta-scene[data-split] { grid-template-columns: 1fr; gap: 2.5rem; }
  .doc { transform: none; }
}

@media (max-width: 760px) {
  .cta-frame__content { padding: 4rem 1.25rem 4.5rem; }
  .cta-title { font-size: 2.125rem; }
  .cta-lead { font-size: 1.25rem; }
  /* поля уже и кегль 1rem — «Записаться на экскурсию →» помещается в одну строку на 360–25.875rem */
  .cta-action__btn { width: 100%; justify-content: center; white-space: normal; text-align: center; padding-left: 1.25rem; padding-right: 1.25rem; font-size: 1rem; }
  .doc { padding: 1.25rem; }
  /* описание шага переносится под название */
  .doc-step { grid-template-columns: 1.625rem minmax(0, 1fr); row-gap: 0.25rem; }
  .doc-step__text { grid-column: 2; }
  .doc-step__name { white-space: normal; }
}

@media (prefers-reduced-motion: reduce) {
  .cta-kicker__wave b, .cta-free__dot { animation: none; }
}

/* ==================== ФУТЕР ==================== */

.foot { background: #0B1220; padding: 4rem 0 3rem; }

.foot__grid { display: flex; justify-content: space-between; gap: 3rem; flex-wrap: wrap; }
.foot__brand { flex: 1 1 20rem; min-width: 0; }
.foot__logo { display: flex; align-items: center; gap: 1rem; }
.foot__mark { flex: none; width: 2.125rem; height: 2.125rem; }
.foot__mark svg { width: 2.125rem; height: 2.125rem; display: block; }
.foot__name { font-size: 1.1875rem; font-weight: 600; letter-spacing: -0.01em; color: #EDF3FB; }
.foot__desc { margin: 1rem 0 0; max-width: 21.25rem; font-size: 0.875rem; line-height: 1.5; color: #7E93B4; }

.foot__req { flex: 0 1 18.75rem; }
.foot__label { font-size: 0.625rem; letter-spacing: 0.2em; color: #5E7796; }
.foot__reqLine { margin: 1rem 0 0; font-size: 0.875rem; line-height: 1.5; color: #5E7796; }

.foot__links { flex: 0 1 15rem; display: flex; flex-direction: column; align-items: flex-start; gap: 1rem; }
.foot__links a { font-size: 0.875rem; color: #8FA2BE; transition: color var(--t-micro) var(--ease); }
.foot__links a:hover { color: var(--holo-bright); }

.foot__bottom {
  margin-top: 2rem; padding-top: 1.5rem;
  border-top: 1px solid #141E2F;
  display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap;
}
.foot__copy { font-size: 0.875rem; color: #5E7796; }
.foot__slogan { font-size: 0.5625rem; letter-spacing: 0.18em; color: #3E5070; }

/* ==================== БЛОКИ 8–13 — МОБАЙЛ ==================== */

@media (max-width: 900px) {
  .foot__grid { gap: 2rem; }
  .foot__brand, .foot__req, .foot__links { flex: 1 1 100%; }
  .foot__links { flex-direction: row; flex-wrap: wrap; gap: 0.5rem 1.5rem; }
  .foot__links a { min-height: 2.75rem; display: flex; align-items: center; }
  .foot__bottom { margin-top: 1.5rem; }
}

/* ==================== АДАПТИВ: два контейнера, два рубежа ==================== */

@media (max-width: 1400px) {
  .wrap, .nav, .hero__content, .sec__wrap { padding-left: 2.5rem; padding-right: 2.5rem; }
}

@media (max-width: 900px) {
  .wrap, .nav, .hero__content, .sec__wrap { padding-left: 1.25rem; padding-right: 1.25rem; }
}

@media (max-width: 600px) {
  .sec { padding: 4rem 0; }
  .sec--dark { padding: 4rem 0; }
  .h2-a { font-size: 1.875rem; }
  .h2-b { font-size: 1.625rem; }
  /* исключение ритма: у кадра hero вертикального поля нет */
  .hero { padding: 0; }
  .levels, .meet, .solution, .duo, .sys, .own, .build, .sup, .impl, .faq { padding: 4rem 0; }
  .final { padding: 0; }
}

/* фигура Кузьмича — только на широких */
@media (max-width: 1219px) {
  .kuz-fig { display: none; }
}
@media (min-width: 1220px) {
  .hero { --card-right: 20rem; }
}

@media (max-width: 1100px) {
  .hero__col { width: 100%; min-width: 0; max-width: 32.5rem; }
  .hero h1 { font-size: 2.5rem; }
  .kuz-card { --card-right: 1.5rem; }
}

@media (max-width: 900px) {
  .nav__links a { min-height: 2.75rem; }   /* тап-цели */
}

/* Вертикальная компоновка: узкие экраны и «высокие» пропорции,
   где кадр 16:9 в режиме cover уже не вмещает голограмму целиком. */
@media (max-width: 900px), (max-aspect-ratio: 13/10) {
  .hero {
    height: auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
  }
  .nav { position: relative; order: 0; }
  .hero .nav::before { display: none; }
  .hero__content { order: 1; height: auto; padding-top: 0.5rem; padding-bottom: 1.5rem; }
  .hero__col { width: 100%; min-width: 0; max-width: 45rem; }
  .hero h1 { font-size: clamp(1.75rem, 4.4vw, 2.5rem); }
  .hero__lead { font-size: 1rem; max-width: 38.75rem; }
  .hero__action { margin-top: 1.5rem; }

  /* кадр на всю ширину: голограмма по горизонтали всегда целиком,
     по высоте — мягкая подрезка вокруг того же якоря */
  .hero__stage {
    position: relative;
    order: 2;
    width: 100%;
    height: clamp(13.75rem, 46vh, 56.25vw);
    overflow: hidden;
  }
  .scene {
    position: absolute;
    left: 0;
    top: 0;                 /* кадр прижат к верху: подрезается только земля снизу */
    transform: none;
    width: 100%;
    height: auto;
    aspect-ratio: var(--scene-ratio);
  }
  .veil--left { background: linear-gradient(90deg, rgba(4,7,14,0.5) 0%, rgba(4,7,14,0.2) 38%, rgba(4,7,14,0) 72%); }
.veil--bottom { background: linear-gradient(180deg, rgba(4,7,14,0.25) 0%, rgba(4,7,14,0) 40%, rgba(4,7,14,0.45) 100%); }

  .kuz-fig { display: none; }

  /* карточка голосового — под кадром на всю ширину, верхом заезжает на фото на 2.5rem:
     так она читается как часть сцены, а не отдельный блок под ней */
  .kuz-card {
    position: relative; right: auto; bottom: auto;   /* right/bottom из десктопного правила при relative сдвигали бы её */
    order: 3;
    width: auto;
    margin: -2.5rem 2.5rem 2rem;
  }
  .kuz-card__link { display: none; }

  /* метки — колонкой в углу кадра, чтобы не уезжали за край. Не абсолютные позиции с жёсткими
     отступами (главная метка с чипом выше 3.5rem, и вторая на неё налезала), а обычный поток:
     кадр — flex-столбик, главная метка первой, зазор 0.5rem, высота любая. */
  .scene--holo .frame { display: flex; flex-direction: column; align-items: flex-start; gap: 0.5rem; padding: 0.875rem; }
  .hud-label { position: static; max-width: 100%; white-space: normal; margin: 0 !important; }
  .hud-label--primary { order: -1; }
}

/* Компакт: типографика и тап-цели */
@media (max-width: 600px) {
  .nav { gap: 1rem; padding-top: 1rem; padding-bottom: 1rem; }
  .nav__logo svg { height: 1.75rem; }
  .nav__links { gap: 1rem; }
  .nav__cta, .nav__links .nav__login { padding: 0.5rem 0.75rem; }

  .hero h1 { font-size: 2rem; }
  .hero__lead { font-size: 0.9688rem; }
  .hero__action { width: 100%; }
  .cta { width: 100%; text-align: center; padding: 1rem 1.5rem; }

  /* чипсы в две строки */
  /* переключатель ниш — служебный элемент, а не кнопка: та же сегментная полоска,
     что на десктопе, только в одну строку на всю ширину и компактнее */
  .switch { display: flex; flex-wrap: nowrap; width: 100%; margin: 0.5rem 0 1.25rem; }
  .switch__btn { flex: 1 1 0; min-width: 0; padding: 0 0.1875rem; min-height: 2.375rem; font-size: clamp(0.6875rem, 3.3vw, 0.75rem); letter-spacing: 0.01em; }   /* на 20rem «Инженерия» и «Общестрой» ещё помещаются */

  /* голограмма упрощённая: без мелкой детализации */
  .holo-detail { display: none; }

  .scan { display: none; }
  .hud-label { padding: 0.5rem 0.75rem; }
  .hud-label__main { font-size: 0.5625rem; letter-spacing: 0.18em; }
  .hud-label .chip { font-size: 0.5625rem; }

  .kuz-card { margin: -2.5rem 1.25rem 2rem; padding: 1rem; }

  .nav__links a, .cta { min-height: 2.75rem; }

  /* голограмма статичная: без прорисовки и мерцания */
  .frame.is-active { animation: none; }
  .frame.is-active .draw { animation: none; stroke-dashoffset: 0; }
  .frame.is-active .fadeIn { animation: none; opacity: 1; }
  .frame.is-active .hud-label { animation: none; opacity: 1; }
}

/* на узких экранах CTA живёт в контенте, в шапке — только логотип */
@media (max-width: 560px) {
  .nav__links .nav__cta { display: none; }
}

/* узкие телефоны: логотип 11.5625rem + «Войти» + бургер в 22.5rem не помещались с зазорами 1rem —
   бургер уезжал за правый край (на 20rem — горизонтальная прокрутка) */
@media (max-width: 400px) {
  .nav { gap: 0.75rem; }
  .nav__links { gap: 0.75rem; }
  .nav__links .nav__login { padding: 0.5rem 0.625rem; }
}
@media (max-width: 340px) {
  .nav__logo svg { height: 1.375rem; }
}

/* ==================== БЕЗ АНИМАЦИЙ ==================== */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .draw { stroke-dashoffset: 0 !important; }
  .fadeIn { opacity: 1 !important; }
  .hud-label { opacity: 1 !important; }
  .scan { display: none; }
  .wave > span { transform: none !important; }
}

/* Шапка на средних ширинах: четыре пункта + две кнопки тесно — сначала сжимаем,
   а на ≤1024 оставляем только «Войти» и экскурсию. */
@media (min-width: 601px) and (max-width: 1180px) {   /* компакт ≤600 задаёт шапку сам */
  .nav { gap: 1.5rem; }
  .nav__links { gap: 1rem; }
  .nav__logo svg { height: 2rem; }
}
@media (max-width: 1024px) {
  .nav__links a:not(.nav__cta):not(.nav__login) { display: none; }
}

/* ==================== МЕНЮ-ГАМБУРГЕР ====================
   Там, где пункты шапки не помещаются (≤1024), они уходят в выпадающую панель.
   «Войти» остаётся в шапке всегда; экскурсия — пока влезает (до 560), дальше — в панели. */
.nav__burger, .nav__panel { display: none; }

@media (max-width: 1024px) {
  .nav__burger {
    display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.25rem;
    flex: none; width: 2.75rem; height: 2.75rem; padding: 0;
    border: 1px solid #2A3A55; border-radius: 0.5625rem;
    background: transparent;
    cursor: pointer;
    transition: border-color var(--t-micro) var(--ease), background var(--t-micro) var(--ease);
  }
  .nav__burger:hover,
  .nav.is-open .nav__burger { border-color: rgba(94, 200, 248, 0.5); background: rgba(94, 200, 248, 0.08); }
  .nav__burger span {
    display: block; width: 1.125rem; height: 1.5px; border-radius: 1px;
    background: #DCE7F4;
    transition: transform var(--t-base) var(--ease), opacity var(--t-micro) var(--ease);
  }
  .nav.is-open .nav__burger span:nth-child(1) { transform: translateY(0.3438rem) rotate(45deg); }
  .nav.is-open .nav__burger span:nth-child(2) { opacity: 0; }
  .nav.is-open .nav__burger span:nth-child(3) { transform: translateY(-0.3438rem) rotate(-45deg); }

  /* панель — роль «карточка»: радиус 12 */
  .nav__panel {
    display: flex; flex-direction: column;
    position: absolute; z-index: 1;
    top: calc(100% - 0.5rem); right: 2.5rem;
    width: 20rem;
    padding: 0.5rem;
    background: rgba(9, 17, 30, 0.96);
    border: 1px solid rgba(94, 200, 248, 0.32);
    border-radius: var(--r-card);
    backdrop-filter: blur(0.625rem);
    box-shadow: 0 1rem 3rem rgba(2, 5, 12, 0.5);
    opacity: 0; visibility: hidden; transform: translateY(-0.5rem);
    transition: opacity var(--t-base) var(--ease), transform var(--t-base) var(--ease), visibility 0s linear var(--t-base);
  }
  .nav.is-open .nav__panel {
    opacity: 1; visibility: visible; transform: none;
    transition: opacity var(--t-base) var(--ease), transform var(--t-base) var(--ease), visibility 0s;
  }
  .nav__panel a:not(.cta) {
    display: flex; align-items: center;
    min-height: 2.75rem; padding: 0 1rem;
    border-radius: 0.5rem;
    font-size: 0.9688rem; color: #DCE7F4;
    transition: background var(--t-micro) var(--ease), color var(--t-micro) var(--ease);
  }
  .nav__panel a:not(.cta):hover { background: rgba(94, 200, 248, 0.08); color: #FFFFFF; }
  .nav__panel a[aria-current="page"] { color: var(--holo-bright); }
  .nav__panel-cta { display: none; }
}

@media (max-width: 900px) {
  .nav__panel { right: 1.25rem; }
}

@media (max-width: 600px) {
  .nav__panel { left: 1.25rem; right: 1.25rem; width: auto; }
}

/* экскурсия ушла из шапки — живёт в панели */
@media (max-width: 560px) {
  .nav__panel .nav__panel-cta { display: block; margin-top: 0.5rem; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  .nav__panel, .nav__burger span { transition: none !important; }
}

/* текущая страница в шапке */
.nav__links a[aria-current="page"] { color: #EDF3FB; }