/* ════════════════════════════════════════════════════════════════════
   Win'Event — tokens.css
   Variables de design : couleurs, typo fluide, espaces, motion.
   La palette est VERROUILLÉE (6 rôles). Ne pas ajouter d'autres teintes.
   ════════════════════════════════════════════════════════════════════ */

/* Ordre de cascade des couches (déclaré une fois, ici) */
@layer reset, tokens, base, layout, components, pages, utilities;

@layer tokens {
  :root {
    /* ── Palette : 6 rôles ──────────────────────────────────────── */
    --ink:        #0C0B0A;   /* Encre — fond principal        */
    --chalk:      #F6F2EA;   /* Craie — fond clair            */
    --gold:       #C9A227;   /* Or Waouh — décor / gros display */
    --champagne:  #EAD9A0;   /* Or clair — reflets            */
    --bronze:     #8A6B1F;   /* Bronze — or lisible sur clair */
    --graphite:   #1A1917;   /* Texte sur fond clair          */

    /* ── Dérivées fonctionnelles (teintes des 6, pas de nouvelles) ─ */
    --ink-2:      #131110;   /* panneaux sur fond encre       */
    --ink-3:      #1c1917;   /* cartes sur fond encre         */
    --chalk-2:    #efe8da;   /* panneaux sur fond craie       */
    --on-ink:     #F6F2EA;   /* texte sur encre               */
    --on-ink-mut: #b8b0a1;   /* texte secondaire sur encre    */
    --on-chalk-mut:#5b554b;  /* texte secondaire sur craie    */
    --line-ink:   rgba(234,217,160,.16); /* filets sur encre  */
    --line-chalk: rgba(26,25,23,.12);    /* filets sur craie  */
    --focus:      var(--gold);

    /* ── Or = matière : dégradé multi-stops (jamais un aplat) ────── */
    --grad-gold:  linear-gradient(100deg,
                    #EAD9A0 0%, #C9A227 32%, #8A6B1F 50%,
                    #C9A227 68%, #EAD9A0 100%);
    --grad-gold-soft: linear-gradient(120deg, #EAD9A0, #C9A227 55%, #8A6B1F);

    /* ── Typographie : familles ─────────────────────────────────── */
    --font-display: "Cormorant Garamond", "Cormorant", Georgia, "Times New Roman", serif;
    --font-script:  "Parisienne", "Segoe Script", "Brush Script MT", cursive;
    --font-body:    "Jost", "Century Gothic", "Segoe UI", system-ui, -apple-system, sans-serif;

    /* ── Échelle typographique fluide (clamp) ───────────────────── */
    --fs-eyebrow: clamp(0.72rem, 0.68rem + 0.18vw, 0.82rem);
    --fs-small:   clamp(0.82rem, 0.79rem + 0.15vw, 0.9rem);
    --fs-body:    clamp(1rem, 0.965rem + 0.18vw, 1.125rem);
    --fs-lead:    clamp(1.15rem, 1.05rem + 0.5vw, 1.45rem);
    --fs-h3:      clamp(1.3rem, 1.12rem + 0.8vw, 1.7rem);
    --fs-h2:      clamp(2rem, 1.5rem + 2.3vw, 3.4rem);
    --fs-h1:      clamp(2.7rem, 1.75rem + 4.6vw, 6rem);
    --fs-display: clamp(3.2rem, 1.9rem + 6.2vw, 8.5rem);
    --fs-script:  clamp(1.8rem, 1.2rem + 2.6vw, 3.4rem);

    --lh-tight:   1.02;
    --lh-snug:    1.18;
    --lh-body:    1.62;
    --ls-eyebrow: 0.18em;
    --ls-tight:   -0.01em;

    /* ── Espaces ────────────────────────────────────────────────── */
    --sp-1: 0.25rem;  --sp-2: 0.5rem;  --sp-3: 0.75rem; --sp-4: 1rem;
    --sp-5: 1.5rem;   --sp-6: 2rem;    --sp-7: 3rem;    --sp-8: 4rem;
    --sp-9: 6rem;     --sp-10: 8rem;
    /* Respiration verticale des sections (fluide) */
    --section-y: clamp(3.5rem, 2.5rem + 5vw, 8rem);

    /* ── Grille / conteneurs ────────────────────────────────────── */
    --container:      min(100% - 2.5rem, 1200px);
    --container-wide: min(100% - 2rem, 1440px);
    --container-text: min(100% - 2.5rem, 68ch);
    --gutter: clamp(1.25rem, 0.8rem + 2vw, 2.5rem);

    /* ── Rayons ─────────────────────────────────────────────────── */
    --r-sm: 6px;  --r-md: 12px;  --r-lg: 20px;  --r-pill: 999px;

    /* ── Ombres (chaudes, jamais bleutées) ──────────────────────── */
    --shadow-1: 0 2px 8px rgba(12,11,10,.10);
    --shadow-2: 0 10px 30px rgba(12,11,10,.16);
    --shadow-gold: 0 0 0 1px rgba(201,162,39,.35), 0 12px 34px rgba(138,107,31,.28);

    /* ── Motion ─────────────────────────────────────────────────── */
    --ease-brush: cubic-bezier(0.22, 0.85, 0.24, 1);
    --ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
    --dur-fast:   180ms;
    --dur-mid:    340ms;
    --dur-reveal: 720ms;
    --dur-brush:  820ms;

    /* ── Plans (z-index) ────────────────────────────────────────── */
    --z-header: 100;
    --z-menu:   200;
    --z-modal:  300;
    --z-skip:   400;

    color-scheme: dark light;
  }
}