/* JD Conseils & Solutions — charte graphique v2
   Toutes les couleurs viennent des variables ci-dessous.
   Chaque section porte data-theme="ivoire" ou data-theme="nuit". */

@font-face { font-family: "Quattrocento Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/quattrocento-sans-400.woff2") format("woff2"); }
@font-face { font-family: "Quattrocento Sans"; font-style: italic; font-weight: 400; font-display: swap; src: url("../fonts/quattrocento-sans-400-italic.woff2") format("woff2"); }
@font-face { font-family: "Quattrocento Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/quattrocento-sans-700.woff2") format("woff2"); }

:root {
  /* Palette */
  --bleu-nuit: #0A0F2C;  --nuit-profond: #05081C;  --nuit-eleve: #141A3D;  --surface-nuit: #262C52;
  --ivoire: #F5F3EC;     --ivoire-sable: #ECE7DA;  --ligne-ivoire: #D8D2C2;
  --dore-satine: #D4AF37; --dore-base: #C58E25;   --dore-clair: #F2CF55;  --dore-bronze: #806010;
  --violet-profond: #3A0F5E; --violet-lavande: #B79AD6;
  --gris-perle: #B8BAC8; --gris-ardoise: #4A4E66;
  /* Espacements et rayons */
  --espace-1: 8px; --espace-2: 16px; --espace-3: 24px; --espace-4: 40px; --espace-5: 64px; --espace-section: 96px;
  --arrondi-sm: 4px; --arrondi-md: 10px; --arrondi-cercle: 999px;
  /* Mouvement */
  --courbe: cubic-bezier(.2, .7, .2, 1);
  --entete-h: 88px;
  --largeur: 1200px;
  color-scheme: light;
}

[data-theme="ivoire"] {
  --fond: var(--ivoire); --fond-carte: var(--ivoire-sable); --texte: var(--bleu-nuit);
  --texte-secondaire: var(--gris-ardoise); --titre: var(--dore-bronze); --filet: var(--ligne-ivoire);
  --filet-signature: var(--dore-base); --accent: var(--violet-profond);
  --bouton-fond: var(--bleu-nuit); --bouton-texte: var(--ivoire); --lien: var(--violet-profond);
  --pastille-fond: rgba(58, 15, 94, .07);
}
[data-theme="nuit"] {
  --fond: var(--bleu-nuit); --fond-carte: var(--nuit-eleve); --texte: var(--ivoire);
  --texte-secondaire: var(--gris-perle); --titre: var(--dore-satine); --filet: var(--surface-nuit);
  --filet-signature: var(--dore-satine); --accent: var(--violet-lavande);
  --bouton-fond: var(--dore-satine); --bouton-texte: var(--bleu-nuit); --lien: var(--dore-clair);
  --pastille-fond: rgba(183, 154, 214, .1);
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bleu-nuit);
  color: var(--bleu-nuit);
  font-family: "Quattrocento Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; }
p { margin: 0 0 1em; }
h1, h2, h3 { margin: 0; line-height: 1.2; }
ul { margin: 0; padding: 0; list-style: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.sprite symbol { fill: none; }
svg use { fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }

section, .pied { background: var(--fond); color: var(--texte); }
section[id] { scroll-margin-top: 64px; }

:focus-visible { outline: 2px solid var(--accent, var(--violet-lavande)); outline-offset: 3px; border-radius: 2px; }

.evitement {
  position: absolute; left: var(--espace-2); top: -60px; z-index: 100;
  background: var(--dore-satine); color: var(--bleu-nuit); padding: 10px 16px; border-radius: var(--arrondi-sm);
  font-weight: 700; text-decoration: none; transition: top .2s;
}
.evitement:focus { top: var(--espace-2); }

.conteneur { width: 100%; max-width: var(--largeur); margin: 0 auto; padding: 0 var(--espace-3); }
.section { padding: var(--espace-section) 0; position: relative; }
.centre { text-align: center; }
.centre .titre-section::after { margin-left: auto; margin-right: auto; }

/* ---------- Typographie ---------- */
.surtitre {
  font-size: 13px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase;
  color: var(--titre); margin: 0 0 var(--espace-2);
}
.titre-section {
  font-size: clamp(26px, 3.4vw, 38px); font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  color: var(--titre); max-width: 22ch;
}
.centre .titre-section { margin: 0 auto; max-width: 30ch; }
.titre-section::after {
  content: ""; display: block; width: 48px; height: 2px; background: var(--filet-signature);
  margin-top: var(--espace-3);
  transform-origin: left; transition: transform .6s var(--courbe) .2s;
}
.centre .titre-section::after { transform-origin: center; }
.revele:not(.visible) .titre-section::after { transform: scaleX(0); }
.lien { color: var(--lien); text-underline-offset: 3px; text-decoration-thickness: 1px; }
.lien:hover { text-decoration-thickness: 2px; }
.dore { color: var(--dore-satine); }

/* ---------- Boutons ---------- */
.bouton {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 50px; padding: 12px 26px;
  border: 1px solid transparent; border-radius: var(--arrondi-sm);
  font-size: 14px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; text-decoration: none;
  transition: background-color .3s var(--courbe), color .3s var(--courbe), border-color .3s var(--courbe), transform .3s var(--courbe), box-shadow .3s var(--courbe);
}
.bouton .ico { width: 18px; height: 18px; flex: none; }
.bouton--principal { background: var(--bouton-fond); color: var(--bouton-texte); }
[data-theme="nuit"] .bouton--principal:hover { background: var(--dore-clair); box-shadow: 0 10px 30px -12px rgba(212, 175, 55, .6); }
[data-theme="ivoire"] .bouton--principal:hover { background: var(--violet-profond); box-shadow: 0 10px 30px -12px rgba(10, 15, 44, .5); }
.bouton--principal:hover { transform: translateY(-2px); }
.bouton--secondaire { background: transparent; color: var(--texte); border-color: var(--filet-signature); }
.bouton--secondaire:hover { border-color: var(--dore-clair); color: var(--lien); transform: translateY(-2px); }
[data-theme="ivoire"] .bouton--secondaire:hover { color: var(--violet-profond); border-color: var(--violet-profond); }

.lien-fleche {
  display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding-top: var(--espace-3);
  color: var(--lien); font-weight: 700; font-size: 14px; letter-spacing: 1.5px; text-transform: uppercase; text-decoration: none;
}
.lien-fleche svg { width: 18px; height: 18px; transition: transform .3s var(--courbe); }
.lien-fleche:hover svg { transform: translateX(5px); }

.rond {
  display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0;
  border-radius: var(--arrondi-cercle); border: 1px solid var(--filet); background: transparent; color: var(--texte);
  transition: border-color .3s, color .3s, background-color .3s;
}
.rond svg { width: 20px; height: 20px; }
.rond:hover { border-color: var(--dore-satine); color: var(--dore-satine); }

.pastille {
  display: inline-grid; place-items: center; flex: none;
  width: 44px; height: 44px; border-radius: var(--arrondi-cercle);
  background: var(--pastille-fond); color: var(--accent);
}
.pastille svg { width: 22px; height: 22px; }

/* ---------- En-tête ---------- */
.entete {
  position: fixed; inset: 0 0 auto; z-index: 50;
  background: transparent; color: var(--ivoire);
  transition: background-color .3s var(--courbe), box-shadow .3s var(--courbe), backdrop-filter .3s;
}
.entete__barre { display: flex; align-items: center; justify-content: space-between; gap: var(--espace-3); height: var(--entete-h); transition: height .3s var(--courbe); }
.entete.reduit { background: rgba(10, 15, 44, .88); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: 0 1px 0 rgba(212, 175, 55, .18); }
.entete.reduit .entete__barre { height: 64px; }

.marque { display: flex; align-items: center; gap: 12px; text-decoration: none; flex: none; }
.marque__mono { height: 52px; width: auto; transition: height .3s var(--courbe); }
.marque__nom { height: 30px; width: auto; transition: height .3s var(--courbe), opacity .3s; }
.entete.reduit .marque__mono { height: 40px; }
.entete.reduit .marque__nom { height: 26px; }

.menu { display: flex; align-items: center; gap: var(--espace-4); }
.menu__liste { display: flex; gap: 28px; }
.menu__lien {
  position: relative; display: inline-block; padding: 6px 0;
  font-size: 14px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; text-decoration: none;
  color: var(--ivoire); transition: color .3s var(--courbe);
}
.menu__lien::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--dore-satine);
  transform: scaleX(0); transition: transform .3s var(--courbe);
}
.menu__lien:hover, .menu__lien.actif { color: var(--dore-clair); }
.menu__lien:hover::after, .menu__lien.actif::after { transform: scaleX(1); }
.menu__rdv { min-height: 44px; padding: 10px 20px; font-size: 13px; border-color: var(--ivoire); }

.burger { display: none; position: relative; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; z-index: 2; }
.burger span {
  position: absolute; left: 10px; width: 24px; height: 2px; background: var(--ivoire); border-radius: 2px;
  transition: transform .3s var(--courbe), opacity .2s, top .3s var(--courbe);
}
.burger span:nth-child(1) { top: 14px; }
.burger span:nth-child(2) { top: 21px; }
.burger span:nth-child(3) { top: 28px; }
.burger[aria-expanded="true"] span:nth-child(1) { top: 21px; transform: rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.burger[aria-expanded="true"] span:nth-child(3) { top: 21px; transform: rotate(-45deg); }

@media (max-width: 1080px) {
  .menu__liste { gap: 20px; }
  .menu { gap: var(--espace-3); }
}
@media (max-width: 959px) {
  .burger { display: block; }
  .marque__nom { height: 26px; }
  .menu {
    position: fixed; inset: 0; z-index: 1;
    flex-direction: column; justify-content: center; align-items: flex-start; gap: var(--espace-4);
    padding: 96px var(--espace-4) var(--espace-4);
    background: var(--bleu-nuit);
    opacity: 0; visibility: hidden; transition: opacity .35s var(--courbe), visibility .35s;
  }
  .menu.ouvert { opacity: 1; visibility: visible; }
  .menu__liste { flex-direction: column; gap: var(--espace-2); }
  .menu__lien { font-size: 26px; letter-spacing: 3px; }
  .menu__liste li, .menu__rdv { opacity: 0; transform: translateY(16px); transition: opacity .4s var(--courbe), transform .4s var(--courbe); }
  .menu.ouvert .menu__liste li, .menu.ouvert .menu__rdv { opacity: 1; transform: none; }
  .menu.ouvert li:nth-child(1) { transition-delay: .08s; }
  .menu.ouvert li:nth-child(2) { transition-delay: .14s; }
  .menu.ouvert li:nth-child(3) { transition-delay: .2s; }
  .menu.ouvert li:nth-child(4) { transition-delay: .26s; }
  .menu.ouvert li:nth-child(5) { transition-delay: .32s; }
  .menu.ouvert li:nth-child(6) { transition-delay: .38s; }
  .menu.ouvert .menu__rdv { transition-delay: .46s; }
  .menu__rdv { width: 100%; min-height: 52px; font-size: 14px; }
  body.menu-ouvert { overflow: hidden; }
  /* le flou de l'en-tête enfermerait le panneau : on le retire menu ouvert */
  body.menu-ouvert .entete { -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--bleu-nuit); box-shadow: none; }
  .marque { position: relative; z-index: 2; }
  .heros__boutons .bouton { flex: 1 1 100%; }
}

/* ---------- Héros ---------- */
.heros {
  position: relative; overflow: hidden;
  min-height: min(100vh, 920px);
  display: flex; align-items: center;
  padding: calc(var(--entete-h) + var(--espace-5)) 0 var(--espace-5);
}
.heros__deco {
  position: absolute; width: 900px; height: 900px; left: -420px; bottom: -520px;
  fill: none; stroke: var(--nuit-eleve); stroke-width: 1.2; pointer-events: none;
}
.heros__grille { position: relative; display: grid; grid-template-columns: 1.15fr .85fr; align-items: center; gap: var(--espace-5); }
.heros__titre {
  font-size: clamp(36px, 5.2vw, 64px); font-weight: 700; letter-spacing: 2px; text-transform: uppercase; line-height: 1.08;
  color: var(--ivoire); margin-bottom: var(--espace-4);
}
.heros__titre .mot { display: inline-block; }
.heros__intro { font-size: 19px; color: var(--gris-perle); max-width: 36em; margin-bottom: var(--espace-4); }
.heros__boutons { display: flex; flex-wrap: wrap; gap: var(--espace-2); margin-bottom: var(--espace-4); }
.heros__reassurance { font-size: 13px; letter-spacing: .5px; color: var(--gris-perle); margin: 0; padding-top: var(--espace-3); border-top: 1px solid var(--surface-nuit); max-width: 36em; }

.portrait { position: relative; margin: 0 auto; width: min(440px, 100%); }
.portrait__photo {
  position: relative; z-index: 1; width: 100%; aspect-ratio: 4 / 5; object-fit: cover;
  border-radius: var(--arrondi-cercle) var(--arrondi-cercle) var(--arrondi-md) var(--arrondi-md);
  box-shadow: 0 40px 80px -40px rgba(0, 0, 0, .7);
}
.portrait__cercle {
  position: absolute; z-index: 0; width: 108%; left: -2%; top: -6%;
  fill: none; stroke: var(--dore-satine); stroke-width: 1.4;
  overflow: visible;
}
.portrait__cercle circle { stroke-dasharray: 1; stroke-dashoffset: 1; transform: rotate(-90deg); transform-origin: center; }
.charge .portrait__cercle circle { animation: tracer 1.8s var(--courbe) .5s forwards; }
@keyframes tracer { to { stroke-dashoffset: 0; } }
.portrait__carte {
  position: absolute; z-index: 2; left: -28px; bottom: 36px;
  display: flex; flex-direction: column; gap: 2px;
  padding: 14px 20px 14px 18px; border-left: 2px solid var(--dore-satine);
  background: var(--nuit-eleve); border-radius: 0 var(--arrondi-sm) var(--arrondi-sm) 0;
  box-shadow: 0 20px 40px -20px rgba(0, 0, 0, .6);
}
.portrait__nom { font-weight: 700; letter-spacing: 2px; text-transform: uppercase; font-size: 15px; color: var(--ivoire); }
.portrait__role { font-size: 13px; color: var(--gris-perle); }

.heros__suite {
  position: absolute; left: 50%; bottom: 24px; transform: translateX(-50%);
  width: 26px; height: 42px; border: 1px solid var(--surface-nuit); border-radius: 13px;
}
.heros__suite span {
  position: absolute; left: 50%; top: 8px; width: 2px; height: 8px; margin-left: -1px; background: var(--dore-satine); border-radius: 2px;
  animation: molette 2s var(--courbe) infinite;
}
@keyframes molette { 0% { opacity: 0; transform: translateY(0); } 30% { opacity: 1; } 100% { opacity: 0; transform: translateY(14px); } }

/* Cascade d'entrée du héros */
.cascade { opacity: 0; transform: translateY(16px); }
.charge .cascade { animation: monter .6s var(--courbe) forwards; animation-delay: calc(var(--i) * 80ms + 100ms); }
@keyframes monter { to { opacity: 1; transform: none; } }

@media (max-width: 959px) {
  .heros { min-height: 0; padding-top: calc(var(--entete-h) + var(--espace-3)); }
  .heros__grille { grid-template-columns: 1fr; gap: var(--espace-4); }
  .portrait { order: -1; width: min(300px, 72vw); }
  .portrait__carte { left: -12px; bottom: 20px; padding: 10px 14px; }
  .heros__suite { display: none; }
}

/* ---------- Apparition au défilement ---------- */
.revele { opacity: 0; transform: translateY(16px); transition: opacity .6s var(--courbe), transform .6s var(--courbe); transition-delay: var(--delai, 0ms); }
.revele.visible { opacity: 1; transform: none; }
.sans-js .revele, .sans-js .cascade { opacity: 1; transform: none; }

/* ---------- Grilles et cartes ---------- */
.grille { display: grid; gap: var(--espace-3); margin-top: var(--espace-5); }
.grille--4 { grid-template-columns: repeat(4, 1fr); }
.grille--3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1080px) { .grille--4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 959px) { .grille--3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .grille--4, .grille--3 { grid-template-columns: 1fr; } }

.carte {
  position: relative; display: flex; flex-direction: column;
  padding: var(--espace-4) var(--espace-4) var(--espace-4);
  background: var(--fond-carte); border-radius: var(--arrondi-md);
  transition: transform .4s var(--courbe), box-shadow .4s var(--courbe), opacity .6s var(--courbe);
}
.carte::before {
  content: ""; position: absolute; left: var(--espace-4); right: var(--espace-4); top: 0; height: 2px;
  background: var(--filet-signature); opacity: .45; transform-origin: left;
  transition: opacity .4s var(--courbe), left .4s var(--courbe), right .4s var(--courbe);
}
.carte:hover { transform: translateY(-6px); }
.carte:hover::before { opacity: 1; left: 0; right: 0; }
[data-theme="ivoire"] .carte:hover { box-shadow: 0 24px 48px -28px rgba(10, 15, 44, .35); }
[data-theme="nuit"] .carte:hover { box-shadow: 0 24px 48px -28px rgba(0, 0, 0, .8); }
.carte .pastille { margin-bottom: var(--espace-3); }
.grille--4 .carte { padding: var(--espace-4) 28px; }
.grille--4 .carte::before { left: 28px; right: 28px; }
.grille--4 .carte h3 { font-size: 18px; }
.carte h3 { font-size: 19px; letter-spacing: 1px; margin-bottom: 12px; }
.carte p { color: var(--texte-secondaire); margin-bottom: 0; }
@media (max-width: 640px) { .carte { padding: var(--espace-3); } .carte::before { left: var(--espace-3); right: var(--espace-3); } }

.puces li { position: relative; padding-left: 20px; margin-top: 8px; color: var(--texte-secondaire); }
.puces li::before { content: ""; position: absolute; left: 2px; top: .7em; width: 6px; height: 6px; border-radius: 50%; border: 1.5px solid var(--accent); }
.carte p + .puces { margin-top: var(--espace-2); }

/* ---------- Cabinet ---------- */
.cabinet__entete { display: grid; grid-template-columns: .8fr 1.2fr; gap: var(--espace-5); align-items: start; }
.cabinet__intro { font-size: 18px; color: var(--texte-secondaire); padding-top: 34px; }
.cabinet__intro p:last-child { margin: 0; color: var(--texte); }
.engagements { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px var(--espace-3); margin-top: var(--espace-5); padding-top: var(--espace-4); border-top: 1px solid var(--filet); }
.engagements li { display: flex; align-items: flex-start; gap: 10px; color: var(--texte-secondaire); font-size: 15px; }
.engagements .ico { margin-top: 3px; }
.engagements .ico { width: 18px; height: 18px; color: var(--accent); flex: none; }
@media (max-width: 959px) {
  .cabinet__entete { grid-template-columns: 1fr; gap: var(--espace-3); }
  .cabinet__intro { padding-top: 0; }
  .engagements { grid-template-columns: 1fr; }
}

/* ---------- Vos besoins ---------- */
.questions { margin: var(--espace-4) auto 0; text-align: center; }
.questions__label { font-size: 14px; color: var(--gris-perle); letter-spacing: 1px; margin-bottom: 6px; }
.questions__liste { position: relative; height: 3.4em; font-size: clamp(18px, 2.2vw, 23px); font-style: italic; color: var(--ivoire); }
.questions__liste li {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  opacity: 0; transform: translateY(10px); transition: opacity .6s var(--courbe), transform .6s var(--courbe);
}
.questions__liste li.actif { opacity: 1; transform: none; }
.profils { margin-top: var(--espace-4); }
.carte--profil h3 { font-size: 21px; }
.carte--profil .puces li { color: var(--gris-perle); }

/* Mise en évidence des solutions depuis « Voir les solutions » */
.carte--expertise.mise-en-avant { box-shadow: 0 0 0 2px var(--dore-base), 0 24px 48px -28px rgba(10, 15, 44, .35); }
.carte--expertise.mise-en-avant::before { opacity: 1; left: 0; right: 0; }
.grille.filtre .carte--expertise:not(.mise-en-avant) { opacity: .55; }

/* ---------- Solutions ---------- */
.vigilance {
  max-width: 820px; margin: var(--espace-4) auto 0; text-align: center;
  font-size: 14px; color: var(--texte-secondaire);
}
.appel {
  display: flex; align-items: center; justify-content: space-between; gap: var(--espace-3); flex-wrap: wrap;
  margin-top: var(--espace-5); padding: var(--espace-4);
  border: 1px solid var(--filet); border-left: 2px solid var(--filet-signature); border-radius: var(--arrondi-md);
}
.appel p { margin: 0; font-size: 19px; }

/* ---------- Partenaires (défilement infini) ---------- */
.partenaires { padding: var(--espace-5) 0; border-top: 1px solid var(--nuit-eleve); border-bottom: 1px solid var(--nuit-eleve); }
.partenaires .surtitre { margin-bottom: var(--espace-4); }
.defile {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.defile__piste { display: flex; gap: 20px; width: max-content; animation: defiler 60s linear infinite; }
.defile:hover .defile__piste, .defile:focus-within .defile__piste { animation-play-state: paused; }
@keyframes defiler { to { transform: translateX(calc(-50% - 10px)); } }
.defile__piste li {
  flex: none; display: grid; place-items: center;
  width: 220px; height: 110px; padding: 10px;
  background: var(--ivoire); border-radius: var(--arrondi-md);
  transition: transform .4s var(--courbe), box-shadow .4s var(--courbe);
}
.defile__piste img { width: 200px; height: 90px; object-fit: contain; transition: filter .4s var(--courbe), opacity .4s var(--courbe); }
@media (hover: hover) {
  .defile__piste img { filter: grayscale(1); opacity: .72; }
  .defile__piste li:hover img { filter: none; opacity: 1; }
  .defile__piste li:hover { transform: translateY(-4px); box-shadow: 0 16px 30px -18px rgba(0, 0, 0, .8); }
}
@media (max-width: 640px) {
  .defile__piste { gap: 14px; animation-duration: 45s; }
  @keyframes defiler { to { transform: translateX(calc(-50% - 7px)); } }
  .defile__piste li { width: 168px; height: 84px; }
  .defile__piste img { width: 150px; height: 68px; }
}

/* ---------- Formation ---------- */
.formation { display: grid; grid-template-columns: 1.1fr .9fr; gap: var(--espace-5); align-items: center; }
.formation__texte p { color: var(--texte-secondaire); max-width: 34em; }
.formation__texte .titre-section { margin-bottom: var(--espace-4); }
.formation__texte .bouton { margin-top: var(--espace-2); }
.themes { display: grid; gap: var(--espace-2); }
.theme {
  display: flex; gap: var(--espace-3); align-items: flex-start;
  padding: var(--espace-3); background: var(--fond-carte); border-radius: var(--arrondi-md);
  border-left: 2px solid var(--filet-signature);
}
.theme strong { display: block; font-size: 18px; margin-bottom: 4px; }
.theme span:last-child { color: var(--texte-secondaire); }
@media (max-width: 959px) { .formation { grid-template-columns: 1fr; } }

/* ---------- Avis (carrousel) ---------- */
.carrousel { max-width: 860px; margin: var(--espace-5) auto 0; }
.carrousel__fenetre { overflow: hidden; }
.carrousel__piste { display: flex; transition: transform .6s var(--courbe); }
.avis {
  flex: 0 0 100%; padding: 0 var(--espace-2); text-align: center;
}
.avis__etoiles { display: flex; justify-content: center; gap: 4px; margin-bottom: var(--espace-3); color: var(--dore-satine); }
.avis__etoiles svg { width: 20px; height: 20px; }
.avis__etoiles use { fill: currentColor; stroke: none; }
.avis blockquote { margin: 0 auto var(--espace-3); max-width: 40em; font-size: clamp(18px, 2vw, 21px); font-style: italic; line-height: 1.6; }
.avis blockquote::before { content: "\201C"; display: block; font-size: 64px; line-height: .6; color: var(--dore-satine); font-style: normal; margin-bottom: var(--espace-2); }
.avis__auteur { font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; font-size: 14px; }
.avis__date { color: var(--gris-perle); font-size: 13px; }
.carrousel__commandes { display: flex; align-items: center; justify-content: center; gap: var(--espace-3); margin-top: var(--espace-4); }
.carrousel__points { display: flex; gap: 10px; }
.carrousel__points button {
  width: 10px; height: 10px; padding: 0; border-radius: 50%; border: 1px solid var(--dore-satine); background: transparent;
  transition: background-color .3s, transform .3s;
}
.carrousel__points button[aria-selected="true"] { background: var(--dore-satine); transform: scale(1.2); }
.avis__liens { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: var(--espace-3); margin-top: var(--espace-5); }
.avis__liens .ico { width: 16px; height: 16px; }

/* ---------- Contact ---------- */
.contact__chapo { color: var(--texte-secondaire); max-width: 40em; margin-top: var(--espace-3); }
.contact { display: grid; grid-template-columns: 1.35fr .9fr; gap: var(--espace-5); margin-top: var(--espace-4); align-items: start; }
@media (max-width: 959px) { .contact { grid-template-columns: 1fr; gap: var(--espace-4); } }

.formulaire { display: grid; gap: var(--espace-3); }
.champs-2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--espace-3); }
@media (max-width: 640px) { .champs-2 { grid-template-columns: 1fr; } }
.champ { display: grid; gap: 6px; }
.champ label { font-size: 14px; font-weight: 700; letter-spacing: .5px; }
.champ input, .champ select, .champ textarea {
  width: 100%; min-height: 50px; padding: 12px 14px;
  background: #fff; color: var(--bleu-nuit);
  border: 1px solid var(--ligne-ivoire); border-radius: var(--arrondi-sm);
  transition: border-color .2s, box-shadow .2s;
}
.champ select { appearance: none; padding-right: 40px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233A0F5E' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; background-size: 20px; }
.champ textarea { resize: vertical; min-height: 140px; }
.champ input:focus, .champ select:focus, .champ textarea:focus { outline: none; border-color: var(--violet-profond); box-shadow: 0 0 0 3px rgba(58, 15, 94, .12); }
.champ.erreur input, .champ.erreur textarea { border-color: #9B2C2C; }
.champ__erreur { font-size: 13px; color: #9B2C2C; }
.piege { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.case { display: flex; gap: 12px; align-items: flex-start; font-size: 15px; color: var(--texte-secondaire); cursor: pointer; }
.case input { flex: none; width: 20px; height: 20px; margin-top: 3px; accent-color: var(--violet-profond); }
.case.erreur { color: #9B2C2C; }
.formulaire__bas { display: flex; align-items: center; gap: var(--espace-3); flex-wrap: wrap; }
.formulaire__note { margin: 0; font-size: 13px; color: var(--texte-secondaire); }
.formulaire__message { margin: 0; padding: var(--espace-2) var(--espace-3); border-radius: var(--arrondi-sm); border-left: 2px solid var(--violet-profond); background: var(--ivoire-sable); }
.formulaire__message.erreur { border-left-color: #9B2C2C; }
.formulaire button[disabled] { opacity: .6; cursor: wait; }

.coordonnees { display: grid; gap: var(--espace-4); }
.coordonnees__carte {
  padding: var(--espace-4); border-radius: var(--arrondi-md);
  background: var(--bleu-nuit); color: var(--ivoire);
  --bouton-fond: var(--dore-satine); --bouton-texte: var(--bleu-nuit);
}
.coordonnees__carte h3 { font-size: 19px; letter-spacing: 1px; color: var(--dore-satine); margin-bottom: 10px; }
.coordonnees__carte p { color: var(--gris-perle); }
.coordonnees__carte .bouton:hover { background: var(--dore-clair); box-shadow: none; }
.coordonnees__liste { display: grid; gap: var(--espace-3); }
.coordonnees__liste li { display: flex; align-items: center; gap: var(--espace-2); }
.coordonnees__liste a { color: var(--texte); font-weight: 700; text-decoration: none; overflow-wrap: anywhere; }
.coordonnees__liste a:hover { color: var(--violet-profond); text-decoration: underline; text-underline-offset: 3px; }
.coordonnees__liste span:last-child { color: var(--texte-secondaire); }

/* ---------- Pied de page ---------- */
.pied { --fond: var(--nuit-profond); padding: var(--espace-5) 0 var(--espace-4); font-size: 15px; }
.pied__grille { display: grid; grid-template-columns: 1.4fr .8fr 1fr; gap: var(--espace-5); padding-bottom: var(--espace-4); border-bottom: 1px solid var(--surface-nuit); }
.pied__marque img { width: 150px; margin-bottom: var(--espace-3); }
.pied__marque p { color: var(--gris-perle); max-width: 30em; }
.pied__titre { font-size: 13px; letter-spacing: 3px; text-transform: uppercase; color: var(--dore-satine); margin-bottom: var(--espace-2); }
.pied ul li { margin-bottom: 8px; color: var(--gris-perle); }
.pied a { color: var(--ivoire); text-decoration: none; }
.pied a:hover { color: var(--dore-clair); }
.reseaux { display: flex; gap: 10px; margin-top: var(--espace-3); }
.reseaux a { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid var(--surface-nuit); border-radius: 50%; transition: border-color .3s, color .3s, transform .3s var(--courbe); }
.reseaux a:hover { border-color: var(--dore-satine); transform: translateY(-3px); }
.reseaux svg { width: 19px; height: 19px; }
.mentions { padding: var(--espace-4) 0; border-bottom: 1px solid var(--surface-nuit); font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 12px; font-weight: 300; line-height: 1.7; color: var(--gris-perle); }
.mentions p { margin-bottom: 8px; }
.mentions a { color: var(--gris-perle); text-decoration: underline; }
.pied__bas { display: flex; justify-content: space-between; flex-wrap: wrap; gap: var(--espace-2); padding-top: var(--espace-3); font-size: 14px; color: var(--gris-perle); }
.pied__bas p { margin: 0; }
.pied__bas ul { display: flex; flex-wrap: wrap; gap: var(--espace-3); }
.pied__bas li { margin: 0; }
@media (max-width: 959px) { .pied__grille { grid-template-columns: 1fr 1fr; gap: var(--espace-4); } .pied__marque { grid-column: 1 / -1; } }
@media (max-width: 560px) { .pied__grille { grid-template-columns: 1fr; } }

/* ---------- Haut de page ---------- */
.haut {
  position: fixed; right: 20px; bottom: 20px; z-index: 40;
  display: grid; place-items: center; width: 48px; height: 48px; padding: 0;
  border-radius: 50%; border: 1px solid var(--dore-satine); background: rgba(10, 15, 44, .9); color: var(--dore-satine);
  opacity: 0; visibility: hidden; transform: translateY(12px);
  transition: opacity .3s var(--courbe), transform .3s var(--courbe), visibility .3s, background-color .3s, color .3s;
}
.haut svg { width: 22px; height: 22px; }
.haut.visible { opacity: 1; visibility: visible; transform: none; }
.haut:hover { background: var(--dore-satine); color: var(--bleu-nuit); }

/* ---------- Fenêtre de rendez-vous ---------- */
.agenda {
  width: min(880px, calc(100vw - 32px)); max-height: calc(100vh - 32px); padding: 0;
  border: 0; border-radius: var(--arrondi-md); background: var(--ivoire); color: var(--bleu-nuit);
  box-shadow: 0 40px 100px -20px rgba(0, 0, 0, .6);
}
.agenda[open] { display: flex; flex-direction: column; animation: apparaitre .35s var(--courbe); }
.agenda::backdrop { background: rgba(5, 8, 28, .75); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
@keyframes apparaitre { from { opacity: 0; transform: translateY(16px) scale(.98); } }
.agenda__tete { display: flex; align-items: center; justify-content: space-between; gap: var(--espace-2); padding: var(--espace-2) var(--espace-2) var(--espace-2) var(--espace-3); background: var(--bleu-nuit); color: var(--ivoire); }
.agenda__tete h2 { font-size: 16px; letter-spacing: 2px; text-transform: uppercase; color: var(--dore-satine); }
.agenda__tete .rond { color: var(--ivoire); border-color: var(--surface-nuit); }
.agenda__corps { position: relative; flex: 1 1 auto; height: min(680px, calc(100vh - 150px)); background: #fff; }
.agenda__corps iframe { display: block; width: 100%; height: 100%; border: 0; }
.agenda__chargement { position: absolute; inset: 0; display: grid; place-items: center; margin: 0; color: var(--gris-ardoise); }
.agenda__note { margin: 0; padding: 10px var(--espace-3); font-size: 13px; color: var(--gris-ardoise); border-top: 1px solid var(--ligne-ivoire); }
@media (max-width: 640px) {
  .agenda { width: 100vw; max-width: 100vw; height: 100%; max-height: 100%; border-radius: 0; margin: 0; }
  .agenda__corps { height: auto; flex: 1 1 0; }
}

/* ---------- Pages secondaires (mentions, confidentialité, 404) ---------- */
.page { padding: calc(var(--entete-h) + var(--espace-5)) 0 var(--espace-section); min-height: 70vh; }
.page .conteneur { max-width: 860px; }
.page h1 { font-size: clamp(28px, 4vw, 40px); letter-spacing: 2px; text-transform: uppercase; color: var(--titre); margin-bottom: var(--espace-2); }
.page h1::after { content: ""; display: block; width: 48px; height: 2px; background: var(--filet-signature); margin-top: var(--espace-3); }
.page h2 { font-size: 20px; letter-spacing: 1px; color: var(--titre); margin: var(--espace-4) 0 var(--espace-2); }
.page p, .page li { color: var(--texte-secondaire); }
.page ul { list-style: disc; padding-left: 1.3em; margin-bottom: 1em; }
.page a { color: var(--lien); }
.page .date { font-size: 14px; }
.a-completer { background: rgba(197, 142, 37, .18); padding: 0 4px; border-radius: 2px; }

/* ---------- Mouvement réduit ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; transition-delay: 0ms !important; }
  .cascade, .revele { opacity: 1; transform: none; }
  .portrait__cercle circle { stroke-dashoffset: 0; }
  .defile { -webkit-mask-image: none; mask-image: none; }
  .defile__piste { width: auto; flex-wrap: wrap; justify-content: center; animation: none; padding: 0 var(--espace-3); }
  .defile__piste li[aria-hidden="true"] { display: none; }
  .questions__liste { height: auto; }
  .questions__liste li { position: static; opacity: 1; transform: none; }
  .questions__liste li:not(:first-child) { display: none; }
}
.avis__vide { max-width: 36em; margin: var(--espace-4) auto 0; color: var(--gris-perle); }
