/* tokens.css — единственное место, где живут значения.
   Всё остальное в проекте ссылается на них через var(--as-*).
   Правка цвета, размера, отступа или длительности начинается и заканчивается здесь. */

:root {
  /* ---------- 1. Цвет: три роли, ни одной четвёртой ---------- */
  /* Роль 1 — база: тайга Горной Шории ночью */
  --as-base-900: #0C1A14;               /* основной тёмный фон страницы */
  --as-base-800: #112319;               /* соседняя тёмная секция, второй план */
  --as-base-700: #172F23;               /* плоскости и слоты на тёмном */
  --as-base-600: #23422F;               /* наведение и заливка границ на тёмном */

  /* Роль 2 — передышка: снег и выгоревшее дерево */
  --as-cream-50: #FAF7F0;               /* основной светлый фон секции */
  --as-cream-100: #F2EDE2;              /* плоскости и слоты на светлом */
  --as-cream-200: #E3DACA;              /* заливка разделителей и плашек на светлом */

  /* Роль 3 — единственный акцент: обожжённая глина, не металл (BR-024) */
  --as-accent-500: #A0552F;             /* заливка управляющих элементов, акцентный текст на светлом */
  --as-accent-400: #C87B52;             /* акцентный текст и линии на тёмном, состояние наведения */
  --as-accent-soft: rgba(160, 85, 47, 0.16); /* подложка активного состояния */

  /* Текст */
  --as-text-on-dark: #F4F0E7;           /* основной текст на тёмном, 15.7:1 */
  --as-text-on-dark-mute: #9FB0A3;      /* второстепенный текст на тёмном, 7.9:1 */
  --as-text-on-light: #101C15;          /* основной текст на светлом, 16.4:1 */
  --as-text-on-light-mute: #4E5C53;     /* второстепенный текст на светлом, 6.6:1 */

  /* Линии — несущий декор и только он */
  --as-line-on-dark: rgba(244, 240, 231, 0.16);
  --as-line-on-light: rgba(16, 28, 21, 0.14);

  /* Служебные */
  --as-focus: #C87B52;                  /* кольцо фокуса, видимое на обоих фонах */
  --as-shade: rgba(12, 26, 20, 0.72);   /* затемнение под мобильным меню */

  /* ---------- 2. Шрифт ---------- */
  /* Подмена Onest на Gilroy — замена файлов в site/fonts/ и одной строки ниже. */
  --as-font-display: "Onest", "Golos Text", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;

  --as-w-regular: 400;
  --as-w-medium: 500;
  --as-w-semibold: 600;

  /* ---------- 3. Типографическая шкала ---------- */
  /* Первый аргумент clamp — мобильная шкала, третий — десктопная.
     Дисплейные размеры сжимаются сильнее текстовых: разрыв d1/body
     10x на десктопе и 4x на телефоне. */
  --as-fs-d1: clamp(64px, 10.4vw, 168px);
  --as-fs-d2: clamp(40px, 6.6vw, 104px);
  --as-fs-d3: clamp(30px, 4.6vw, 72px);
  --as-fs-h1: clamp(28px, 4vw, 56px);
  --as-fs-h2: clamp(22px, 2.6vw, 34px);
  --as-fs-lead: clamp(18px, 1.5vw, 22px);
  --as-fs-body: clamp(16px, 1.15vw, 17px);
  --as-fs-micro: clamp(12px, 0.9vw, 13px);
  --as-fs-num: clamp(40px, 5.6vw, 88px);
  --as-fs-btn: 15px;

  --as-lh-flat: 1;
  --as-lh-display: 0.94;
  --as-lh-head: 1.08;
  --as-lh-lead: 1.42;
  --as-lh-body: 1.6;

  --as-tr-display: -0.02em;
  --as-tr-head: -0.01em;
  --as-tr-body: 0em;
  --as-tr-micro: 0.16em;
  --as-tr-btn: 0.06em;

  /* ---------- 4. Сетка и регистры ширины ---------- */
  --as-shell: 1280px;                   /* центральная колонка, приём ESTADEL */
  --as-shell-narrow: 880px;             /* текстовые секции */
  --as-measure: 620px;                  /* предельная ширина абзаца (R27) */
  --as-gutter: 40px;                    /* поля страницы на десктопе */
  --as-gutter-sm: 20px;                 /* поля страницы на телефоне */
  --as-title-measure: 66%;              /* предельная ширина заголовка блока внутри своей колонки */
  --as-frame-sm: 78%;                   /* ширина кадра горизонтальной ленты: остаток — видимый край следующего */
  --as-cols: 12;
  --as-col-gap: 24px;
  --as-col-gap-sm: 16px;

  /* Брейкпоинты. CSS не пускает var() в прелюдию @media,
     поэтому в responsive.css те же числа стоят литералами —
     список здесь остаётся единственным реестром. */
  --as-bp-lg: 1200px;
  --as-bp-md: 900px;
  --as-bp-sm: 600px;

  /* ---------- 5. Ритм и отступы (шаг 4) ---------- */
  --as-s1: 4px;
  --as-s2: 8px;
  --as-s3: 12px;
  --as-s4: 16px;
  --as-s5: 24px;
  --as-s6: 32px;
  --as-s7: 48px;
  --as-s8: 64px;
  --as-s9: 96px;
  --as-s10: 128px;

  /* Вертикальный ритм страницы: плотный, а не «воздух между секциями» (R32) */
  --as-rhythm-tight: 96px;              /* рядовая секция, десктоп */
  --as-rhythm-wide: 128px;              /* смена регистра, десктоп */
  --as-rhythm-tight-sm: 64px;           /* рядовая секция, телефон */
  --as-rhythm-wide-sm: 80px;            /* смена регистра, телефон */
  --as-block-gap: 48px;                 /* между блоками внутри секции */

  /* ---------- 6. Форма и размеры элементов ---------- */
  --as-radius-flat: 2px;                /* плоскости: почти прямой угол */
  --as-radius-control: 999px;           /* только управляющие элементы */
  --as-hairline: 1px;
  --as-rule-weight: 1px;
  --as-ctrl-h: 56px;                    /* высота кнопки */
  --as-ctrl-h-sm: 44px;                 /* высота чипа и поля мобильного меню */
  --as-ctrl-pad: 32px;
  --as-pad-plane: 32px;                 /* внутренний отступ плоскости */
  --as-header-h: 72px;
  --as-header-h-sm: 60px;
  --as-sticky-h: 64px;                  /* закреплённая нижняя панель на телефоне */
  --as-opacity-disabled: 0.5;           /* прозрачность выключенного управляющего элемента */
  --as-focus-ring: 2px;
  --as-focus-offset: 3px;

  /* Пропорции медиа: больше трёх на странице не вводится */
  --as-ratio-wide: 16 / 9;
  --as-ratio-tall: 3 / 4;
  --as-ratio-square: 1 / 1;
  --as-bleed-h: 72vh;

  /* ---------- 7. Движение: один движок, одна кривая ---------- */
  --as-ease: cubic-bezier(0.16, 1, 0.30, 1);
  --as-dur-fast: 240ms;                 /* наведение и фокус */
  --as-dur-base: 700ms;                 /* появление рядового элемента */
  --as-dur-slow: 1100ms;                /* появление полотна */
  --as-delay-step: 90ms;                /* шаг лестницы задержек */
  --as-reveal-shift: 24px;              /* единственное смещение при появлении */
  --as-reveal-delay: 0ms;               /* ступень лестницы задержек; её ставит [data-reveal-delay] */

  /* ---------- 8. Слои ---------- */
  --as-z-word: 1;                       /* слово в hero — под медиа */
  --as-z-media: 2;                      /* медиа перекрывает слово (приём ESTADEL) */
  --as-z-sticky: 40;
  --as-z-header: 50;
  --as-z-menu: 60;
}