:root {
  /* Colors - Base Palette */
  --color-bg: #050C16;
  --color-card: #0A1628;
  --color-surface: #0F1F38;
  --color-surface-hover: rgba(255, 255, 255, 0.06);
  
  /* Borders */
  --color-border: rgba(255, 255, 255, 0.08);
  --color-border-light: rgba(255, 255, 255, 0.14);
  --color-border-hover: rgba(0, 229, 204, 0.35);
  
  /* Accents */
  --color-cyan: #00E5CC;
  --color-cyan-glow: rgba(0, 229, 204, 0.25);
  --color-blue: #2563EB;
  --color-blue-hover: #1D4ED8;
  --color-whatsapp: #25D366;
  --color-whatsapp-hover: #2ee272;
  
  /* Typography & Neutrals */
  --color-white: #FFFFFF;
  --color-text: #E2E8F0;
  --color-muted: #94A3B8;
  --color-dark-muted: #64748B;
  --color-success: #10B981;
  --color-danger: #EF4444;
  
  /* Typography */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-display: 'Outfit', 'Inter', -apple-system, sans-serif;
  
  /* Shadows */
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 20px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 12px 35px rgba(0, 0, 0, 0.6);
  --shadow-cyan: 0 0 25px rgba(0, 229, 204, 0.25);
  --shadow-blue: 0 4px 15px rgba(37, 99, 235, 0.4);
  
  /* Border Radii (10px standard) */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-full: 9999px;
  
  /* Animations */
  --transition-fast: 0.15s ease;
  --transition-normal: 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-smooth: 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}