/* ==========================================================================
   tokens.css — variables NON colorées, communes à tous les thèmes
   (typographie, espacements, rayons, largeurs, ombres, transitions).
   Les couleurs vivent dans themes.css. Tailles en rem.
   ========================================================================== */

:root {
  /* Familles — polices locales à venir (voir fonts.css), repli propre actif. */
  --font-sans: "Source Sans 3", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;

  /* Échelle typographique (fluide, bornée). Texte courant ≥ 1rem. */
  --fs-eyebrow: 0.875rem;   /* 14px — sur-titre technique (mono) */
  --fs-tag:     0.8125rem;  /* 13px — étiquettes courtes (mono)  */
  --fs-small:   1rem;       /* 16px — plancher informatif        */
  --fs-body:    1.125rem;   /* 18px — texte courant              */
  --fs-lead:    1.25rem;    /* 20px — chapô                      */
  --fs-h3:      clamp(1.25rem, 1.1rem + 0.6vw, 1.375rem);
  --fs-h2:      clamp(1.875rem, 1.35rem + 2.1vw, 2.5rem);   /* 30 → 40px */
  --fs-h1:      clamp(2.375rem, 1.55rem + 3.4vw, 3.5rem);   /* 38 → 56px */

  --lh-tight: 1.12;
  --lh-heading: 1.18;
  --lh-body: 1.65;

  /* Espacements */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 5.5rem;
  --space-10: 7.5rem;

  /* Rythme vertical des grandes sections (≈ 80 → 120px) */
  --section-y: clamp(3.5rem, 2.5rem + 4vw, 7.5rem);

  /* Respiration haute mutualisée entre le header et le Hero.
     Référence visuelle = le Hero de l'accueil ; réutilisée sur toutes les
     pages internes pour un espacement homogène (fluide desktop → mobile). */
  --hero-padding-top-desktop: clamp(3.5rem, 2.5rem + 4vw, 7.5rem);

  /* Largeurs maximales */
  --max-content: 75rem;   /* 1200px */
  --max-text: 70ch;       /* mesure de ligne confortable */
  --gutter: clamp(1.25rem, 0.8rem + 2vw, 4rem);

  /* Rayons */
  --radius-sm: 0.3125rem; /* 5px */
  --radius: 0.5rem;       /* 8px */
  --radius-lg: 0.75rem;   /* 12px */
  --radius-pill: 999px;

  /* Bordures */
  --bw: 1px;
  --bw-strong: 1.5px;

  /* Ombres sobres (discrètes ; peu visibles en sombre, volontairement) */
  --shadow-sm: 0 1px 2px rgba(15, 25, 35, 0.05);
  --shadow: 0 4px 16px rgba(15, 25, 35, 0.07);

  /* Transition unique, neutralisée sous prefers-reduced-motion (voir base.css) */
  --transition: 150ms ease;

  /* Renfort d'erreur (formulaires) — sert de bordure/icône uniquement ; le
     texte d'erreur reste en --text (AAA). Valeur unique lisible en clair comme
     en sombre (contraste graphique ≥ 3:1 sur toutes les surfaces des thèmes). */
  --danger: #D64550;
}