/**
 * AION DESIGN SYSTEM — TOKENS OFICIAIS
 * AION Action — Imersão Prática ao Vivo no Mercado Internacional
 * 
 * Cores, Tipografia, Vidro Líquido e Espaçamentos padronizados.
 */

:root {
  /* ==========================================================================
     1. PALETA DE CORES OFICIAL (EXTRAÍDA DOS ASSETS DA MARCA)
     ========================================================================== */
  
  /* Azuis da Família AION */
  --aion-blue-950: #000B24; /* Azul Abissal / Noite */
  --aion-blue-900: #001033; /* Azul Noite Profundo */
  --aion-blue-800: #00184D; /* Azul Base Profundo (Paleta de Cores, Faixa 1) */
  --aion-blue-700: #001F66; /* Azul Primário Escuro */
  --aion-blue-600: #002473; /* Azul Oficial AION (Paleta de Cores, Faixa 2) */
  --aion-blue-550: #003099; /* Azul Royal (Paleta de Cores, Faixa 3) */
  --aion-blue-500: #0043E0; /* Azul Oficial Marca (Arte 165/166, Símbolo) */
  --aion-blue-400: #0050FF; /* Azul de Ação e Interatividade (Arte 164) */
  --aion-blue-300: #2979FF; /* Azul Brilhante / Acento Dinâmico */
  --aion-blue-200: #6699FF; /* Azul Médio / Badges e Destaques */
  --aion-blue-100: #A8C8FF; /* Destaque Suave de Texto */
  --aion-blue-50:  #E6EFFF; /* Luminescência Sutil */

  /* Neutros Escuros / Pretos */
  --aion-dark-950: #030407; /* Preto Abissal */
  --aion-dark-900: #0D0D0D; /* Preto Oficial AION (Paleta de Cores, Arte 165) */
  --aion-dark-850: #111317; /* Superfície Elevada */
  --aion-dark-800: #161920; /* Card Escuro / Painel Secundário */
  --aion-dark-700: #1D212A; /* Borda Escura / Divisor Forte */
  --aion-dark-600: #2B313E; /* Elementos Interativos Desfocados */
  --aion-dark-500: #4B5263; /* Texto Mudo / Placeholder */

  /* Neutros Claros / Brancos */
  --aion-light-white: #FFFFFF; /* Branco Puro */
  --aion-light-50:    #F8FAFC;
  --aion-light-100:   #F1F5F9;
  --aion-light-200:   #E5E5E5; /* Cinza Oficial AION (Paleta de Cores, Símbolo copiar) */
  --aion-light-300:   #CBD5E1;
  --aion-light-400:   #94A3B8;
  --aion-light-500:   #64748B;
  --aion-light-600:   #475569;

  /* Cores Semânticas / Funcionais */
  --aion-success-500: #10B981;
  --aion-success-400: #34D399;
  --aion-success-bg:  rgba(16, 185, 129, 0.12);
  --aion-warning-500: #F59E0B;
  --aion-warning-400: #FBBF24;
  --aion-warning-bg:  rgba(245, 158, 11, 0.12);
  --aion-danger-500:  #EF4444;
  --aion-danger-400:  #F87171;
  --aion-danger-bg:   rgba(239, 68, 68, 0.12);
  --aion-info-500:    #0050FF;
  --aion-info-bg:     rgba(0, 80, 255, 0.12);

  /* ==========================================================================
     2. FUNDOS DE CONTRASTE DINÂMICO ENTRE AS DOBRAS
     ========================================================================== */
  --bg-dobra-1-hero:       #020612; /* Azul Noite Profundo + Halo Cobalt da Hero */
  --bg-dobra-2-problema:   #080C16; /* Escuridão Focada para Revelação de Texto */
  --bg-dobra-3-oquee:      #0D1220; /* Ardósia Nobre Elevada com 4 Pilares */
  --bg-dobra-4-paraquem:   #060911; /* Matriz Bipolar de Identificação */
  --bg-dobra-5-oferta:     #040816; /* Epicentro Comercial com Auréola Azul R$ 35 */
  --bg-dobra-6-como:       #0A0F1F; /* Trilha Sequencial dos 7 Passos + Alerta Zoom */
  --bg-dobra-7-conduz:     #050812; /* Carvão Institucional Executivo Diego Goes */
  --bg-dobra-8-confiar:    #0B1020; /* Pilares de Solidez AION + INFINOX */
  --bg-dobra-9-cta:        #030612; /* Card Final Monumental com Garantia */
  --bg-dobra-10-faq:       #090E1C; /* FAQ em Vidro Líquido Neutro */
  --bg-dobra-footer:       #02040A; /* Obsidian Máximo de Conformidade Legal */

  /* ==========================================================================
     3. TIPOGRAFIA OFICIAL — HELVETICA NOW TEXT (CLASSE A/A+)
     ========================================================================== */
  --font-family-base: "Helvetica Now Text", "Helvetica Now Display", "Helvetica Neue", Helvetica, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --font-family-mono: "SF Mono", "Fira Code", "Cascadia Code", "Roboto Mono", Consolas, monospace;

  /* Escala de Tamanhos de Alta Definição */
  --font-size-display: clamp(1.85rem, 4.5vw, 3.85rem);
  --font-size-h1:      clamp(1.75rem, 3.8vw, 3.0rem);
  --font-size-h2:      clamp(1.6rem, 2.8vw, 2.25rem);
  --font-size-h3:      clamp(1.2rem, 2.0vw, 1.55rem);
  --font-size-h4:      1.125rem;
  --font-size-body-lg: clamp(1.05rem, 1.25vw, 1.18rem);
  --font-size-body:    1rem;
  --font-size-body-sm: 0.875rem;
  --font-size-caption: 0.75rem;
  --font-size-price:   clamp(2.75rem, 5.0vw, 3.75rem);

  /* Pesos Refinados */
  --font-weight-light:    300;
  --font-weight-regular:  400;
  --font-weight-medium:   450;
  --font-weight-semibold: 550;
  --font-weight-bold:     650;

  /* Alturas de Linha */
  --line-height-display: 1.12;
  --line-height-heading: 1.25;
  --line-height-body:    1.65;
  --line-height-tight:   1.3;

  /* Micro-kerning Suíço */
  --letter-spacing-display:    -0.034em;
  --letter-spacing-heading:    -0.025em;
  --letter-spacing-subheading: -0.015em;
  --letter-spacing-body:       -0.012em;
  --letter-spacing-normal:     -0.005em;
  --letter-spacing-caps:        0.06em;
  --letter-spacing-kicker:      0.09em;

  /* ==========================================================================
     4. TOKENS DE VIDRO LÍQUIDO E GLASSMORPHISM 2026
     ========================================================================== */
  --glass-blur-subtle: 12px;
  --glass-blur-base:   24px;
  --glass-blur-liquid: 36px;
  --glass-blur-dense:  48px;
  --glass-saturate:    200%;

  /* Superfícies de Vidro Líquido */
  --glass-surface-translucent: rgba(10, 16, 30, 0.65);
  --glass-surface-elevated:    rgba(14, 22, 40, 0.78);
  --glass-surface-card:        rgba(10, 15, 28, 0.72);
  --glass-surface-blue:        rgba(0, 36, 115, 0.32);
  --glass-surface-blue-hover:  rgba(0, 67, 224, 0.42);

  /* Bordas Especulares e Reflexos */
  --glass-border-subtle:   1px solid rgba(255, 255, 255, 0.08);
  --glass-border-specular: 1px solid rgba(255, 255, 255, 0.14);
  --glass-border-top-rim:  1px solid rgba(255, 255, 255, 0.35);
  --glass-border-blue:     1px solid rgba(0, 80, 255, 0.45);

  /* Sombras Inset e Externas */
  --glass-shadow-ambient: 0 20px 48px -10px rgba(0, 0, 0, 0.7);
  --glass-shadow-inset:   inset 0 1px 1px 0 rgba(255, 255, 255, 0.22), inset 0 -1px 2px 0 rgba(0, 0, 0, 0.4);
  --glass-shadow-glow:    0 0 50px rgba(0, 80, 255, 0.32);

  /* ==========================================================================
     5. ESPAÇAMENTOS E LAYOUT
     ========================================================================== */
  --space-3xs: 2px;
  --space-2xs: 4px;
  --space-xs:  8px;
  --space-sm:  12px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 96px;
  --space-5xl: 128px;

  --container-max-width: 1220px;
  --container-narrow-width: 880px;
  --container-editorial-width: 760px;
  --container-padding: clamp(16px, 4vw, 36px);

  /* Raios de Arredondamento */
  --radius-xs:   4px;
  --radius-sm:   8px;
  --radius-md:   12px;
  --radius-lg:   16px;
  --radius-xl:   24px;
  --radius-2xl:  32px;
  --radius-full: 9999px;
  --radius-section-top: clamp(32px, 4vw, 48px);

  /* Transições e Z-index */
  --transition-fast: 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-base: 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-slow: 0.6s cubic-bezier(0.16, 1, 0.3, 1);

  --z-index-mesh:   0;
  --z-index-base:   1;
  --z-index-card:   2;
  --z-index-sticky: 100;
  --z-index-modal:  1000;
}
