:root {
  /* Couleurs de marque : noir/anthracite dominant + rouge en accent vif,
     fidèles au site en prod. Le violet du logo reste un détail de marque,
     pas une couleur de fond. */
  --color-dark: #1a1a1a;
  --color-dark-alt: #262626;
  --color-accent: #c41230;
  --color-accent-dark: #9c0e26;
  --color-logo-purple: #3a104e;
  --color-text: #1a1a1a;
  --color-text-muted: #5c5c5c;
  --color-text-on-dark-muted: #b8b8b8;
  --color-grey-light: #f4f2f5;
  --color-grey-border: #e0dde2;
  --color-white: #ffffff;
  --color-accent-soft: #fbe9ec;

  /* Typographie */
  --font-base: "Poppins", "Segoe UI", Arial, sans-serif;
  --fs-h1: clamp(2rem, 1.6rem + 2vw, 3.25rem);
  --fs-h1-page: clamp(1.85rem, 1.5rem + 1.6vw, 2.75rem);
  --fs-h2-column: clamp(1.4rem, 1.25rem + 0.7vw, 1.85rem);
  --fs-lead: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --fs-h2: clamp(1.5rem, 1.3rem + 1vw, 2.25rem);
  --fs-h3: clamp(1.15rem, 1.05rem + 0.5vw, 1.5rem);
  --fs-body: 1rem;
  --fs-small: 0.875rem;

  /* Espacements */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  /* Grands espacements fluides : généreux sur desktop, resserrés sur mobile. */
  --space-lg: clamp(2rem, 1.6rem + 1vw, 2.5rem);
  --space-xl: clamp(2.75rem, 2rem + 2.5vw, 4rem);
  --space-2xl: clamp(3.5rem, 2.25rem + 4vw, 6rem);

  /* Mise en page */
  --container-width: 1200px;
  --radius: 4px;
  --shadow-card: 0 2px 8px rgba(26, 26, 26, 0.06);
  --shadow-raised: 0 10px 28px rgba(26, 26, 26, 0.10);
  --measure: 78ch; /* largeur de lecture confortable pour les blocs de texte */
  --transition: 0.18s ease;
  --header-height: 84px;
}