/* ============================================================
   VARIABLES — VivreEspagne · Electric Navy
   Todo oscuro: #030B1A → #1D4ED8 · Acento #2563EB
   ============================================================ */
:root {
    --white:      #FFFFFF;
    --off-white:  #EFF6FF;

    /* Fondos — variaciones de navy oscuro */
    --navy:        #030B1A;
    --navy-light:  #060F24;
    --navy-medium: #0A1E3D;
    --navy-deep:   #040B1C;
    --navy-darker: #030810;
    --navy-alpha-90: rgba(3,11,26,0.92);
    --navy-alpha-60: rgba(3,11,26,0.60);
    --navy-alpha-10: rgba(3,11,26,0.08);

    /* Acento eléctrico */
    --gold:        #2563EB;
    --gold-light:  #93C5FD;
    --gold-dark:   #1D4ED8;
    --gold-alpha-20: rgba(37,99,235,0.18);

    /* Acento secundario coral/énfasis */
    --terracota:       #3B82F6;
    --terracota-light: #60A5FA;
    --terracota-bg:    rgba(59,130,246,0.12);

    /* Success/confirmación */
    --sage:        #10B981;
    --sage-light:  #34D399;
    --sage-bg:     rgba(16,185,129,0.12);

    /* Cream → versión oscura para elementos "claros" */
    --cream:       #0A1E3D;
    --cream-dark:  #0F2D5E;
    --cream-darker:#152B4E;
    --cream-text:  #93C5FD;

    /* Gradientes */
    --gradient-hero: linear-gradient(145deg,#030B1A 0%,#0A1E3D 35%,#0F2D5E 65%,#1D4ED8 100%);
    --gradient-blue: linear-gradient(135deg,#2563EB,#3B82F6);
    --gradient-coral:linear-gradient(135deg,#1D4ED8,#2563EB);
    --gradient-card: linear-gradient(135deg,rgba(37,99,235,0.08),rgba(59,130,246,0.04));
    --gradient-dark: linear-gradient(160deg,#030B1A 0%,#060F24 50%,#0A1E3D 100%);

    --text-dark:  #F0F9FF;
    --text-body:  rgba(240,249,255,0.80);
    --text-muted: rgba(240,249,255,0.48);
    --text-light: rgba(240,249,255,0.28);
    --border:          rgba(37,99,235,0.22);
    --border-gold:     rgba(37,99,235,0.45);

    --font-heading: 'Cormorant Garamond', Georgia, serif;
    --font-body:    'DM Sans', -apple-system, sans-serif;
    --font-mono:    'DM Mono', monospace;

    --text-xs:.75rem; --text-sm:.875rem; --text-base:1rem;
    --text-lg:1.125rem; --text-xl:1.25rem; --text-2xl:1.5rem;
    --text-3xl:1.875rem; --text-4xl:2.25rem; --text-5xl:3rem;
    --text-6xl:3.75rem; --text-7xl:4.5rem;

    --space-1:.25rem;  --space-2:.5rem;   --space-3:.75rem;
    --space-4:1rem;    --space-5:1.25rem; --space-6:1.5rem;
    --space-8:2rem;    --space-10:2.5rem; --space-12:3rem;
    --space-16:4rem;   --space-20:5rem;   --space-24:6rem;
    --section-py:    var(--space-20);
    --section-py-sm: var(--space-12);

    --container-max:1200px;
    --container-px: var(--space-6);

    --radius-sm:4px;  --radius:8px;    --radius-md:12px;
    --radius-lg:16px; --radius-xl:24px;--radius-2xl:32px;
    --radius-full:9999px;

    --shadow-xs:   0 1px 2px rgba(0,0,0,0.30);
    --shadow-sm:   0 2px 8px rgba(0,0,0,0.35);
    --shadow-md:   0 4px 20px rgba(0,0,0,0.40);
    --shadow-lg:   0 8px 40px rgba(0,0,0,0.45);
    --shadow-xl:   0 16px 60px rgba(0,0,0,0.50);
    --shadow-gold: 0 4px 24px rgba(37,99,235,0.40);
    --shadow-glow: 0 0 40px rgba(37,99,235,0.30),0 4px 20px rgba(37,99,235,0.25);
    --shadow-coral:0 4px 24px rgba(59,130,246,0.35);

    --transition-fast:150ms ease;
    --transition:    220ms cubic-bezier(0.4,0,0.2,1);
    --transition-slow:400ms cubic-bezier(0.4,0,0.2,1);

    --header-h:        72px;
    --header-h-scroll: 60px;
    --header-bg:       rgba(3,11,26,0.94);
    --header-border:   rgba(37,99,235,0.20);

    --z-below:-1; --z-base:0; --z-raised:10; --z-dropdown:100;
    --z-sticky:200; --z-overlay:300; --z-modal:400; --z-toast:500;
}

/* Todo el tema es oscuro — variables uniformes */
.section--navy,
.section--cream,
.section--white,
.section--off-white,
[data-theme="dark"] {
    --text-dark:  #F0F9FF;
    --text-body:  rgba(240,249,255,0.80);
    --text-muted: rgba(240,249,255,0.48);
    --border:     rgba(37,99,235,0.22);
}