/* ==========================================================================
   ARFRIO CLIMATIZADORES — DESIGN TOKENS
   ========================================================================== */

:root {
  /* Paleta oficial da marca */
  --e-global-color-primary: #0083CB;
  --e-global-color-secondary: #54595F;
  --e-global-color-text: #7A7A7A;
  --e-global-color-accent: #74859B;
  --e-global-color-2fded32b: #6EC1E4;
  --e-global-color-ad063dc: #61CE70;
  --e-global-color-42080f29: #4054B2;
  --e-global-color-74603a5f: #23A455;
  --e-global-color-3677f93b: #000;
  --e-global-color-3df4165c: #FFF;

  /* Tokens semânticos — modo claro */
  --color-bg: #F7F9FB;
  --color-bg-alt: #EFF3F7;
  --color-surface: #FFFFFF;
  --color-border: #E4E9EE;

  --color-text-heading: #16191D;
  --color-text-body: var(--e-global-color-text);
  --color-text-muted: #9AA1A8;

  --color-brand: var(--e-global-color-primary);
  --color-brand-dark: #00629B;
  --color-accent-cyan: var(--e-global-color-2fded32b);
  --color-accent-indigo: var(--e-global-color-42080f29);
  --color-secondary: var(--e-global-color-secondary);
  --color-muted-blue: var(--e-global-color-accent);

  --color-success: var(--e-global-color-ad063dc);
  --color-success-dark: var(--e-global-color-74603a5f);
  --color-flow-hot: #E2434D;
  --color-flow-cold: var(--e-global-color-2fded32b);

  /* Badges de ícone coloridos (specs, pilares, valores) */
  --badge-blue-bg: #E4F2FB;   --badge-blue-icon: #0083CB;
  --badge-teal-bg: #E1F6FA;   --badge-teal-icon: #0F9CBF;
  --badge-green-bg: #E5F9EA;  --badge-green-icon: #23A455;
  --badge-indigo-bg: #EAECFA; --badge-indigo-icon: #4054B2;

  /* Tipografia */
  --font-display: 'Space Grotesk', 'Segoe UI', sans-serif;
  --font-body: 'Inter', 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', 'Consolas', monospace;

  /* Layout / forma */
  --container-width: 1240px;
  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --radius-pill: 999px;

  --shadow-card: 0 1px 2px rgba(20,30,45,.04), 0 8px 24px rgba(20,30,45,.06);
  --shadow-card-hover: 0 4px 10px rgba(20,30,45,.06), 0 20px 44px rgba(20,30,45,.12);
  --shadow-elevated: 0 8px 16px rgba(20,30,45,.06), 0 32px 64px rgba(20,30,45,.14);
  --transition-base: 280ms cubic-bezier(.4,0,.2,1);
}

/* Modo Engenharia (dark mode) — Módulo 4 */
.dark-theme {
  --color-bg: #12151A;
  --color-bg-alt: #181C22;
  --color-surface: #1D2229;
  --color-border: #2A303A;

  --color-text-heading: #F3F5F7;
  --color-text-body: #B8BFC8;
  --color-text-muted: #6E7680;

  --color-brand: var(--e-global-color-2fded32b);
  --color-brand-dark: #4FA8C7;

  --badge-blue-bg: rgba(110,193,228,.12);   --badge-blue-icon: #6EC1E4;
  --badge-teal-bg: rgba(110,193,228,.12);   --badge-teal-icon: #7FDCEE;
  --badge-green-bg: rgba(97,206,112,.14);   --badge-green-icon: #6FE082;
  --badge-indigo-bg: rgba(120,140,230,.14); --badge-indigo-icon: #8C9CF5;

  --shadow-card: 0 4px 20px rgba(0,0,0,.4);
  --shadow-card-hover: 0 0 0 1px rgba(110,193,228,.3), 0 20px 48px rgba(0,0,0,.55);
  --shadow-elevated: 0 0 0 1px rgba(110,193,228,.25), 0 30px 70px rgba(0,0,0,.6);

  --glow-neon: 0 0 14px rgba(110,193,228,.55), 0 0 34px rgba(110,193,228,.25);
  --glow-neon-text: 0 0 8px rgba(110,193,228,.65);
}