/* ============================================================================
   GRIMPEEZ — DESIGN TOKENS  (source de vérité unique)  ·  V2 « bleu nuit »
   ----------------------------------------------------------------------------
   Copie fidèle de seo-audit/brand/tokens.css. Ne PAS éditer ici à la main :
   éditer la source puis recopier, pour que le thème + les 236 comparatifs +
   le styleguide restent alignés.

   Ces variables sont LA charte. Elles alimentent :
     1. le thème (theme.json + components.css consomment var(--gz-*)),
     2. le moteur build_synthese.py,
     3. la page styleguide.html (preview).
   ============================================================================ */

:root {
  /* --- Encre & neutres (teintés froid pour aller avec le navy) ----------- */
  --gz-ink:        #0e1828;   /* titres, texte fort (navy-noir)   */
  --gz-ink-soft:   #2b3a4f;   /* texte courant                    */
  --gz-mut:        #64748b;   /* secondaire, légendes (slate)     */
  --gz-line:       #e5e9f0;   /* filets, bordures                 */
  --gz-surface:    #ffffff;   /* fond cartes                      */
  --gz-stone:      #f5f7fa;   /* sections, fonds froids           */
  --gz-stone-2:    #eef1f6;   /* fond alterné                     */

  /* --- Marque (bleu nuit) ------------------------------------------------ */
  --gz-navy:       #17305a;   /* BLEU marque (primaire, liens)    */
  --gz-navy-d:     #0e1f3d;   /* navy profond (hub, footer, hero) */
  --gz-navy-2:     #244a86;   /* navy clair (liens hover)         */
  --gz-azure:      #4f8fdc;   /* bleu clair (fin de dégradé jauge)*/

  /* --- Accent premium ---------------------------------------------------- */
  --gz-gold:       #c9a25c;   /* OR (liseré, « coup de cœur »)    */
  --gz-gold-d:     #ab8743;

  /* --- CTA (action commerciale) — corail, réglable ---------------------- */
  --gz-cta:        #ff6f5f;   /* bouton d'achat affilié           */
  --gz-cta-d:      #ec5947;   /* hover                            */

  /* --- Sémantique -------------------------------------------------------- */
  --gz-pro:        #1f9d6b;   /* « on aime » (vert validation)    */
  --gz-con:        #d6452f;   /* « on aime moins »                */
  --gz-pro-bg:     #e8f5ee;
  --gz-con-bg:     #fdeeea;
  --gz-info-bg:    #eef3fb;   /* fond info (navy très clair)      */
  --gz-star:       #e8a13a;   /* étoiles / notes agrégées         */

  /* --- Typographie (plus moderne : Space Grotesk titres / Inter texte) --- */
  --gz-font-display: "Space Grotesk", "Archivo", system-ui, -apple-system, sans-serif;
  --gz-font-body:    "Inter", "Source Sans 3", system-ui, -apple-system, sans-serif;
  --gz-font-serif:   "Fraunces", Georgia, serif;   /* option titres « premium éditorial » */

  --gz-fs-h1: clamp(2.1rem, 1.4rem + 2.7vw, 3rem);
  --gz-fs-h2: clamp(1.55rem, 1.2rem + 1.3vw, 2.05rem);
  --gz-fs-h3: 1.32rem;
  --gz-fs-lead: 1.16rem;
  --gz-fs-base: 1rem;
  --gz-fs-sm: 0.875rem;
  --gz-fs-xs: 0.78rem;

  --gz-lh-tight: 1.12;
  --gz-lh-body: 1.65;
  --gz-tracking-label: 0.07em;

  --gz-w-regular: 400;
  --gz-w-medium: 500;
  --gz-w-semi: 600;
  --gz-w-bold: 700;

  /* --- Rayons (plus généreux), ombres (plus douces), espacement ---------- */
  --gz-r-sm: 10px;
  --gz-r: 14px;
  --gz-r-lg: 20px;
  --gz-r-pill: 999px;

  --gz-shadow: 0 4px 18px rgba(16, 30, 60, .07);
  --gz-shadow-lg: 0 14px 44px rgba(16, 30, 60, .13);

  --gz-gap: 1.25rem;
  --gz-container: 760px;
  --gz-container-wide: 1140px;
}