/* ============================================================
   DESIGN TOKENS — Сила Бренда
   Все цвета через CSS-переменные. Тема переключается через
   data-theme="dark" на <html>.
   ============================================================ */

:root {
  /* --- Базовая ч/б палитра (общая) --- */
  --ink: #0a0a0a;
  --paper: #ffffff;

  /* --- LIGHT theme (default) --- */
  --bg: #f4f3ef;
  --surface: #ffffff;
  --surface-2: #ebeae4;
  --border: #0a0a0a;
  --border-soft: rgba(10, 10, 10, 0.12);
  --text: #0a0a0a;
  --text-muted: #6b6b6b;
  --accent: #f5b82e;
  --accent-hover: #ffc940;
  --accent-ink: #0a0a0a;
  --accent-glow: rgba(245, 184, 46, 0.45);
  --accent-soft: rgba(245, 184, 46, 0.14);
  --ink-grid: rgba(10, 10, 10, 0.06);
  --danger: #d72e2e;
  --success: #2eaa55;

  /* --- Типографика --- */
  --font-display: 'Inter', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', 'Courier New', monospace;

  --fs-hero: clamp(2.75rem, 7.5vw, 6.5rem);
  --fs-h2: clamp(1.875rem, 4vw, 3.25rem);
  --fs-h3: clamp(1.25rem, 2vw, 1.625rem);
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-mono: 0.78rem;

  --leading-tight: 0.95;
  --leading-snug: 1.15;
  --leading-normal: 1.5;

  --tracking-wide: 0.04em;
  --tracking-mono: 0.08em;

  /* --- Спейсинг (8px grid) --- */
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-5: 2.5rem;
  --space-6: 3rem;
  --space-7: 4rem;
  --space-8: 5rem;
  --space-9: 6rem;
  --space-10: 8rem;

  --container: 1280px;
  --gutter: clamp(1rem, 3vw, 2rem);
  --section-pad-y: clamp(3.5rem, 8vw, 7rem);

  /* --- Геометрия (фирстиль = острое) --- */
  --radius: 0;
  --border-w: 2px;
  --border-w-thick: 3px;

  /* --- Easings & timings --- */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --t-fast: 0.18s;
  --t-base: 0.32s;
  --t-slow: 0.6s;

  /* --- Z-index слои --- */
  --z-header: 100;
  --z-modal: 200;
  --z-toast: 300;

  /* --- Header --- */
  --header-h: 76px;
}

[data-theme="dark"] {
  --bg: #0a0a0a;
  --surface: #161616;
  --surface-2: #1f1f1f;
  --border: #f4f3ef;
  --border-soft: rgba(244, 243, 239, 0.18);
  --text: #f4f3ef;
  --text-muted: #8a8a8a;
  --ink-grid: rgba(244, 243, 239, 0.06);
  --danger: #ff5a5a;
  --success: #5be08a;
}

/* ============================================================
   ACCENT PALETTE
   ============================================================ */
:root[data-accent="amber"]    { --accent: #f5b82e; --accent-hover: #ffc940; --accent-ink: #0a0a0a; --accent-glow: rgba(245,184,46,.45);  --accent-soft: rgba(245,184,46,.14); }
:root[data-accent="lime"]     { --accent: #b6ff3c; --accent-hover: #c8ff5b; --accent-ink: #0a0a0a; --accent-glow: rgba(182,255,60,.55);  --accent-soft: rgba(182,255,60,.12); }
:root[data-accent="orange"]   { --accent: #ff6b1c; --accent-hover: #ff834a; --accent-ink: #ffffff; --accent-glow: rgba(255,107,28,.5);   --accent-soft: rgba(255,107,28,.14); }
:root[data-accent="brown"]    { --accent: #9c6634; --accent-hover: #b07840; --accent-ink: #ffffff; --accent-glow: rgba(156,102,52,.45);  --accent-soft: rgba(156,102,52,.14); }
:root[data-accent="blue"]     { --accent: #2e6cf5; --accent-hover: #4d83ff; --accent-ink: #ffffff; --accent-glow: rgba(46,108,245,.5);   --accent-soft: rgba(46,108,245,.14); }
:root[data-accent="magenta"]  { --accent: #ff3d8a; --accent-hover: #ff5fa1; --accent-ink: #ffffff; --accent-glow: rgba(255,61,138,.5);   --accent-soft: rgba(255,61,138,.14); }
:root[data-accent="red"]      { --accent: #e63946; --accent-hover: #ff4d5a; --accent-ink: #ffffff; --accent-glow: rgba(230,57,70,.5);    --accent-soft: rgba(230,57,70,.14);  }
:root[data-accent="violet"]   { --accent: #8b5cf6; --accent-hover: #a47dff; --accent-ink: #ffffff; --accent-glow: rgba(139,92,246,.5);   --accent-soft: rgba(139,92,246,.14); }
:root[data-accent="teal"]     { --accent: #14b8a6; --accent-hover: #2dd4bf; --accent-ink: #ffffff; --accent-glow: rgba(20,184,166,.5);   --accent-soft: rgba(20,184,166,.14); }
:root[data-accent="emerald"]  { --accent: #10b981; --accent-hover: #34d399; --accent-ink: #ffffff; --accent-glow: rgba(16,185,129,.5);   --accent-soft: rgba(16,185,129,.14); }
:root[data-accent="yellow"]   { --accent: #facc15; --accent-hover: #fde047; --accent-ink: #0a0a0a; --accent-glow: rgba(250,204,21,.5);   --accent-soft: rgba(250,204,21,.14); }
:root[data-accent="graphite"] { --accent: #404040; --accent-hover: #525252; --accent-ink: #ffffff; --accent-glow: rgba(64,64,64,.5);     --accent-soft: rgba(64,64,64,.14);   }
[data-theme="dark"]:root[data-accent="graphite"] { --accent: #d4d4d4; --accent-hover: #e5e5e5; --accent-ink: #0a0a0a; --accent-glow: rgba(212,212,212,.4); --accent-soft: rgba(212,212,212,.12); }

/* Акцент на уровне элемента (слайд карусели, модал) — переопределяет глобальный */
[data-accent="amber"]    { --accent: #f5b82e; --accent-hover: #ffc940; --accent-ink: #0a0a0a; --accent-glow: rgba(245,184,46,.45);  --accent-soft: rgba(245,184,46,.14); }
[data-accent="lime"]     { --accent: #b6ff3c; --accent-hover: #c8ff5b; --accent-ink: #0a0a0a; --accent-glow: rgba(182,255,60,.55);  --accent-soft: rgba(182,255,60,.12); }
[data-accent="orange"]   { --accent: #ff6b1c; --accent-hover: #ff834a; --accent-ink: #ffffff; --accent-glow: rgba(255,107,28,.5);   --accent-soft: rgba(255,107,28,.14); }
[data-accent="brown"]    { --accent: #9c6634; --accent-hover: #b07840; --accent-ink: #ffffff; --accent-glow: rgba(156,102,52,.45);  --accent-soft: rgba(156,102,52,.14); }
[data-accent="blue"]     { --accent: #2e6cf5; --accent-hover: #4d83ff; --accent-ink: #ffffff; --accent-glow: rgba(46,108,245,.5);   --accent-soft: rgba(46,108,245,.14); }
[data-accent="magenta"]  { --accent: #ff3d8a; --accent-hover: #ff5fa1; --accent-ink: #ffffff; --accent-glow: rgba(255,61,138,.5);   --accent-soft: rgba(255,61,138,.14); }
[data-accent="red"]      { --accent: #e63946; --accent-hover: #ff4d5a; --accent-ink: #ffffff; --accent-glow: rgba(230,57,70,.5);    --accent-soft: rgba(230,57,70,.14);  }
[data-accent="violet"]   { --accent: #8b5cf6; --accent-hover: #a47dff; --accent-ink: #ffffff; --accent-glow: rgba(139,92,246,.5);   --accent-soft: rgba(139,92,246,.14); }
[data-accent="teal"]     { --accent: #14b8a6; --accent-hover: #2dd4bf; --accent-ink: #ffffff; --accent-glow: rgba(20,184,166,.5);   --accent-soft: rgba(20,184,166,.14); }
[data-accent="emerald"]  { --accent: #10b981; --accent-hover: #34d399; --accent-ink: #ffffff; --accent-glow: rgba(16,185,129,.5);   --accent-soft: rgba(16,185,129,.14); }
[data-accent="yellow"]   { --accent: #facc15; --accent-hover: #fde047; --accent-ink: #0a0a0a; --accent-glow: rgba(250,204,21,.5);   --accent-soft: rgba(250,204,21,.14); }
[data-accent="graphite"] { --accent: #404040; --accent-hover: #525252; --accent-ink: #ffffff; --accent-glow: rgba(64,64,64,.5);     --accent-soft: rgba(64,64,64,.14);   }