/* ============================================================
   tokens.css — единственный источник дизайн-токенов.
   Правит только тикет 01. Остальные тикеты токены ЧИТАЮТ.
   ============================================================ */

:root {
  /* --- Поверхности (истина из interfaces.md) --- */
  --color-surface-base: #121212;
  --color-surface-card: #1E1A1A;
  --theme-surface-base: #241117;
  --theme-surface-card: #381A24;

  /* --- Акцент и текст --- */
  --color-accent-primary: #D4AF37;
  --color-text-primary: #F8F4E6;
  --color-text-secondary: #A09898;

  /* --- Типографика --- */
  --font-display: 'Cormorant Garamond', 'Times New Roman', Georgia, serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --text-xs: 0.75rem;    /* 12px */
  --text-sm: 0.875rem;   /* 14px */
  --text-base: 1rem;     /* 16px */
  --text-lg: 1.25rem;    /* 20px */
  --text-xl: 1.75rem;    /* 28px */
  --text-2xl: 2.5rem;    /* 40px */
  --text-3xl: 3.5rem;    /* 56px */
  --text-h1: 3rem;       /* 48px — H1 hero по эталону */
  --text-h2: 1.9375rem;  /* 31px — H2 секций по эталону */
  --tracking-wide: 0.08em;
  --tracking-caps: 0.16em;
  /* Единый канон разрядки H2: один для всех секций, включая капс-приём
     (mediakit, reels). Правится ТОЛЬКО здесь. */
  --tracking-h2: 0.02em;

  /* Метрики трёх уровней текста (эталон PREMIUM DARK).
     Body — 16/300/1.6, Caption/UI — 12/500/1.4, H2 — 31/500/1.2. */
  --weight-body: 300;
  --weight-caption: 500;
  --leading-body: 1.6;
  --leading-caption: 1.4;
  --leading-heading: 1.2;

  /* --- Сетка: 12 колонок, максимум 1440px, шаг 8px --- */
  --grid-columns: 12;
  --container-max: 1440px;
  --gutter: 24px;
  /* Отступ по краям горизонтальных лент, которые лежат ВО ВСЮ ШИРИНУ экрана
     (протокол, гайд). Контейнер контента шире 1440px не растёт и стоит по
     центру, а лента тянется от края до края — на широком мониторе первая
     карточка уезжала влево от заголовка секции (на 1920 — на 240px).
     Здесь отступ повторяет левый край контейнера: до 1440px это обычные
     24px, шире — (ширина − 1440) / 2 + 24. «100%» берёт ширину видимой части
     ленты (без полосы прокрутки), поэтому одно значение годится и для
     padding самого трека, и для scroll-padding-inline прокручиваемого блока
     (без второго стрелки ← → останавливают карточку не на месте).
     ВНИМАНИЕ: внутри уже ограниченного контейнера этот токен не применять —
     там лента и так начинается по заголовку. */
  --track-pad: max(var(--gutter), calc((100% - var(--container-max)) / 2 + var(--gutter)));
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 32px;
  --space-6: 48px;
  --space-8: 64px;
  --space-12: 96px;
  --space-16: 128px;
  --section-pad-desktop: 120px; /* вертикальный отступ секций (hero — до 160) */
  --card-pad: var(--space-4);       /* 32px — внутренний отступ карточек */
  --card-pad-lg: var(--space-6);    /* 48px — крупные карточки */

  /* --- Внутренний ритм секции: три ступени, все кратны 8 ---
     title  — «заголовок → подзаголовок» (пара, поэтому плотно);
     lead   — «шапка секции → контент»;
     lead-tight — шаг между элементами внутри шапки (второй лид, табы, путь). */
  --rhythm-title: var(--space-2);      /* 16px */
  --rhythm-lead-tight: var(--space-3); /* 24px */
  --rhythm-lead: var(--space-6);       /* 48px */

  /* --- Шаг контентных сеток: две ступени --- */
  --gap-grid: var(--space-3);      /* 24px — карточные сетки и ленты */
  --gap-grid-lg: var(--space-6);   /* 48px — крупные колонки и блоки */
  --border-card: 1px solid color-mix(in srgb, var(--color-accent-primary) 20%, transparent);

  /* --- G75: единый тёплый luxury-фильтр контентных фото --- */
  --photo-luxe: sepia(0.18) saturate(1.12) contrast(1.04) brightness(0.98) hue-rotate(-6deg);

  /* --- Движение: только transform/opacity --- */
  --motion-duration: 0.3s;
  --motion-ease: cubic-bezier(0.25, 0.46, 0.45, 0.94);

  /* --- Кнопки: без скруглений, контур 1px --- */
  --button-radius: 0;
  --button-outline: 1px;
  --tap-target-min: 44px;

  /* --- Шапка --- */
  --header-height: 64px;

  /* --- Слои --- */
  --z-header: 100;
  --z-overlay: 200;
  --z-modal: 300;
}