/* =============================================================================
   Tokens — fonte única de cor, tipografia, espaço, raio, sombra e movimento.
   Mesma paleta de marca do sistema (financeiro-ui). Outros arquivos CSS
   consomem SOMENTE var(--fa-*): nada de hex, rgb(), ms ou cubic-bezier literal.
   Tema claro em :root; escuro em [data-theme='dark'] (definido por theme-init.js).
   ============================================================================= */

:root {
  /* Marca (constantes) */
  --fa-brand-navy: #0a1b2c;
  --fa-brand-navy-rgb: 10, 27, 44;
  --fa-brand-blue: #193a82;
  --fa-brand-blue-rgb: 25, 58, 130;
  --fa-brand-gold: #deb76d;
  --fa-brand-gold-rgb: 222, 183, 109;
  --fa-brand-gold-strong: #c79a3f;
  --fa-brand-mist: #b8bacf;
  --fa-brand-mist-rgb: 184, 186, 207;
  --fa-brand-taupe: #736b60;
  --fa-white: #ffffff;
  --fa-white-rgb: 255, 255, 255;

  /* Superfícies */
  --fa-bg: #f4f5fa;
  --fa-surface: #ffffff;
  --fa-surface-2: #eeeff6;
  --fa-surface-3: #e1e2ee;
  --fa-surface-glass: rgba(255, 255, 255, 0.72);
  --fa-overlay: rgba(var(--fa-brand-navy-rgb), 0.52);

  /* Texto e bordas */
  --fa-text: #0a1b2c;
  --fa-text-muted: #5f584f;
  --fa-text-subtle: #8f877c;
  --fa-text-on-solid: #ffffff;
  --fa-border: #dcdde9;
  --fa-border-strong: #b8bacf;

  /* Semânticas */
  --fa-primary: #193a82;
  --fa-primary-rgb: 25, 58, 130;
  --fa-primary-solid: #193a82;
  --fa-primary-solid-hover: #122c66;
  --fa-primary-soft: #e6eaf5;
  --fa-accent: #a87c26;
  --fa-accent-soft: #fbf3e2;
  --fa-success: #0f8f5f;
  --fa-success-soft: #e3f6ee;
  --fa-danger: #c9343a;
  --fa-danger-soft: #fdeaeb;
  --fa-focus: rgba(var(--fa-brand-blue-rgb), 0.32);

  /* Gradientes */
  --fa-gradient-brand: linear-gradient(135deg, #2450b0 0%, #193a82 50%, #0a1b2c 100%);
  --fa-gradient-accent: linear-gradient(135deg, #f0d9a6 0%, #deb76d 50%, #c79a3f 100%);
  --fa-gradient-text: linear-gradient(100deg, #193a82 0%, #2f5fcb 45%, #c79a3f 100%);
  --fa-gradient-surface: linear-gradient(180deg, var(--fa-surface) 0%, var(--fa-surface-2) 100%);

  /* Seções de marca (escuras nos dois temas) */
  --fa-dark-bg: #0a1b2c;
  --fa-dark-surface: #10263c;
  --fa-dark-border: rgba(var(--fa-brand-mist-rgb), 0.16);
  --fa-dark-text: #eceef6;
  --fa-dark-text-muted: #b8bacf;
  --fa-dark-primary: #93aef0;
  --fa-dark-gradient-text: linear-gradient(100deg, #93aef0 0%, #c6d4f7 45%, #deb76d 100%);

  /* Tipografia */
  --fa-font-sans: 'Plus Jakarta Sans Variable', 'Segoe UI', system-ui, -apple-system, Roboto, Arial, sans-serif;
  --fa-font-mono: 'Cascadia Code', 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;
  --fa-text-xs: 0.75rem;
  --fa-text-sm: 0.875rem;
  --fa-text-md: 1rem;
  --fa-text-lg: 1.125rem;
  --fa-text-xl: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);
  --fa-text-2xl: clamp(1.5rem, 1.2rem + 1.2vw, 2rem);
  --fa-text-3xl: clamp(1.875rem, 1.3rem + 2.4vw, 2.75rem);
  --fa-text-display: clamp(2.25rem, 1.4rem + 3.8vw, 4rem);
  --fa-leading-tight: 1.12;
  --fa-leading-body: 1.6;

  /* Espaço (escala de 4px) */
  --fa-space-1: 0.25rem;
  --fa-space-2: 0.5rem;
  --fa-space-3: 0.75rem;
  --fa-space-4: 1rem;
  --fa-space-5: 1.5rem;
  --fa-space-6: 2rem;
  --fa-space-7: 3rem;
  --fa-space-8: 4rem;
  --fa-page-gutter: clamp(1rem, 0.5rem + 2vw, 2rem);
  --fa-section-y: clamp(3.5rem, 2rem + 6vw, 7rem);

  /* Layout */
  --fa-container: 1200px;
  --fa-container-narrow: 820px;
  --fa-header-h: 4.25rem;

  /* Raio */
  --fa-radius-sm: 0.5rem;
  --fa-radius-md: 0.75rem;
  --fa-radius-lg: 1rem;
  --fa-radius-xl: 1.5rem;
  --fa-radius-pill: 999px;

  /* Elevação */
  --fa-shadow-xs: 0 1px 2px rgba(var(--fa-brand-navy-rgb), 0.06);
  --fa-shadow-sm: 0 2px 8px rgba(var(--fa-brand-navy-rgb), 0.06);
  --fa-shadow-md: 0 8px 24px rgba(var(--fa-brand-navy-rgb), 0.08);
  --fa-shadow-lg: 0 24px 56px rgba(var(--fa-brand-navy-rgb), 0.16);
  --fa-shadow-glow: 0 10px 28px rgba(var(--fa-primary-rgb), 0.32);
  --fa-shadow-gold: 0 10px 28px rgba(var(--fa-brand-gold-rgb), 0.35);

  /* Efeitos */
  --fa-blur: 14px;
  --fa-orb-opacity: 0.5;
  --fa-grid-line: rgba(var(--fa-brand-blue-rgb), 0.07);
  --fa-spotlight: rgba(var(--fa-primary-rgb), 0.1);

  /* Movimento */
  --fa-dur-fast: 120ms;
  --fa-dur-base: 200ms;
  --fa-dur-slow: 360ms;
  --fa-dur-reveal: 700ms;
  --fa-dur-draw: 1600ms;
  --fa-dur-float: 6s;
  --fa-dur-marquee: 40s;
  --fa-dur-flow: 3.2s;
  --fa-dur-pulse: 1.8s;
  --fa-dur-spin: 0.7s;
  --fa-dur-blink: 0.8s;
  --fa-dur-instant: 1ms;
  --fa-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --fa-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --fa-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --fa-ease-linear: linear;
  --fa-stagger-step: 80ms;

  /* Camadas */
  --fa-z-header: 100;
  --fa-z-skip: 200;

  color-scheme: light;
}

[data-theme='dark'] {
  --fa-bg: #06111d;
  --fa-surface: #0a1b2c;
  --fa-surface-2: #10263c;
  --fa-surface-3: #17334f;
  --fa-surface-glass: rgba(var(--fa-brand-navy-rgb), 0.76);
  --fa-overlay: rgba(2, 8, 15, 0.68);

  --fa-text: #eceef6;
  --fa-text-muted: #b8bacf;
  --fa-text-subtle: #8a8ca3;
  --fa-border: #1a3049;
  --fa-border-strong: #2b4666;

  --fa-primary: #93aef0;
  --fa-primary-rgb: 147, 174, 240;
  --fa-primary-solid: #2a56bd;
  --fa-primary-solid-hover: #3a68d3;
  --fa-primary-soft: rgba(147, 174, 240, 0.14);
  --fa-accent: #deb76d;
  --fa-accent-soft: rgba(var(--fa-brand-gold-rgb), 0.14);
  --fa-success: #4fd39f;
  --fa-success-soft: rgba(79, 211, 159, 0.14);
  --fa-danger: #ff7b80;
  --fa-danger-soft: rgba(255, 123, 128, 0.14);
  --fa-focus: rgba(147, 174, 240, 0.45);

  --fa-gradient-text: var(--fa-dark-gradient-text);

  --fa-dark-bg: #081624;
  --fa-dark-surface: #0d2135;

  --fa-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.4);
  --fa-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.4);
  --fa-shadow-md: 0 8px 24px rgba(0, 0, 0, 0.45);
  --fa-shadow-lg: 0 24px 56px rgba(0, 0, 0, 0.6);
  --fa-shadow-glow: 0 10px 30px rgba(42, 86, 189, 0.5);

  --fa-orb-opacity: 0.35;
  --fa-grid-line: rgba(var(--fa-brand-mist-rgb), 0.05);
  --fa-spotlight: rgba(var(--fa-primary-rgb), 0.12);

  color-scheme: dark;
}
