/* ============================================================
   TOKENS — Fonte única de verdade do design system.
   Nenhum valor bruto (cor, espaço, raio) deve existir fora daqui.
   ============================================================ */

:root {
  /* ---------- SUPERFÍCIES ---------- */
  --bg-0: #050507;          /* fundo da página */
  --bg-1: #08080b;          /* seção alternada */
  --bg-2: #0c0c11;          /* card */
  --bg-3: #121218;          /* card elevado / hover */
  --bg-4: #17171f;          /* topo da hierarquia */

  /* ---------- TEXTO ---------- */
  --txt-1: #f4f5f7;         /* títulos e texto principal */
  --txt-2: #9ea3ae;         /* texto de apoio  — 7.6:1 */
  --txt-3: #7a7f88;         /* meta e legendas — 4.7:1 */
  --txt-inv: #050507;

  /* ---------- ACENTO ---------- */
  --accent: #5a83f0;        /* azul suave — 5.5:1 sobre bg-0 */
  --accent-soft: #8fa9f7;
  --accent-bright: #a9c0ff;
  --accent-dim: rgba(90, 131, 240, 0.14);
  --accent-line: rgba(90, 131, 240, 0.32);
  --accent-glow: rgba(90, 131, 240, 0.4);

  /* ---------- SEMÂNTICO ---------- */
  --ok: #4ec38a;
  --ok-dim: rgba(78, 195, 138, 0.14);
  --warn: #e0b25c;

  /* ---------- LINHAS E VIDRO ---------- */
  --line: rgba(255, 255, 255, 0.07);
  --line-2: rgba(255, 255, 255, 0.11);
  --line-3: rgba(255, 255, 255, 0.18);
  --glass: rgba(255, 255, 255, 0.035);
  --glass-2: rgba(255, 255, 255, 0.06);
  --glass-blur: 20px;
  --highlight: inset 0 1px 0 rgba(255, 255, 255, 0.07);

  /* ---------- SOMBRAS ---------- */
  --sh-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --sh-md: 0 4px 16px rgba(0, 0, 0, 0.4), 0 1px 2px rgba(0, 0, 0, 0.3);
  --sh-lg: 0 18px 48px -12px rgba(0, 0, 0, 0.7), 0 4px 12px rgba(0, 0, 0, 0.35);
  --sh-xl: 0 32px 80px -20px rgba(0, 0, 0, 0.8), 0 8px 24px rgba(0, 0, 0, 0.4);
  --sh-glow: 0 0 0 1px var(--accent-line), 0 12px 40px -12px var(--accent-glow);

  /* ---------- TIPOGRAFIA ---------- */
  --font-sans: 'Inter Tight', -apple-system, BlinkMacSystemFont, 'Segoe UI',
    Roboto, Helvetica, Arial, sans-serif;
  --font-serif: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, 'SF Mono',
    Menlo, Consolas, monospace;

  /* escala fluida — clamp(min, preferido, max) */
  --fs-display: clamp(3rem, 1.2rem + 8vw, 8.5rem);
  --fs-h1: clamp(2.35rem, 1.2rem + 4.6vw, 5rem);
  --fs-h2: clamp(1.9rem, 1.15rem + 3vw, 3.5rem);
  --fs-h3: clamp(1.35rem, 1.05rem + 1.2vw, 1.9rem);
  --fs-h4: clamp(1.1rem, 1rem + 0.5vw, 1.35rem);
  --fs-lg: clamp(1.05rem, 0.98rem + 0.4vw, 1.25rem);
  --fs-body: 1rem;
  --fs-sm: 0.9375rem;
  --fs-xs: 0.8125rem;
  --fs-mono: 0.78125rem;

  --lh-tight: 1.02;
  --lh-snug: 1.18;
  --lh-normal: 1.5;
  --lh-relaxed: 1.68;

  --tr-tight: -0.045em;     /* títulos grandes */
  --tr-snug: -0.025em;
  --tr-normal: -0.011em;
  --tr-wide: 0.14em;        /* eyebrows em maiúsculas */

  /* ---------- ESPAÇAMENTO (base 4px) ---------- */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.25rem;
  --sp-6: 1.5rem;
  --sp-8: 2rem;
  --sp-10: 2.5rem;
  --sp-12: 3rem;
  --sp-16: 4rem;
  --sp-20: 5rem;
  --sp-24: 6rem;
  --sp-32: 8rem;

  --section-y: clamp(5rem, 3rem + 8vw, 9.5rem);
  --gutter: clamp(1.25rem, 0.6rem + 2.6vw, 3rem);
  --maxw: 1200px;
  --maxw-narrow: 780px;
  --maxw-wide: 1400px;

  /* ---------- RAIOS ---------- */
  --r-xs: 6px;
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-2xl: 36px;
  --r-full: 999px;

  /* ---------- MOVIMENTO ---------- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);
  --d-fast: 160ms;
  --d-base: 260ms;
  --d-slow: 480ms;
  --d-reveal: 900ms;

  /* ---------- CAMADAS ---------- */
  --z-base: 1;
  --z-raised: 10;
  --z-sticky: 20;
  --z-nav: 30;
  --z-menu: 40;
  --z-overlay: 50;
  --z-toast: 60;

  --nav-h: 68px;

  color-scheme: dark;
}

/* Acessibilidade: desliga todo movimento não essencial. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --d-fast: 1ms;
    --d-base: 1ms;
    --d-slow: 1ms;
    --d-reveal: 1ms;
  }
  *,
  *::before,
  *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
    scroll-behavior: auto !important;
  }
}