/* Jetons du système visuel : voir DESIGN.md (fait foi avec ce fichier). */
:root {
  --marine: #1E3D58;
  --marine-20: rgba(30, 61, 88, 0.2);
  --encre: #10202F;
  --sable: #C7936E;
  --coque: #FFFFFF;
  --coque-70: rgba(255, 255, 255, 0.7);
  --ecume: #EDF2F4;
  --lagon: #13777A;
  --brume: #5B6B78;
  --trait: #C9D3DA;
  --alerte: #A23B2A;
  --aconfirmer: #8A5A12;
  --blanc-78: rgba(255, 255, 255, 0.78);
  --blanc-94: rgba(255, 255, 255, 0.94);
  --blanc-40: rgba(255, 255, 255, 0.4);
  --blanc-25: rgba(255, 255, 255, 0.25);
  --blanc-20: rgba(255, 255, 255, 0.2);
  --fond-aconfirmer: #FBF6EE;
  --fond-alerte: #FBEFEC;

  --f-titre: "Bodoni Moda", "Didot", "Bodoni 72", Georgia, serif;
  --f-texte: "Albert Sans", "Segoe UI", system-ui, sans-serif;

  --t-xs: 13px;
  --t-s: 15px;
  --t-m: 17px;
  --t-l: 20px;
  --t-xl: 26px;
  --t-2xl: 34px;
  --t-3xl: 36px;
  --t-hero: 36px;

  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;
  --s-8: 64px;
  --s-9: 96px;

  --r-photo: 6px;
  --r-champ: 4px;
  --r-pastille: 999px;
  --r-panneau: 12px;

  --ombre-barre: 0 -6px 20px rgba(16, 32, 47, 0.12);
  --ombre-panneau: 0 18px 48px rgba(16, 32, 47, 0.22);
  --ombre-escale: 0 0 0 1px #C7936E;

  --gouttiere: 16px;
  --contenu: 1200px;
  --texte: 680px;
  --courbe: cubic-bezier(.2, .7, .2, 1);
}

@media (min-width: 768px) {
  :root { --gouttiere: 32px; --t-l: 21px; --t-xl: 30px; --t-2xl: 44px; --t-3xl: 56px; --t-hero: 44px; }
}
@media (min-width: 1280px) {
  :root { --gouttiere: 64px; --t-3xl: 68px; --t-hero: 56px; }
}