/* src/tokens.css
 * Дизайн-токены Orizon Link — значения дословно из
 * .autopilot/2026-09-14-orizonlink-site--wip/design-tokens.md (согласованный холст).
 * site.css использует только эти переменные — своих значений не заводит.
 */

:root {
  /* Цвет */
  --c-bg: #fbfcfd;
  --c-bg-section: #f3f5f8;
  --c-surface: #ffffff;
  --c-ink: #121822;
  --c-ink-2: #4e5766;
  --c-line: #e2e6eb;
  --c-line-strong: #cbd2da;
  --c-accent: #0a6e78;
  --c-accent-hover: #085a62;
  --c-accent-soft: #e6f2f3;
  --c-on-accent: #ffffff;

  /* Шрифт */
  --font-sans: "Onest", "Segoe UI", "Helvetica Neue", Arial, sans-serif;

  /* Шкала отступов */
  --sp-8: 8px;
  --sp-12: 12px;
  --sp-14: 14px;
  --sp-20: 20px;
  --sp-28: 28px;
  --sp-40: 40px;
  --sp-48: 48px;
  --sp-80: 80px;
  --sp-96: 96px;
  --sp-112: 112px;

  /* Радиусы */
  --radius-sm: 8px;
  --radius-md: 10px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 999px;

  /* Типографика — компьютер */
  --fs-h1: 64px;
  --lh-h1: 1.08;
  --ls-h1: -0.02em;

  --fs-h2: 44px;
  --lh-h2: 1.15;
  --ls-h2: -0.015em;

  --fs-h3: 22px;
  --lh-h3: 1.3;

  --fs-lead: 20px;
  --lh-lead: 1.55;
  --lead-max-width: 720px;

  --fs-subtitle: 18px;
  --lh-subtitle: 1.55;

  --fs-body: 16px;
  --lh-body: 1.6;

  --fs-eyebrow: 14px;
  --lh-eyebrow: 1.5;
  --ls-eyebrow: 0.08em;

  --fs-pill: 14px;
  --pill-pad-y: 7px;
  --pill-pad-x: 14px;

  --fs-nav: 15px;
  --nav-gap: 28px;

  --fs-logo: 17px;
  --ls-logo: 0.16em;
  --logo-size: 30px;

  --fs-fact-value: 26px;
  --fs-fact-label: 15px;
  --lh-fact-label: 1.5;

  --fs-step-num: 14px;

  --fs-chip: 15px;
  --ls-chip: 0.04em;
  --chip-pad-y: 6px;
  --chip-pad-x: 12px;

  --fs-faq-q: 18px;

  /* Шапка / первый экран */
  --header-h: 80px;
  --hero-top: 112px;
  --hero-gap: 28px;
  --hero-btn-gap: 12px;

  --facts-pad-top: 32px;
  --facts-pad-bottom: 44px;
  --facts-gap: 40px;

  --section-pad-y: 96px;
  --section-head-gap: 48px;
  --section-head-inner-gap: 14px;

  --card-pad: 28px;
  --card-gap: 14px;
  --region-card-gap: 18px;
  --cards-gap: 20px;

  --page-pad-x: 80px;
  --content-max: 1280px;

  /* Кнопки */
  --btn-h: 52px;
  --btn-pad-x: 26px;
  --btn-h-header: 44px;
  --btn-pad-x-header: 20px;

  --menu-btn-size: 44px;
  --menu-icon-size: 20px;

  --icon-size: 24px;
  --icon-stroke: 1.75;
  --icon-tile: 52px;

  /* v2 — тёмная и акцентная полосы, карточки регионов (design-tokens.md, "Оформление v2") */
  --c-strip-dark-bg: #121822;
  --c-ink-on-dark: #f3f5f8;
  --c-ink-2-on-dark: #a7b0bc;
  --c-accent-on-dark: #4fb3bc;
  --c-tile-on-dark: #1c2530;
  --c-on-accent-2: #d5ecee;
  --c-on-accent-3: #bfe3e6;
  --c-on-accent-line: #3f9199;
  --c-region-stroke: #bfdcdf;
  --c-region-stroke-on-accent: #3f9199;
  --c-grid-dash: #d5dbe2;

  --radius-strip: 28px;
  --radius-region: 18px;

  --sp-24: 24px;
  --strip-pad-y: 104px;
  --strip-pad-x: 56px;
  --region-card-h: 300px;
  --region-watermark-fs: 118px;
}

/* Типографика и отступы — телефон (≤ 767px) */
@media (max-width: 767px) {
  :root {
    --fs-h1: 34px;
    --lh-h1: 1.12;
    --ls-h1: -0.015em;

    --fs-h2: 32px;
    --lh-h2: 1.15;

    --fs-h3: 20px;

    --fs-lead: 17px;
    --lh-lead: 1.55;

    --fs-subtitle: 16px;
    --lh-subtitle: 1.55;

    --fs-pill: 13px;
    --lh-pill: 1.35;
    --pill-pad-y: 6px;
    --pill-pad-x: 12px;

    --fs-logo: 15px;
    --logo-size: 26px;

    --header-h: 64px;
    --hero-top: 36px;
    --hero-gap: 20px;
    --hero-btn-gap: 10px;

    --facts-gap: 14px;

    --section-pad-y: 64px;

    --page-pad-x: 20px;

    --strip-pad-y: 48px;
    --strip-pad-x: 20px;
    --region-card-h: auto;
    --region-watermark-fs: 72px;
  }
}