/* ===== Главная · 01 · Первый экран с фото (новый) =====
   Наряд «Дизайн-102». Санкция на разморозку главной — [С] 22.10 16:01
   («сверстать новый экран главной страницы для ПК, моб и планшета — pixel perfect»).

   Источник: GeoWise_pervyi_ekran_PAKET/02_verstka/hero.css (ред. 22.10.2026).
   При переносе переменные пакета приведены к проектным:
     --gut  → --gutter        (40 / 48 / 20; на 1440 контейнер даёт поле 120)
     --soft → --bg-soft       (#F5F5F7)
     --h1 / --h1-lh → --fs-h1-hero / --lh-h1-hero  (58 / 48 / 36)
   На ПК H1 задан числом 60/64 по макету — токен не меняем (в tokens.css 58/64).
   tokens.css и components.css не правятся: всё здесь, в скоупе страницы. */

/* ----- Шапка на главной: fixed, высота 80, стекло всегда -----
   Файл подключён только к index.html, поэтому на остальных 16 страницах
   шапка остаётся как была (sticky, белая, 84 / 70 / 62).
   «Правки 88», п. «Хэдер все время – стекло – везде 70 процентов прозрачности»
   (санкция [С] 22.10 22:05, наряд «Дизайн-107»): шапка стеклянная на всех
   ширинах и при любой прокрутке, белизна 70 % вместо 60 %. Состояние
   .is-solid отменено, переключение классов убрано из scripts/home-header.js;
   .is-solid и .is-glass оставлены в селекторе, чтобы старый JS из кэша
   браузера не смог вернуть белую шапку. Переход background-color больше
   нечему анимировать — убран вместе с правилом prefers-reduced-motion
   (наряд Д-103, Н-7). Этим отменены H-2 и H-3 из docs/etalon-home.md
   и reports/checklist_pravki_7a.md. */
.home-mono .header,
.home-mono .header.is-glass,
.home-mono .header.is-solid{position:fixed;left:0;right:0;top:0;z-index:50;
  background:rgba(255,255,255,.7);
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}
@media (min-width:768px){
  .home-mono .header__in{height:80px}          /* макет: 80 на ПК и на планшете */
  .home-mono .mmenu{top:80px}
}
/* шапка fixed → прокрутка к якорю не должна уезжать под неё (80 / 80 / 62) */
.home-mono [id]{scroll-margin-top:80px}
@media (max-width:767px){.home-mono [id]{scroll-margin-top:62px}}

/* ----- Мобильное меню главной: белая заливка на весь экран ниже шапки -----
   «Правки 88», п. «Вернуть меню в мобильном и планшете — заливка белая»
   (санкция [С] 22.10 22:05, наряд «Дизайн-107»).
   Причина дефекта: backdrop-filter делает шапку содержащим блоком для своих
   потомков с position:fixed, а .mmenu лежит внутри <header>. Пара top/bottom
   из components.css считалась от коробки шапки высотой 62/80 и давала высоту
   0 — белой подложки не было, пункты висели поверх страницы (image4 докса).
   Лечим в скоупе главной: высоту задаём явно, bottom снимаем. Высота верна
   и внутри шапки, и если содержащим блоком снова станет окно.
   100lvh, а не 100dvh — это высота окна со свёрнутой адресной строкой Safari
   на iOS, то есть запас: под строкой никогда не покажется полоса страницы,
   лишнее уходит за край экрана. Первым идёт 100vh — запасной вариант для
   браузеров без lvh. styles/components.css не трогаем: он общий для 17 страниц. */
@media (max-width:767px){
  .home-mono .mmenu{bottom:auto;overflow-y:auto;
    height:calc(100vh - var(--header-h));height:calc(100lvh - var(--header-h))}
}
@media (min-width:768px) and (max-width:1023px){
  .home-mono .mmenu{bottom:auto;overflow-y:auto;
    height:calc(100vh - 80px);height:calc(100lvh - 80px)}
}

/* ----- Сцена первого экрана ----- */
.nh{position:relative;height:852px;overflow:hidden;background:#fff;padding:0}
.nh-stage{position:absolute;top:0;left:50%;width:1440px;height:852px;margin-left:-720px}
.nh-photo,.nh-person{position:absolute;left:0;top:0;width:1440px;height:auto;display:block}
.nh-photo{z-index:0}
.nh-fade{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(0deg,#fff 0%,rgba(255,255,255,.9) 9%,rgba(255,255,255,0) 26%),
             linear-gradient(180deg,rgba(255,255,255,.75) 0%,rgba(255,255,255,0) 14%),
             linear-gradient(90deg,#fff 0%,rgba(255,255,255,.97) 26%,rgba(255,255,255,.82) 40%,rgba(255,255,255,.35) 52%,rgba(255,255,255,0) 62%)}
.nh-glow{position:absolute;inset:0;z-index:2;pointer-events:none}
.nh-person{z-index:3}
.nh-personfade{position:absolute;inset:0;z-index:3;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.75) 0%,rgba(255,255,255,0) 14%),
             linear-gradient(90deg,#fff 0%,rgba(255,255,255,.97) 26%,rgba(255,255,255,.82) 40%,rgba(255,255,255,.35) 52%,rgba(255,255,255,0) 62%);
  /* путь к маске пишем прямо здесь: url() внутри кастомного свойства браузер
     разрешает относительно таблицы стилей, а не документа — из index.html
     через var(--pm) получался styles/pages/img/... и маска не грузилась. */
  -webkit-mask:url(/img/hero-person.webp) 0 0/1440px auto no-repeat;
  mask:url(/img/hero-person.webp) 0 0/1440px auto no-repeat}

/* ----- Плашки нейросетей ----- */
.nh-tile{position:absolute;z-index:4;width:76px;height:80px;border-radius:20px;background:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px}
.nh-logo{width:30px;height:30px;color:var(--ink)}
.nh-tile span{font-size:11px;line-height:13px;color:var(--gray);font-weight:400}
.nh-plus{position:absolute;z-index:4;left:1348px;top:582px;width:56px;height:56px;border-radius:50%;
  background:#fff;display:flex;align-items:center;justify-content:center;font-size:17px;font-weight:700}
.nh-glow--t,.nh-glow--m,.nh-plus-m{display:none}
.nh-t-openai{left:700px;top:184px}
.nh-t-alice{left:700px;top:294px}
.nh-t-claude{left:1138px;top:164px}
.nh-t-perplexity{left:1234px;top:204px}
.nh-t-gigachat{left:1298px;top:292px}
.nh-t-deepseek{left:1340px;top:382px}
.nh-t-gemini{left:1338px;top:478px}

/* ----- Текст ----- */
.nh-in{position:relative;z-index:5;height:852px;
  max-width:calc(var(--container) + var(--gutter)*2);margin:0 auto}
.nh-txt{position:absolute;left:var(--gutter);top:168px;width:560px}
.nh .h1{font-size:60px;line-height:64px;letter-spacing:-.015em}   /* макет: 60/64, трекинг −1,5 % */
.nh .lead{font-size:20px;line-height:32px;max-width:520px;margin-top:28px}
.nh .lead b{color:var(--ink)}
.nh .actions{margin-top:36px}
/* на фото: белая 60 % + рамка 1 px. Обводка — внутрь бокса: в эталоне у .btn
   box-sizing:border-box и border:1px, то есть рамка входит в бокс (Д-105, п.1). */
.nh .btn--ghost{background:rgba(255,255,255,.6);box-shadow:inset 0 0 0 1px var(--line-2)}
/* ----- Кнопки первого экрана: бокс по эталону (наряд «Дизайн-105», п.1) -----
   В эталоне .btn — border-box с полями 30 и рамкой 1 px, поэтому бокс
   «Проверить бренд» 213 и «Как это работает» 209 на 1440 и на 768.
   У нас рамки в боксе нет (--btn-px 30 / 28 из токенов) → задаём поля 31
   в скоупе главной; подпись в нашей сборке Inter 3.19 совпадает с эталоном
   до 0,1 px, так что бокс сходится без min-width. tokens.css не трогаем. */
@media (min-width:768px){
  .nh .actions .btn{padding-left:31px;padding-right:31px}
  /* «Как это работает»: замер эталона @2x даёт бокс 208,7 (рамка по центрам
     345,44…553,10), у нас 209,6 — подпись в Inter 3.19 на 1 px шире макета.
     Снимаем этот 1 px полями 30,5: левый край кнопки не двигается (он задан
     зазором 12 от синей), правый сходится с эталоном (наряд «Дизайн-109», п.3).
     «Проверить бренд» не трогаем — там 213,0 против 213,0 в эталоне. */
  .nh .actions .btn--ghost{padding-left:30.5px;padding-right:30.5px}
}

/* ----- Чат: тот же блок главной, в новых координатах ----- */
.nh-chat{position:absolute;z-index:4;left:893px;top:384px;width:330px;max-width:330px;
  background:#fff;box-shadow:none;border:1px solid var(--line);border-radius:28px;padding:16px 15px 15px}
@media (min-width:1024px){
  /* макет: плашка «Ваш бренд в этом списке?» — 32, радиус 16 (была 28 по правкам 65) */
  .nh-chat .chat__slot{height:32px;padding-top:0;padding-bottom:0;border-radius:16px}

  /* ----- Внутренние отступы карточки по эталону ПК (наряд «Дизайн-109», п.1–2) -----
     Замер GeoWise_pervyi_ekran_PK1440.jpg @2x (значения в CSS-px):
     карточка 384…717 (высота 333) · чипы 401…431 · «Клиент» 448…464 ·
     пузырь 473…543 (70, ширина 237, шаг строк 23) · панель ответа 559…701 (142) ·
     строки ответа 575…599 / 614…638 / 653…685 (зазоры 15 и 15) ·
     поля панели 16 сверху и снизу, 10 по бокам · полоски высотой 8, левый край 953.
     Геометрия карточки шла из home-chat.css (пузырь 78, панель 138 с полями 18/14,
     зазоры строк 16/10, полоски 10) — отсюда накопленный сдвиг вниз +6…+9
     и карточка 335 вместо 333. Правим только здесь, в скоупе .nh .nh-chat:
     home-chat.css и components.css используются и на других экранах, их не трогаем;
     на телефоне и планшете (<1024) чат скрыт, поэтому правило под 1024.
     Классы и разметка те же, анимация печати и чипов работает как прежде. */
  .nh .nh-chat .chat__bubble{margin-top:9px;max-width:237px;
    line-height:23px;padding:10.5px 16px 13.5px}
  .nh .nh-chat .chat__answer{padding:16px 10px}
  .nh .nh-chat .chat__row{gap:10px}
  .nh .nh-chat .chat__row + .chat__row,
  .nh .nh-chat .chat__row:last-child{margin-top:15px}
  .nh .nh-chat .chat__bar{height:8px;border-radius:4px}
  /* пилюля в эталоне 229 (953…1182); наша подпись на 2 px уже — добираем полем справа */
  .nh .nh-chat .chat__slot{padding-left:14px;padding-right:16px}

  /* Ряд чипов: в эталоне поля метки 12,8 и зазор 7,3 (у нас было 12 и 6),
     из-за чего набегал сдвиг влево: «Алиса» −2, «Claude» −6. */
  .nh .nh-chat .chip{padding:0 12.8px}
  .nh .nh-chat .gw-chat__track{gap:7.3px}
}

/* ----- Строка преимуществ ----- */
.nh-facts{position:absolute;left:var(--gutter);top:756px;display:flex;align-items:center}
.nh-fact{display:flex;align-items:center;gap:14px;padding-right:32px;margin-right:32px;
  border-right:1px solid var(--line-2)}
.nh-fact:last-child{border-right:0;padding-right:0;margin-right:0}
/* Подписи первого пункта в Inter 3.19 на 1 px шире макета, из-за чего вся
   строка правее него (разделители и пункты 2–3) стояла на +1 px по x.
   Снимаем этот 1 px полем первого пункта (наряд «Дизайн-109», п.3);
   собственная ширина пунктов 2 и 3 с эталоном совпадает. */
.nh-fact:first-child{padding-right:31px}
.nh-ic{flex:none;width:44px;height:44px;border-radius:50%;background:var(--bg-soft);
  display:flex;align-items:center;justify-content:center}
.nh-ic svg{width:22px;height:22px;fill:none;stroke:var(--ink);stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.nh-fact b{display:block;font-size:15px;line-height:20px;font-weight:700}
.nh-fact small{display:block;font-size:13px;line-height:16px;color:var(--gray);margin-top:2px}

/* ===== Ноутбуки 1024–1439: экран ПК уменьшается целиком (макет 1440) =====
   Ступени zoom — из README ПК-пакета (наряд «Дизайн-102»). Проверка Н-11
   (наряд «Дизайн-105») вскрыла побочный эффект: шапка 80 px не масштабируется
   вместе со сценой, а в макете над макушкой заложено ровно 84 px (просвет 4).
   После уменьшения макушка оказывается на 84·z и уходит под шапку: на 1024
   −20,3 px, на 1100 −15,8, на 1180 −11,2, на 1280 −5,3, на 1366 −0,4.
   Опускаем сцену внутри секции на --nh-dy = 84·(1/z − 1) — просвет снова 4 px
   на всех ступенях. Сдвиг сделан высотой секции и смещением слоёв, а не
   внешним отступом: порог переключения шапки в scripts/home-header.js
   считается от высоты #hero, и он остаётся точным. */
@media (min-width:1024px) and (max-width:1439px){
  .nh{height:calc(852px + var(--nh-dy))}
  .nh-stage{top:var(--nh-dy)}
  .nh-in{top:var(--nh-dy)}
}
@media (min-width:1024px) and (max-width:1099px){.nh{zoom:.711;--nh-dy:34.1px}}
@media (min-width:1100px) and (max-width:1179px){.nh{zoom:.764;--nh-dy:25.9px}}
@media (min-width:1180px) and (max-width:1279px){.nh{zoom:.819;--nh-dy:18.6px}}
@media (min-width:1280px) and (max-width:1365px){.nh{zoom:.889;--nh-dy:10.5px}}
@media (min-width:1366px) and (max-width:1439px){.nh{zoom:.948;--nh-dy:4.6px}}
/* ----- ПК от 1024: сцена до правого края окна -----
   «Правки 89», задача 1 (P89-1…P89-3), эталон image1 докса;
   санкция [С] 23.10 10:47 (наряд «Дизайн-111») и [С] 23.10 13:19
   (наряд «Дизайн-113», HOME_UNFREEZE=2026-10-23).

   Было до Д-111: сцена шириной 1440 центрировалась на любой ширине
   (left:50%, margin-left:-720px), справа оставалась белая полоса — фото
   выглядело обрезанным, а градиент ::after её только подчёркивал.
   Д-111 прижал сцену вправо от 1441. Д-113 опускает порог до 1024:
   на ноутбуках между ступенями zoom сцена оказывалась уже окна и справа
   тоже появлялась белая полоса с резким краем фото (на 1279 — 49,8 px,
   на 1365 — 42,4 px; ровно это на кадре «было/стало» Сергея).

   1024–1920 — сцена прижата к правому краю окна, градиента справа нет:
   фото доходит до края на каждой ширине. Текст, шапка и кнопки лежат
   в контейнере сетки и не двигаются — правило трогает только .nh-stage.
   В zoom-контексте (1024–1439) right:0 считается в масштабированных px
   от коробки .nh, а её правый край и есть правый край окна, поэтому
   совпадение точное на любой ширине шага.

   ≥1921 — стоп: сцена больше не уезжает от текста. Левый край держим на
   50% − 480. На 1920 это ровно 960 − 480 = 480, то есть те же 480, что даёт
   right:0 из правила выше (1920 − 1440), — на границе диапазонов скачка нет.
   Справа у сцены снова мягкий переход 120 px в белый: там, где за её краем
   начинается белый фон страницы, стык не должен быть виден.

   Ступени zoom и --nh-dy на 1024–1439 не тронуты (блок выше), раскладка
   ≤1023 (там .nh-stage переопределён на position:relative) лежит ниже
   порога 1024 px. На 1440 правило даёт left:0 — ровно то же, что давало
   центрирование (720 − 720), так что принятый кадр 1440 не меняется. */
@media (min-width:1024px){
  .nh-stage{left:auto;right:0;margin-left:0}
}
@media (min-width:1921px){
  .nh-stage{right:auto;left:50%;margin-left:-480px}
  .nh-stage::after{content:"";position:absolute;top:0;right:0;bottom:0;
    width:120px;z-index:3;pointer-events:none;
    background:linear-gradient(90deg,rgba(255,255,255,0),#fff)}
}

/* ----- Лента нейросетей в карточке чата: мягкий край слева -----
   «Правки 89», пункт «ОТДЕЛЬНО: карточка чата» (санкция [С] 23.10 13:19,
   наряд «Дизайн-113»).

   Лента прокручивается: styles/pages/home-chat.js считает
   dx = track.scrollWidth − rail.clientWidth + 24 и анимация gw-slide
   сдвигает .gw-chat__track на −dx. После сдвига у левого края рельса
   оказывается середина плашки «GigaChat» — и она была срезана насухо
   («…gaChat» на кадре Сергея): маска в home-chat.css гасит только правый
   край (22 px). Значит нужен второй вариант из докса — мягкий переход
   у левого края, а не «начинать с первой плашки целиком».

   Делаем переход появляющимся, а не постоянным: до старта прокрутки первая
   плашка стоит у самого края и гасить её нечего (и статичный вид карточки,
   с которым сверяются принятые кадры, не должен измениться). Длину левой
   растушёвки держим в своей переменной --nh-fade-l: она зарегистрирована
   как <length>, поэтому анимируется и градиент маски пересчитывается.
   0 → 22 px за 0,4 s с той же задержкой --gw-slide-delay, что у gw-slide,
   то есть ровно в момент, когда лента начинает ехать.

   Файл home-chat.css не трогаем — правило живёт в скоупе .nh .nh-chat,
   то есть только в карточке первого экрана главной. Ниже 1024 карточка
   скрыта (.nh-chat{display:none} в блоке ≤1023), так что планшет
   и телефон правило не задевает вовсе. */
@property --nh-fade-l{syntax:'<length>';inherits:true;initial-value:0px}
.nh .nh-chat .gw-chat__rail{
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 var(--nh-fade-l),
                     #000 calc(100% - 22px),transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 var(--nh-fade-l),
                     #000 calc(100% - 22px),transparent 100%)}
.nh .nh-chat.is-playing .gw-chat__rail{
  animation:nh-fade-left .4s linear both;animation-delay:var(--gw-slide-delay,0ms)}
@keyframes nh-fade-left{from{--nh-fade-l:0px}to{--nh-fade-l:22px}}
@media (prefers-reduced-motion:reduce){
  .nh .nh-chat .gw-chat__rail{animation:none!important}
}

/* ===== Планшет 768–1023 и телефон <768 — общая раскладка пакета.
   Планшет доведён и сверен с макетом 768 (наряд Д-103, Н-8);
   телефон 390 — черновик пакета, доводка в следующем наряде. ===== */
@media (max-width:1023px){
 /* Зазор под первым экраном — как между обычными соседними секциями
    («Правки 88», п. «Поправь отступ от Как это работает до Генеративный поиск
    — посмотри наши стили», санкция [С] 22.10 22:05, наряд «Дизайн-108»).
    Было: у первого экрана нижнего отступа нет вовсе (низ кнопки = низ секции),
    а у следующей секции padding-top урезан до 72 (планшет) и 56 (телефон) —
    вдвое меньше обычного. Стало: урезание снято, первому экрану дан обычный
    нижний отступ --section-y, итого 80 + 80 = 160 на планшете и 56 + 56 = 112
    на телефоне — ровно столько же, сколько между всеми прочими секциями
    (замер: 160 на 768, 112 на 390). ПК (≥1024) не трогаем.
    overflow:hidden нужен и сам по себе: им обрезан верх сцены (см. ниже). */
 .nh{height:auto;overflow:hidden;padding-bottom:var(--section-y)}
 /* Просвет «низ шапки → макушка» = 9 px на всей полосе
    («Правки 88», п. «Отступ от хэдера до волос такой сделай», образец — image1
    докса, iPhone 430; санкция [С] 22.10 22:05, наряд «Дизайн-108»).
    Было: сцена тянется по ширине окна, а шапка фиксированные 62/80 — просвет
    рос вместе с окном: 6 (320) → 17 (390) → 30 (430) → 94 (767) на телефоне,
    22 (768) → 56 (1023) на планшете.
    Стало: сцену поднимаем внутри секции ровно на лишнее — тот же приём, что
    --nh-dy на ноутбуках (наряд «Дизайн-105»), только со знаком минус.
    Проценты в margin считаются от ШИРИНЫ блока, поэтому один calc держит
    просвет постоянным на всей полосе без единицы vw и без JS.
    Планшет: макушка в фото-t (981×664) стоит на 19,578 % его высоты, сцена
    768/520 → макушка = 13,256 % ширины окна; хотим 80 + 9 = 89.
    Сдвиг отрицательный на всей полосе 768–1023 (−12,8 на 768, −46,6 на 1023).
    Верх сцены при этом срезан границей секции — то есть ровно по низу
    фиксированной шапки, так что срез не виден: под стеклом 0,7 продолжается
    то же фото, белой полосы не возникает. Плашки нейросетей и «+5» лежат
    внутри сцены и едут вместе с ней — их положение на фото не меняется. */
 .nh-stage{position:relative;top:auto;left:0;margin-left:0;width:100%;height:auto;
   aspect-ratio:768/520;overflow:hidden;margin-top:calc(89px - 13.256%)}
 .nh-photo,.nh-person{width:100%;height:100%;object-fit:cover}
 .nh-photo{z-index:0}.nh-glow{z-index:1}.nh-person{z-index:2}
 .nh-fade{z-index:3;background:linear-gradient(0deg,#fff 0,#fff 22px,rgba(255,255,255,0) 112px)}
 .nh-glow{width:100%;height:100%}
 .nh-glow--d,.nh-glow--m,.nh-personfade,.nh-chat,.nh-facts,
 .nh-t-deepseek,.nh-t-gemini,.nh-plus-d{display:none}
 .nh-glow--t{display:block}
 .nh-plus-m{display:inline}
 .nh-in{position:relative;z-index:5;height:auto;max-width:none;margin:-36px 0 0}
 .nh-txt{position:relative;left:auto;top:auto;width:auto;padding:16px var(--gutter) 0}
 .nh .h1{font-size:var(--fs-h1-hero);line-height:var(--lh-h1-hero);margin-top:16px;max-width:560px}
 .nh .h1 .muted{display:block}
 .nh .lead{max-width:600px}
 .home-mono .tg{right:var(--gutter)}
 .nh-t-openai{left:19.478%;top:46.350%;transform:translate(-50%,-50%)}
 .nh-t-alice{left:var(--gutter);top:77.765%;transform:translateY(-50%)}
 .nh-t-claude{left:73.013%;top:36.538%;transform:translate(-50%,-50%)}
 .nh-t-perplexity{left:84.268%;top:53.846%;transform:translate(-50%,-50%)}
 .nh-t-gigachat{left:auto;right:var(--gutter);top:71.154%;transform:translateY(-50%)}
 .nh-plus{left:89.769%;top:86.154%;transform:translate(-50%,-50%)}
}
/* ===== Планшет 768–1023: доводка по макету 768 (наряд «Дизайн-103», этап Н-8) =====
   В токенах на планшете поля 48, надзаголовок 16/19, кнопка 58 — на первом экране
   главной макет требует 40 / 17/21 / 60. Правим только здесь, в скоупе главной. */
@media (min-width:768px) and (max-width:1023px){
 /* поля 40: логотип, линии меню, текст, кнопки, крайние значки — на одной линии */
 .home-mono .header .container{padding-left:40px;padding-right:40px}
 /* Кнопка «Проверить бренд» в шапке на планшете — решение [С] 22.10 20:05
    «с кнопкой»: состав шапки на планшете такой же, как на телефоне и как
    на остальных страницах этой ширины (логотип слева по полю 40, справа
    кнопка и бургер, бургер — правым краем по полю 40). В макете 768 кнопки
    нет, это сознательное отступление от эталона (наряд «Дизайн-105», п.0).
    Правила даёт components.css: .header .btn{margin-left:auto} и
    .burger{margin-left:15px} — отдельных правил здесь не нужно. */
 .nh-txt{padding-left:40px;padding-right:40px}
 .nh-t-alice{left:40px}
 .nh-t-gigachat{right:40px}
 .home-mono .tg{right:40px}
 /* макет 768: надзаголовок 17/21 (в токенах 16/19), кнопки 60 (в токенах 58) */
 .nh .eyebrow{font-size:17px;line-height:21px}
 .nh .btn{height:60px}
}
/* ===== Телефон <768: доводка по макету 390 (наряд «Дизайн-104», этап Н-9) =====
   Надзаголовок в токенах 15/18, макет первого экрана главной — 15/20;
   лид на ПК задан числом 20/32 и без медиазапроса доставался телефону —
   возвращаем 18/27 (в токенах те же 18/27); отступы лида — токенами (Д-106).
   Правим только здесь, в скоупе главной; tokens.css не трогаем. */
@media (max-width:767px){
 /* Телефон: макушка в фото-m (780×720) стоит на 21,944 % его высоты, сцена
    390/360 → макушка = 20,2562 % ширины окна; хотим 62 + 9 = 71.
    Ниже 350 px окна сцена уже короче нужного и макушка сама поднимается выше
    71 — опускать её сдвигом нельзя, под шапкой появилась бы белая полоса.
    Поэтому там работает вторая половина приёма: min-height 323,5 (= 71 / 0,21944)
    не даёт сцене стать короче, фото по object-fit:cover дотягивается до этой
    высоты и чуть подрезается по бокам (на 320 — по 15 px с каждой стороны),
    а макушка остаётся ровно на 71. На 350 и шире высота снова натуральная,
    стык двух режимов непрерывный. min() держит сдвиг не ниже нуля. */
 .nh-stage{aspect-ratio:390/360;min-height:323.5px;
   margin-top:min(0px,calc(71px - 20.2562%))}
 .nh .eyebrow{font-size:15px;line-height:20px}        /* макет 390: 15/20 */
 /* лид 18/27 — как в токенах; отступы до и после лида берём токенами
    (--gap-lead 18, --gap-actions 24), а не числами из макета (наряд Д-106, п.1,
    правка [С] 22.10 22:03 «подтяни отступы по нашим стилям»). Было 20/24. */
 .nh .lead{font-size:18px;line-height:27px;margin-top:var(--gap-lead)}
 /* Принудительный перенос последнего <b> с новой строки (Д-104) убран по правке
    [С] 22.10 22:03: текст лида течёт сам, «и помогаем попасть…» продолжается
    на второй строке сразу за «Claude —». Разметка index.html не тронута. */
 /* Кнопка «Проверить бренд» в шапке: бокс 144 по эталону 390 (наряд «Дизайн-105»,
    п.1). В эталоне поля 13 + рамка 1 px в боксе → 14; в токенах --btn-header-px
    12,65 (под макет Home v5, бокс 142,3). Правим только в скоупе главной. */
 .home-mono .header .btn{padding-left:14px;padding-right:14px}
 /* обводка «Как это работает» внутрь бокса задана выше, для всех ширин */
 .nh-glow--t{display:none}.nh-glow--m{display:block}
 .nh-tile{width:48px;height:48px;border-radius:14px}
 .nh-tile span{display:none}
 .nh-logo{width:24px;height:24px}
 .nh-plus{width:40px;height:40px;font-size:14px}
 .nh .h1{margin-top:12px;max-width:none}
 .nh .lead{max-width:none}
 .nh .actions{flex-direction:column;align-items:stretch;margin-top:var(--gap-actions);gap:12px}
 .nh-t-alice{left:var(--gutter);top:68.529%;transform:translateY(-50%)}
 .nh-t-openai{left:18.284%;top:42.584%;transform:translate(-50%,-50%)}
 .nh-t-claude{left:75.907%;top:36.696%;transform:translate(-50%,-50%)}
 .nh-t-perplexity{left:auto;right:var(--gutter);top:53.513%;transform:translateY(-50%)}
 .nh-t-gigachat{left:auto;right:var(--gutter);top:71.487%;transform:translateY(-50%)}
 .nh-plus{left:79.660%;top:84.819%;transform:translate(-50%,-50%)}
}
