/* =====================================================================
   BASE — jetons de design, remise à zéro, typographie, boutons.
   Palette et typographies reprises de la maquette v1 retenue par la cliente.
   ===================================================================== */
:root {
  --noir: #0a0a0a;
  --noir-doux: #1a1612;
  --creme: #f5f0e8;
  --creme-doux: #faf6ef;
  --or: #c9a96e;
  --or-vif: #d9bd85;
  --bordeaux: #5d1a1a;
  --bordeaux-profond: #3a0f0f;
  --gris: #8a8580;
  --gris-clair: #d4ccc1;
  --blanc: #fff;
  --texte-doux: #3b342d;
  --creme-fonce: #f3ece1;
  --creme-chaud: #efe5d4;
  --creme-pale: #f7f1e7;
  --sable: #efe8dc;
  --sable-survol: #f1e8da;
  --alerte-fond: #fff3d6;
  --alerte-texte: #7a5a1c;
  --pessah-fond: #f6efe1;
  --pessah-bord: #e9d9b5;
  --succes-fond: #eef4ee;
  --succes-texte: #2e5a35;
  --succes-bord: #cfe0d1;
  --succes-vif: #5cb85c;
  --erreur-fond: #fbeeee;
  --neutre-fond: #eee;
  --ligne: rgba(0, 0, 0, .1);
  --ligne-claire: rgba(255, 255, 255, .15);
  --ombre-s: 0 4px 16px rgba(0, 0, 0, .06);
  --ombre-m: 0 16px 48px rgba(0, 0, 0, .08);
  --ombre-l: 0 32px 80px rgba(0, 0, 0, .14);
  --police-titre: 'Playfair Display', Georgia, serif;
  --police-texte: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --courbe: cubic-bezier(.16, 1, .3, 1);
  --rayon: 14px;
  --hauteur-entete: 76px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--police-texte);
  color: var(--noir);
  background: var(--creme-doux);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; color: inherit; }
button { cursor: pointer; border: none; background: none; }
ul, ol { list-style: none; }

.conteneur { max-width: 1320px; margin: 0 auto; padding: 0 32px; }
@media (max-width: 720px) { .conteneur { padding: 0 18px; } }

h1, h2, h3, h4 { font-family: var(--police-titre); font-weight: 600; line-height: 1.15; letter-spacing: -.02em; }
.italique { font-style: italic; font-weight: 400; color: var(--or); }
.surtitre {
  display: inline-block; font-size: 11px; letter-spacing: 3px; text-transform: uppercase;
  font-weight: 600; color: var(--or); margin-bottom: 18px;
}
.titre-section { font-size: clamp(32px, 4.4vw, 56px); margin-bottom: 18px; }
.chapo { font-size: 18px; color: var(--gris); max-width: 640px; }

/* ----- Boutons ----- */
.bouton {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 15px 28px; border-radius: 999px; font-size: 14px; font-weight: 600; letter-spacing: .3px;
  transition: transform .3s var(--courbe), background .3s, color .3s, border-color .3s;
}
.bouton:hover { transform: translateY(-2px); }
.bouton--plein { background: var(--bordeaux); color: var(--creme); }
.bouton--plein:hover { background: var(--bordeaux-profond); }
.bouton--or { background: var(--or); color: var(--noir); }
.bouton--or:hover { background: var(--or-vif); }
.bouton--contour { border: 1px solid var(--noir); }
.bouton--contour:hover { background: var(--noir); color: var(--creme); }
.bouton--clair { border: 1px solid var(--ligne-claire); color: var(--creme); }
.bouton--clair:hover { background: var(--creme); color: var(--noir); }
.bouton--petit { padding: 10px 18px; font-size: 13px; }
.bouton--bloc { width: 100%; }

.lien-fleche { font-weight: 600; border-bottom: 1px solid currentColor; padding-bottom: 2px; }

/* ----- Apparition au défilement ----- */
[data-apparition] { opacity: 0; transform: translateY(30px); transition: opacity .9s var(--courbe), transform .9s var(--courbe); }
[data-apparition].visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  [data-apparition] { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
}

.visuellement-cache { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }