/* ============================================================
   ETILIK PRINT — VOLTAGE COBALT · TOKENS (source de vérité)
   DA verrouillée 29/05/2026 · kit design-system 08/07/2026
   Facelift appliqué 10/07/2026 (handoff design_handoff_facelift)

   RÈGLES DURES (ne jamais violer) :
   1. Fond de page BLANC PUR. Le noir = blocs (footer, bloc prix), jamais fond de page.
   2. Cobalt #2D5BFF = accent reine, un seul bleu.
   3. Inter exclusivement.
   4. Vert = STRICTEMENT sémantique (en ligne / validé). Jamais décoratif.
   5. Espacements sur l'échelle 4px, rayons sur les 4 tokens (+ swatch).
   6. Jamais le mot « flocage » (c'est de l'impression).

   Ce fichier est chargé AVANT tout autre CSS. Ne pas redéfinir ces
   variables dans les pages : les modifier ICI uniquement.
   ============================================================ */
:root{
  /* --- Couleurs --- */
  --white:#FFFFFF;
  --ink:#0A0A0A;            /* noir des blocs */
  --ink-soft:#3A3A3E;       /* texte courant secondaire */
  --ink-mute:#5C5C64;       /* légendes, hints */
  --line:#ECECEE;           /* filets */
  --line-2:#A3A3A3;         /* bordures de champs */
  --chip:#F5F5F5;           /* fonds de vignette */

  --cobalt:#2D5BFF;         /* accent reine */
  --cobalt-deep:#1E45E0;    /* hover */
  --cobalt-soft:#EAEEFF;    /* aplats doux */
  --cobalt-glow:rgba(45,91,255,.55);
  --cobalt-on-dark:#A8C0FF; /* petit texte cobalt SUR noir (contraste ~9.8:1) */

  /* vert STRICTEMENT sémantique : en ligne / validé */
  --green:#22C55E;
  --green-text:#15803D;     /* texte vert sur blanc (>=4.5:1) */
  --green-soft:#E7F8EE;
  --green-glow:rgba(34,197,94,.5);

  /* états (propres au site : erreurs de formulaire, encarts d'avertissement) */
  --error:#DC2626;
  --error-soft:#FEF2F2;
  --warn-bg:#FFF8EC;
  --warn-line:#F0D9A8;
  --warn-text:#7A5A12;

  /* --- Ombres (légèrement bleutées) --- */
  --sh-1:0 1px 2px rgba(20,30,60,.04), 0 4px 10px rgba(20,30,60,.06);
  --sh-2:0 2px 6px rgba(20,30,60,.05), 0 14px 30px rgba(20,30,60,.08);
  --sh-3:0 8px 18px rgba(20,30,60,.07), 0 26px 60px rgba(20,30,60,.11);
  --sh-cobalt:0 10px 26px rgba(45,91,255,.28);
  --sh-hero:0 10px 26px rgba(10,20,60,.28);       /* CTA blanc sur photo */
  --sh-hero-hover:0 16px 36px rgba(10,20,60,.34);

  /* --- Rayons (4 tokens + exception swatch) --- */
  --r-sm:12px; --r-md:16px; --r-lg:22px; --r-xl:30px;
  --r-swatch:6px;           /* exception unique : swatches couleur */
  --r-focus:6px;            /* anneau :focus-visible */
  /* legacy : --r valait 14px (hors échelle) et sert dans ~336 fichiers.
     Alignée sur --r-md (16px) conformément à l'audit P0-2. */
  --r:16px;

  /* --- Bordures (règle actée, audit P0-3) ---
     1px   = filets, cartes au repos
     1.5px = champs interactifs + état sélectionné */
  --bw-line:1px;
  --bw-field:1.5px;

  /* --- Layout --- */
  --gut:clamp(20px,5vw,56px);
  --maxw:1180px;
  --measure:70ch;           /* longueur de ligne confortable (texte long) */

  /* --- Échelle d'espacements 4px (la clé anti-« brut ») ---
     Aucune valeur intermédiaire : 13, 15, 18px = bug. */
  --s-1:4px;  --s-2:8px;   --s-3:12px; --s-4:16px; --s-5:24px;
  --s-6:32px; --s-7:48px;  --s-8:64px; --s-9:96px; --s-10:128px;

  /* --- Typo Inter --- */
  --fs-hero:clamp(3rem,9vw,7rem);      /* hero photo atelier */
  --lh-hero:.92;
  --fs-h2:clamp(1.7rem,3.6vw,2.65rem);
  --fs-h3:1.25rem;
  --fs-body:17px;
  --fs-small:.92rem;
  --fs-caption:.82rem;
  --fs-micro:.72rem;
  --track-tight:-.045em;    /* hero */
  --track-head:-.022em;     /* titres */
  --track-caps:.05em;       /* MICRO MAJUSCULES */
}
