:root {
    /* Azul de marca del kit Elementor y del logo: #0D2F97.
       No se sustituye por #0B4EA2. El resto se deriva de ese azul. */
    --azul-profundo: #071A4A;
    --azul-fuerte: #0D2F97;
    --azul-intermedio: #4D6DDD;
    --azul-claro: #D5E2F8;
    --azul-hielo: #F3F6FC;
    --blanco: #FFFFFF;
    --texto: #12263F;
    --texto-suave: #4A5C73;
    --color-primary: var(--azul-fuerte);
    --color-primary-dark: var(--azul-profundo);
    --color-secondary: var(--texto-suave);
    --color-text: var(--texto);
    --color-muted: var(--texto-suave);
    --color-accent: var(--azul-intermedio);
    --color-ink: var(--azul-profundo);
    --color-white: var(--blanco);
    --color-button: var(--azul-fuerte);
    --color-button-hover: #0A3EBE;
    --color-bg: var(--blanco);
    --color-bg-soft: var(--azul-hielo);
    --color-line: rgba(13, 47, 151, 0.16);
    --font-heading: "Sora", "Segoe UI", sans-serif;
    --font-body: "IBM Plex Sans", "Segoe UI", sans-serif;
    --font-mono: ui-monospace, "Cascadia Mono", Consolas, monospace;
    --fs-body: 1.0625rem;
    --lh-body: 1.65;
    --fs-h1: clamp(2.2rem, 4.4vw, 3.75rem);
    --fs-h2: clamp(1.6rem, 2.5vw, 2.35rem);
    --fs-h3: clamp(1.12rem, 1.5vw, 1.35rem);
    --radius: 12px;
    --radius-sm: 8px;
    --shadow: 0 10px 28px rgba(7, 26, 74, 0.1);
    --shadow-sm: 0 4px 14px rgba(7, 26, 74, 0.06);
    --header-h: 84px;
    --container: 1240px;
    --space: 96px;
    --ease: cubic-bezier(0.22, 0.8, 0.24, 1);
    --s-1: 8px;
    --s-2: 16px;
    --s-3: 24px;
    --s-4: 32px;
    --s-5: 48px;
    --s-6: 64px;
    --s-7: 96px;
}

@media (max-width: 767px) {
    :root { --space: 64px; --header-h: 72px; }
}