/* Passerelle CGU – serveur de présentation et d'essai : styles communs (mêmes couleurs que la console) */
:root {
  --vert: #0f5132; --vert-moyen: #1f7a52; --vert-clair: #e8f3ee; --or: #c99a2e;
  --texte: #17211c; --doux: #55625c; --trait: #dde3e0; --fond: #f5f7f6; --carte: #ffffff;
  --rouge: #a4232c; --bleu-clair: #e7eef9;
  --police: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --chiffres: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}
@media (prefers-color-scheme: dark) {
  :root { --texte: #e6eee9; --doux: #9fb0a6; --trait: #2b3631; --fond: #101613; --carte: #18201c; --vert-clair: #15302a;
          --bleu-clair: #1b2638; --vert-moyen: #4fb184; }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--fond); color: var(--texte); font: 16px/1.55 var(--police); }
a { color: var(--vert-moyen); }
.haut { background: var(--vert); color: #fff; }
.haut .dedans { max-width: 1040px; margin: 0 auto; padding: 12px 16px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.haut span { opacity: .8; }
.haut .espace { flex: 1; }
main { max-width: 1040px; margin: 0 auto; padding: 28px 16px 48px; }
h1 { font-size: clamp(24px, 4vw, 32px); line-height: 1.2; margin: 0 0 8px; letter-spacing: -.01em; }
h2 { font-size: 19px; margin: 0 0 12px; }
.sous { color: var(--doux); margin: 0 0 24px; max-width: 760px; }
.carte { background: var(--carte); border: 1px solid var(--trait); border-radius: 14px; padding: 20px 22px; }
.bouton { display: inline-flex; align-items: center; gap: 8px; background: var(--or); color: #1c1606; text-decoration: none;
  font-weight: 600; border-radius: 10px; padding: 9px 16px; border: 0; font: 600 15px var(--police); cursor: pointer; }
.bouton.discret { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.45); }
main .bouton.discret { color: var(--texte); border-color: var(--trait); }
.avis { color: var(--doux); font-size: 14px; }
.grille { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; }
footer { color: var(--doux); font-size: 13px; text-align: center; padding: 0 16px 32px; }
