/* ==========================================================
   MEELHYPNOSE — feuille de styles unique
   Traduction fidèle de la maquette figée (index.html / l-alliance.html).
   Ne pas réinterpréter : toute valeur vient de la maquette.

   Seule différence assumée avec la maquette :
   - letter-spacing converti de em en px (valeur x taille de police)
   - menu mobile en <details> (la maquette masquait simplement le menu)
   - styles blog / FAQ / 404, absents de la maquette, calqués sur ses tokens
   ========================================================== */

/* ==========================================================
   POLICES AUTO-HEBERGEES — RGPD + performance
   Fichiers attendus dans assets/fonts/ (voir README).
   ========================================================== */
@font-face{
  font-family:'Playfair Display';
  font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/playfair-display-v37-latin-regular.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Playfair Display';
  font-style:normal;font-weight:500;font-display:swap;
  src:url('../fonts/playfair-display-v37-latin-500.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Playfair Display';
  font-style:italic;font-weight:400;font-display:swap;
  src:url('../fonts/playfair-display-v37-latin-italic.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Mulish';
  font-style:normal;font-weight:300;font-display:swap;
  src:url('../fonts/mulish-v13-latin-300.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Mulish';
  font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/mulish-v13-latin-regular.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Mulish';
  font-style:normal;font-weight:600;font-display:swap;
  src:url('../fonts/mulish-v13-latin-600.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

/* ==========================================================
   TOKENS
   QUATRE paliers de descente, volontairement écartés pour
   que le passage de l'un à l'autre soit perceptible.
   NE PAS LES RAPPROCHER.
   ========================================================== */
:root{
  --p1:#FAF3EC;   /* surface   — le plus clair */
  --p2:#F1E1D2;   /* grès      — le fond du logo */
  --p3:#DFCBB4;   /* sable     — nettement plus soutenu */
  --p4:#2E433A;   /* sous-bois — la profondeur */

  --feuillage:#414A35;
  --brume:#859990;
  --or:#C5AD81;
  --rose:#E6A591;
  --rose-fonce:#D98F79;
  --clair:#F8F1EA;

  --display:'Playfair Display',Georgia,serif;
  --body:'Mulish',system-ui,-apple-system,sans-serif;
  --max:1140px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  margin:0;
  font-family:var(--body);
  font-size:17px;
  line-height:1.75;
  font-weight:300;
  color:var(--p4);
  background:var(--p2);
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,p,ul,figure,blockquote,dl,dd{margin:0}
ul{padding:0;list-style:none}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--p4);outline-offset:3px;border-radius:2px}
.sur-fond-profond :focus-visible{outline-color:var(--or)}

.wrap{max-width:var(--max);margin:0 auto;padding:0 26px}

/* Accessibilité — lien d'évitement */
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:999;
  background:var(--p4);color:var(--clair);
  padding:12px 20px;font-size:14px;text-decoration:none;
}
.skip-link:focus{left:0}

/* ==========================================================
   TYPOGRAPHIE
   letter-spacing en px uniquement (voir en-tête de fichier)
   ========================================================== */
.surtitre{
  font-size:12.5px;font-weight:600;letter-spacing:2.75px;
  text-transform:uppercase;color:var(--feuillage);
}
.sur-fond-profond .surtitre{color:var(--or)}

.t1{font-family:var(--display);font-weight:400;font-size:clamp(36px,5.2vw,58px);line-height:1.14;color:var(--feuillage)}
.t2{font-family:var(--display);font-weight:400;font-size:clamp(29px,3.7vw,42px);line-height:1.2;color:var(--feuillage)}
.t3{font-family:var(--display);font-weight:500;font-size:22px;line-height:1.3;color:var(--feuillage)}
.t1 em,.t2 em{font-style:italic;color:var(--p4)}
.sur-fond-profond .t1,.sur-fond-profond .t2,.sur-fond-profond .t3{color:var(--clair)}
.sur-fond-profond .t2 em{color:var(--rose)}
.mesure{max-width:60ch}
.chapo{font-size:18.5px;opacity:.9}
/* Utilitaires reprenant à l'identique les styles en ligne de la maquette */
.bloc-intro{max-width:62ch}
.bloc-intro-large{max-width:66ch}
.espace-titre{margin-top:16px}
.espace-chapo{margin-top:26px}
.espace-texte{margin-top:20px}
.sur-fond-profond{color:var(--clair)}
.sur-fond-profond .chapo{opacity:.86}

/* ==========================================================
   BOUTONS — un seul traitement de survol
   ========================================================== */
.btn{
  display:inline-block;font-size:15px;font-weight:600;
  letter-spacing:.75px;text-decoration:none;
  padding:15px 32px;border-radius:2px;
  transition:background-color .25s,border-color .25s;
}
.btn-plein{background:var(--rose);color:var(--p4);border:1px solid var(--rose)}
.btn-plein:hover{background:var(--rose-fonce);border-color:var(--rose-fonce)}
.btn-vide{background:transparent;color:var(--feuillage);border:1.5px solid var(--feuillage)}
.btn-vide:hover{background:rgba(65,74,53,.07)}
.btn-clair{background:transparent;color:var(--clair);border:1.5px solid rgba(248,241,234,.5)}
.btn-clair:hover{border-color:var(--clair)}
.btn-sans-retour{white-space:nowrap}
.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}
.mention-tarif{margin-top:18px;font-size:14px;opacity:.72}

/* ==========================================================
   EN-TETE
   ========================================================== */
.entete{position:sticky;top:0;z-index:50}
.coords{background:var(--p4);color:var(--clair);font-size:13.5px}
.coords .wrap{display:flex;justify-content:center;gap:10px 26px;flex-wrap:wrap;padding:11px 26px}
.coords a{text-decoration:none;opacity:.92}
.coords a:hover{opacity:1}
.nav{background:var(--p2);border-bottom:1px solid rgba(133,153,144,.35)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:14px;padding-bottom:14px;min-height:96px}
.marque{display:flex;align-items:center;line-height:0;text-decoration:none;flex-shrink:0}
.marque img{height:68px;width:auto;display:block;max-width:none}
@media (max-width:900px){.marque img{height:58px}}
@media (max-width:640px){
  .nav .wrap{min-height:76px;padding-top:10px;padding-bottom:10px}
  .marque img{height:52px}
}
.menu{display:flex;gap:26px;font-size:14.5px;letter-spacing:.87px;text-transform:uppercase}
.menu a{text-decoration:none;color:var(--feuillage);padding-bottom:3px;border-bottom:1px solid transparent;transition:border-color .25s}
.menu a:hover{border-bottom-color:var(--or)}
.menu .current-menu-item > a,
.menu .current_page_item > a{border-bottom-color:var(--or)}

/* ==========================================================
   MENU MOBILE — <details> natif, aucun JavaScript.
   Retour d'expérience : LiteSpeed avait cassé un menu mobile
   en différant son JS. Ce qui n'existe pas ne peut pas être cassé.
   ========================================================== */
.menu-mobile{display:none;position:relative}
.menu-mobile > summary{
  list-style:none;cursor:pointer;
  display:flex;align-items:center;gap:9px;
  font-size:12.5px;font-weight:600;letter-spacing:2.5px;
  text-transform:uppercase;color:var(--feuillage);
  padding:12px 4px;min-height:44px;
}
.menu-mobile > summary::-webkit-details-marker{display:none}
.menu-mobile > summary::marker{content:''}
.menu-mobile-barres{
  display:inline-flex;flex-direction:column;justify-content:center;gap:5px;
  width:22px;height:16px;
}
.menu-mobile-barres span{display:block;height:1.5px;width:100%;background:var(--feuillage)}
.menu-mobile[open] > summary .menu-mobile-barres span:nth-child(2){opacity:.35}
.menu-mobile-panneau{
  position:absolute;right:0;top:calc(100% + 10px);
  min-width:238px;
  background:var(--p1);
  border:1px solid rgba(133,153,144,.45);
  border-radius:3px;
  box-shadow:0 10px 30px rgba(46,67,58,.14);
  padding:10px 0;
}
.menu-mobile-panneau ul{display:flex;flex-direction:column}
.menu-mobile-panneau a{
  display:block;padding:13px 24px;
  font-size:14.5px;letter-spacing:.87px;text-transform:uppercase;
  color:var(--feuillage);text-decoration:none;
}
.menu-mobile-panneau a:hover{background:rgba(197,173,129,.16)}
.menu-mobile-panneau .current-menu-item > a,
.menu-mobile-panneau .current_page_item > a{color:var(--p4);font-weight:600}
@media (max-width:900px){
  .menu{display:none}
  .menu-mobile{display:block}
}

/* ==========================================================
   RYTHME VERTICAL
   ========================================================== */
.sec{padding:140px 0}
.sec-1{background:var(--p1)}
.sec-2{background:var(--p2)}
.sec-3{background:var(--p3)}
.sec-4{background:var(--p4)}

.fil{
  width:1px;height:74px;margin:0 auto;
  background-image:linear-gradient(var(--or) 3px,transparent 3px);
  background-size:1px 11px;
}
.fil-court{height:44px;margin:0 0 26px}

/* ==========================================================
   HERO
   ========================================================== */
.hero{background:var(--p1)}
/* Logo d'ouverture — centré, au-dessus de la grille du hero.
   Même fichier que la navigation : aucun octet supplémentaire à charger. */
.hero-logo{text-align:center;padding-top:64px}
.hero-logo img{height:110px;width:auto;margin:0 auto;max-width:100%}
.hero-logo + .hero-grille{padding-top:56px}
@media (max-width:900px){
  .hero-logo{padding-top:44px}
  .hero-logo img{height:92px}
  .hero-logo + .hero-grille{padding-top:34px}
}
@media (max-width:640px){
  .hero-logo{padding-top:34px}
  .hero-logo img{height:76px}
  .hero-logo + .hero-grille{padding-top:26px}
}
.hero-grille{
  display:grid;grid-template-columns:1.08fr .92fr;
  gap:64px;align-items:center;
  padding:108px 0 124px;
}
.hero-grille .t1{margin-top:26px}
.hero-sous-titre{
  font-family:var(--display);font-style:italic;
  font-size:clamp(20px,2.8vw,28px);
  color:var(--p4);opacity:.82;
  margin-top:20px;line-height:1.4;
}
.hero-grille .chapo{margin-top:32px}
.hero-visuel{text-align:center;margin:0}
.hero-visuel img{
  width:clamp(220px,60vw,420px);
  aspect-ratio:1;
  height:auto;
  margin:0 auto;
  border-radius:50%;
}
.hero-visuel figcaption{
  margin-top:24px;font-family:var(--body);
  font-size:12.5px;letter-spacing:2px;text-transform:uppercase;
  color:var(--feuillage);opacity:.85;
}

/* ==========================================================
   ANIMATION UNIQUE — le marquee des motifs.
   Le hero est statique. prefers-reduced-motion respecté.
   ========================================================== */
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
}

/* ==========================================================
   MARQUEE — bande défilante des motifs de consultation
   ========================================================== */
.marquee-section{
  background:var(--p2);
  overflow:hidden;
  border-bottom:1px solid rgba(133,153,144,.28);
}
.marquee-wrapper{
  overflow:hidden;
  -webkit-mask-image:linear-gradient(to right,transparent 0%,black 9%,black 91%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0%,black 9%,black 91%,transparent 100%);
  padding:40px 0;
}
.marquee-track{
  display:flex;
  width:max-content;
  animation:marquee-scroll 36s linear infinite;
}
.marquee-track:hover{animation-play-state:paused}
@keyframes marquee-scroll{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
.marquee-set{
  display:flex;gap:64px;flex-shrink:0;
  padding-right:64px;align-items:center;
}
.marquee-item{
  display:flex;flex-direction:column;align-items:center;
  gap:15px;min-width:104px;
}
.marquee-item svg{width:54px;height:54px;flex-shrink:0}
.marquee-item span{
  font-size:11px;font-weight:600;letter-spacing:1.98px;
  text-transform:uppercase;color:var(--feuillage);opacity:.75;
  text-align:center;white-space:nowrap;
}

/* ==========================================================
   BARRE DE REASSURANCE
   ========================================================== */
.reassurance{background:var(--p4);padding:26px 0}
.reassurance .wrap{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:0}
.reassurance-item{
  display:flex;align-items:center;gap:14px;
  padding:10px 44px;color:var(--clair);
}
.reassurance-item+.reassurance-item{border-left:1px solid rgba(197,173,129,.35)}
.reassurance-val{font-family:var(--display);font-size:23px;color:var(--or);line-height:1}
.reassurance-label{font-size:12px;letter-spacing:1.44px;text-transform:uppercase;opacity:.82;line-height:1.45}
@media (max-width:768px){
  .reassurance .wrap{flex-direction:column}
  .reassurance-item{padding:11px 16px;width:100%;justify-content:center}
  .reassurance-item+.reassurance-item{border-left:none;border-top:1px solid rgba(197,173,129,.22)}
}

/* ==========================================================
   TEASER QUI SUIS-JE
   ========================================================== */
.teaser{max-width:66ch}

/* ==========================================================
   MA PRATIQUE — les deux approches
   ========================================================== */
.domaines{display:flex;flex-direction:column;gap:24px;margin-top:56px}
.domaine-carte{
  border:1px solid rgba(133,153,144,.5);border-radius:3px;
  padding:44px 40px 42px;background:var(--p1);
}
.domaine-entete{
  display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;
  margin-bottom:24px;
}
.domaine-carte h3{
  font-family:var(--display);font-size:27px;font-weight:400;
  color:var(--feuillage);margin:0;
}
.domaine-carte h3 em{font-style:italic;color:var(--p4)}
.domaine-carte p{font-size:16.5px;line-height:1.78;opacity:.88;margin-bottom:16px;max-width:68ch}
.domaine-carte p:last-of-type{margin-bottom:0}
.domaine-badge{
  font-size:11px;font-weight:600;letter-spacing:2px;text-transform:uppercase;
  color:var(--or);background:var(--p4);padding:6px 15px;border-radius:100px;
  white-space:nowrap;
}
.domaine-question{
  font-family:var(--display);font-style:italic;font-size:19px;
  color:var(--feuillage);margin:26px 0 14px;
}
.domaine-liste{
  list-style:none;padding:0;margin:0 0 20px;
  display:flex;flex-direction:column;gap:12px;max-width:64ch;
}
.domaine-liste li{
  padding-left:20px;position:relative;
  font-size:16px;line-height:1.7;opacity:.88;
}
.domaine-liste li::before{
  content:"";position:absolute;left:0;top:12px;
  width:9px;height:1px;background:var(--or);
}
.domaine-citation{
  margin:24px 0 0;padding:20px 24px;
  border-left:2px solid var(--or);
  font-family:var(--display);font-style:italic;
  font-size:19px;line-height:1.55;color:var(--feuillage);
  max-width:60ch;
}
.domaine-citation cite{
  display:block;margin-top:12px;
  font-family:var(--body);font-style:normal;
  font-size:11.5px;letter-spacing:2px;text-transform:uppercase;
  color:var(--feuillage);opacity:.7;
}
@media (max-width:640px){
  .domaine-carte{padding:32px 24px 30px}
  .domaine-carte h3{font-size:23px}
}

/* ==========================================================
   APPEL DECOUVERTE — dans le flux uniquement
   ========================================================== */
.appel-section{
  background:var(--p1);border:1px solid rgba(133,153,144,.45);border-radius:3px;
  padding:50px 46px;display:grid;grid-template-columns:1fr auto;
  gap:36px;align-items:center;margin-top:64px;
}
.appel-pastille{
  font-size:11px;font-weight:600;letter-spacing:1.76px;text-transform:uppercase;
  color:var(--or);background:var(--p4);padding:6px 15px;border-radius:100px;
  display:inline-block;margin-bottom:18px;
}
.appel-section h3{font-family:var(--display);font-size:27px;font-weight:400;color:var(--feuillage);margin-bottom:14px}
.appel-section h3 em{font-style:italic}
.appel-section p{font-size:16px;opacity:.88;line-height:1.72;max-width:52ch}

/* ==========================================================
   SCROLL PANELS — le déroulé
   ========================================================== */
.sp-section{background:var(--p4);padding:140px 0}
.sp-inner{display:flex;gap:72px;align-items:flex-start;max-width:var(--max);margin:0 auto;padding:0 26px}
.sp-left{flex:0 0 42%;position:sticky;top:130px}
.sp-header{margin-bottom:44px}
.sp-surtitre{font-size:12px;font-weight:600;letter-spacing:2.64px;text-transform:uppercase;color:var(--or);margin-bottom:16px}
.sp-titre{font-family:var(--display);font-weight:400;font-size:clamp(30px,3.6vw,42px);line-height:1.2;color:var(--clair)}
.sp-titre em{font-style:italic;color:var(--rose)}
.sp-chapo{margin-top:18px;font-size:16px;line-height:1.7;color:var(--clair);opacity:.82;max-width:40ch}
.sp-panels-wrap{aspect-ratio:1/1;overflow:hidden;border-radius:16px;max-height:440px;width:min(100%,480px);position:relative}
.sp-panel{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  transform:translateY(100%);transition:transform .65s cubic-bezier(.4,0,.2,1);
  border-radius:16px;overflow:hidden;background:var(--p1);
}
.sp-panel.is-active{transform:translateY(0)}
.sp-panel.is-past{transform:translateY(-100%)}
.sp-panel-inner{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:54px}
.sp-panel-inner svg{width:100%;max-width:280px;height:auto}
.sp-right{flex:1}
.sp-items{display:flex;flex-direction:column}
.sp-item{padding:104px 0;display:flex;flex-direction:column;gap:18px;min-height:240px;border-bottom:1px solid rgba(197,173,129,.2)}
.sp-item:last-child{border-bottom:none;padding-bottom:0}
.sp-item-num{font-family:var(--display);font-size:13px;color:var(--or);letter-spacing:1.3px}
.sp-item-titre{font-family:var(--display);font-weight:400;font-size:28px;line-height:1.25;color:var(--clair)}
.sp-item-titre em{font-style:italic;color:var(--rose)}
.sp-item-texte{font-size:16px;line-height:1.78;color:var(--clair);opacity:.84;max-width:52ch}
.sp-temps{
  list-style:none;padding:0;margin:4px 0 0;
  display:flex;flex-direction:column;gap:14px;
}
.sp-temps li{
  padding-left:18px;position:relative;
  font-size:15.5px;line-height:1.7;
  color:var(--clair);opacity:.84;max-width:52ch;
}
.sp-temps li::before{
  content:"";position:absolute;left:0;top:11px;
  width:8px;height:1px;background:var(--or);
}
.sp-temps strong{
  color:var(--clair);opacity:1;font-weight:600;
}
.sp-item-tag{
  font-size:11px;font-weight:600;letter-spacing:1.76px;text-transform:uppercase;
  color:var(--p4);background:var(--or);padding:6px 15px;border-radius:100px;align-self:flex-start;
}

/* ==========================================================
   MOTIFS — ce qui amène à consulter
   ========================================================== */
.motifs-vedettes{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1px;margin-top:56px;background:rgba(133,153,144,.42);
}
.motif-vedette{background:var(--p2);padding:38px 30px 40px}
.motif-vedette-icone{width:42px;height:42px;margin-bottom:20px;opacity:.75}
.motif-vedette h3{font-family:var(--display);font-weight:500;font-size:22px;line-height:1.25;color:var(--feuillage);margin-bottom:13px}
.motif-vedette p{font-size:16px;line-height:1.72;opacity:.88}
.motif-vedette p em{color:var(--feuillage);opacity:.95}
.motif-vedette-baseline{margin-top:12px}
.motif-illustration{
  margin-top:26px;padding-top:26px;
  border-top:1px solid rgba(133,153,144,.35);
  display:flex;justify-content:center;
}
.motif-illustration svg{width:100%;max-width:180px;height:auto}
@media (max-width:640px){.motif-illustration svg{max-width:150px}}

.motifs-secondaires{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1px;margin-top:1px;background:rgba(133,153,144,.42);
}
.motif-sec{background:var(--p3);padding:26px 26px 28px}
.motif-sec h3{font-family:var(--display);font-size:18px;font-weight:500;color:var(--feuillage);margin-bottom:7px}
.motif-sec p{font-size:15px;opacity:.86;line-height:1.65}

.motifs-mention{margin-top:22px;font-size:15px;opacity:.7;font-style:italic}

.cadre-intervention{
  margin-top:56px;padding:34px 38px;
  background:var(--p1);
  border:1px solid rgba(133,153,144,.5);
  border-left:3px solid var(--or);
  border-radius:3px;
  max-width:74ch;
}
.cadre-intervention h3{
  font-family:var(--display);font-size:21px;font-weight:500;
  color:var(--feuillage);margin-bottom:16px;
}
.cadre-intervention p{font-size:16px;line-height:1.75;opacity:.88;margin-bottom:14px}
.cadre-intervention p:last-child{margin-bottom:0}
.cadre-intervention strong{
  color:var(--feuillage);font-weight:600;
  letter-spacing:.5px;
}
@media (max-width:640px){.cadre-intervention{padding:26px 24px}}
.avertissement{margin-top:44px;padding:24px 28px;border-left:2px solid var(--brume);font-size:15px;line-height:1.7;opacity:.82}

/* ==========================================================
   EN PRATIQUE — infos
   ========================================================== */
.pratique-intro{max-width:66ch}
.pratique-intro p + p{margin-top:18px;opacity:.88}
.infos{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:56px}
.info-bloc dt{font-size:12.5px;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;color:var(--feuillage);margin-bottom:12px}
.info-bloc dd{font-size:16.5px;line-height:1.7}
.info-bloc dd a{text-decoration:none;border-bottom:1px solid var(--or)}
.info-secondaire{opacity:.7}

/* ==========================================================
   AVIS
   ========================================================== */
.avis{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:56px}
.avis figure{
  background:var(--p1);border:1px solid rgba(133,153,144,.42);border-radius:3px;
  padding:34px 30px 30px;display:flex;flex-direction:column;gap:16px;
}
.avis blockquote{font-family:var(--display);font-style:italic;font-size:19px;line-height:1.55;color:var(--feuillage)}
.avis figcaption{margin-top:auto;font-size:13px;letter-spacing:1.82px;text-transform:uppercase;color:var(--feuillage);opacity:.78}
.avis-etoiles{color:var(--or);font-size:15px;letter-spacing:4.2px;line-height:1}
.avis-source{margin-top:36px;font-size:15px;opacity:.78}

/* ==========================================================
   CONTACT
   ========================================================== */
.contact-bloc{background:var(--p4);border-radius:4px;padding:60px 48px;text-align:center;margin-top:48px}
.contact-bloc p{max-width:52ch;margin:0 auto;opacity:.88}
.contact-bloc .actions{justify-content:center}
.contact-bloc .t2{margin-top:16px}
.contact-bloc .contact-texte{margin-top:20px}

/* ==========================================================
   PIED DE PAGE
   ========================================================== */
.pied{background:var(--p4);color:var(--clair);padding:72px 0 36px}
.pied-grille{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}
.pied h2{font-family:var(--display);font-size:25px;font-weight:400;color:var(--clair);margin-bottom:14px}
.pied h2 em{font-style:italic}
.pied p,.pied li{font-size:15px;opacity:.8;line-height:1.8}
.pied h3{font-size:12.5px;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;color:var(--or);margin-bottom:13px}
.pied a{text-decoration:none}
.reseaux{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.reseaux a{
  display:inline-flex;align-items:center;justify-content:center;
  width:42px;height:42px;
  border:1px solid rgba(197,173,129,.45);border-radius:50%;
  color:var(--clair);text-decoration:none;
  transition:background-color .25s,border-color .25s;
}
.reseaux a:hover{background:rgba(197,173,129,.16);border-color:var(--or)}
.reseaux svg{width:18px;height:18px;display:block}
.pied-bas{
  margin-top:48px;padding-top:26px;border-top:1px solid rgba(197,173,129,.28);
  font-size:13.5px;opacity:.7;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
}

/* ==========================================================
   L'ALLIANCE — teaser accueil + page dédiée
   ========================================================== */
.alliance-duo{
  display:flex;align-items:center;justify-content:center;
  gap:0;margin:0 0 34px;
}
.alliance-duo img{
  width:clamp(104px,17vw,140px);
  aspect-ratio:1;height:auto;
  border-radius:50%;
  border:3px solid var(--p1);
}
.alliance-duo img:last-child{margin-left:-26px}

.alliance-teaser{
  background:var(--p1);
  border:1px solid rgba(133,153,144,.45);
  border-radius:3px;
  padding:54px 46px 50px;
  text-align:center;
  margin-top:8px;
}
.alliance-teaser .t2{margin-top:14px}
.alliance-teaser p{max-width:56ch;margin:22px auto 0;font-size:17px;line-height:1.75;opacity:.9}
.alliance-sep{
  width:64px;height:1px;margin:30px auto 0;
  background-image:linear-gradient(to right,var(--or) 3px,transparent 3px);
  background-size:11px 1px;
}
.alliance-teaser-actions{justify-content:center}

/* page dédiée */
.entete-page{text-align:center}
.entete-page .alliance-duo{margin-bottom:30px}
.entete-page .t1{margin-top:14px}
.alliance-noms{
  display:flex;justify-content:center;gap:56px;flex-wrap:wrap;
  margin-top:26px;text-align:center;
}
.alliance-nom{font-size:13px;letter-spacing:2px;text-transform:uppercase;color:var(--feuillage);opacity:.82;line-height:1.7}
.alliance-nom strong{display:block;font-family:var(--display);font-size:20px;font-weight:400;letter-spacing:0;text-transform:none;opacity:1;margin-bottom:4px}
.alliance-lien-site{
  display:inline-block;margin-top:8px;
  font-size:11.5px;letter-spacing:1.5px;text-decoration:none;
  color:var(--feuillage);border-bottom:1px solid var(--or);
}

.alliance-intro{max-width:64ch}
.alliance-intro p{font-size:18.5px;line-height:1.78;opacity:.9}
.alliance-intro p + p{margin-top:20px}
.alliance-intro strong{font-weight:600}

.alliance-approches{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:52px}
.alliance-approche{
  background:var(--p1);border:1px solid rgba(133,153,144,.45);
  border-radius:3px;padding:36px 32px;
}
.alliance-approche h3{font-family:var(--display);font-size:22px;font-weight:500;color:var(--feuillage);margin-bottom:14px}
.alliance-approche p{font-size:16px;line-height:1.75;opacity:.88}

.alliance-suite{max-width:64ch;margin-top:52px}
.alliance-suite > p:first-child{font-size:17.5px;line-height:1.78;opacity:.9}
.alliance-possibilites{margin-top:30px;font-family:var(--display);font-size:22px;color:var(--feuillage)}
.alliance-liste{list-style:none;padding:0;margin:26px 0 0;display:flex;flex-direction:column;gap:13px;max-width:52ch}
.alliance-liste li{padding-left:22px;position:relative;font-size:16.5px;line-height:1.7}
.alliance-liste li::before{content:"";position:absolute;left:0;top:12px;width:10px;height:1px;background:var(--or)}

.alliance-cri{
  font-family:var(--display);font-size:clamp(24px,3.4vw,34px);
  line-height:1.35;color:var(--feuillage);text-align:center;
  margin-top:56px;
}
.alliance-cri em{font-style:italic;display:block}

.alliance-offres{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:52px}
.alliance-offre{
  background:var(--p4);color:var(--clair);
  border-radius:3px;padding:38px 34px;
}
.alliance-offre p:first-child{font-size:15px;opacity:.85;margin-bottom:16px}
.alliance-tarif{font-family:var(--display);font-size:34px;color:var(--or);line-height:1}
.alliance-tarif s{font-size:19px;opacity:.5;margin-left:10px}
.alliance-offre p:last-child{margin-top:14px;font-size:15px;opacity:.85}

@media (max-width:760px){
  .alliance-approches,.alliance-offres{grid-template-columns:1fr}
  .alliance-teaser{padding:38px 26px 36px}
  .alliance-noms{gap:32px}
}

/* ==========================================================
   BANDEAU FLOTTANT — desktop uniquement.
   Il masquait du contenu sur mobile.
   ========================================================== */
.appel-flottant{
  position:fixed;bottom:26px;right:26px;z-index:200;
  background:var(--rose);color:var(--p4);border-radius:100px;
  padding:15px 26px;font-size:14px;font-weight:600;text-decoration:none;
  box-shadow:0 4px 20px rgba(46,67,58,.22);
  transition:background-color .25s;letter-spacing:.42px;
}
.appel-flottant:hover{background:var(--rose-fonce)}
@media (max-width:900px){.appel-flottant{display:none}}

/* ==========================================================
   PAGES INTERIEURES — en-tête, contenu éditorial, FAQ, blog
   Absents de la maquette : calqués sur ses tokens, sans invention.
   ========================================================== */
.entete-simple{background:var(--p1);padding:96px 0 78px}
.entete-simple .t1{margin-top:14px}
.entete-simple .chapo{margin-top:24px;max-width:62ch}

.fil-ariane{font-size:13px;opacity:.75;margin-bottom:26px}
.fil-ariane a{text-decoration:none;border-bottom:1px solid rgba(197,173,129,.7)}
.fil-ariane span[aria-current]{opacity:.8}

.contenu{max-width:68ch}
.contenu p{font-size:17.5px;line-height:1.8;opacity:.92}
.contenu p + p{margin-top:22px}
.contenu h2{font-family:var(--display);font-weight:400;font-size:31px;line-height:1.25;color:var(--feuillage);margin:52px 0 20px}
.contenu h3{font-family:var(--display);font-weight:500;font-size:23px;line-height:1.3;color:var(--feuillage);margin:38px 0 16px}
.contenu ul{margin:22px 0;display:flex;flex-direction:column;gap:12px}
.contenu ul li{padding-left:20px;position:relative;font-size:17px;line-height:1.75;opacity:.9}
.contenu ul li::before{content:"";position:absolute;left:0;top:14px;width:9px;height:1px;background:var(--or)}
.contenu ol{margin:22px 0 22px 20px;padding-left:8px;list-style:decimal;display:flex;flex-direction:column;gap:12px}
.contenu a{border-bottom:1px solid var(--or);text-decoration:none}
.contenu blockquote{
  margin:32px 0;padding:20px 24px;border-left:2px solid var(--or);
  font-family:var(--display);font-style:italic;font-size:19px;line-height:1.55;color:var(--feuillage);
}
.contenu img{margin:32px 0;border-radius:3px}
.contenu strong{font-weight:600;color:var(--feuillage)}
.contenu table{width:100%;border-collapse:collapse;margin:28px 0;font-size:16px}
.contenu th,.contenu td{text-align:left;padding:12px 14px;border-bottom:1px solid rgba(133,153,144,.4)}
.contenu th{font-weight:600;color:var(--feuillage)}

.portrait-page{max-width:360px;margin:0 0 44px;border-radius:3px}

/* Formulaire de contact — habillage des shortcodes courants */
.form-contact{max-width:62ch;margin-top:12px}
.form-contact input[type=text],
.form-contact input[type=email],
.form-contact input[type=tel],
.form-contact select,
.form-contact textarea,
.form-contact .wpcf7-form-control{
  width:100%;font-family:var(--body);font-size:16px;font-weight:300;
  color:var(--p4);background:var(--p1);
  border:1px solid rgba(133,153,144,.6);border-radius:2px;
  padding:13px 15px;margin-top:7px;
}
.form-contact textarea{min-height:170px;resize:vertical}
.form-contact label{display:block;margin-top:20px;font-size:14px;font-weight:600;letter-spacing:.5px;color:var(--feuillage)}
.form-contact input[type=submit],
.form-contact button[type=submit],
.form-contact .wpcf7-submit{
  width:auto;margin-top:26px;cursor:pointer;
  background:var(--rose);color:var(--p4);border:1px solid var(--rose);
  font-size:15px;font-weight:600;letter-spacing:.75px;
  padding:15px 32px;border-radius:2px;
  transition:background-color .25s,border-color .25s;
}
.form-contact input[type=submit]:hover,
.form-contact button[type=submit]:hover,
.form-contact .wpcf7-submit:hover{background:var(--rose-fonce);border-color:var(--rose-fonce)}
.form-absent{
  border:1px dashed rgba(133,153,144,.7);border-radius:3px;
  padding:26px 28px;font-size:16px;line-height:1.7;opacity:.9;max-width:62ch;
}

/* FAQ — <details> natif, aucun JavaScript */
.faq{margin-top:44px;max-width:74ch;border-top:1px solid rgba(133,153,144,.4)}
.faq details{border-bottom:1px solid rgba(133,153,144,.4)}
.faq summary{
  list-style:none;cursor:pointer;
  display:flex;justify-content:space-between;align-items:baseline;gap:20px;
  padding:24px 0;min-height:44px;
  font-family:var(--display);font-size:20px;line-height:1.35;color:var(--feuillage);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::marker{content:''}
.faq summary::after{content:"+";font-family:var(--body);font-size:20px;color:var(--or);flex-shrink:0}
.faq details[open] summary::after{content:"–"}
.faq-reponse{padding:0 0 26px;font-size:16.5px;line-height:1.78;opacity:.9;max-width:64ch}
.faq-reponse p + p{margin-top:14px}

/* Articles */
.articles-liste{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:56px}
.article-carte{
  background:var(--p1);border:1px solid rgba(133,153,144,.42);border-radius:3px;
  display:flex;flex-direction:column;overflow:hidden;
}
.article-carte img{width:100%;aspect-ratio:3/2;object-fit:cover}
.article-carte-corps{padding:28px 26px 30px;display:flex;flex-direction:column;gap:12px;flex:1}
.article-carte h2{font-family:var(--display);font-weight:500;font-size:21px;line-height:1.3;color:var(--feuillage)}
.article-carte h2 a{text-decoration:none}
.article-carte time{font-size:12.5px;letter-spacing:2.5px;text-transform:uppercase;opacity:.7}
.article-carte p{font-size:15.5px;line-height:1.7;opacity:.88}
.article-carte .lire{margin-top:auto;padding-top:14px;font-size:14px;font-weight:600;letter-spacing:.75px;text-decoration:none;border-bottom:1px solid var(--or);align-self:flex-start}
.etat-vide{
  margin-top:48px;padding:52px 46px;text-align:center;
  background:var(--p1);border:1px solid rgba(133,153,144,.45);border-radius:3px;
  max-width:66ch;margin-left:auto;margin-right:auto;
}
.etat-vide h2{font-family:var(--display);font-weight:400;font-size:27px;color:var(--feuillage);margin-bottom:16px}
.etat-vide p{font-size:16.5px;line-height:1.75;opacity:.88;max-width:52ch;margin:0 auto}
.pagination{margin-top:56px;display:flex;gap:10px;flex-wrap:wrap;font-size:15px}
.pagination .page-numbers{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:44px;min-height:44px;padding:0 12px;
  border:1px solid rgba(133,153,144,.5);border-radius:2px;text-decoration:none;
}
.pagination .page-numbers.current{background:var(--p4);color:var(--clair);border-color:var(--p4)}

.article-meta{font-size:12.5px;letter-spacing:2.5px;text-transform:uppercase;opacity:.75;margin-top:18px}
.article-nav{
  margin-top:64px;padding-top:30px;border-top:1px solid rgba(133,153,144,.4);
  display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;font-size:15px;
}
.article-nav a{text-decoration:none;border-bottom:1px solid var(--or)}

/* 404 */
.page-404{text-align:center;max-width:60ch;margin:0 auto}
.page-404 .t1{margin-top:16px}
.page-404 p{margin-top:24px;font-size:17.5px;line-height:1.8;opacity:.9}
.page-404 .actions{justify-content:center}

/* ==========================================================
   RESPONSIVE
   ========================================================== */
@media (max-width:1000px){
  .motifs-vedettes,.motifs-secondaires,.avis,.infos,.articles-liste{grid-template-columns:repeat(2,1fr)}
  .pied-grille{grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  .hero-grille{grid-template-columns:1fr;gap:48px;padding:64px 0 76px}
  .domaines{grid-template-columns:1fr}
  .sp-inner{flex-direction:column;gap:0}
  .sp-left{position:static;width:100%;flex:none}
  .sp-panels-wrap{max-height:300px;aspect-ratio:16/9;width:100%}
  .sp-item{padding:60px 0}
  .appel-section{grid-template-columns:1fr;padding:38px 28px}
  .entete-simple{padding:70px 0 58px}
}
@media (max-width:640px){
  body{font-size:16px}
  .wrap{padding:0 20px}
  .sec,.sp-section{padding:84px 0}
  .motifs-vedettes,.motifs-secondaires,.avis,.infos,.articles-liste{grid-template-columns:1fr}
  .pied-grille{grid-template-columns:1fr;gap:34px}
  .coords .wrap{gap:4px 16px;font-size:12.5px}
  .contact-bloc{padding:42px 24px}
  .actions .btn{flex:1 1 100%;text-align:center}
  .marque{font-size:23px}
  .entete-simple{padding:56px 0 46px}
  .etat-vide{padding:38px 26px}
  .contenu h2{font-size:27px}
}
