/*
 * Design tokens dérivés de la charte graphique CCI (docs/design/charte-graphique-cci.pdf).
 *
 * --color-primary est la SEULE couleur imposée par la charte
 * (#373cf5 / Pantone 2728C). Les autres teintes ci-dessous sont des
 * gris neutres construits autour de cette couleur, pour la hiérarchie
 * de lecture — la charte n'interdit pas d'utiliser du neutre ailleurs
 * que sur le logo, elle interdit de RECOLORER LE LOGO lui-même.
 *
 * --color-primary-hover est une teinte assombrie de --color-primary
 * réservée aux états interactifs (survol/focus de liens et boutons),
 * jamais appliquée au logo.
 */

:root {
  /* Couleur de marque (charte, non négociable) */
  --color-primary: #373cf5;
  --color-primary-hover: #2c30c9;

  /* Neutres */
  --color-ink: #16162a;
  --color-ink-muted: #52536b;
  --color-surface: #ffffff;
  --color-surface-alt: #f4f5fb;
  --color-border: #dcdce8;
  /* Limite de composant INTERACTIF (champ de texte, carte-lien,
     bouton secondaire) — distinct de --color-border ci-dessus
     (décoratif, réservé aux séparateurs statiques : en-tête/pied de
     page, encarts). --color-border seul est ≈1,36:1 sur blanc, sous
     le minimum de 3:1 exigé par WCAG 2.2 SC 1.4.11 pour qu'un
     contrôle reste identifiable visuellement ; ≈4,96:1 ici. Gris
     neutre, pas une couleur de charte — ajustable librement. */
  --color-border-interactive: #6e6e85;
  --color-focus-ring: #16162a;

  /* État sémantique d'erreur (hors charte — la charte ne couvre que le
     logo/la marque, un message d'erreur a besoin d'une couleur non
     ambiguë avec les liens/boutons en --color-primary) */
  --color-danger: #b3261e;
  --color-danger-surface: #fdecea;

  /* Typographie */
  --font-body: "Fira Sans", system-ui, sans-serif;
  --text-body: clamp(1rem, 0.95rem + 0.2vw, 1.0625rem);
  --text-small: 0.875rem;
  --text-h1: clamp(1.75rem, 1.4rem + 1.6vw, 2.5rem);
  --text-h2: clamp(1.375rem, 1.2rem + 0.8vw, 1.75rem);
  --line-height-body: 1.6;
  --line-height-heading: 1.2;

  /* Rythme d'espacement */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-section: clamp(3rem, 2rem + 4vw, 6rem);

  /* Layout */
  --content-max-width: 64rem;
  --radius-sm: 6px;
}