:root {
    --color-50: #EBF1FA;
    --color-100: #C6D9F1;
    --color-200: #A1C1E8;
    --color-300: #7CA9DE;
    --color-400: #5890D5;
    --color-500: #3378CC;
    --color-600: #2A62A7;
    --color-700: #214D83;
    --color-800: #17375E;
    --color-900: #0E2239;
    --color-950: #050C14;

    /* Tokens semánticos basados estrictamente en la paleta corporativa oficial */
    --brand-primary: var(--color-600);
    --brand-primary-hover: var(--color-700);
    --brand-accent: var(--color-500);
    --brand-accent-light: var(--color-400);
    --brand-glow: var(--color-300);

    --surface-white: #FFFFFF;
    --surface-soft: var(--color-50);
    --surface-tinted: var(--color-100);
    --surface-dark: var(--color-900);
    --surface-darker: var(--color-950);

    --text-heading: var(--color-900);
    --text-body: var(--color-800);
    --text-muted: #435D7A;
    --text-on-dark: #FFFFFF;
    --text-on-dark-muted: var(--color-100);

    --border-subtle: var(--color-100);
    --border-medium: var(--color-200);

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

    /* Geometría y sombras */
    --container-max: 1260px;
    --radius-sm: 10px;
    --radius-md: 16px;
    --radius-lg: 22px;
    --radius-xl: 28px;
    --radius-pill: 9999px;

    --shadow-sm: 0 4px 14px rgba(14, 34, 57, 0.06);
    --shadow-md: 0 12px 32px rgba(14, 34, 57, 0.09);
    --shadow-lg: 0 20px 48px rgba(5, 12, 20, 0.16);
    --shadow-glow: 0 8px 24px rgba(42, 98, 167, 0.32);

    --transition-fast: 180ms cubic-bezier(0.22, 1, 0.36, 1);
    --transition-smooth: 320ms cubic-bezier(0.22, 1, 0.36, 1);
}