/* Polices hébergées dans le thème (v2.4) : aucune requête vers Google Fonts.
   Cormorant Garamond et EB Garamond sous licence SIL OFL (assets/fonts/LICENSE-OFL.txt),
   sous-ensemble latin, qui couvre le français. */
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/cormorant-garamond-500-normal.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/cormorant-garamond-600-normal.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:500;font-display:swap;src:url(../fonts/cormorant-garamond-500-italic.woff2) format('woff2')}
@font-face{font-family:'EB Garamond';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/eb-garamond-400-normal.woff2) format('woff2')}
@font-face{font-family:'EB Garamond';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/eb-garamond-500-normal.woff2) format('woff2')}
@font-face{font-family:'EB Garamond';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/eb-garamond-600-normal.woff2) format('woff2')}
@font-face{font-family:'EB Garamond';font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/eb-garamond-400-italic.woff2) format('woff2')}
@font-face{
  font-family:'Blosta';
  src:url(../fonts/blosta.woff2) format('woff2');
  font-weight:400;font-display:swap;
}
:root{
  --bg:#FEF3DE; --bg-soft:#F6E8CE; --panel:#FFF9E7;
  --gold:#CFA23D; --gold-light:#E7C567;
  /* Doré foncé réservé au TEXTE. Même teinte (42°) et même saturation que
     --gold, luminosité abaissée. --gold restait à 2,15:1 sur le fond crème,
     très en dessous du minimum WCAG AA (4,5:1) : illisible pour une partie des
     visiteurs, et le suréclairage du plein soleil suffit à le faire disparaître.
     --gold reste inchangé pour les filets, bordures et dégradés. */
  --gold-ink:#8B6B22;
  --garnet:#D34026; --garnet-deep:#B6331D;      /* rouge coquelicot */
  --coral:#E36A4E; --terra:#D18A57;
  --olive:#A3AA68; --olive-deep:#757D46;         /* sauge */
  --olive-mid:#939D62;
  /* Sauge des ornements, assombrie de 36% à 26% de luminosité (teinte et
     saturation identiques). À #6E7642, AUCUN des quatre textes crème posés
     dessus n'atteignait 4,5:1 (2,90 à 4,18). Ils passent tous à #4F5530.
     Cette valeur rejoint aussi celle du dégradé d'overlay de la photo. */
  --band:#4F5530;
  --footer:#F6E8CE;          /* crème de la palette, footer */
  --footer-ink:#5E663A;      /* sauge foncé lisible sur crème */
  --footer-soft:#939D62;
  --ink:#4D3B2A; --ink-soft:#6F5A40;
  --maxw:1180px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--bg);color:var(--ink);
  font-family:'EB Garamond',Georgia,serif;
  font-size:18px;line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}

/* ---------- décor de page : coins ---------- */
.page-frame{position:fixed;inset:0;pointer-events:none;z-index:40}
.page-frame .corner{position:absolute;width:clamp(90px,11vw,150px);opacity:.9}
.page-frame .tl{top:0;left:0}
.page-frame .tr{top:0;right:0;transform:scaleX(-1)}
.page-frame .bl{bottom:0;left:0;transform:scaleY(-1)}
.page-frame .br{bottom:0;right:0;transform:scale(-1,-1)}

/* filets latéraux discrets */
.edge{position:fixed;background:linear-gradient(var(--olive),transparent);z-index:39;pointer-events:none}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,5vw,64px)}

/* ---------- typo ---------- */
/* Titres et sous-titres : Cormorant Garamond (demande de Carmen, oct. 2026).
   Blosta reste réservée au nom « Carmen Pagès » (.brand, .sig, .signature).
   Règle générale de faible priorité : les titres stylés plus bas la
   précisent (taille, couleur). */
h1,h2,h3,h4{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;line-height:1.15}
/* Pages intérieures : l'interligne serré des titres supprimait l'air sous
   eux (il venait de l'interligne du texte courant). */
.page-main h2{margin:1.1em 0 .45em}
.page-main > :first-child h2:first-child,.page-main > h2:first-child{margin-top:0}
.page-main h3,.page-main h4{margin-bottom:.35em}
.display{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;line-height:1.02;letter-spacing:.5px}
.eyebrow{font-size:.74rem;letter-spacing:.28em;text-transform:uppercase;
  color:var(--gold-ink);font-weight:600}
.lede{font-size:1.22rem;color:var(--ink-soft)}

/* ---------- header ---------- */
header{position:relative;z-index:30;background:var(--panel);
  border-bottom:1px solid rgba(201,162,75,.35)}
.nav{display:flex;align-items:center;justify-content:space-between;
  gap:24px;padding:16px clamp(20px,5vw,64px);max-width:var(--maxw);margin:0 auto}
.brand{font-family:'Blosta',serif;font-size:1.85rem;color:var(--garnet);
  -webkit-text-stroke:.3px var(--garnet);letter-spacing:.5px;
  margin-left:clamp(40px,6vw,88px)}  /* décale à droite du coin, sans agrandir le header */
.brand small{display:block;white-space:nowrap;font-family:'EB Garamond',serif;
  font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--olive-deep);-webkit-text-stroke:0;margin-top:2px}
.menu{display:flex;gap:22px;align-items:center;font-size:.9rem;white-space:nowrap;
  letter-spacing:.04em}
.menu a{color:var(--ink-soft);transition:color .2s;white-space:nowrap}
.menu a:hover{color:var(--garnet)}
.nav-cta{border:1px solid var(--garnet);color:var(--garnet);
  padding:8px 18px;border-radius:24px;font-size:.9rem;transition:all .2s}
/* ".menu" ajouté : sans lui, ".menu a:hover" (plus prioritaire) gardait le
   texte rouge sur le fond rouge au survol, le bouton devenait illisible. */
.menu .nav-cta:hover,.menu .nav-cta:focus-visible{background:var(--garnet);color:#fff}
.burger{display:none;font-size:1.6rem;color:var(--garnet);background:none;border:0;cursor:pointer}

/* ---------- hero ---------- */
.hero{position:relative;text-align:center;padding:clamp(56px,9vw,110px) 0 clamp(40px,6vw,72px)}
.hero h1{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;color:var(--garnet);
  font-size:clamp(2.5rem,5.2vw,4.2rem);line-height:1.04;margin:18px auto 8px;max-width:22ch;text-wrap:balance}
.hero .sub{font-style:normal;font-size:clamp(1.3rem,2.6vw,1.9rem);
  color:var(--olive-deep);margin-bottom:22px}
.hero .lede{max-width:56ch;margin:0 auto 34px}
.cta-row{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-bottom:22px}
.btn{padding:14px 32px;border-radius:28px;font-size:1rem;letter-spacing:.03em;
  transition:all .22s;cursor:pointer;border:1px solid transparent;display:inline-block}
.btn-primary{background:var(--garnet);color:#fff}
.btn-primary:hover{background:var(--garnet-deep);transform:translateY(-2px)}
.btn-ghost{border-color:var(--olive);color:var(--olive-deep)}
.btn-ghost:hover{background:var(--olive);color:#fff}
.geo-line{font-size:.9rem;color:var(--ink-soft);letter-spacing:.02em}
.geo-line b{color:var(--garnet);font-weight:600}

/* fioriture séparateur */
.flourish{display:block;margin:clamp(6px,1.2vw,14px) auto clamp(0px,0.4vw,4px);width:min(340px,60vw);opacity:.92}
.flourish.flip{transform:scaleX(-1)}
.flourish-lg{width:min(560px,80vw);opacity:.95}

/* ---------- section générique ---------- */
section{position:relative;z-index:2}
.sec{padding:clamp(48px,7vw,90px) 0}
.sec-head{text-align:center;max-width:60ch;margin:0 auto clamp(30px,5vw,54px)}
.sec-head h2{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;color:var(--garnet);
  font-size:clamp(1.9rem,4vw,3rem);line-height:1.05;margin:10px 0 14px}
.sec-head p{color:var(--ink-soft);font-size:1.08rem}

/* cartes soins */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.card{background:var(--panel);border:1px solid rgba(184,149,80,.4);
  border-radius:3px;padding:34px 28px;text-align:center;
  transition:transform .25s,box-shadow .25s;position:relative}
.card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(63,77,38,.10)}
.card h3{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;color:var(--olive-deep);
  font-size:1.48rem;margin-bottom:12px}
.card p{font-size:1rem;color:var(--ink-soft);margin-bottom:18px}
.card .more{color:var(--garnet);font-size:.9rem;letter-spacing:.06em;
  text-transform:uppercase;font-weight:600;border-bottom:1px solid var(--gold);
  padding-bottom:2px}
.card .ico{width:46px;height:46px;margin:0 auto 16px;color:var(--olive)}
.card .leaf{display:block;width:44px;height:44px;margin:0 auto 16px}
.card .leaf svg{width:100%;height:100%}

/* illustration Mucha encadrée */
.illus{text-align:center;padding-top:clamp(20px,3vw,40px)}
.illus-plate{display:inline-block;margin-top:clamp(24px,3vw,40px);background:var(--panel);
  border:1px solid var(--gold-light);padding:20px;border-radius:3px;
  box-shadow:0 10px 30px rgba(63,77,38,.08)}
.illus-plate img{width:min(300px,70vw)}
.illus h2{margin-top:26px}

/* Illustration insérée au fil du texte (contenu WordPress, pas l'accueil).
   Même traitement « planche encadrée » que .illus-plate, centrée sous un
   paragraphe plutôt qu'à côté d'un titre. */
.illus-inline{
  text-align:center;margin:28px auto;background:var(--panel);
  border:1px solid var(--gold-light);padding:16px 16px 14px;border-radius:3px;
  box-shadow:0 10px 30px rgba(63,77,38,.08);max-width:420px;
}
.illus-inline img{width:100%;height:auto;display:block;border-radius:2px}
.illus-inline figcaption{
  margin-top:10px;font-size:.86rem;color:var(--ink-soft);font-style:italic;
}

/* bandeau vert (endométriose etc.) — teinte accordée aux coins */
.band{background:var(--band);color:#FAEEC4;position:relative;overflow:hidden}
.band .wrap{padding:clamp(50px,7vw,84px) clamp(20px,5vw,64px)}
.band .eyebrow{color:var(--gold-light)}
.band h2{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;color:#fff;
  font-size:clamp(1.9rem,4vw,3rem);margin:10px 0 16px;max-width:22ch}
.band p{max-width:60ch;font-size:1.1rem;color:#EEE1B5}
.band .inner{position:relative;z-index:3;max-width:60ch}
/* photo en overlay par-dessus le vert, fondue dans le fond */
.band .band-photo{position:absolute;inset:0;z-index:1;pointer-events:none}
.band .band-photo img{width:100%;height:100%;object-fit:cover;object-position:center 40%;
  opacity:.34;mix-blend-mode:luminosity}
.band .band-photo::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,var(--band) 30%,rgba(76,90,46,.72) 62%,rgba(76,90,46,.45) 100%)}
.mini-disclaimer{margin-top:22px;font-size:.86rem;font-style:italic;color:#DDD0A3;max-width:60ch}

/* split à propos */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,5vw,64px);align-items:center}
.split .photo-frame{position:relative;display:flex;justify-content:center;isolation:isolate}
.split .photo-frame img.cadre{width:min(500px,92vw);position:relative;z-index:3;pointer-events:none}
.split .ph{position:absolute;top:52%;left:50%;transform:translate(-50%,-50%);width:58%;aspect-ratio:3/4;z-index:1;overflow:hidden;
  /* Arrondi en arche : calé sur l'ouverture du cadre iris (cadre-iris.webp)
     superposé par-dessus, très arrondi en haut, presque carré en bas.
     Sur une classe stable du composant plutôt qu'en CSS additionnel ciblant
     un nom de fichier : l'arrondi reste si la photo est remplacée. */
  border-radius:90px 90px 35px 35px;background:linear-gradient(160deg,#F4E5BB,#E5D4A9);display:flex;align-items:center;justify-content:center;color:var(--ink-soft);font-size:.8rem;text-align:center;font-style:italic;padding:12px}
.split .ph img{width:100%;height:100%;object-fit:cover}
.split h2{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;color:var(--garnet);font-size:clamp(1.8rem,3.6vw,2.7rem);margin-bottom:16px}
.split p{color:var(--ink-soft);margin-bottom:14px}
.sig{font-family:'Blosta',serif;color:var(--olive-deep);font-size:1.5rem;margin-top:8px}

/* étapes séance */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;counter-reset:s}
.step{text-align:center;position:relative;padding-top:12px}
.step .n{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;font-variant-numeric:lining-nums;font-size:2.4rem;color:var(--gold);line-height:1}
.step h4{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;color:var(--olive-deep);
  font-size:1.25rem;margin:8px 0 8px}
.step p{font-size:.95rem;color:var(--ink-soft)}
.cure-note{max-width:64ch;margin:clamp(28px,4vw,44px) auto 0;text-align:center;
  background:var(--bg-soft);border:1px solid rgba(184,149,80,.4);
  border-radius:14px;padding:22px 28px}
.cure-note p{font-size:1rem;color:var(--ink-soft)}
.cure-note b{color:var(--olive-deep)}

/* zones */
.zones .wrap{padding:clamp(46px,6vw,78px) clamp(20px,5vw,64px)}
.zone-tags{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:8px}
.zone-tags a{border:1px solid var(--gold-light);color:#FAEEC4;padding:8px 18px;
  border-radius:22px;font-size:.94rem;transition:all .2s}
.zone-tags a:hover{background:var(--gold-light);color:var(--olive-deep)}

/* contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,56px);align-items:center}
.contact-info h2{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;color:var(--garnet);font-size:clamp(1.9rem,4vw,2.8rem);margin-bottom:16px}
.contact-info .row{display:flex;gap:12px;align-items:baseline;margin-bottom:12px;font-size:1.06rem}
.contact-info .row b{color:var(--olive-deep);min-width:92px;display:inline-block}
.contact-info .row a{color:var(--garnet);font-weight:600}
.map-ph{background:var(--panel);border:1px solid var(--gold-light);border-radius:3px;
  aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;
  color:var(--ink-soft);font-style:italic;position:relative;overflow:hidden}
.map-ph::after{content:"Carte interactive · zone d'intervention";position:relative;z-index:2}
.map-ph .grid-bg{position:absolute;inset:0;
  background:
   linear-gradient(rgba(148,92,82,.12) 1px,transparent 1px) 0 0/34px 34px,
   linear-gradient(90deg,rgba(148,92,82,.12) 1px,transparent 1px) 0 0/34px 34px,
   var(--bg-soft)}

/* footer — vert pomme pastel, texte foncé */
footer{background:var(--footer);color:var(--footer-ink);position:relative;z-index:30}
.footer-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;
  padding:clamp(46px,6vw,72px) clamp(20px,5vw,64px);max-width:var(--maxw);margin:0 auto}
footer h5{font-family:'EB Garamond',serif;font-weight:600;color:var(--footer-ink);
  font-size:1rem;letter-spacing:.05em;margin-bottom:14px}
footer ul{list-style:none}
footer li{margin-bottom:8px;font-size:.94rem}
footer a{color:var(--footer-soft)}
footer a:hover{color:var(--garnet)}
.footer-brand .brand{color:var(--garnet);-webkit-text-stroke:.3px var(--garnet);padding-left:0}
.footer-brand .brand small{color:var(--footer-soft)}
.footer-brand p{font-size:.92rem;margin-top:12px;color:var(--footer-soft);max-width:34ch}
.geo-para{padding:0 clamp(20px,5vw,64px) 20px;max-width:var(--maxw);margin:0 auto;
  font-size:.82rem;color:#71783A;line-height:1.6}
.footer-legal{border-top:1px solid rgba(58,69,32,.2);
  padding:18px clamp(20px,5vw,64px);max-width:var(--maxw);margin:0 auto;
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  font-size:.82rem;color:#71783A}
.footer-legal .disc{max-width:70ch;font-style:italic}

/* responsive */
@media(max-width:880px){
  .menu{display:none}
  .burger{display:block}
  .cards,.steps{grid-template-columns:1fr}
  .split,.contact-grid{grid-template-columns:1fr}
  .footer-top{grid-template-columns:1fr 1fr}
  .split .photo-frame{order:-1}
  .brand{margin-left:clamp(48px,13vw,72px);font-size:1.2rem}  /* décale à droite du coin */
  .burger{margin-right:clamp(40px,11vw,60px)}                 /* décale à gauche du coin droit */
  .page-frame .corner{width:clamp(80px,13vw,120px);opacity:.8}                  /* coins plus discrets sur mobile */
}
@media(max-width:520px){
  .footer-top{grid-template-columns:1fr}
  .page-frame .corner{width:76px;opacity:.72}
  .brand{margin-left:clamp(40px,14vw,60px)}
}


/* médaillon dans le header, à gauche du nom */
.brand-logo{display:flex;align-items:center;gap:14px;margin-left:clamp(56px,7vw,96px)}
.brand-logo .medallion{width:clamp(74px,7.5vw,104px);height:auto;display:block}
.brand-logo .brand-txt{display:flex;flex-direction:column;line-height:1.05}
@media(max-width:880px){
  .brand-logo{margin-left:clamp(52px,12vw,72px);gap:10px}
  .brand-logo .medallion{width:clamp(46px,10vw,58px)}
}

/* fioriture feuilles en tête de carte (remplace l'icône) */
.card .leaf-sep{display:block;width:clamp(90px,42%,130px);height:auto;margin:0 auto 14px;opacity:.92}
/* petits coins fins pour encadrer les cartes pathologie */
.card{overflow:hidden}
.card .card-corner{position:absolute;top:0;width:clamp(58px,26%,84px);height:auto;
  opacity:.7;pointer-events:none;z-index:1}
.card .cc-tl{left:0}
.card .cc-tr{right:0;transform:scaleX(-1)}
.card h3,.card p,.card .more,.card .leaf-sep{position:relative;z-index:2}

/* ============================================================
   AJOUTS v4 — placeholders, groupes de cartes, sélecteur,
   zones scindées, témoignages désactivés
   ============================================================ */

/* --- placeholder volontairement visible et gênant --- */
.todo{
  display:block;background:#FFF0F0;border:2px dashed var(--garnet);
  color:var(--garnet-deep);padding:14px 18px;margin:14px 0;
  font-family:'EB Garamond',serif;font-size:.92rem;line-height:1.5;border-radius:4px;
}
.todo::before{content:"À COMPLÉTER · ";font-weight:700;letter-spacing:.08em;font-size:.78rem}
.todo-inline{
  background:#FFF0F0;border-bottom:2px dashed var(--garnet);
  color:var(--garnet-deep);padding:0 4px;font-weight:600;
}

/* --- titres de groupe dans la section soins --- */
.card-group{margin-top:44px}
.card-group + .card-group{margin-top:56px}
.card-group-title{
  font-family:'EB Garamond',serif;font-style:italic;font-size:1.32rem;
  color:var(--olive-deep);text-align:center;margin-bottom:22px;
  position:relative;
}
.card-group-title::after{
  content:"";display:block;width:56px;height:1px;background:var(--gold);
  margin:12px auto 0;
}
.cards-2{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:clamp(20px,3vw,34px);
}

/* --- sélecteur de ressenti --- */
.selector{
  background:var(--panel);border:1px solid var(--gold-light);
  border-radius:6px;padding:clamp(24px,4vw,42px);margin-top:34px;
  position:relative;
}
.selector h3{
  font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(1.3rem,2.4vw,1.72rem);
  text-align:center;margin-bottom:6px;color:var(--ink);font-weight:500;
}
.selector .hint{
  text-align:center;color:var(--ink-soft);font-size:.94rem;margin-bottom:24px;
}
.sel-options{
  display:flex;flex-wrap:wrap;gap:10px;justify-content:center;
}
.sel-options button{
  font-family:'EB Garamond',serif;font-size:1rem;cursor:pointer;
  background:var(--bg);border:1px solid var(--olive);color:var(--ink);
  padding:9px 18px;border-radius:999px;transition:.18s;
}
.sel-options button:hover,.sel-options button[aria-pressed="true"]{
  background:var(--olive-deep);border-color:var(--olive-deep);color:var(--panel);
}
.sel-result{
  margin-top:26px;padding-top:24px;border-top:1px solid var(--gold-light);
  text-align:center;
}
.sel-result[hidden]{display:none}
.sel-result .sel-zones{color:var(--ink-soft);font-size:.95rem;margin:8px 0 10px}
.sel-result .sel-prudence{color:var(--ink-soft);font-size:.88rem;font-style:italic;line-height:1.5;max-width:52ch;margin:0 auto 18px}
.sel-result .sel-page{
  font-family:'EB Garamond',serif;font-size:1.24rem;color:var(--olive-deep);
}
/* Le lien généré par selecteur.js fonctionnait déjà (href correct, clic
   opérationnel), mais il était visuellement IDENTIQUE au texte autour :
   a{color:inherit;text-decoration:none} s'applique par défaut à tous les
   liens du site. Rien ne signalait qu'on pouvait cliquer dessus. Même
   traitement que les liens ".more" déjà utilisés partout ailleurs. */
.sel-result .sel-page a{
  color:var(--garnet);font-weight:600;
  border-bottom:1px solid var(--gold);padding-bottom:1px;
}
.sel-result .sel-page a:hover{color:var(--garnet-deep)}

/* --- zones scindées en deux blocs --- */
.zone-group{margin-top:26px}
.zone-group h3{
  font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-size:1.21rem;
  margin-bottom:12px;font-weight:500;
}

/* --- témoignages (désactivés au lancement) --- */
.testimonials{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;margin-top:30px}
.testimonial{
  background:var(--panel);border:1px solid var(--gold-light);
  border-radius:5px;padding:26px 24px;
}
.testimonial p{font-style:italic;color:var(--ink);margin-bottom:14px}
.testimonial cite{font-style:normal;font-size:.88rem;color:var(--ink-soft);letter-spacing:.04em}

/* --- correctif v4.1 : les 5 étapes ne doivent plus laisser d'orpheline --- */
.steps{
  display:flex !important;flex-wrap:wrap;justify-content:center;
  gap:clamp(24px,3vw,40px) clamp(20px,2.5vw,32px);
}
.steps .step{flex:0 1 200px;max-width:230px;text-align:center}
@media(max-width:900px){ .steps .step{flex:0 1 240px} }

/* --- grille 3 cartes --- */
.cards-3{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:clamp(20px,3vw,34px);
}

/* --- bandeau d'appel intermédiaire --- */
.cta-band{
  margin-top:44px;text-align:center;padding:32px 24px;
  background:var(--panel);border-top:1px solid var(--gold-light);
  border-bottom:1px solid var(--gold-light);
}
.cta-band p{
  font-family:'EB Garamond',serif;font-style:italic;
  font-size:clamp(1.05rem,2vw,1.25rem);color:var(--ink);margin-bottom:18px;
}

/* --- bouton de remise à zéro du sélecteur --- */
.sel-raz{
  background:none;border:none;cursor:pointer;font-family:'EB Garamond',serif;
  font-size:.9rem;color:var(--ink-soft);text-decoration:underline;
  text-underline-offset:3px;
}
.sel-raz:hover{color:var(--garnet)}

/* --- v4.2 : fil d'Ariane, tableau de tarifs, ancres de zones --- */
.breadcrumb{
  padding-top:112px;font-size:.84rem;color:var(--ink-soft);
  letter-spacing:.02em;
}
.breadcrumb a{color:var(--ink-soft);text-decoration:none;border-bottom:1px solid var(--gold-light)}
.breadcrumb a:hover{color:var(--garnet)}

.price-table{
  width:100%;border-collapse:collapse;margin-top:18px;
  font-family:'EB Garamond',serif;
}
.price-table th{
  text-align:left;font-weight:600;font-size:.82rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--olive-deep);
  padding:10px 14px;border-bottom:1px solid var(--gold);
}
.price-table td{padding:14px;border-bottom:1px solid var(--gold-light);color:var(--ink)}
.price-table tr:last-child td{border-bottom:none}

/* Tableaux .grille : forfaits de déplacement (page Tarifs) et horaires (page
   Contact). La classe était utilisée dans le contenu mais n'avait AUCUNE règle
   CSS : les deux tableaux s'affichaient en HTML brut, sans bordure ni
   espacement, juste sous une .price-table soignée. Mêmes règles que
   .price-table, avec une seconde colonne alignée à droite (montants, heures). */
.grille{
  width:100%;border-collapse:collapse;margin-top:18px;
  font-family:'EB Garamond',serif;
}
.grille th{
  text-align:left;font-weight:600;font-size:.82rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--olive-deep);
  padding:10px 14px;border-bottom:1px solid var(--gold);
}
.grille td{padding:12px 14px;border-bottom:1px solid var(--gold-light);color:var(--ink)}
.grille tr:last-child td{border-bottom:none}
.grille th:last-child,.grille td:last-child{text-align:right;white-space:nowrap}

/* Sur petit écran, les deux colonnes se resserrent au lieu de déborder. */
@media(max-width:560px){
  .price-table th,.price-table td,.grille th,.grille td{padding:10px 8px;font-size:.95rem}
}

.zone-anchors h3{
  font-family:'Cormorant Garamond',Georgia,serif;font-size:1.39rem;color:var(--olive-deep);
  margin-top:30px;margin-bottom:8px;scroll-margin-top:110px;font-weight:600;}
.zone-tags span{
  display:inline-block;padding:7px 15px;margin:4px;border-radius:999px;
  background:var(--panel);border:1px solid var(--gold-light);
  font-family:'EB Garamond',serif;font-size:.95rem;color:var(--ink);
}

/* ============================================================
   v5 — RYTHME ET SIGNATURE DES PAGES INTERNES
   Signature : le fil. Une ligne continue dans la marge gauche,
   qui se remplit au scroll, avec un nœud à chaque section.
   C'est le trajet lymphatique, et la ligne fouettée Art nouveau.
   ============================================================ */

.page-body{position:relative}

/* --- le fil --- */
.thread{
  position:absolute;left:0;top:0;bottom:0;width:1px;
  background:var(--gold-light);
}
.thread::after{
  content:"";position:absolute;left:0;top:0;width:1px;
  height:var(--thread,0%);
  background:linear-gradient(180deg,var(--gold) 0%,var(--garnet) 100%);
  transition:height .25s linear;
}
.thread-node{
  position:absolute;left:-4px;width:9px;height:9px;
  transform:rotate(45deg);background:var(--bg);
  border:1px solid var(--gold);
}
.thread-node.on{background:var(--garnet);border-color:var(--garnet)}

.page-grid{
  display:grid;grid-template-columns:minmax(0,1fr) 292px;
  gap:clamp(32px,5vw,68px);align-items:start;
}
.page-body{min-width:0}
.page-main{min-width:0;overflow-wrap:break-word}
.page-main{padding-left:clamp(20px,3vw,44px)}

/* --- carte latérale collante --- */
.aside-card{
  position:sticky;top:104px;background:var(--panel);
  border:1px solid var(--gold-light);border-radius:5px;
  padding:28px 26px;text-align:center;
}
.aside-card .k{
  font-family:'EB Garamond',serif;font-size:.74rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--olive-deep);margin-bottom:6px;
}
.aside-card .v{
  font-family:'EB Garamond',serif;font-size:1.9rem;color:var(--garnet);
  line-height:1.1;margin-bottom:4px;
}
.aside-card .d{font-size:.9rem;color:var(--ink-soft);margin-bottom:20px}
.aside-card hr{border:none;border-top:1px solid var(--gold-light);margin:20px 0}
.aside-card .tel{
  display:block;font-family:'EB Garamond',serif;font-size:1.28rem;
  color:var(--ink);text-decoration:none;margin-bottom:14px;
}
.aside-card .tel:hover{color:var(--garnet)}

/* --- sections alternées --- */
.sec--alt{background:var(--panel);border-block:1px solid var(--gold-light)}

/* --- bloc verbatim --- */
.pull{
  margin:44px 0;padding:34px 0 34px 34px;
  border-left:2px solid var(--garnet);position:relative;
}
.pull p{
  font-family:'EB Garamond',serif;font-style:italic;
  font-size:clamp(1.24rem,2.6vw,1.62rem);line-height:1.5;
  color:var(--olive-deep);
}
.pull cite{display:none}

/* --- liste de sensations --- */
.sensations{list-style:none;margin:20px 0}
.sensations li{
  position:relative;padding-left:32px;margin-bottom:15px;
  font-family:'EB Garamond',serif;font-size:1.06rem;color:var(--ink);
}
.sensations li::before{
  content:"";position:absolute;left:2px;top:.6em;
  width:7px;height:7px;transform:rotate(45deg);
  border:1px solid var(--garnet);
}

/* --- FAQ en accordéon (natif, sans JS) --- */
.faq details{border-bottom:1px solid var(--gold-light);padding:4px 0}
.faq summary{
  cursor:pointer;list-style:none;padding:18px 34px 18px 0;position:relative;
  font-family:'EB Garamond',serif;font-size:1.08rem;color:var(--olive-deep);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"+";position:absolute;right:6px;top:16px;
  font-size:1.4rem;color:var(--gold);transition:transform .22s;
}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 20px;color:var(--ink-soft)}

/* --- bandeau de communes défilant --- */
.marquee{
  overflow:hidden;max-width:100%;border-block:1px solid var(--gold-light);
  padding:16px 0;margin:40px 0;background:var(--panel);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
}
.marquee-track{display:flex;width:max-content;animation:glisse 42s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee span{
  font-family:'EB Garamond',serif;font-size:1.05rem;color:var(--olive-deep);
  white-space:nowrap;padding:0 26px;
}
.marquee span::after{content:"\2726";color:var(--gold);margin-left:26px;font-size:.7rem;vertical-align:middle}
@keyframes glisse{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* --- apparition au scroll --- */
html.js .reveal{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s ease}
html.js .reveal.vu{opacity:1;transform:none}

@media(max-width:980px){
  .page-grid{grid-template-columns:1fr}
  .page-main{padding-left:26px}
  .aside-card{position:static;margin-top:36px}
  .thread{left:2px}
}
@media(prefers-reduced-motion:reduce){
  html.js .reveal{opacity:1;transform:none;transition:none}
  .marquee-track{animation:none}
  .thread::after{transition:none}
}


/* --- v5.1 : menu deroulant --- */
.nav-drop{position:relative}
.nav-drop-btn{
  white-space:nowrap;background:none;border:none;cursor:pointer;font:inherit;color:inherit;
  padding:0;display:inline-flex;align-items:center;gap:5px;
}
.nav-drop-btn span{font-size:.7em;color:var(--gold)}
.nav-drop-panel{
  position:absolute;top:calc(100% + 12px);left:50%;
  transform:translateX(-50%) translateY(-6px);
  min-width:262px;background:var(--bg);border:1px solid var(--gold-light);
  box-shadow:0 14px 40px rgba(74,45,32,.13);padding:8px;
  /* Fermeture retardée : le panneau reste cliquable 0,35 s après la sortie
     de la souris (visibility, contrairement à pointer-events, se retarde).
     Sans ce délai, le panneau disparaissait pendant que la souris traversait
     l'espace sous le bouton, et le clic sur un lien tombait dans le vide. */
  opacity:0;visibility:hidden;
  transition:opacity .18s .35s,transform .18s .35s,visibility 0s .53s;z-index:60;
}
/* Pont invisible qui couvre l'espace entre le bouton et le panneau : la
   souris reste « sur » le menu en descendant vers les liens. */
.nav-drop-panel::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px}
.nav-drop:hover .nav-drop-panel,
.nav-drop:focus-within .nav-drop-panel,
.nav-drop.ouvert .nav-drop-panel{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);
  transition:opacity .18s,transform .18s,visibility 0s}
.nav-drop-panel a{
  display:block;padding:10px 14px;font-size:.96rem;
  font-family:'EB Garamond',serif;color:var(--ink);text-decoration:none;
}
.nav-drop-panel a:hover{background:var(--panel);color:var(--garnet)}

/* --- menu mobile --- */
@media(max-width:900px){
  .menu{
    position:fixed;inset:var(--nav-h,74px) 0 0 0;background:var(--bg);
    flex-direction:column;align-items:flex-start;gap:0;padding:24px 28px 60px;
    transform:translateX(110%);transition:transform .3s cubic-bezier(.4,0,.2,1);
    overflow-y:auto;z-index:900;display:flex;
  }
  .menu.ouvert{transform:translateX(0)}
  .menu > a,.nav-drop-btn{padding:15px 0;font-size:1.1rem;width:100%}
  .nav-drop{width:100%}
  .nav-drop-panel{
    position:static;transform:none;opacity:1;pointer-events:all;
    border:none;box-shadow:none;min-width:0;padding:0 0 10px 16px;
    display:none;background:none;visibility:visible;transition:none;
  }
  .nav-drop-panel::before{display:none}
  .nav-drop.ouvert .nav-drop-panel{display:block;transform:none}
  .burger{display:block;z-index:901}
}


/* --- v5.2 : respiration du menu sur écrans intermédiaires --- */
@media(max-width:1180px) and (min-width:901px){
  .menu{gap:15px;font-size:.84rem}
  .nav-cta{padding:9px 16px}
  .brand small{font-size:.62rem;letter-spacing:.1em}
}

/* --- section « le geste » : image à gauche, texte contre --- */
.illus-split{
  display:grid;grid-template-columns:minmax(0,0.85fr) minmax(0,1.15fr);
  gap:clamp(28px,5vw,64px);align-items:center;
}
.illus-split .illus-plate{
  margin:0;display:block;background:var(--panel);
  border:1px solid var(--gold-light);padding:clamp(18px,2.4vw,30px);
}
.illus-split .illus-plate img{width:100%;height:auto;display:block}
.illus-split .sec-head{text-align:left;margin:0;max-width:none}
.illus-split .sec-head h2{margin-left:0;margin-right:0}
@media(max-width:860px){
  .illus-split{grid-template-columns:1fr}
  .illus-split .illus-plate{max-width:340px;margin:0 auto}
  .illus-split .sec-head{text-align:center}
}

/* ============================================================
   PAGE À PROPOS — traitement distinct des pages soin
   ============================================================ */
.portrait{
  display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);
  gap:clamp(28px,5vw,60px);align-items:center;margin-bottom:clamp(36px,5vw,60px);
}
.portrait .photo-frame{position:relative;display:flex;justify-content:center;isolation:isolate;margin:0}
.portrait .photo-frame img.cadre{width:100%;max-width:340px;position:relative;z-index:3;pointer-events:none}
.portrait .ph{position:absolute;top:52%;left:50%;transform:translate(-50%,-50%);width:58%;aspect-ratio:3/4;z-index:1;overflow:hidden;
  border-radius:90px 90px 35px 35px;background:linear-gradient(160deg,#F4E5BB,#E5D4A9);display:flex;align-items:center;justify-content:center;color:var(--ink-soft);font-size:.8rem;text-align:center;font-style:italic;padding:12px}
.portrait .ph img{width:100%;height:100%;object-fit:cover;border-radius:90px 90px 35px 35px}
/* (arrondi en arche : reprend le CSS additionnel ajouté dans le Personnaliser du site local) */
.portrait-txt p{font-size:1.06rem}
.portrait-txt .signature{
  font-family:'Blosta',serif;font-size:2rem;color:var(--garnet);
  margin-top:22px;display:block;
}
@media(max-width:820px){.portrait{grid-template-columns:1fr}.portrait .photo-frame{max-width:300px;margin:0 auto}}

/* parcours en jalons */
.parcours{list-style:none;margin:30px 0 0;position:relative;padding-left:34px}
.parcours::before{
  content:"";position:absolute;left:6px;top:8px;bottom:8px;width:1px;
  background:linear-gradient(180deg,var(--gold),var(--garnet));
}
.parcours li{position:relative;margin-bottom:30px}
.parcours li::before{
  content:"";position:absolute;left:-32px;top:.45em;width:11px;height:11px;
  transform:rotate(45deg);background:var(--bg);border:1px solid var(--garnet);
}
.parcours h3{
  font-family:'Cormorant Garamond',Georgia,serif;font-size:1.28rem;color:var(--olive-deep);
  margin-bottom:6px;font-weight:600;
}

/* engagements en deux colonnes */
.engagements{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:26px;margin-top:24px}
.engagement{background:var(--panel);border:1px solid var(--gold-light);padding:24px}
.engagement h3{
  font-family:'Cormorant Garamond',Georgia,serif;font-size:1.14rem;color:var(--garnet);
  margin-bottom:10px;letter-spacing:.02em;font-weight:600;}
.engagement p{font-size:.96rem;color:var(--ink-soft);margin:0}


/* --- v5.3 : respiration entre paragraphes --- */
.illus-split .sec-head p + p,.portrait-txt p + p,.page-main p + p{margin-top:14px}
.illus-split .sec-head p:last-of-type{margin-bottom:0}
.more{
  display:inline-block;border-bottom:1px solid var(--gold);
  padding-bottom:2px;text-decoration:none;
}
.more::after{content:" \2192";color:var(--gold)}


/* ============================================================
   v5.5 — CTA lisible et en-tête mobile
   ============================================================ */

/* le numéro sous le bouton, jamais dans le bouton */
.tel-line{
  margin-top:12px;font-family:'EB Garamond',serif;font-size:.98rem;
  color:var(--ink-soft);
}
.tel-line a{
  color:var(--garnet);text-decoration:none;
  border-bottom:1px solid var(--gold);white-space:nowrap;
}
.cta-band .tel-line{margin-top:14px}
.aside-card .tel{margin:14px 0 0;font-size:1.14rem}

/* --- en-tête mobile --- */
@media(max-width:700px){
  .brand small{display:none}
  .brand-logo .medallion{width:46px;height:46px}
  .brand,.brand-logo .brand-txt{font-size:1.02rem}
  .nav{padding-block:12px}
}

/* --- panneau de menu mobile --- */
@media(max-width:900px){
  .menu{
    inset:0;padding:88px 30px 48px;gap:0;
    justify-content:flex-start;
  }
  .menu > a{
    padding:16px 0;font-size:1.16rem;width:100%;
    border-bottom:1px solid var(--gold-light);
  }
  .menu .nav-cta{
    border:none;background:var(--garnet);color:var(--panel);
    text-align:center;border-radius:999px;
    padding:16px 26px;margin-top:26px;width:100%;
    font-size:1.04rem;letter-spacing:.02em;
  }
  .menu .nav-cta:hover{color:var(--panel)}
  .nav-drop-btn{
    padding:16px 0;font-size:1.16rem;width:100%;
    justify-content:space-between;border-bottom:1px solid var(--gold-light);
  }
  .nav-drop.ouvert .nav-drop-btn{border-bottom-color:transparent}
  .nav-drop-panel{padding:0 0 12px 18px}
  .nav-drop-panel a{padding:11px 0;font-size:1.02rem;color:var(--ink-soft)}
  .burger{
    position:fixed;top:16px;right:22px;font-size:1.6rem;
    background:none;border:none;color:var(--garnet);cursor:pointer;
  }
  /* le numéro toujours atteignable en bas du panneau */
  .menu::after{
    content:var(--carmen-tel,"06 11 93 76 43");display:block;margin-top:24px;
    font-family:'EB Garamond',serif;font-size:1.1rem;
    color:var(--ink-soft);text-align:center;width:100%;
  }
}


/* focus clavier visible */
a:focus-visible, button:focus-visible, summary:focus-visible,
.sel-options button:focus-visible, .burger:focus-visible, .nav-drop-btn:focus-visible{
  outline:2px solid var(--garnet);
  outline-offset:3px;
  border-radius:2px;
}

/* ---------------------------------------------------------------
   Corrections spécifiques WordPress
   --------------------------------------------------------------- */

/* La barre d'admin WordPress est fixée en haut de la fenêtre et recouvrait
   les deux ornements de coin supérieurs. On décale le cadre décoratif de la
   hauteur de la barre, uniquement quand elle est affichée (donc uniquement
   pour les personnes connectées, jamais pour les visiteurs). */
body.admin-bar .page-frame{top:32px}
@media screen and (max-width:782px){
  body.admin-bar .page-frame{top:46px}
}


/* ============================================================
   v6 — THÈME À BLOCS
   Le contenu est désormais fait de blocs WordPress. Les ornements
   qui étaient des <img> dans le HTML (fioritures, coins de cartes,
   cadre iris, fil, grille de la carte) passent en CSS : ils ne
   peuvent plus être effacés par erreur en modifiant un texte, et
   s'affichent aussi dans l'éditeur.
   On utilise ::before plutôt que ::after sur les groupes : l'éditeur
   se sert de ::after pour dessiner le contour du bloc sélectionné.
   Les sélecteurs visent .wp-block-group : les pages pas encore passées
   en blocs gardent leurs <img> et ne reçoivent pas l'ornement en double.
   ============================================================ */

/* --- fioriture en bas de section (remplace img.flourish.flourish-lg) --- */
.avec-fioriture{
  --fio-pb:clamp(48px,7vw,90px);
  padding-bottom:calc(var(--fio-pb) + clamp(6px,1.2vw,14px) + min(560px,80vw) * .2723 + clamp(0px,.4vw,4px));
}
.hero.avec-fioriture{--fio-pb:clamp(40px,6vw,72px)}
.avec-fioriture::before{
  content:"";position:absolute;left:50%;transform:translateX(-50%);
  bottom:calc(var(--fio-pb) + clamp(0px,.4vw,4px));
  width:min(560px,80vw);aspect-ratio:1502/409;opacity:.95;pointer-events:none;
  background:url(../img/fioriture-large.webp) center/contain no-repeat;
}
.hero--page{padding-top:20px}

/* --- cartes : coins et feuille (remplacent les <img> décoratives) --- */
.wp-block-group.card:not(.card--simple)::before{
  content:"";position:absolute;left:0;right:0;top:0;height:92px;
  background:
    url(../img/coin-carte.webp) left top/clamp(58px,26%,84px) auto no-repeat,
    url(../img/coin-carte-droite.webp) right top/clamp(58px,26%,84px) auto no-repeat;
  opacity:.7;pointer-events:none;z-index:1;
}
.wp-block-group.card:not(.card--simple) h3::before{
  content:"";display:block;width:clamp(90px,42%,130px);aspect-ratio:476/121;
  margin:0 auto 14px;opacity:.92;
  background:url(../img/feuille-separateur.webp) center/contain no-repeat;
}

/* --- cadre iris autour du portrait --- */
.wp-block-group.photo-frame::before{
  content:"";display:block;position:relative;z-index:3;pointer-events:none;
  aspect-ratio:740/1042;background:url(../img/cadre-iris.webp) center/contain no-repeat;
}
.split .wp-block-group.photo-frame{min-width:0}
.split .wp-block-group.photo-frame::before{width:min(500px,92vw);max-width:100%}
.portrait .wp-block-group.photo-frame{width:100%}
.portrait .wp-block-group.photo-frame::before{width:100%;max-width:340px}
.ph p{margin:0;color:inherit;font-size:inherit}
.ph figure,.ph .wp-block-image{margin:0;width:100%;height:100%}

/* --- images posées dans un bloc Image --- */
.illus-plate figure,.band-photo figure{margin:0}
.band .band-photo figure{height:100%}

/* --- carte « zone d'intervention » --- */
.wp-block-group.map-ph::before{
  content:"";position:absolute;inset:0;
  background:
   linear-gradient(rgba(148,92,82,.12) 1px,transparent 1px) 0 0/34px 34px,
   linear-gradient(90deg,rgba(148,92,82,.12) 1px,transparent 1px) 0 0/34px 34px,
   var(--bg-soft);
}
.wp-block-group.map-ph::after{content:none}
.map-ph > p{position:relative;z-index:2}

/* --- gras : les blocs écrivent <strong>, l'ancien HTML écrivait <b> --- */
.geo-line strong{color:var(--garnet);font-weight:600}
.cure-note strong{color:var(--olive-deep)}
.contact-info .row strong{color:var(--olive-deep);min-width:92px;display:inline-block}

/* --- espacements autrefois écrits en style="" dans le HTML --- */
.espace-haut{margin-top:18px}
.espace-haut-petit{margin-top:12px}
.carmen-bouton-seul{margin-top:18px}
.contact-intro{color:var(--ink-soft);margin-bottom:20px}
.sel-raz-ligne{margin-top:14px}
.mini-disclaimer--page{margin-top:36px}
.cta-band--page{margin-top:40px}
.band .inner--centre{text-align:center;max-width:820px;margin:0 auto}
.band .inner--centre h2{margin-left:auto;margin-right:auto}
.band .inner--centre p{margin:0 auto}
.aside-card .d:last-child{margin:0}
.testimonial .cite{font-style:normal;font-size:.88rem;color:var(--ink-soft);letter-spacing:.04em;margin:0}
.sec--selecteur{padding-top:0}
.wp-block-group.card:not(.card--simple) > p:last-child{margin-bottom:0}
.wp-block-group.card:not(.card--simple) > p:last-child:has(.more){font-size:inherit}
.illus-split .sec-head p.espace-haut{margin-top:16px}

/* --- v6.1 : pages intérieures en blocs --- */
/* Espacements autrefois écrits en style="" : même priorité qu'un style
   en ligne, d'où !important. */
.u-mt-18{margin-top:18px !important}
.u-mt-20{margin-top:20px !important}
.u-mt-22{margin-top:22px !important}
.u-mt-26{margin-top:26px !important}
.u-m-0{margin:0 !important}

/* Parcours en jalons (titre + texte) : un bloc Liste ne peut pas contenir de
   titre, les jalons sont donc des groupes. Même rendu que .parcours li. */
.parcours .jalon{position:relative;margin-bottom:30px}
.parcours .jalon::before{
  content:"";position:absolute;left:-32px;top:.45em;width:11px;height:11px;
  transform:rotate(45deg);background:var(--bg);border:1px solid var(--garnet);
}

/* Tableaux en bloc Tableau : le tableau est enveloppé dans une <figure>,
   et WordPress ajoute ses propres bordures qu'on neutralise. */
.wp-block-table.price-table,.wp-block-table.grille{margin:18px 0 0;overflow-x:auto}
.wp-block-table.price-table table,.wp-block-table.grille table{width:100%;border-collapse:collapse;font-family:'EB Garamond',serif}
.wp-block-table.price-table :is(thead,tbody,tr,th,td),.wp-block-table.grille :is(thead,tbody,tr,th,td){border:0}
.wp-block-table.price-table th,.wp-block-table.grille th{
  text-align:left;font-weight:600;font-size:.82rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--olive-deep);padding:10px 14px;border-bottom:1px solid var(--gold);
}
.wp-block-table.price-table td{padding:14px;border-bottom:1px solid var(--gold-light);color:var(--ink)}
.wp-block-table.grille td{padding:12px 14px;border-bottom:1px solid var(--gold-light);color:var(--ink)}
.wp-block-table.price-table tr:last-child td,.wp-block-table.grille tr:last-child td{border-bottom:none}
.wp-block-table.grille th:last-child,.wp-block-table.grille td:last-child{text-align:right;white-space:nowrap}
@media(max-width:560px){
  .wp-block-table.price-table :is(th,td),.wp-block-table.grille :is(th,td){padding:10px 8px;font-size:.95rem}
}

/* Illustration légendée en bloc Image */
.wp-block-image.illus-inline figcaption{margin:10px 0 0}
.wp-block-image.illus-inline img{vertical-align:baseline}

/* Photo posée dans le cadre : elle remplit toute l'arche (sans le liseré
   beige du rectangle d'attente). */
.ph:has(img){padding:0}

/* --- cadre paysage (accueil, section « Le soin vient à vous ») ---
   Remplace le portrait en arche sur l'accueil : photo de Carmen en séance.
   Pour mettre la photo : dans l'éditeur, cliquer dans le cadre, supprimer le
   texte d'attente et insérer un bloc Image. La photo remplit le cadre
   (recadrée au centre), quelle que soit la taille choisie dans l'éditeur. */
.photo-paysage{
  position:relative;isolation:isolate;min-width:0;
  padding:14px;background:var(--panel);
  border:1px solid rgba(184,149,80,.55);
  outline:1px solid rgba(184,149,80,.35);outline-offset:6px;
}
.photo-paysage::before,.photo-paysage::after{
  content:"";position:absolute;left:-10px;right:-10px;height:110px;
  pointer-events:none;z-index:3;opacity:.9;
  background:
    url(../img/coin-carte.webp) left top/clamp(64px,20%,96px) auto no-repeat,
    url(../img/coin-carte-droite.webp) right top/clamp(64px,20%,96px) auto no-repeat;
}
.photo-paysage::before{top:-10px}
.photo-paysage::after{bottom:-10px;transform:scaleY(-1)}
.split .photo-paysage .ph{
  position:relative;top:auto;left:auto;transform:none;
  width:100%;aspect-ratio:4/3;border-radius:2px;padding:12px;
}
.split .photo-paysage .ph:has(img){padding:0}
.photo-paysage .ph figure{margin:0;width:100% !important;height:100%}
.photo-paysage .ph img{width:100% !important;height:100% !important;
  aspect-ratio:auto !important;object-fit:cover;border-radius:0 !important}
.photo-paysage .ph figcaption{display:none}
/* Photo de Carmen en séance : cadrage calé en haut pour ne pas couper sa tête. */
.photo-paysage .ph img[src*="photo-carmen-seance"]{object-position:50% 0}
@media(max-width:880px){.split .photo-paysage{order:-1;margin:10px}}

/* --- avis Google (widget Trustindex) --- */
.avis-google{padding-bottom:clamp(20px,3vw,36px)}
.avis-widget{min-height:120px}
.avis-mention{text-align:center;font-size:.86rem;font-style:italic;color:var(--ink-soft);margin-top:18px}
.avis-mention a{color:var(--garnet);border-bottom:1px solid var(--gold);font-style:normal;margin-left:6px;white-space:nowrap}
.avis-attente{border:1px dashed var(--gold);background:var(--panel);padding:28px;text-align:center;color:var(--ink-soft);font-style:italic}

/* Réservation en ligne (Calendly), page Prendre rendez-vous */
.rdv-en-ligne{margin:clamp(28px,4vw,48px) 0}
.rdv-en-ligne .calendly-inline-widget{border:1px solid var(--gold-light);border-radius:6px;overflow:hidden;background:#fff}

/* Carte de la zone d'intervention (accueil) */
.carte-zone{position:relative;aspect-ratio:4/3;border:1px solid var(--gold-light);border-radius:3px;
  overflow:hidden;background:var(--bg-soft);z-index:0}
.carte-zone .leaflet-tile-pane{filter:sepia(.3) saturate(.85) brightness(1.02)}
.carte-zone.leaflet-container{font-family:'EB Garamond',Georgia,serif;background:var(--bg-soft)}
.carte-repli{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  padding:24px;text-align:center;font-style:italic;color:var(--ink-soft)}
.carte-active .carte-repli{display:none}
.carte-etiquette{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;font-size:1rem;color:var(--garnet);
  background:var(--panel);border:1px solid var(--gold-light);box-shadow:none}
.carte-legende{list-style:none;margin:14px 0 0;padding:0;font-size:.98rem;color:var(--ink)}
.carte-legende li{display:flex;align-items:center;gap:10px;margin:4px 0}
.pastille{width:16px;height:16px;border-radius:50%;flex:none}
.pastille--pleine{background:rgba(211,64,38,.2);border:2px solid var(--garnet)}
.pastille--tirets{border:2px dashed var(--olive-deep)}
.carte-note{font-size:.86rem;font-style:italic;color:var(--ink-soft);margin-top:6px}
.carte-lien a{color:var(--garnet);border-bottom:1px solid var(--gold);font-size:.95rem}

/* ===== Mobile : blocs qui défilent sur le côté (v2.4) =====
   Cartes « Pour qui, pour quoi », étapes de la méthode et choix du
   sélecteur : sur téléphone, on les fait glisser horizontalement au lieu
   de les empiler. La carte suivante dépasse un peu à droite pour montrer
   qu'on peut glisser ; des points sous chaque rangée indiquent la position. */
@media(max-width:720px){
  .cards-2,.cards-3,.steps{
    display:flex !important;flex-wrap:nowrap !important;justify-content:flex-start !important;
    overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;
    scroll-snap-type:x mandatory;scroll-padding-inline:20px;
    margin-inline:-20px;padding:4px 20px 10px;gap:14px !important;
    scrollbar-width:none;
  }
  .cards-2::-webkit-scrollbar,.cards-3::-webkit-scrollbar,.steps::-webkit-scrollbar{display:none}
  .cards-2 > .card,.cards-3 > .card{flex:0 0 84%;max-width:none;scroll-snap-align:start;margin:0}
  .steps > .step{
    flex:0 0 74% !important;max-width:none !important;scroll-snap-align:start;
    background:var(--panel);border:1px solid var(--gold-light);border-radius:6px;
    padding:22px 18px 20px;
  }

  /* Sélecteur : les choix sur trois lignes qui défilent sur le côté */
  .sel-options{
    display:grid;grid-auto-flow:column;grid-template-rows:repeat(3,auto);
    justify-content:start;gap:8px;
    overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;
    margin-inline:calc(-1 * clamp(24px,4vw,42px));padding:2px clamp(24px,4vw,42px) 8px;
    scrollbar-width:none;
  }
  .sel-options::-webkit-scrollbar{display:none}
  .sel-options button{white-space:nowrap;padding:8px 15px;font-size:.98rem}
  .selector .hint{margin-bottom:16px}

  /* points de position */
  .defile-points{display:flex;justify-content:center;gap:7px;margin-top:10px}
  .defile-points span{width:7px;height:7px;border-radius:50%;background:var(--gold-light);transition:background .2s,transform .2s}
  .defile-points span.actif{background:var(--garnet);transform:scale(1.25)}
}
@media(min-width:721px){.defile-points{display:none}}

/* ===== Mobile : pied de page en rubriques repliables (v2.4) =====
   Les trois listes (Vos besoins, Zones, Infos) se replient : un toucher sur
   le titre ouvre la rubrique. Sans JavaScript, tout reste ouvert. */
@media(max-width:720px){
  .footer-top{grid-template-columns:1fr !important;gap:0 !important}
  .footer-brand{margin-bottom:18px}
  .footer-col{border-top:1px solid rgba(58,69,32,.18)}
  .footer-col:last-child{border-bottom:1px solid rgba(58,69,32,.18)}
  .footer-col h5{margin:0 !important;padding:15px 2px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-size:1.05rem}
  html.js .footer-col h5::after{content:"+";font-size:1.35rem;line-height:1;color:var(--gold);font-weight:400}
  html.js .footer-col.ouvert h5::after{content:"\2212"}
  html.js .footer-col > :not(h5){display:none}
  html.js .footer-col.ouvert > :not(h5){display:block;padding:0 2px 12px}
  .footer-col li{margin-bottom:0}
  .footer-col li a{display:block;padding:7px 0;font-size:1rem}
  .geo-para,.footer-legal{font-size:.84rem}
  .footer-brand .brand{margin-left:0 !important}
  .footer-legal{padding-bottom:72px !important}  /* laisse la place aux coins décoratifs */
}

/* Crédit de réalisation, pied de page */
.copyright .credit a{color:inherit;border-bottom:1px solid currentColor}
.copyright .credit a:hover{color:var(--garnet)}