:root {
  /* Colors — Monocromática (sin acento). Anclada al nuevo logo #2B3B5C */
  --color-primary:      #2B3B5C;   /* Navy del logo nuevo */
  --color-deep:         #1A2A47;   /* Navy profundo, hover y fondos */
  --color-light:        #E8EBF1;   /* Navy claro, separadores suaves */
  --color-text:         #1F2A37;   /* Texto principal */
  --color-text-muted:   #5C6770;   /* Secundario, eyebrows */
  --color-bg:           #F7F8FA;   /* Fondo general (blanco hueso) */
  --color-white:        #FFFFFF;   /* CTAs sobre fondo oscuro */
  --color-border:       #E5E7EB;   /* Bordes y líneas */
  --color-footer:       #0F1A2E;   /* Footer profundo */

  /* Compatibilidad retro (no usar — alias a primary) */
  --color-accent:       var(--color-primary);
  --color-accent-dark:  var(--color-deep);
  --color-accent-hover: var(--color-deep);

  /* Typography */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: 'JetBrains Mono', 'Courier New', monospace;

  --text-display:  clamp(36px, 5.5vw, 64px);
  --text-h1:       clamp(32px, 4vw, 48px);
  --text-h2:       clamp(28px, 3.2vw, 42px);
  --text-h3:       22px;
  --text-h4:       17px;
  --text-body-lg:  17px;
  --text-body:     16px;
  --text-sm:       15px;
  --text-xs:       14px;
  --text-caption:  13px;
  --text-eyebrow:  12px;

  /* Spacing */
  --sp-1:   4px;
  --sp-2:   8px;
  --sp-3:  12px;
  --sp-4:  16px;
  --sp-5:  24px;
  --sp-6:  32px;
  --sp-7:  48px;
  --sp-8:  64px;
  --sp-9: 100px;

  /* Layout */
  --container-max:   1200px;
  --container-px:      24px;
  --container-px-lg:   48px;
  --section-py:       100px;
  --section-py-sm:     70px;
  --header-h:          78px;

  /* Radii */
  --radius-sm: 4px;
  --radius-md: 6px;

  /* Shadows */
  --shadow-card:   0 12px 32px rgba(43, 59, 92, 0.10);
  --shadow-header: 0 4px 12px rgba(0, 0, 0, 0.06);

  /* Transitions */
  --t-fast: 0.15s ease;
  --t-base: 0.20s ease;
}