/* ============================================================
   variables.css
   Tokens de diseño globales para ServiziEolie.
   Importar PRIMERO antes que cualquier otro CSS.
   ============================================================ */

:root {
    /* ── Paleta océano ── */
    --color-ocean-deep:   #0a2a3d;
    --color-ocean-mid:    #0e4d6e;
    --color-ocean-bright: #1a7fa6;
    --color-turquoise:    #2ec4d4;
    --color-aqua-light:   #8ee9ef;

    /* ── Paleta cálida ── */
    --color-sand:         #f0e6c8;
    --color-sand-dark:    #d4c49a;
    --color-ivory:        #faf6ee;
    --color-coral:        #e07a5f;
    --color-gold:         #c9a84c;

    /* ── Texto ── */
    --color-text-dark:    #0f1e28;
    --color-text-mid:     #2d4a5c;
    --color-white:        #ffffff;

    /* ── Tipografía ── */
    --font-display: 'Cormorant Garamond', Georgia, serif;
    --font-body:    'DM Sans', system-ui, sans-serif;

    --text-xs:   11px;
    --text-sm:   13.5px;
    --text-base: 15.5px;
    --text-lg:   18px;
    --text-xl:   24px;
    --text-2xl:  32px;
    --text-3xl:  clamp(36px, 5vw, 60px);
    --text-hero: clamp(52px, 7vw, 88px);

    --leading-tight:  1.1;
    --leading-normal: 1.6;
    --leading-loose:  1.8;

    /* ── Espaciado ── */
    --space-xs:  8px;
    --space-sm:  16px;
    --space-md:  28px;
    --space-lg:  48px;
    --space-xl:  80px;
    --space-2xl: 120px;

    /* ── Layout ── */
    --max-width:     1400px;
    --max-width-md:  1200px;
    --max-width-sm:  900px;
    --nav-height:    68px;
    --lang-bar-height: 34px;

    /* ── Bordes y sombras ── */
    --radius-sm:  2px;
    --radius-md:  4px;
    --radius-full: 9999px;

    --shadow-sm:  0 2px 12px rgba(0, 0, 0, 0.05);
    --shadow-md:  0 8px 30px rgba(14, 77, 110, 0.12);
    --shadow-lg:  0 20px 60px rgba(14, 77, 110, 0.15);

    /* ── Transiciones ── */
    --transition-fast:   0.2s ease;
    --transition-normal: 0.3s ease;
    --transition-slow:   0.6s ease;

    /* ── Z-index ── */
    --z-nav:     100;
    --z-overlay: 200;
    --z-fab:     999;
}