/* Токены раскладки и типографики: то, что реально повторяется на страницах.
   До этого числа лежали в инлайнах и в классах; теперь имя одно, значение одно.
   Цвета здесь не задаются — они в tokens ДС, tokens-status.css и tokens-dark.css. */
:root{
  /* Сетка страницы: одно правило на все макеты.
     Контейнер до 1240 px, центрируется; боковое поле одно и то же у шапки, секций и подвала. */
  --page-max: 1240px;
  --page-pad: clamp(16px, 3.2cqw, 32px);   /* 390 → 16, 768 → 24.6, 1280+ → 32 */

  /* Контейнер и полосы */
  --container-max: var(--page-max);         /* прежнее имя, чтобы значения не расходились */
  --container-narrow: 1180px;       /* колонка служебных страниц и статьи */
  --band-y: clamp(48px, 6cqw, 96px);   /* вертикальные отступы полосы */
  --band-x: clamp(20px, 5cqw, 48px);   /* боковые отступы полосы */
  --band-y-lg: clamp(56px, 8cqw, 140px);
  --band-gap: clamp(28px, 3.5cqw, 48px);  /* отступ между блоками внутри полосы */
  --stack-gap: clamp(24px, 3cqw, 40px);
  --grid-gap: clamp(16px, 2cqw, 24px);

  /* Меры строки */
  --measure-lede: 52ch;
  --measure-body: 70ch;
  --measure-narrow: 40ch;

  /* Заголовки и текст */
  /* Старые имена — алиасы на шкалу, чтобы не расходились два набора значений */
  --h1: var(--fs-h1);
  --h2: var(--fs-h2);
  --h3: var(--fs-h3);
  --h4: var(--fs-h4);
  --text-lede: var(--fs-body);
  --text-body: var(--fs-small);
  --text-small: var(--fs-caption);
  --text-cap: var(--fs-cap);
  --lh-tight: 1.04;
  --lh-body: 1.55;
  --ls-tight: -.04em;
  --ls-title: -.02em;
  --ls-cap: .1em;

  /* Типографическая шкала — вариант с размахом: семь ступеней заголовков, четыре текстовых.
     Первое значение — узкий экран, дальше рост по ширине контейнера, третье — потолок. */
  --fs-display-1: clamp(64px, 9.4cqw, 128px);  /* сумма на первом экране, главные числа */
  --fs-display-2: clamp(42px, 6.2cqw, 88px);   /* числа-акценты в блоках, номера ошибок */
  --fs-hero: clamp(30px, 5cqw, 76px);         /* заголовок первого экрана: три строки на широком */
  --fs-h1: var(--fs-hero);                     /* первый заголовок остальных страниц: как hero главной */
  --fs-h2: clamp(30px, 4.2cqw, 56px);          /* заголовок секции */
  --fs-h3: clamp(22px, 2.5cqw, 32px);          /* подзаголовок, заголовок блока */
  --fs-h4: clamp(19px, 1.9cqw, 24px);          /* заголовок карточки */
  --fs-h5: 20px;                               /* строка списка, вопрос аккордеона */
  --fs-lead: 18px;                             /* лид под заголовком */
  --fs-body: 17px;                             /* основной текст */
  --fs-small: 15px;                            /* мелкий текст, метки полей */
  --fs-caption: 13.5px;                        /* подписи под элементами */
  --fs-cap: 11.5px;                            /* прописные надзаголовки */

  /* Насыщенность: заголовки 700, подзаголовки и элементы управления 600, текст 400 */
  --fw-title: 700;
  --fw-strong: 600;
  --fw-body: 400;

  /* Интерлиньяж и разрядка по ступеням */
  --lh-display: .96;
  --lh-h1: .98;
  --lh-h2: 1.02;
  --lh-h3: 1.08;
  --lh-h4: 1.14;
  --lh-h5: 1.2;
  --lh-lead: 1.45;
  --lh-cap: 1.35;
  --ls-display: -.05em;
  --ls-h1: -.045em;
  --ls-h2: -.04em;
  --ls-h3: -.03em;
  --ls-h4: -.025em;
  --ls-h5: -.02em;

  /* Формы и кнопки */
  --tap-min: 44px;        /* минимальная зона нажатия */
  --control-h: 56px;      /* высота поля и основной кнопки */
  --control-h-sm: 50px;
  --r-pill: 999px;
  --r-card: 28px;
  --r-inner: 18px;
  --r-field: 14px;
  --field-pad: 22px 16px 8px;
  --focus-ring: 3px;      /* толщина кольца фокуса */
}