/* =========================================================
   AZUR — Design tokens (référence : docs/AUDIT.md §2-3)
   Source : extraits depuis design AZUR (azur-home-1.jsx, ligne 8-27)
   ========================================================= */

:root {
    /* ----- Backgrounds ----- */
    --bg:          #f4f6fb;
    --bg-soft:     #eef1f9;
    --white:       #ffffff;
    --surface:     #ffffff;

    /* ----- Inks (text) ----- */
    --ink:         #0d1230;
    --ink-soft:    #1f2657;
    --ink-muted:   #3a4170;
    --muted:       #6b7299;

    /* ----- Borders ----- */
    --line:        #dde2ee;
    --line-soft:   #eceff7;

    /* ----- Brand : Majorelle (10 tons) ----- */
    --majorelle:        #003FA3;  /* PRIMARY */
    --majorelle-deep:   #002b75;
    --majorelle-soft:   #2a66c4;
    --majorelle-light:  #c7d6f0;

    /* ----- Accent : Gold ----- */
    --gold:        #FFD54A;  /* ACCENT */
    --gold-deep:   #e0b324;
    --gold-soft:   #ffe89c;

    /* ----- Semantic ----- */
    --success:     #1f9d55;
    --warning:     #e0a82e;
    --danger:      #c6483a;

    /* ----- Typography ----- */
    --font-display: 'Bricolage Grotesque', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    --font-sans:    'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    --font-mono:    ui-monospace, 'SF Mono', 'Cascadia Mono', 'Consolas', monospace;

    /* Type scale */
    --fs-h1-hero:  clamp(40px, 6vw, 88px);
    --fs-h1-page:  clamp(36px, 5vw, 64px);
    --fs-h2:       clamp(28px, 3.5vw, 40px);
    --fs-h3:       clamp(20px, 2.2vw, 24px);
    --fs-h4:       18px;
    --fs-body:     16px;
    --fs-body-lg:  19px;
    --fs-small:    14px;
    --fs-meta:     12px;
    --fs-eyebrow:  11px;

    /* Line heights */
    --lh-tight:    0.95;
    --lh-snug:     1.1;
    --lh-normal:   1.5;
    --lh-relaxed:  1.6;

    /* Letter spacing */
    --ls-tight:    -0.045em;
    --ls-snug:     -0.025em;
    --ls-normal:   -0.005em;
    --ls-wide:     0.22em;   /* eyebrows uppercase */

    /* Font weights */
    --fw-regular:  400;
    --fw-medium:   500;
    --fw-semibold: 600;
    --fw-bold:     700;
    --fw-extra:    800;

    /* ----- Spacing (base 4) ----- */
    --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:  96px;
    --sp-10: 128px;

    /* ----- Radius ----- */
    --r-xs:  4px;
    --r-sm:  8px;
    --r-md:  12px;
    --r-lg:  16px;
    --r-xl:  22px;
    --r-2xl: 28px;
    --r-pill: 999px;

    /* ----- Transitions ----- */
    --t-instant: 80ms cubic-bezier(0.4, 0, 0.2, 1);
    --t-fast:    160ms cubic-bezier(0.4, 0, 0.2, 1);
    --t-base:    240ms cubic-bezier(0.22, 0.61, 0.36, 1);
    --t-slow:    400ms cubic-bezier(0.22, 0.61, 0.36, 1);
    --t-spring:  520ms cubic-bezier(0.34, 1.56, 0.64, 1);

    /* ----- Layout ----- */
    --container-max:    1320px;
    --container-narrow: 760px;
    --container-tight:  540px;

    /* ----- Shadows ----- */
    --sh-sm:  0 1px 2px rgba(13, 18, 48, 0.06);
    --sh-md:  0 4px 14px rgba(13, 18, 48, 0.08);
    --sh-lg:  0 14px 36px rgba(13, 18, 48, 0.12);
    --sh-xl:  0 24px 60px rgba(13, 18, 48, 0.18);
    --sh-glow-majorelle: 0 16px 36px rgba(0, 63, 163, 0.35);
    --sh-glow-gold:      0 16px 36px rgba(255, 213, 74, 0.40);
    --sh-glow-ink:       0 12px 28px rgba(13, 18, 48, 0.20);

    /* ----- Z-index ----- */
    --z-base:     0;
    --z-elevated: 10;
    --z-sticky:   100;
    --z-overlay:  500;
    --z-modal:    1000;
    --z-toast:    2000;
}

/* =========================================================
   SELECTION — Majorelle bg + Gold text
   ========================================================= */
::selection {
    background: var(--majorelle);
    color: var(--gold);
}
::-moz-selection {
    background: var(--majorelle);
    color: var(--gold);
}
