/* =========================================================================
   USM — токены.
   Палитра снята пипеткой с макета: акцент #ad8d6c (он же цвет логотипа),
   тёплый фон правой половины #f5f3f1, тёмный графит #2b2a29 — фон тёмных
   блоков и полноэкранного меню.
   Шрифт один на весь сайт — вариативный USM (см. base.css @font-face).
   ========================================================================= */

:root {
  --font-display: "USM", "Helvetica Neue", Arial, sans-serif;
  --font-body: "USM", "Helvetica Neue", Arial, sans-serif;
  /* Заголовок первого экрана — Tenor Sans (OFL, self-hosted), из макета
     «USM — 2» */
  --font-title: "Tenor Sans", "USM", "Helvetica Neue", Arial, sans-serif;

  /* Вес заголовков — как на usm92, 900 здесь слишком жирно */
  --weight-display: 650;

  /* Свет */
  --color-bg: #ffffff;
  --color-bg-soft: #f5f3f1;
  --color-bg-mute: #f2efe8;
  --color-ink: #343231;
  --color-text: #424241;
  --color-muted: #737272;
  /* подзаголовок первого экрана и расшифровка логотипа — из макета */
  --color-lead: #666666;
  /* основной текст в блоках «О компании» и «Команда» */
  --color-body-soft: #625e5d;
  --color-border: #e3ded3;
  --color-border-soft: #ece7dd;

  /* Тьма */
  --color-bg-dark: #2b2a29;
  --color-bg-resources: #3b3834;
  --color-bg-dark-2: #1f1e1d;   /* пара к --color-bg-dark */
  --color-text-dark: #ffffff;
  --color-muted-dark: #dad4cf;
  --color-border-dark: rgba(255, 255, 255, 0.18);
  --color-border-dark-soft: rgba(255, 255, 255, 0.08);

  /* Акцент */
  --color-accent: #ad8d6c;
  /* ink — тот же тон на 15% темнее, пропорция сохранена от прежней пары */
  --color-accent-ink: #92775b;
  --color-accent-soft: rgba(173, 141, 108, 0.12);
  /* текст контурной кнопки при наведении — из макета «USM — 2 hover» */
  --color-accent-hover: #956e45;
  /* Макет «test»: залитая кнопка и выделение «СРО» */
  --color-accent-strong: #a58360;

  /* Песочные фоны макета «test»: низ первого экрана, «О компании» и
     «Команда» — #f5f3f1, «Партнёры» — #e2d5cc; цифры в кругах — #8c7a79 */
  --color-sand: #f5f3f1;
  --color-sand-2: #e2d5cc;
  --color-stat: #8c7a79;
  --sketch-opacity: 0.3;

  /* Сетка. Значения целые: из макета (1920) и ступенями вниз —
     дробных величин в вёрстке нет. */
  --gutter: 160px;
  --container: 1600px;
  /* Компактная шапка одной высоты — без скачка при прокрутке. */
  --header-h: 80px;
  --header-h-stuck: 80px;


  --space-2xs: 8px;
  --space-xs: 12px;
  --space-16: 16px;
  --space-sm: 20px;
  --space-24: 24px;
  --space-28: 28px;
  --space-md: 32px;
  --space-lg: 56px;
  --space-xl: 112px;

  /* Движение */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-img: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 0.2s;
  --dur-base: 0.45s;
  --dur-slow: 0.9s;

  --radius: 10px;
  /* Скругление кнопок и полей из макета */
  --radius-btn: 8px;
  --radius-pill: 999px;

  /* Обводка полей ввода и второстепенных кнопок — из макета */
  --color-line: #c2c2c2;
  /* Обводка контурных кнопок макета «USM — 2»: цвет текста на 20% */
  --color-line-soft: rgba(52, 50, 49, 0.2);

  /* Палитра полноэкранного меню. Живёт на :root, а не на .site-menu:
     при открытом меню шапка лежит поверх него и красится в те же цвета,
     а она вне .site-menu — локальные переменные туда бы не дошли. */
  --menu-bg: var(--color-bg-dark);   /* тот же графит, что у тёмных блоков */
  --menu-text: #ffffff;
  --menu-accent: #c49a6c;
  --menu-minor: #cfcdc9;
  --menu-border: rgba(255, 255, 255, 0.45);
}

/* Ступени сетки: поля и высота шапки уменьшаются целыми числами */
@media (max-width: 1600px) { :root { --gutter: 100px; --header-h: 80px; --header-h-stuck: 80px; } }
@media (max-width: 1400px) { :root { --gutter: 80px; --header-h: 80px; --header-h-stuck: 80px; } }
@media (max-width: 1200px) { :root { --gutter: 48px; --header-h: 80px; --header-h-stuck: 80px; } }
@media (max-width: 900px)  { :root { --gutter: 24px; --header-h: 80px; --header-h-stuck: 80px; --space-xl: 72px; --space-lg: 40px; } }
@media (max-width: 560px)  { :root { --gutter: 20px; --header-h: 70px; --header-h-stuck: 70px; --space-xl: 56px; } }

/* Единая адаптивная шкала H1 на всех страницах. */
:root { --h1-size: 56px; --h1-line-height: 1.05; --h1-weight: 400; --h1-letter-spacing: 0; }
@media (max-width: 1200px) { :root { --h1-size: 52px; } }
@media (max-width: 900px) { :root { --h1-size: 48px; } }
@media (max-width: 560px) { :root { --h1-size: 32px; } }

:root { --weight-supporting-text: 350; --card-title-line-height: 1.3; }
:root { --card-title-size: 20px; --card-title-weight: 500; }

/* Вводный абзац в первом экране и под заголовком секции. */
:root { --lead-size: 20px; --lead-line-height: 1.4; }
:root { --p-large-size: 18px; --p-large-letter-spacing: -0.01em; }
:root { --p-size: 18px; --p-line-height: 1.6; --p-weight: 350; --p-bold-weight: 450; --p-small-size: 14px; }
@media (max-width: 1600px) { :root { --lead-size: 18px; } }
@media (max-width: 900px) { :root { --lead-size: 17px; } }

/* Общая роль заголовка раздела. */
:root { --h2-size: 48px; --h2-line-height: 1.1; --h2-weight: 400; --h2-letter-spacing: 0.02em; }
@media (max-width: 1200px) { :root { --h2-size: 40px; } }
@media (max-width: 900px) { :root { --h2-size: 34px; } }
@media (max-width: 560px) { :root { --h2-size: 28px; } }

:root { --carousel-nav-gap: 36px; }
:root { --card-content-gap: var(--space-sm); }
@media (max-width: 900px) { :root { --card-content-gap: var(--space-16); } }
:root { --card-padding-inline: var(--space-24); --card-padding-block: var(--space-24); }

:root { --carousel-card-min-width: 288px; }

/* Общая компактная роль для табов и выпадающих фильтров. */
:root { --filter-control-size: 15px; --filter-control-weight: 400; --filter-control-line-height: 1.6; --filter-control-letter-spacing: 0; }

/* Мобилка: все описания (основной текст и подзаголовки-лиды) — 16px */
@media (max-width: 640px) {
  :root { --p-size: 16px; --p-large-size: 16px; }
}
