/* ==========================================================
   Design tokens — Spoed Ontstoppingsdienst
   Valeurs lues dans les fichiers Elementor du site actuel
   (post-14.css / post-19.css) : couleurs globales, typographie,
   rayons, ombre, largeur de conteneur, points de rupture.
   ========================================================== */
:root {
  /* Couleurs */
  --color-navy: #082d53;          /* primaire (e-global-color-primary / accent) */
  --color-yellow: #ffd974;        /* secondaire */
  --color-yellow-deep: #f5cc60;   /* jaune plus soutenu, survols */
  --color-ink: #111111;           /* titres */
  --color-text: #414141;          /* texte courant */
  --color-surface: #f8f8f8;       /* cartes, champs de formulaire */
  --color-white: #ffffff;
  --color-blue: #1d69b7;          /* survol des boutons */
  --color-grey-900: #292929;
  --color-grey-600: #787878;
  --color-grey-400: #a7a7a7;
  --color-grey-300: #d9d9d9;

  /* Typographie : Poppins */
  --font-base: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-black: 900;

  /* Tailles Elementor : bureau / tablette / mobile */
  --fs-hero: clamp(2.25rem, 5.2vw, 3.75rem);     /* primary 60 / 55 / 40 px */
  --fs-h2: clamp(1.9rem, 3.6vw, 3.125rem);       /* secondary 50 / 45 / 33 px */
  --fs-h3: clamp(1.25rem, 2vw, 1.875rem);        /* accent 30 / 25 / 22 px */
  --fs-lead: 1.0625rem;
  --fs-body: 1rem;                               /* texte du site actuel : 15 px, ici 16 px pour la lisibilité */
  --fs-small: 0.8125rem;                         /* 13 px */
  --lh-tight: 1.1;
  --lh-body: 1.6;

  /* Formes */
  --radius-xs: 5px;
  --radius-sm: 10px;
  --radius-md: 20px;
  --radius-lg: 25px;              /* boutons, champs, cartes */
  --radius-pill: 50px;
  --radius-round: 50%;

  /* Ombre */
  --shadow-card: 0 6px 20px rgba(0, 0, 0, 0.15);
  --shadow-soft: 0 4px 16px rgba(8, 45, 83, 0.10);

  /* Mise en page */
  --container: 1140px;            /* largeur max Elementor */
  --gutter: 20px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 48px;
  --space-6: 80px;

  /* Points de rupture (référence, utilisés dans styles.css) :
     tablette <= 1024px, mobile <= 767px */
}