/* ============================================================
   SODAGREEN · DESIGN TOKENS — fonte única da verdade
   ------------------------------------------------------------
   Substitui os 4+ esquemas de :root duplicados nas páginas.
   Identidade: fintech-de-bet sóbria (Polymarket × Stripe × Nubank).
   Dark-only. Verde carrega a marca; ouro é acento raro (≤8%, nunca solo).
   Referência de afinação: tweakcn / Realtime Colors.
   ============================================================ */

:root {
  /* ---- Superfícies (grafite verde-esverdeado, nunca cinza neutro, nunca branco) ---- */
  --bg:            #0a0f0d;   /* fundo base da página */
  --surface:       #11181a;   /* cards, superfícies elevadas */
  --surface-2:     #1a2425;   /* hover de superfície, faixas */
  --surface-3:     #243032;   /* superfície mais alta, inputs */
  --border:        #1f2a2b;   /* bordas e divisores */
  --border-strong: #2b3a3b;   /* borda em foco/hover de card */

  /* ---- Verde (a marca · ação · KPIs · estados de sucesso) ---- */
  --green:      #10b981;
  --green-400:  #34d399;   /* hover, links, acento suave, foco */
  --green-300:  #6ee7b7;   /* highlight, dot vivo */
  --green-700:  #047857;   /* pressed, gradiente sutil do CTA */
  --green-900:  #064e3b;   /* faixa verde profunda */
  --green-glow: rgba(16, 185, 129, 0.45);
  --green-line: rgba(16, 185, 129, 0.14);
  --green-wash: rgba(16, 185, 129, 0.10);

  /* ---- Ouro (o "×2" · acento EXCLUSIVO e raro · nunca sozinho, nunca em CTA) ---- */
  --gold:      #facc15;
  --gold-soft: #fde047;
  --gold-deep: #d97706;
  --gold-line: rgba(250, 204, 21, 0.35);

  /* ---- Texto (rampa zinc) ---- */
  --text:    #f1f5f9;   /* H1/H2, valores de KPI */
  --text-2:  #cbd5e1;   /* corpo */
  --text-3:  #94a3b8;   /* secundário, legendas */
  --muted:   #82828b;   /* labels, footer, compliance · subido p/ passar contraste AA (~4.9:1 sobre --bg) */
  --faint:   #3f3f46;   /* desabilitado, divisor sutil */

  /* ---- Semânticos (só estado, nunca decoração) ---- */
  --danger: #ef4444;
  --info:   #60a5fa;
  --warning: var(--gold);

  /* ---- Tipografia ---- */
  --font-display: 'Bricolage Grotesque', system-ui, sans-serif;  /* títulos, KPIs, wordmark */
  --font-body:    'Inter', system-ui, sans-serif;                 /* corpo, UI */
  --font-mono:    'JetBrains Mono', ui-monospace, monospace;       /* números, eyebrows, labels */

  /* Escala de tamanho (fluida, mobile→desktop) */
  --fs-eyebrow: 11px;
  --fs-body:    clamp(15px, 3.6vw, 17px);
  --fs-lead:    clamp(17px, 4vw, 20px);
  --fs-h2:      clamp(26px, 6vw, 40px);
  --fs-h1:      clamp(34px, 8.5vw, 60px);
  --fs-kpi:     clamp(28px, 8vw, 56px);

  /* ---- Espaçamento (base 4px) ---- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10: 40px;
  --sp-14: 56px;
  --sp-20: 80px;

  /* ---- Raio ---- */
  --radius-sm: 8px;
  --radius:    12px;
  --radius-lg: 16px;
  --radius-xl: 22px;
  --radius-pill: 999px;

  /* ---- Elevação (borda + bg; sombra colorida só no CTA verde) ---- */
  --shadow-card:  0 12px 32px -18px rgba(0, 0, 0, 0.55);
  --glow-cta:     0 12px 40px -12px rgba(16, 185, 129, 0.55);  /* ÚNICO glow permitido */

  /* ---- Layout ---- */
  --container: 720px;

  /* ---- Movimento (rápido, sóbrio · sem bounce/spring/scroll-reveal dramático) ---- */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur:  160ms;
  --dur-slow: 220ms;
}

/* Respeita quem pediu menos movimento */
@media (prefers-reduced-motion: reduce) {
  :root { --dur: 0ms; --dur-slow: 0ms; }
  * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
}