/* ============================================================
   ЦЕХ EVENTS & CATERING — дизайн-система «Ночная галерея» (вариант A)
   tokens.css — только переменные. Источник: variants/a/index.html
   + design-direction.md (lock варианта A). Ничего не выдумано.
   Брейкпоинты: 390 (база, мобайл-фёрст) / 768 / 1200.
   ============================================================ */

/* Подменные шрифты под метрики Unbounded и Manrope.
   Google Fonts приезжают с fonts.gstatic на 2,8-й секунде мобильного
   соединения — до этого страница нарисована системным sans, а после
   подмены заголовок перевёрстывался и тянул за собой всю страницу
   (CLS 0.021 на /cases/). size-adjust выравнивает ширину строки,
   ascent/descent — положение базовой линии, сдвиг исчезает.
   Коэффициенты замерены canvas-ом: Unbounded шире системного sans
   в 1,24-1,27 раза на прописной кириллице, Manrope — примерно вровень. */
@font-face{
  font-family:'Unbounded fallback';
  src:local('Helvetica Neue'),local('Helvetica'),local('Arial'),local('Roboto');
  size-adjust:125%;ascent-override:99%;descent-override:24%;line-gap-override:0%;
}
@font-face{
  font-family:'Manrope fallback';
  src:local('Helvetica Neue'),local('Helvetica'),local('Arial'),local('Roboto');
  size-adjust:97%;ascent-override:107%;descent-override:30%;line-gap-override:0%;
}

:root{
  /* ---------- Цвета ---------- */
  --bg:#000;                          /* pure-black канвас (lock) */
  --text:#fff;                        /* белая типографика */
  --muted:#999;                       /* вторичный текст */
  --hair:rgba(255,255,255,.14);       /* видимая линия: бордеры, разделители */
  --hair-soft:rgba(255,255,255,.08);  /* мягкая линия: секционные границы */
  --lozenge:rgba(200,200,200,.1);     /* фон lozenge-бейджей и pill-подложек */
  --accent:#f36c5e;                   /* красный: ТОЛЬКО primary-CTA + 1 hero-момент */
  --card-bg:#0a0a0a;                  /* подложка медиа-фреймов */
  --form-bg:#050505;                  /* подложка карточки формы */
  --dim:#555;                         /* placeholder, самый тихий текст */
  --dim2:#8a8a8a;                     /* form-note (12px: контраст 6.1:1, WCAG AA) */
  --dim3:#8a8a8a;                     /* ссылки в подвале футера (11px поверх водяного знака: контраст 6.1:1) */
  --soft:#ccc;                        /* ссылки навигации/футера */

  /* ---------- Типографика: семейства ---------- */
  --display:'Unbounded','Unbounded fallback',sans-serif;   /* display: 400/600/700 */
  --body:'Manrope','Manrope fallback',sans-serif;          /* body: 400/500/600 */

  /* ---------- Шкала: непрерывный clamp 390 → 1440, БЕЗ медиазапросов ----------
     Спецификация: system/typography.md v2.0 (§1, §3). Значения 390 / 768 / 1200 / 1440:
       hero  30 / 39   / 50   / 56      h2    26 / 32 / 40 / 44
       h2-md 22 / 27   / 33   / 36      h3    19 / 21.5 / 24 / 26
       list  20 / 24   / 29   / 32      num   34 / 43 / 54 / 60
       lead  17 / 18   / 19   / 20
     Форма clamp(min, intercept + Nvw, max): min попадает ровно на 390, max — на 1440.
     Переопределять --fs-* в @media запрещено: разрыв 767/768 был причиной скачка кегля. */
  --hdr-h:61px;                                    /* высота липкой шапки (60 + hairline) */
  --fs-hero:   clamp(30px, 20.3px + 2.48vw, 56px); /* h1 и hero; кап −33% к прежним 84 */
  --fs-h2:     clamp(26px, 19.3px + 1.71vw, 44px); /* секционный h2, UPPERCASE */
  --fs-h2-md:  clamp(22px, 16.8px + 1.33vw, 36px); /* h2 второго ранга: цифры, партнёры, оффер */
  --fs-h3:     clamp(19px, 16.4px + 0.67vw, 26px); /* заголовок карточки */
  --fs-list:   clamp(20px, 15.5px + 1.14vw, 32px); /* dir-row, пункты мобильного меню */
  --fs-num:    clamp(34px, 24.3px + 2.48vw, 60px); /* цифры статистики */
  --fs-lead:   clamp(17px, 15.9px + 0.29vw, 20px); /* лид под заголовком, .hero-sub p */
  --fs-body:   16px;                               /* body — не масштабируется */
  --fs-caption:12px;                               /* подпись экспоната, лейбл статистики */
  --fs-micro:  11px;                               /* кикер, лейбл поля, футер */
  --fs-btn:    14px;                               /* кнопки, фикс */

  /* ---------- Межстрочные ---------- */
  --lh-display:1.05;  /* h1, hero */
  --lh-h2:1.08;       /* h2 */
  --lh-h3:1.15;       /* h3, .dir-row .name, заголовки карточек */
  --lh-lead:1.45;
  --lh-body:1.55;
  --lh-caption:1.40;
  --lh-micro:1.20;
  --lh-num:1;

  /* ---------- Трекинг: чем крупнее капс, тем меньше ---------- */
  --ls-display:-.02em;   /* Unbounded 26px+ UPPERCASE */
  --ls-h3:-.01em;        /* Unbounded 19-26px */
  --ls-body:0;
  --ls-caps:.10em;       /* caption 12px UPPERCASE */
  --ls-caps-wide:.16em;  /* micro 11px UPPERCASE: кикеры, лейблы */
  --ls-caps-tight:.06em; /* кнопки 14px UPPERCASE */

  /* ---------- Меры (макс. длина строки) ---------- */
  --measure-display:22ch;
  --measure-h2:24ch;
  --measure-h3:26ch;
  --measure-lead:52ch;
  --measure-body:68ch;

  /* ---------- Движение ---------- */
  /* motion.css и главная ссылаются на них (раньше — только инлайн-копия главной) */
  --ease-out:cubic-bezier(.23,1,.32,1);
  --ease-in-out:cubic-bezier(.77,0,.175,1);

  /* ---------- Spacing / геометрия ---------- */
  --sect:30px;      /* section padding; пауза между секциями = 2×sect = 60px (lock 56–76) */
  --gutter:20px;    /* боковые поля контейнера */
  --radius:10px;    /* карточки-«экспонаты», поля форм */
  --pill:9999px;    /* кнопки и lozenge-бейджи */
  --wrap-max:1240px;/* контейнер */
}

@media (min-width:768px){
  :root{
    --sect:36px;    /* пауза 72px */
    --gutter:36px;
    /* Типографику НЕ трогаем: шкала — один непрерывный clamp (typography.md §2, §3) */
  }
}

@media (min-width:1200px){
  :root{
    --sect:38px;    /* пауза 76px — верх lock-диапазона */
    --hdr-h:67px;   /* шапка растёт только на ≥1200 (motion.css §7: .hdr-in 60 → 66) */
  }
}
