/* ================================================
   TUDO SE VESTE - Design Tokens & Variables
   ================================================ */

:root {
  /* Cores principais */
  --azul-escuro:   #0a1a3a;
  --azul:          #1a3a6e;
  --azul-medio:    #2563c0;
  --azul-claro:    #4a9eff;
  --verde:         #009c3b;
  --verde-escuro:  #007a2e;
  --amarelo:       #ffdf00;
  --amarelo-dark:  #e6c800;
  --branco:        #ffffff;
  --cinza-bg:      #f0f4ff;
  --cinza-texto:   #64748b;
  --azul-texto:    #4a5568;

  /* Tipografia */
  --font-display: 'Bebas Neue', sans-serif;
  --font-body:    'Nunito', sans-serif;

  /* Espaçamentos */
  --space-xs:  8px;
  --space-sm:  16px;
  --space-md:  24px;
  --space-lg:  48px;
  --space-xl:  80px;

  /* Bordas */
  --radius-sm:  8px;
  --radius-md:  16px;
  --radius-lg:  20px;
  --radius-pill: 50px;

  /* Sombras */
  --shadow-card:  0 4px 20px rgba(26,58,110,0.08);
  --shadow-hover: 0 16px 40px rgba(26,58,110,0.18);
  --shadow-btn:   0 4px 16px rgba(0,156,59,0.3);
  --shadow-hero:  0 8px 30px rgba(0,156,59,0.5);

  /* Transições */
  --transition-fast:   0.2s ease;
  --transition-normal: 0.3s ease;
  --transition-slow:   0.4s ease;
}