/* =============================================================
   TOKENS — Follower Brands Public Site
   Design system bold/moderno. Fundo preto dominante.
   Coerente com o BP via laranja queimado.
   ============================================================= */

:root {
  /* === Cores base === */
  --black:      #0a0a08;   /* Preto profundo (fundo principal) */
  --black-2:    #131310;   /* Preto secundário (cards sutis) */
  --black-3:    #1c1c18;   /* Preto-card */
  --paper:      #f5f1ea;   /* Off-white quente (texto principal) */
  --paper-dim:  #c4bfb0;   /* Texto secundário */
  --paper-mute: #6b6657;   /* Texto muted */
  --rule:       #2a2a26;   /* Linhas e bordas no escuro */
  --rule-2:     #3a3a34;   /* Bordas mais visíveis */

  /* === Cores de acento === */
  --accent:        #ff5722;  /* Laranja vibrante (CTAs, destaques) */
  --accent-dim:    #c4421a;  /* Laranja queimado (consistente com BP) */
  --accent-bright: #ff7849;  /* Laranja brighter (hover) */
  --signal:        #f4e3a8;  /* Amarelo claro (microhighlights) */

  /* === Tipografia === */
  --font-display: 'Space Grotesk', -apple-system, sans-serif;
  --font-body:    'Inter Tight', -apple-system, sans-serif;
  --font-mono:    'JetBrains Mono', monospace;
  --font-serif:   'Instrument Serif', Georgia, serif;  /* ênfase editorial (itálico) */

  /* === Espaçamento === */
  --space-xs: 8px;
  --space-sm: 16px;
  --space-md: 24px;
  --space-lg: 48px;
  --space-xl: 96px;
  --space-2xl: 160px;

  /* === Layout === */
  --wrap-max: 1400px;
  --wrap-pad: 48px;
  --wrap-pad-mobile: 24px;

  /* === Animação === */
  --ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
  --ease-snap:  cubic-bezier(0.85, 0, 0.15, 1);
  --dur-fast:   0.2s;
  --dur-base:   0.4s;
  --dur-slow:   0.8s;
}