/*
 * PixelBox — jetons de design (design tokens).
 * Source de vérité : bloc :root du mockup « pixel-box-wireframe-charte-1 »,
 * repris à l'identique. Toute valeur graphique du site part d'ici.
 */
:root{
  /* Couleurs — l'interface est monochrome ; la couleur vient des mosaïques */
  --color-bg:#FFFFFF;          /* mur de galerie */
  --color-ink:#0A0A0A;         /* texte principal, CTA */
  --color-ink-soft:#4A4A4A;    /* texte secondaire uniquement */
  --color-rule:#E8E8E8;        /* filet 1 px */
  --color-rule-ink:#0A0A0A;    /* filet appuyé (colonne premium) */
  --color-surface:#F7F7F7;     /* gris neutre très pâle, usage unique */
  --color-glass-1:#F2F2F0;     /* verre neutre, fond de mosaïque */
  --color-glass-2:#EAEAE7;
  --color-alert:#B3261E;       /* ajout hors mockup : bordure des messages d'erreur (WooCommerce) */

  /* Typographie */
  --font-serif:"Newsreader",Georgia,serif;
  --font-sans:"Archivo","Helvetica Neue",Helvetica,Arial,sans-serif;
  --text-h1:clamp(44px,6.2vw,72px);
  --text-h2:clamp(30px,3.4vw,42px);
  --text-h3:22px;
  --text-lead:clamp(17px,1.5vw,20px);
  --text-body:16px;
  --text-small:14px;
  --text-micro:13px;
  --leading-tight:1.08;
  --leading-title:1.18;
  --leading-body:1.65;
  --measure:66ch;

  /* Espacement — carré de 8 px */
  --space-1:8px;  --space-2:16px; --space-3:24px; --space-4:32px;
  --space-5:48px; --space-6:64px; --space-7:96px; --space-8:128px;

  /* Structure */
  --radius:0;
  --container:1240px;
  --container-narrow:760px;
}