/**
 * L'Indécente — Jetons de design
 * Charte v1 — 12/09/2026
 *
 * Tous les ratios de contraste sont mesurés selon WCAG 2.1 contre --c-nuit (#0A0A0B).
 * Ne pas modifier une valeur sans remesurer.
 */

:root {

  /* ---------------------------------------------------------------
     FONDS — noir très légèrement bleuté. Un noir pur écrase le magenta.
     --------------------------------------------------------------- */
  --c-nuit:            #0A0A0B;   /* fond de page, partout */
  --c-nuit-2:          #131317;   /* surfaces posées : cartes, encarts, champs */
  --c-nuit-3:          #1B1B21;   /* cellules de calendrier, états neutres */
  --c-trait:           #26262E;   /* filets, séparateurs, bordures au repos */

  /* ---------------------------------------------------------------
     MAGENTA — trois rôles distincts. C'est le cœur du système.

     ⚠️ --c-magenta plafonne à 4,40:1 : SOUS le seuil AA de 4,5:1.
        Il est réservé aux éléments d'interface (seuil 3:1).
        Dès qu'il doit être LU, utiliser --c-magenta-clair.
     --------------------------------------------------------------- */
  --c-magenta:         #E6007E;   /* 4,40:1 — aplats, symbole, bordures actives, points d'état */
  --c-magenta-clair:   #FF2E9A;   /* 5,76:1 — liens, italiques de titre, prix, œils de section */
  --c-magenta-fonce:   #B3005F;   /* blanc dessus : 6,81:1 — fond des boutons principaux */

  /* ---------------------------------------------------------------
     TEXTES — ivoire chaud contre le magenta froid ;
     gris tirés vers le violet pour rester dans la famille.
     --------------------------------------------------------------- */
  --c-ivoire:          #F4F1EC;   /* 17,6:1 — texte principal, titres */
  --c-brume:           #A8A4AE;   /*  8,09:1 — texte secondaire, légendes, intitulés */
  --c-ombre:           #827E8C;   /*  5,01:1 — texte tertiaire, méta, placeholders */

  /* ---------------------------------------------------------------
     ÉTATS — sémantiques, distincts de la couleur de marque.
     --------------------------------------------------------------- */
  --c-succes:          #4ADE80;   /* 11,36:1 */
  --c-erreur:          #FF6B6B;   /*  7,13:1 */

  /* ---------------------------------------------------------------
     TYPOGRAPHIE — deux familles, jamais trois.
     Jost : géométrique de la lignée Futura, c'est la famille du logo.
     Cormorant Garamond : garalde à fort contraste, titres uniquement.
     --------------------------------------------------------------- */
  --f-titre: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --f-ui:    'Jost', 'Futura', 'Century Gothic', system-ui, -apple-system, sans-serif;

  /* Échelle typographique */
  --fs-h1:      clamp(2.125rem, 6vw, 3.375rem);   /* 34 → 54 px */
  --fs-h2:      clamp(1.75rem, 4.4vw, 2.5rem);    /* 28 → 40 px */
  --fs-h3:      1.375rem;                          /* 22 px */
  --fs-oeil:    0.6875rem;                         /* 11 px — œil de section */
  --fs-corps:   1.0625rem;                         /* 17 px */
  --fs-petit:   0.875rem;                          /* 14 px */
  --fs-micro:   0.75rem;                           /* 12 px */

  --lh-titre:   1.12;
  --lh-corps:   1.7;

  --ls-oeil:    0.26em;    /* œils de section */
  --ls-btn:     0.16em;    /* boutons, intitulés */
  --ls-logo:    0.22em;    /* mot-symbole */

  /* ---------------------------------------------------------------
     ESPACEMENTS — échelle unique. Aucune valeur arbitraire dans le code.
     --------------------------------------------------------------- */
  --sp-1:  0.5rem;    /*  8 px */
  --sp-2:  1rem;      /* 16 px */
  --sp-3:  1.5rem;    /* 24 px */
  --sp-4:  2rem;      /* 32 px */
  --sp-6:  3rem;      /* 48 px */
  --sp-8:  4rem;      /* 64 px */
  --sp-12: 6rem;      /* 96 px */
  --sp-16: 8rem;      /* 128 px */

  /* ---------------------------------------------------------------
     MISE EN PAGE
     --------------------------------------------------------------- */
  --max-page:  1240px;
  --max-texte: 64ch;     /* longueur de ligne confortable */
  --gouttiere: 1.5rem;   /* marge latérale minimale, jamais en dessous */

  /* ---------------------------------------------------------------
     FORME & MOUVEMENT
     Rayon de 2 px : le luxe se lit dans des angles nets.
     --------------------------------------------------------------- */
  --radius:      2px;
  --duree:       400ms;
  --duree-lente: 1000ms;
  --courbe:      cubic-bezier(0.16, 1, 0.3, 1);
}

/* -------------------------------------------------------------------
   ACCESSIBILITÉ — non négociable.
   Pas d'animation ralentie : pas d'animation du tout.
   ------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}