:root {
  /* CODENICSA Brand Colors (Extracted from /docs/LOGO.ai & Code_Generated_Image.png) */
  --brand-navy: #251e49;           /* rgb(37, 30, 73) - Color base institucional */
  --brand-navy-dark: #191436;      /* rgb(25, 20, 54) - Fondo principal noche */
  --brand-navy-deeper: #120e28;    /* Superficie más profunda */
  --brand-navy-light: #322861;     /* Fondo de tarjetas / hover */
  
  --primary: #6eb4b9;              /* rgb(110, 180, 185) - Burbuja frontal (Aqua / Mint Teal) */
  --primary-hover: #5ab1b8;
  --primary-light: #a5d8dc;
  --primary-glow: rgba(110, 180, 185, 0.4);
  
  --secondary: #6a9fc5;            /* rgb(106, 159, 197) - Burbuja intermedia (Steel Cyan Blue) */
  --secondary-hover: #548eb7;
  --secondary-glow: rgba(106, 159, 197, 0.35);

  --accent: #7e78d7;               /* rgb(126, 120, 215) - Burbuja trasera (Electric Violet / Purple) */
  --accent-hover: #6c65ce;
  --accent-glow: rgba(126, 120, 215, 0.35);

  /* Gradients corporativos basados en las 3 burbujas del logo */
  --grad-brand: linear-gradient(135deg, #7e78d7 0%, #6a9fc5 50%, #6eb4b9 100%);
  --grad-brand-hover: linear-gradient(135deg, #6c65ce 0%, #5a94bd 50%, #5eb8be 100%);
  --grad-teal: linear-gradient(135deg, #6eb4b9 0%, #6a9fc5 100%);
  --grad-violet: linear-gradient(135deg, #7e78d7 0%, #6a9fc5 100%);
  --grad-card: linear-gradient(145deg, rgba(50, 40, 97, 0.6) 0%, rgba(37, 30, 73, 0.85) 100%);
  --grad-hero: radial-gradient(circle at 50% 10%, rgba(126, 120, 215, 0.22) 0%, rgba(110, 180, 185, 0.15) 35%, rgba(25, 20, 54, 0) 70%);

  /* Neutrals & Surfaces (Dark Theme por defecto) */
  --bg-main: var(--brand-navy-dark);
  --bg-surface: var(--brand-navy);
  --bg-surface-elevated: var(--brand-navy-light);
  --text-primary: #ffffff;
  --text-secondary: #cdd5e0;
  --text-muted: #8d98ab;
  --border-color: rgba(110, 180, 185, 0.16);
  --border-glow: rgba(110, 180, 185, 0.4);

  /* Glassmorphism Corporativo */
  --glass-bg: rgba(37, 30, 73, 0.85);
  --glass-border: rgba(110, 180, 185, 0.22);
  --glass-blur: blur(20px);
  --glass-shadow: 0 12px 40px -10px rgba(18, 14, 40, 0.65);

  /* Tipografía */
  --font-heading: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* Espaciado & Layout */
  --max-width: 1240px;
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-full: 9999px;
  --transition-fast: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-bounce: 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* Modo Claro Adaptado a la Paleta Institucional */
[data-theme="light"] {
  --bg-main: #f5f6fb;
  --bg-surface: #ffffff;
  --bg-surface-elevated: #eceef8;
  --text-primary: #191436;
  --text-secondary: #433e61;
  --text-muted: #726e8a;
  --border-color: rgba(37, 30, 73, 0.12);
  --border-glow: rgba(110, 180, 185, 0.5);
  --glass-bg: rgba(255, 255, 255, 0.9);
  --glass-border: rgba(37, 30, 73, 0.08);
  --grad-card: linear-gradient(145deg, #ffffff 0%, #f4f5fc 100%);
  --glass-shadow: 0 12px 32px -8px rgba(37, 30, 73, 0.12);
}