/* HASchange — Color system
   Yellow gold + graphite black + warm light. Yellow = speed/value/action;
   graphite & black = trust/contrast. */
:root {
  /* ── Brand yellows / golds ── */
  --has-yellow: #F9CD2E;        /* primary accent: CTA, active, badges */
  --has-yellow-light: #FAD859;  /* hover, light accents, soft fills */
  --has-yellow-pale: #FBE79F;   /* backings, highlights, decorative */
  --has-gold: #E0A714;          /* coins, premium accents, warnings */
  --has-gold-deep: #B09121;     /* shadows, depth, dimensional */

  /* ── Graphite / black / warm neutrals ── */
  --has-graphite: #423E37;      /* logo, body text, icons, contrast cards */
  --has-black: #12100A;         /* dark bg, footer, splash, hi-contrast */
  --has-cream: #F5F1DF;         /* soft bg, secondary blocks */
  --has-white: #FFFFFF;         /* cards, inputs, text on dark */

  /* ── Text ── */
  --text-primary: #12100A;
  --text-secondary: #423E37;
  --text-muted: #736F68;
  --text-on-dark: #FFFFFF;
  --text-on-yellow: #12100A;

  /* ── Lines & disabled ── */
  --border-light: #E6E0D0;
  --border-dark: rgba(255,255,255,.12);
  --disabled-bg: #DFDFDE;
  --disabled-text: #9C9A97;

  /* ── Semantic / state ── */
  --success: #2EAD5B;
  --warning: #E0A714;
  --error: #E5484D;
  --pending: #F9CD2E;

  /* ── Semantic surface aliases ── */
  --surface-page: #F5F1DF;
  --surface-card: #FFFFFF;
  --surface-card-dark: #12100A;
  --surface-sunken: #FBF9F1;
  --accent: #F9CD2E;
  --accent-hover: #FAD859;
  --accent-pressed: #E0A714;

  /* ── Tint washes (focus rings, ghost hovers) ── */
  --yellow-wash: rgba(249,205,46,.14);
  --yellow-ring: rgba(249,205,46,.18);
  --success-wash: rgba(46,173,91,.12);
  --error-wash: rgba(229,72,77,.12);
}

/* Цифры, суммы, курсы и адреса — фирменный шрифт с табличными цифрами.
   Применяйте класс .has-num или font-variant-numeric: tabular-nums вручную. */
.has-num { font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; }

/* Тёмная тема: тёмный логотип-текст невидим на тёмной шапке — подменяем
   на белую версию. Отличия от бандла: движок помечает тему классами
   html.dark / body.dark, а не атрибутом data-theme, и путь ведёт
   в images/ темы (этот файл лежит в css/). */
html.dark img.hc-logo,
body.dark img.hc-logo,
[data-theme="dark"] img.hc-logo {
  content: url("../images/logo-haschange-white.svg");
}
/* HASchange — Typography
   Единственный фирменный шрифт — TT Norms (геометрический гротеск,
   современный и дружелюбный). Файлы .ttf загружены и самохостятся через
   @font-face в tokens/fonts.css (веса 300/400/500/700/800/900 + курсивы).
   Системный fallback по брендбуку: Inter / Arial / sans-serif.
   Отдельного моноширинного шрифта в системе нет: суммы, курсы и адреса
   набираются фирменным шрифтом с табличными цифрами (font-variant-numeric:
   tabular-nums). Нули — без перечёркивания. */

:root {
  --font-sans: "TT Norms", "TT Norms Pro", Inter, Arial, sans-serif;
  /* Цифры/суммы: тот же фирменный шрифт + tabular-nums (см. правило ниже) */
  --font-num: var(--font-sans);

  /* Weights */
  --fw-regular: 400; /* @kind font */
  --fw-medium: 500; /* @kind font */
  --fw-demibold: 600; /* @kind font */
  --fw-bold: 700; /* @kind font */
  --fw-extrabold: 800; /* @kind font */

  /* Type scale (desktop) */
  --fs-hero: 72px;
  --fs-h1: 48px;
  --fs-h2: 36px;
  --fs-h3: 26px;
  --fs-body-lg: 19px;
  --fs-body: 16px;
  --fs-caption: 13px;
  --fs-button: 16px;

  /* Line heights */
  --lh-tight: 1.05; /* @kind font */
  --lh-heading: 1.15; /* @kind font */
  --lh-snug: 1.35; /* @kind font */
  --lh-body: 1.55; /* @kind font */

  /* Letter spacing */
  --ls-hero: -0.02em; /* @kind font */
  --ls-heading: -0.01em; /* @kind font */
  --ls-normal: 0; /* @kind font */
  --ls-caps: 0.06em; /* @kind font */
}
/* HASchange — Spacing, radii, layout */
:root {
  /* 4px base spacing scale */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;

  /* Corner radii — rounded, friendly */
  --radius-sm: 10px;   /* chips, small controls */
  --radius-md: 14px;   /* inputs, small buttons */
  --radius-button: 16px;   /* кнопки sm/md — по гайду 14–18px */
  --radius-button-lg: 18px; /* крупные CTA — верх диапазона */
  --radius-lg: 20px;   /* cards */
  --radius-xl: 28px;   /* hero / promo cards */
  --radius-pill: 999px;
  --radius-circle: 50%;

  /* Control sizing */
  --control-h-sm: 40px; /* @kind spacing */
  --control-h-md: 48px; /* @kind spacing */
  --control-h-lg: 56px; /* @kind spacing */

  /* Layout */
  --container-max: 1200px; /* @kind spacing */
  --gutter: 24px; /* @kind spacing */
}
/* HASchange — Shadows, focus, motion */
:root {
  /* Elevation — soft, warm-tinted shadows on graphite black */
  --shadow-xs: 0 1px 2px rgba(18,16,10,.06);
  --shadow-sm: 0 2px 8px rgba(18,16,10,.06);
  --shadow-card: 0 8px 32px rgba(18,16,10,.06);
  --shadow-lg: 0 16px 48px rgba(18,16,10,.10);

  /* Yellow lift — used under primary CTAs */
  --shadow-yellow: 0 8px 24px rgba(249,205,46,.28);
  --shadow-yellow-sm: 0 4px 14px rgba(249,205,46,.30);

  /* Focus ring */
  --ring-focus: 0 0 0 4px rgba(249,205,46,.18);
  --ring-error: 0 0 0 4px rgba(229,72,77,.16);
  --ring-success: 0 0 0 4px rgba(46,173,91,.16);

  /* Motion — quick, confident; subtle lift, no bounce */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1); /* @kind other */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --dur-fast: 120ms; /* @kind other */
  --dur-base: 180ms; /* @kind other */
  --dur-slow: 280ms; /* @kind other */
}