/* ============================================================
   Design tokens — снято с эталона ЕОИС (CSS custom properties).
   Холодная бездна с фиолетовым подтоном + антикварное золото.
   ============================================================ */

:root {
  /* --- Поверхности --- */
  --void: #060608;
  --deep: #0a0a10;
  --ink: #101018;
  --layer: #16161f;
  --panel-solid: #1c1c28;
  --panel: #1c1c28b8;
  --surface: #16161fb8;
  --surface-2: #ffffff05;
  --field: #101018;

  /* --- Золото --- */
  --gold-1: #d2a14a;
  --gold-2: #b5853a;
  --gold-hi: #ecc988;
  --gold-soft: #d2a14a1f;
  --gold-line: #d2a14a66;
  --on-accent: #180e00;
  --hover: #d2a14a0f;
  --grid: #d2a14a1a;

  /* --- Текст --- */
  --text: #eceaf2;
  --muted: #eceaf28f;
  --faint: #eceaf24d;
  --dim: #eceaf224;

  /* --- Границы --- */
  --border: #d2a14a29;
  --border-strong: #d2a14a57;
  --border-soft: #ffffff0f;

  /* --- Статусы --- */
  --ok: #86a67f;
  --warn: #d2a14a;
  --err: #c85a5a;
  --up: #86a67f;
  --down: #c85a5a;

  /* --- Геометрия --- */
  --radius: 4px;
  --radius-sm: 2px;
  --shadow: 0 30px 70px -24px #000000d9, 0 10px 28px -14px #0009;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);

  /* --- Шрифты --- */
  --fd: 'Playfair Display', Georgia, serif;
  --fs: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --fm: 'Fira Code', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* --- Типографическая шкала --- */
  --t-label: 10px;
  --t-caption: 12px;
  --t-body-sm: 13.5px;
  --t-body: 15px;
  --t-lead: 19px;
  --t-h3: 17px;
  --t-h2: clamp(28px, 3.4vw, 42px);
  --t-hero: clamp(44px, 5.6vw, 81px);

  /* --- Трекинг мелких капс-лейблов --- */
  --ls-label: 0.2em;
  --ls-nav: 0.18em;
  --ls-logo: 0.28em;

  /* --- Ритм --- */
  --s-4: 4px;   --s-8: 8px;   --s-12: 12px; --s-16: 16px;
  --s-20: 20px; --s-24: 24px; --s-32: 32px; --s-40: 40px;
  --s-48: 48px; --s-64: 64px; --s-80: 80px; --s-96: 96px;
  --s-120: 120px;

  /* --- Раскладка --- */
  --page-max: 1240px;
  --gutter: 24px;
  --nav-h: 64px;
  --section-pad: 96px;
}

@media (max-width: 900px) {
  :root { --section-pad: 64px; --gutter: 18px; }
}