/* ============================================================
   Дизайн-токены. ЕДИНСТВЕННЫЙ источник значений для main.css.
   Магические числа вне этого файла запрещены.

   Язык дизайна — «Продуктовый лендинг» (вариант 4):
   фиолетово-градиентный бренд, коралловый CTA, карточки с мягкими
   тенями, липкая шапка и липкая нижняя CTA-панель на мобиле.
   ============================================================ */

:root {
  /* --- Поверхности --- */
  --c-bg: #ffffff;
  --c-tint: #f5f6fb;          /* подложка секций */
  --c-card: #ffffff;
  --c-surface: var(--c-tint); /* алиас: старое имя, новое значение */
  --c-border: #e3e5f0;

  /* --- Текст --- */
  --c-ink: #14162b;           /* основной текст, контраст 16:1 */
  --c-ink-soft: #565a78;      /* вторичный текст, контраст 6.1:1 */
  --c-inverse: #ffffff;
  --c-ink-onbrand: #b9bdd6;   /* вторичный текст на тёмном, 9.6:1 */

  /* --- Бренд --- */
  --c-brand: #4736d9;         /* заливка, белый текст 7.4:1 */
  --c-brand-hi: #3a2bc0;      /* ховер */
  --c-brand-soft: #eceafc;    /* светлая подложка */
  --c-brand-ink: #3b2cc4;     /* ссылки и текст брендом, 8:1 на белом */
  --c-grad: linear-gradient(120deg, #4736d9, #7a3ff0 55%, #e0457b);
  --c-grad-soft: linear-gradient(160deg, #f3f0ff, #fdf0f6);

  /* Легаси-имена палитры (используются в main.css как алиасы) */
  --c-primary-700: var(--c-brand-ink);
  --c-primary-600: var(--c-brand);
  --c-primary-500: var(--c-brand-hi);
  --c-primary-100: var(--c-brand-soft);
  --c-primary-050: var(--c-tint);

  /* --- CTA: коралловый.
     Исходный #ff5a3d даёт с белым текстом только 3.1:1 — ниже нормы.
     Затемнён до 4.5:1 без потери «кораллового» характера. --- */
  --c-cta: #d93c1c;
  --c-cta-hi: #bf3213;
  --c-cta-ink: #ffffff;
  --c-accent-500: var(--c-cta);       /* легаси-алиасы CTA */
  --c-accent-600: var(--c-cta-hi);
  --c-accent-ink: var(--c-cta-ink);

  /* --- Семантика статусов, контраст ≥ 4.5:1 --- */
  --c-ok-600: #0e7a4a;
  --c-ok-100: #e2f4ea;
  --c-warn-700: #8a5a00;
  --c-warn-100: #fdf0d2;
  --c-err-600: #b3261e;
  --c-err-100: #fdeceb;
  --c-info-700: var(--c-brand-ink);
  --c-info-100: var(--c-brand-soft);
  --c-star: #a86300;          /* звёзды рейтинга, 4.7:1 на белом */

  /* --- Шкала отступов --- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 72px;

  /* --- Радиусы --- */
  --r-1: 10px;
  --r-2: 14px;
  --r-3: 20px;
  --r-4: 28px;
  --r-pill: 999px;

  /* --- Типографика --- */
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto,
               "Helvetica Neue", Arial, sans-serif;
  --fs-xs: 0.8125rem;                            /* 13px — микротекст */
  --fs-sm: 0.9375rem;                            /* 15px — подписи */
  --fs-base: 1.0625rem;                          /* 17px — базовый текст */
  --fs-lg: 1.1875rem;                            /* 19px — лид-абзацы */
  --fs-h3: 1.1875rem;                            /* 19px */
  --fs-h2: clamp(1.625rem, 4.5vw, 2.375rem);     /* 26–38px */
  --fs-h1: clamp(2rem, 7vw, 3.5rem);             /* 32–56px */
  --fs-amount: clamp(2.25rem, 8vw, 3rem);        /* крупная цена */
  --lh-tight: 1.1;
  --lh-base: 1.55;
  --fw-black: 800;
  --fw-bold: 700;
  --fw-semi: 600;
  --tracking-h: -0.025em;     /* поджатие заголовков */

  /* --- Тени --- */
  --shadow-1: 0 2px 8px rgba(20, 22, 43, 0.06);
  --shadow-2: 0 8px 28px rgba(20, 22, 43, 0.10);
  --shadow-3: 0 20px 56px rgba(71, 54, 217, 0.18);
  --shadow-cta: 0 8px 24px rgba(217, 60, 28, 0.32);
  --shadow-up: 0 -4px 20px rgba(20, 22, 43, 0.10);   /* липкая нижняя панель */

  /* --- Прочее --- */
  --focus-ring: 0 0 0 3px rgba(71, 54, 217, 0.40);
  --transition-fast: 0.18s ease;
  --container-max: 1120px;
  --header-h: 64px;           /* высота липкой шапки — для scroll-margin */
  --sticky-h: 76px;           /* высота липкой CTA-панели на мобиле */
  --tap-min: 48px;            /* минимальная площадь касания */
}
