/* Jetons du système visuel : mêmes valeurs que DESIGN.md (la porte qualité les relit dans la page). */
:root {
  --blanc: #FFFFFF;
  --voile: #F2F5F4;
  --chenal: #0F3340;
  --ardoise: #4A5E66;
  --filet: #D3DCDC;
  --magenta: #ED1566;
  --magenta-fonce: #C40E52;
  --lagon: #D4ECEA;
  --haut-fond: #A9DDD8;
  --terre: #E9E3D4;
  --mangrove: #BFD1B5;
  --succes: #1F6F4A;
  --erreur: #B42318;

  --serif: "Newsreader", Georgia, "Times New Roman", serif;
  --sans: "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --t-h1: clamp(40px, 29.6px + 2.67vw, 72px);
  --t-h2: clamp(32px, 26.1px + 1.52vw, 48px);
  --t-h3: clamp(22px, 20.5px + 0.38vw, 26px);
  --t-prix: clamp(28px, 25.8px + 0.57vw, 34px);
  --t-chapeau: clamp(19px, 18.3px + 0.19vw, 21px);
  --t-texte: clamp(17px, 16.6px + 0.1vw, 18px);
  --t-ui: 16px;
  --t-petit: 14px;
  --t-mention: 13px;

  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px; --s8: 64px; --s9: 96px; --s10: 128px;
  --gouttiere: 20px;
  --section: 64px;
  --contenu: 1240px;

  --r-bouton: 4px;
  --r-feuille: 14px;
  --r-rond: 999px;

  --ombre: 0 1px 2px rgba(15, 51, 64, 0.08), 0 10px 30px rgba(15, 51, 64, 0.10);
  --courbe: cubic-bezier(.22, 1, .36, 1);
  --entete: 64px;
}
@media (max-width: 374px) { :root { --gouttiere: 16px; } }
@media (min-width: 768px) { :root { --gouttiere: 40px; --entete: 76px; } }
@media (min-width: 1024px) { :root { --section: 112px; } }