/*
Theme Name: Glam Sultane
Theme URI: https://nacer.ould-aroussi.com/
Author: Glam Sultane
Description: Thème sur mesure pour l'institut de beauté Glam Sultane. Fond crème sablé, accent or patiné, titres Playfair Display et texte Jost. Les prestations viennent du plugin Glam Sultane contenus, et les rendez-vous de Cal.com.
Version: 2.0.0
Requires at least: 6.9
Tested up to: 7.1
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: glam-sultane
Tags: custom-menu, featured-images, translation-ready, blog, one-column
*/

@font-face{font-family:'Playfair Display';font-style:normal;font-weight:500;font-display:swap;src:url(assets/fonts/playfair-display-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Playfair Display';font-style:italic;font-weight:400;font-display:swap;src:url(assets/fonts/playfair-display-latin-400-italic.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:300;font-display:swap;src:url(assets/fonts/jost-latin-300-normal.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/jost-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:500;font-display:swap;src:url(assets/fonts/jost-latin-500-normal.woff2) format('woff2')}
:root{--cream:#F2E8DA;--sand:#E9DCC9;--champ:#DCCBB6;--blush:#E3D3BE;--brown:#382E24;--brown2:#5E5043;--gold:#A89580;--gold2:#CBBCA8;--goldd:#6E5D49;--rose:#D8C8B2;--ok:#5d7a3a;--bad:#9b3b2e}
@media(prefers-color-scheme:dark){:root{color-scheme:light}}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{-webkit-text-size-adjust:100%;font:17px/1.65 'Jost',system-ui,sans-serif;color:var(--brown);background:var(--cream)}
h1,h2,h3{font-family:'Playfair Display',Georgia,serif;font-weight:500;line-height:1.15}
h2{font-size:clamp(1.9rem,4vw,2.8rem);margin-bottom:.6em}
em{font-style:italic;color:#6E5D49}
a{color:inherit}
:focus-visible{outline:3px solid var(--gold2);outline-offset:3px}
.wrap{max-width:1080px;margin:0 auto;padding:0 22px}
section{padding:84px 0}
.soft{background:var(--blush);color:var(--brown)}.soft em{color:var(--goldd)}
.sand{background:var(--sand)}
.promo{background:var(--gold);color:var(--brown);text-align:center;padding:8px 14px;font-weight:500}
header{position:sticky;top:0;z-index:20;height:68px}
header::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(242,232,218,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--rose);transform-origin:top;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
header.scrolled::before{transform:scaleY(.78);box-shadow:0 6px 20px rgba(56,46,36,.12)}
header .wrap,header img{transition:transform .35s cubic-bezier(.2,.7,.2,1)}
header img{transform-origin:left center}
header.scrolled .wrap{transform:translateY(-7px)}
header.scrolled img{transform:scale(.76)}
header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;height:68px}
header img{height:46px}
nav{display:flex;gap:22px;align-items:center}nav a{text-decoration:none;font-size:.95rem}
nav a:hover{color:var(--gold)}
.btn{display:inline-block;background:linear-gradient(135deg,var(--gold),var(--gold2));color:var(--brown);padding:13px 28px;border:0;border-radius:2px;font:500 1rem 'Jost',sans-serif;text-decoration:none;cursor:pointer;box-shadow:0 2px 0 rgba(0,0,0,.15);transition:filter .2s}
.btn:hover{filter:brightness(1.08)}.btn:disabled{opacity:.5;cursor:not-allowed}
.hero{text-align:center;padding:90px 0 100px;position:relative;overflow:hidden}
.hero img{width:min(300px,70%);margin-bottom:10px}
.hero h1{font-size:clamp(2.4rem,7vw,4.6rem);margin:.2em 0}
.hero p{max-width:520px;margin:0 auto 30px;color:var(--brown2)}
.hero::before,.hero::after{content:"";position:absolute;width:420px;height:420px;border:1px solid rgba(168,149,128,.28);border-radius:50%;top:-120px}
.hero::before{left:-160px}.hero::after{right:-160px;top:auto;bottom:-160px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:22px}
.card{background:#FAF3E8;border:1px solid var(--gold2);padding:6px;border-radius:2px}
.card>div{border:1px solid var(--rose);padding:26px 22px;height:100%;display:flex;flex-direction:column}
.card h3{font-size:1.3rem}.card p{margin:.5em 0 1em;font-size:.95rem}
.price{font-family:'Playfair Display',serif;font-size:1.8rem;color:#6E5D49}
.two{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.ph{aspect-ratio:4/3;background:repeating-linear-gradient(45deg,var(--sand),var(--sand) 12px,var(--rose) 12px,var(--rose) 24px);display:grid;place-items:center;color:var(--brown2);text-align:center;padding:12px;font-size:.9rem;border:1px solid var(--gold2)}
.slots{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.slots button,.opt{padding:9px 16px;border:1px solid var(--gold);background:#FAF3E8;border-radius:2px;font:inherit;cursor:pointer;color:var(--brown)}
.slots button[aria-pressed=true],.opt[aria-pressed=true],.day[aria-pressed=true]{background:linear-gradient(135deg,var(--gold),var(--gold2));border-color:var(--gold);color:var(--brown)}
form label{display:block;margin:16px 0 6px;font-weight:500}
input{width:100%;max-width:420px;padding:11px;border:1px solid var(--gold);border-radius:2px;font:inherit;background:#FAF3E8}
#msg{margin-top:16px;font-weight:500}.err{color:var(--bad)}.good{color:var(--ok)}
footer{background:var(--champ);border-top:1px solid rgba(168,149,128,.35);color:var(--brown2);text-align:center;padding:48px 0 90px}
footer p.sig{font:italic 1.4rem 'Playfair Display',serif;color:var(--goldd);margin-bottom:12px}
.sticky{display:none}

@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* ---- Animations (transform/opacity uniquement) ---- */
.reveal{opacity:0;transform:translate3d(0,26px,0);transition:opacity .9s cubic-bezier(.2,.7,.2,1) var(--d,0ms),transform .9s cubic-bezier(.2,.7,.2,1) var(--d,0ms)}
.reveal.in{opacity:1;transform:none}
.hero .wrap{position:relative;z-index:1}
.aura{position:absolute;inset:-35%;pointer-events:none;will-change:transform;animation:drift 22s ease-in-out infinite alternate;background:radial-gradient(40% 40% at 30% 35%,rgba(252,246,236,.75),transparent 70%),radial-gradient(35% 35% at 72% 62%,rgba(214,194,168,.45),transparent 70%),radial-gradient(30% 30% at 55% 20%,rgba(255,255,255,.8),transparent 70%)}
@keyframes drift{from{transform:translate3d(-4%,-3%,0) rotate(0) scale(1)}to{transform:translate3d(5%,4%,0) rotate(14deg) scale(1.12)}}
.btn{transition:filter .2s,transform .35s cubic-bezier(.2,.8,.2,1)}
.price{font-variant-numeric:tabular-nums}
@media(prefers-reduced-motion:reduce){.aura{animation:none}.reveal{opacity:1;transform:none}header::before,header .wrap,header img{transition:none}}

/* ---- Hero ---- */
.hero{min-height:calc(100svh - 68px);display:grid;align-items:center;padding:72px 0}
.hero .wrap{width:100%}
.hero .hero-logo{width:min(170px,44%);margin-bottom:18px}
.hero h1{font-size:clamp(2.9rem,9.5vw,6rem);line-height:1.04;letter-spacing:-.015em;margin:.1em auto .35em;max-width:11em;text-wrap:balance}
.hero .lead{max-width:560px;margin:0 auto 34px;color:var(--brown2);font-size:1.12rem}
.cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.btn.ghost{background:transparent;color:var(--goldd);border:1px solid var(--gold);box-shadow:none}
.btn.ghost:hover{background:rgba(168,149,128,.1)}
.facts{list-style:none;padding:28px 0 0;margin:56px auto 0;max-width:780px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;border-top:1px solid rgba(180,162,140,.35)}
.facts strong{display:block;font:500 1.7rem 'Playfair Display',serif;color:var(--goldd)}
.facts span{font-size:.95rem;color:var(--brown2)}
/* ---- Sections : filet doré qui se trace ---- */
section{position:relative;scroll-margin-top:68px}
section:not(.hero):not(.page-hero)::before{content:"";position:absolute;top:0;left:0;right:0;margin:0 auto;width:min(1036px,calc(100% - 44px));height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);transform-origin:center;transition:transform 1.3s cubic-bezier(.2,.7,.2,1)}
section.draw::before{transform:scaleX(0)}
section.draw.in::before{transform:none}
/* ---- Menu mobile ---- */
.menu{display:none;width:48px;height:48px;background:none;border:0;cursor:pointer;position:relative}
.menu::before,.menu::after{content:"";position:absolute;left:12px;right:12px;height:2px;background:var(--brown);transition:transform .3s}
.menu::before{top:19px}.menu::after{top:27px}
.menu[aria-expanded=true]::before{transform:translateY(4px) rotate(45deg)}
.menu[aria-expanded=true]::after{transform:translateY(-4px) rotate(-45deg)}
@media(max-width:760px){
body{font-size:18px;line-height:1.7}
.wrap{padding:0 20px}
section{padding:64px 0}
h2{font-size:2.1rem}
header img{height:40px}
.menu{display:block}
nav{display:none;position:absolute;left:0;right:0;top:calc(100% - 8px);flex-direction:column;align-items:stretch;gap:0;background:var(--cream);border-bottom:1px solid var(--rose);padding:8px 20px 14px;box-shadow:0 14px 24px rgba(56,46,36,.14)}
nav.open{display:flex}
nav a{padding:15px 0;font-size:1.15rem;border-bottom:1px solid var(--rose)}
nav a.btn{display:none}
.hero{padding:48px 0 56px}
.hero .lead{font-size:1.08rem}
.cta .btn{width:100%;text-align:center}
.facts{grid-template-columns:1fr;gap:18px;margin-top:40px}
.two{grid-template-columns:1fr;gap:28px}
.card p{font-size:1rem}
.btn{min-height:52px;padding:14px 28px}
.slots{gap:10px}
.slots button,.opt{min-height:48px;padding:11px 18px;font-size:1rem}
#svcPick{flex-direction:column}#svcPick .opt{text-align:left;width:100%}
input{max-width:none;min-height:52px;font-size:1.05rem}
form label{font-size:1.05rem}
.sticky{display:block;position:fixed;left:14px;right:14px;bottom:14px;z-index:30;text-align:center;padding-bottom:max(14px,env(safe-area-inset-bottom));box-shadow:0 8px 24px rgba(56,46,36,.3)}
}

/* ---- Cartes prestations enrichies ---- */
#services{grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
.badge{align-self:flex-start;background:linear-gradient(135deg,var(--gold),var(--gold2));color:var(--brown);font-size:.85rem;padding:3px 14px;margin-bottom:12px}
.bul{list-style:none;padding:0;margin:14px 0 22px}
.bul li{position:relative;padding-left:24px;margin:7px 0;font-size:.98rem}
.bul li::before{content:"";position:absolute;left:3px;top:.6em;width:7px;height:7px;border:1px solid var(--gold);transform:rotate(45deg)}
.foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.foot .btn{padding:11px 22px}
/* ---- Envies ---- */
.envies{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));gap:20px}
.envie{display:block;text-decoration:none;padding:28px 24px;border:1px solid var(--gold2);background:#FAF3E8;border-radius:2px;transition:transform .3s,box-shadow .3s}
.envie:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(56,46,36,.12)}
.envie h3{font-size:1.35rem;margin-bottom:.4em}
.envie p{font-size:.98rem}
.go{display:block;margin-top:14px;font-weight:500;color:#6E5D49;text-decoration:underline;text-underline-offset:4px}
/* ---- Séance + FAQ ---- */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:28px;margin-bottom:60px}
.step{padding-top:18px;border-top:1px solid var(--gold)}
.step b{display:block;font:italic 500 2.6rem 'Playfair Display',serif;color:#6E5D49;line-height:1}
.step h3{font-size:1.3rem;margin:.3em 0}
.faq{max-width:760px}.faq h3{font-size:1.6rem;margin-bottom:12px}
details{border-bottom:1px solid var(--gold2)}
summary{cursor:pointer;list-style:none;position:relative;min-height:48px;padding:14px 40px 14px 0;font:500 1.15rem 'Playfair Display',serif}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:4px;top:50%;transform:translateY(-50%);font-size:1.7rem;color:#6E5D49;transition:transform .3s}
details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
details p{padding:0 0 18px;max-width:60ch}
/* ---- Avant / après ---- */
#galerie .grid{grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
figure{margin:0}figcaption{margin-top:10px;font-family:'Playfair Display',serif;font-size:1.15rem}
.ba{position:relative;aspect-ratio:4/3;overflow:hidden;border:1px solid var(--gold2)}
.ba .ph{position:absolute;inset:0;aspect-ratio:auto;border:0}
.ba-b{justify-items:start;text-align:left;padding-left:12%}
.ba-a{justify-items:end;text-align:right;padding-right:12%;background:repeating-linear-gradient(45deg,var(--rose),var(--rose) 12px,var(--champ) 12px,var(--champ) 24px);clip-path:inset(0 0 0 var(--p,50%))}
.ba-line{position:absolute;top:0;bottom:0;left:var(--p,50%);width:2px;background:var(--gold2);pointer-events:none}
.ba-line::after{content:"\2194";position:absolute;top:50%;left:50%;width:42px;height:42px;margin:-21px 0 0 -21px;border-radius:50%;background:var(--gold2);color:var(--brown);display:grid;place-items:center;font-size:1.2rem}
.ba input{position:absolute;inset:0;width:100%;height:100%;max-width:none;min-height:0;padding:0;border:0;opacity:0;cursor:ew-resize}
.ba:focus-within{outline:3px solid var(--gold2);outline-offset:3px}
.ba-tag{position:absolute;top:10px;padding:2px 12px;background:rgba(242,232,218,.92);color:var(--brown);font-size:.85rem;pointer-events:none}

/* ---- Pages ---- */
@view-transition{navigation:auto}
header{view-transition-name:site-header}
nav a[aria-current=page]:not(.btn){color:#6E5D49;box-shadow:0 2px 0 var(--gold)}
nav{gap:20px}nav a{font-size:.94rem}
.page-hero{position:relative;overflow:hidden;text-align:center;padding:76px 0 68px}
.page-hero .wrap{position:relative;z-index:1}
.page-hero h1{font-size:clamp(2.4rem,7vw,4.2rem);line-height:1.08;margin-bottom:.3em}
.page-hero p{color:var(--brown2);max-width:540px;margin:0 auto}
.more{text-align:center;margin-top:40px}
.btn.line{background:transparent;color:var(--brown);border:1px solid var(--brown);box-shadow:none}
.btn.line:hover{background:rgba(56,46,36,.06)}
.soft .btn.line{color:var(--goldd);border-color:var(--goldd)}
.teaser{text-align:center}.teaser figure{max-width:560px;margin:0 auto;text-align:left}
.band{text-align:center}.band p{max-width:520px;margin:0 auto}
.fnav{margin-bottom:14px}.fnav a{margin:0 10px;text-decoration:none;display:inline-block;padding:6px 0}.fnav a:hover{color:var(--goldd)}
body[data-page=reservation] .sticky{display:none!important}
@media(max-width:980px){
.menu{display:block}
nav{display:none;position:absolute;left:0;right:0;top:calc(100% - 8px);flex-direction:column;align-items:stretch;gap:0;background:var(--cream);border-bottom:1px solid var(--rose);padding:8px 20px 14px;box-shadow:0 14px 24px rgba(56,46,36,.14)}
nav.open{display:flex}
nav a{padding:15px 0;font-size:1.15rem;border-bottom:1px solid var(--rose)}
nav a.btn{display:none}
nav a[aria-current=page]:not(.btn){box-shadow:none;font-weight:500}
.sticky{display:block;position:fixed;left:14px;right:14px;bottom:14px;z-index:30;text-align:center;padding-bottom:max(14px,env(safe-area-inset-bottom));box-shadow:0 8px 24px rgba(56,46,36,.3)}
}
@media(max-width:760px){.page-hero{padding:52px 0 44px}}
@media(prefers-reduced-motion:reduce){@view-transition{navigation:none}}

/* ===== Mise à jour 2027 ===== */
.palms{position:absolute;inset:0;pointer-events:none}
.palms img{position:absolute;width:min(640px,72vw);height:auto;opacity:.3;transform-origin:0 100%;animation:sway 16s ease-in-out infinite alternate}
.palms img:first-child{left:-110px;bottom:-90px}
.palms img:last-child{right:-150px;top:-120px;transform-origin:100% 0;animation-name:sway2}
@keyframes sway{from{transform:rotate(-2.5deg)}to{transform:rotate(3deg)}}
@keyframes sway2{from{transform:scaleX(-1) rotate(2.5deg)}to{transform:scaleX(-1) rotate(-3deg)}}
.hero h1{font-size:clamp(3.3rem,11.5vw,7.6rem);line-height:1;margin-bottom:.3em}
.hero h1 em{background:linear-gradient(100deg,var(--goldd) 32%,#BBA88F 50%,var(--goldd) 68%) 100% 0/260% 100% no-repeat;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sheen 2.8s .9s ease-out forwards}
@keyframes sheen{to{background-position:0 0}}
/* carte de soins */
.carte{border-top:1px solid var(--gold)}
.item{display:grid;grid-template-columns:1fr auto;column-gap:32px;align-items:center;padding:28px 4px;border-bottom:1px solid rgba(168,149,128,.35)}
.item .top{grid-column:1;display:flex;align-items:baseline;gap:14px}
.item h3{font-size:1.55rem;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.leader{flex:1;min-width:24px;border-bottom:2px dotted var(--gold2);transform:translateY(-6px)}
.item .price{font-size:1.9rem;white-space:nowrap}
.item .desc{grid-column:1;margin-top:6px}
.item .meta{grid-column:1;font-size:.92rem;color:var(--brown2)}
.item .btn{grid-column:2;grid-row:1/4;align-self:center}
.item .badge{margin:0;align-self:auto}
/* envies éditoriales */
.envies{grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:36px 40px}
.envie{background:none;border:0;border-top:1px solid var(--gold);padding:22px 0 0;border-radius:0}
.envie:hover{transform:none;box-shadow:none}.envie:hover h3{color:#6E5D49}
.envie h3{font-size:1.7rem}
/* institut asymétrique */
.asym{display:grid;grid-template-columns:repeat(12,1fr);align-items:center}
.asym .ph{grid-column:1/8;grid-row:1;aspect-ratio:5/4}
.asym .txt{grid-column:6/13;grid-row:1;background:#FAF3E8;border:1px solid var(--gold2);padding:46px 42px;position:relative;z-index:1}
.legal{font-size:.9rem;margin-bottom:14px}.legal a{margin:0 10px;text-decoration:none;opacity:.85}.legal a:hover{color:var(--goldd)}
.prose{max-width:760px}.prose h2{font-size:1.6rem;margin:1.6em 0 .5em}.prose h2:first-child{margin-top:0}.prose p{margin-bottom:1em}
/* réservation en étapes + panneau */
.bk{max-width:640px}
.prog{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:26px}
.prog span{border-top:3px solid var(--rose);padding-top:8px;font-size:.85rem;color:var(--brown2)}
.prog span.on{border-color:var(--gold);color:var(--brown)}
.bk h3{font-size:1.6rem;margin-bottom:14px}.bk h3:focus{outline:none}
.opts{display:grid;gap:10px}
.opts .opt{display:flex;justify-content:space-between;gap:12px;text-align:left;min-height:56px;align-items:center;width:100%}
.opts .opt:hover{background:var(--sand)}
.recap{background:var(--sand);padding:12px 16px;margin-bottom:18px;border-left:3px solid var(--gold)}
.days{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:10px;margin-bottom:10px}
.day{flex:0 0 66px;display:grid;justify-items:center;padding:8px 4px;border:1px solid var(--gold);background:#FAF3E8;border-radius:2px;font:inherit;color:var(--brown);cursor:pointer;scroll-snap-align:start}
.day strong{font:500 1.5rem 'Playfair Display',serif;line-height:1.15}.day small{font-size:.8rem}
.hint{color:var(--brown2);font-size:.95rem}
.fine{font-size:.85rem;color:var(--brown2);margin-top:14px}.fine a{color:#6E5D49}
.back{background:none;border:0;color:#6E5D49;font:inherit;cursor:pointer;padding:6px 0;margin-bottom:8px;text-decoration:underline;text-underline-offset:4px;min-height:44px}
.done .btn{margin:6px 10px 6px 0}
.overlay{position:fixed;inset:0;background:rgba(56,46,36,.38);z-index:60}.overlay[hidden]{display:none}
.panel{position:fixed;top:0;right:0;bottom:0;width:min(500px,100%);background:var(--cream);z-index:61;overflow-y:auto;padding:22px 24px 40px;transform:translateX(100%);visibility:hidden;transition:transform .45s cubic-bezier(.2,.7,.2,1),visibility 0s .45s;box-shadow:-20px 0 50px rgba(0,0,0,.25)}
.panel.open{transform:none;visibility:visible;transition:transform .45s cubic-bezier(.2,.7,.2,1),visibility 0s}
.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}
.panel h2{font-size:1.7rem;margin:0}
.x{width:48px;height:48px;border:0;background:none;font-size:2rem;cursor:pointer;color:var(--brown)}
@media(max-width:760px){
.item{grid-template-columns:1fr}.item .btn{grid-column:1;grid-row:auto;margin-top:14px;text-align:center}
.asym{grid-template-columns:1fr}.asym .ph,.asym .txt{grid-column:1;grid-row:auto}.asym .ph{aspect-ratio:4/3}.asym .txt{margin:-36px 14px 0;padding:30px 24px}
.hero h1{font-size:clamp(3rem,15vw,4.6rem)}
.prog span{font-size:.78rem}
}
@media(prefers-reduced-motion:reduce){.palms img{animation:none}.hero h1 em{animation:none}.panel,.panel.open{transition:none}}

/* ===== Lumière : fonds clairs ===== */
.hero.soft{background:radial-gradient(60% 75% at 88% 8%,rgba(252,244,230,.8),transparent 70%),radial-gradient(50% 60% at 4% 96%,rgba(188,168,144,.55),transparent 70%),linear-gradient(180deg,#F2E8DA,#E9DCC9)}
.page-hero.soft{background:radial-gradient(70% 130% at 88% 0%,rgba(252,244,230,.65),transparent 70%),linear-gradient(180deg,#F2E8DA,#E3D3BE)}
.facts{border-top-color:rgba(168,149,128,.4)}

/* ===== Latte soutenu ===== */
.hero.soft{background:radial-gradient(60% 75% at 88% 8%,rgba(252,244,230,.85),transparent 70%),radial-gradient(50% 60% at 4% 96%,rgba(176,156,132,.5),transparent 70%),linear-gradient(180deg,#E6D9C5,#D6C5AE)}
.page-hero.soft{background:radial-gradient(70% 130% at 88% 0%,rgba(252,244,230,.7),transparent 70%),linear-gradient(180deg,#E6D9C5,#D9C9B3)}
.btn.ghost{color:var(--brown);border-color:var(--brown2)}
.btn.ghost:hover{background:rgba(56,46,36,.08)}
.soft .btn.line{color:var(--brown);border-color:var(--brown)}
footer{background:#CBB9A3;color:var(--brown)}
footer p.sig{color:#5A4A38}

/* ===== Photos réelles (remplacent les emplacements) ===== */
img.photo{display:block;width:100%;height:100%;object-fit:cover;border:1px solid var(--gold2);background:var(--sand);padding:0}
.ba img.photo{position:absolute;inset:0;border:0}

/* ===== Confiance & visibilité ===== */
.next{display:inline-flex;gap:10px;align-items:center;margin-top:22px;color:var(--brown2);text-decoration:none;font-size:.98rem}
.next[hidden]{display:none}.next:hover{color:var(--brown)}
.dot{width:9px;height:9px;border-radius:50%;background:#5d7a3a;box-shadow:0 0 0 4px rgba(93,122,58,.2)}
.text-link{color:var(--goldd);text-underline-offset:4px}
.fcontact{margin-bottom:12px}.fcontact a{margin:0 10px;text-decoration:none;display:inline-block;padding:6px 0;font-weight:500}.fcontact a:hover{color:var(--goldd)}
.quick{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
.reviews{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:24px}
.review{margin:0;padding:26px;background:#FAF3E8;border:1px solid var(--gold2)}
.review blockquote{margin:0 0 14px;font:italic 1.2rem/1.5 'Playfair Display',serif}
.review figcaption{font-weight:500;color:var(--goldd)}
.svc{align-items:start}.lead-in{font-size:1.2rem;margin-bottom:1.2em}
.svc h2{font-size:1.6rem;margin:1em 0 .5em}
.buy{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:28px}
.buy .price{font-size:2.2rem}
textarea{width:100%;max-width:640px;min-height:110px;font:inherit;padding:11px;border:1px solid var(--gold);background:#FAF3E8;border-radius:2px;color:var(--brown)}

/* ===== Fond animé du hero (GIF / vidéo / image déposés dans public/photos/hero.*) ===== */
.hero{--veil:.62}
.hero-media{position:absolute;inset:0;overflow:hidden}
.hero-media img,.hero-media video{display:block;width:100%;height:100%;object-fit:cover}
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(250,244,234,var(--veil)),rgba(236,224,206,calc(var(--veil) + .1)))}
.hero-media~.aura,.hero-media~.palms{display:none}
@media(prefers-reduced-motion:reduce){.hero-media{display:none}.hero-media~.aura,.hero-media~.palms{display:block}}

/* ===== Accessibilité : contrastes et titres ===== */
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.hero .lead,.hero p,.facts span,.next,.page-hero p{color:var(--brown)}
.facts strong{color:var(--brown2)}
footer p.sig{color:#4F4030}

/* ============================================================
   Couche WordPress : accessibilité, blocs de l'éditeur, menus,
   nouveaux composants et habillage du formulaire de réservation.
   ============================================================ */

/* ---- Accessibilité et barre d'administration ---- */
.sr-only,
.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.skip-link {
	position: absolute;
	left: -9999px;
	z-index: 100;
	padding: 12px 20px;
	background: var(--cream);
	color: var(--brown);
	border: 1px solid var(--gold);
	text-decoration: none;
}

.skip-link:focus {
	left: 12px;
	top: 12px;
}

.admin-bar header {
	top: 32px;
}

@media screen and (max-width: 782px) {
	.admin-bar header {
		top: 46px;
	}
}

/* ---- Navigation issue des menus WordPress ---- */
nav ul {
	display: flex;
	align-items: center;
	gap: 22px;
	margin: 0;
	padding: 0;
	list-style: none;
}

nav li {
	margin: 0;
}

nav .current-menu-item > a,
nav [aria-current="page"] {
	color: var(--goldd);
	box-shadow: 0 2px 0 var(--gold);
}

nav a.btn[aria-current="page"] {
	box-shadow: 0 2px 0 rgba(0, 0, 0, .15);
}

/* ---- Pied de page ---- */
.fnav ul,
.legal ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* ---- Contenus de l'éditeur ---- */
.prose > * + * {
	margin-top: 1.1em;
}

.prose h2 {
	margin-top: 1.8em;
	font-size: clamp(1.5rem, 3vw, 2rem);
}

.prose h3 {
	margin-top: 1.4em;
	font-size: 1.25rem;
}

.prose ul,
.prose ol {
	padding-left: 1.3em;
}

.prose li + li {
	margin-top: .4em;
}

.prose a {
	text-decoration: underline;
	text-decoration-color: var(--gold2);
	text-underline-offset: 3px;
}

.prose a:hover {
	text-decoration-color: var(--gold);
}

.prose blockquote {
	margin: 1.4em 0;
	padding: 2px 0 2px 20px;
	border-left: 1px solid var(--gold);
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 1.2rem;
	font-style: italic;
	color: var(--goldd);
}

.prose figure,
.prose img {
	max-width: 100%;
	height: auto;
	border-radius: 2px;
}

.prose hr,
.wp-block-separator {
	height: 1px;
	margin: 2.4em auto;
	border: 0;
	background: linear-gradient(90deg, transparent, var(--gold), transparent);
}

.prose table {
	width: 100%;
	border-collapse: collapse;
}

.prose th,
.prose td {
	padding: 10px 12px;
	border-bottom: 1px solid var(--rose);
	text-align: left;
}

/* Blocs natifs utilisés dans les pages */
.wp-block-details {
	padding: 14px 0;
	border-bottom: 1px solid var(--rose);
}

.wp-block-details summary {
	font-weight: 500;
	cursor: pointer;
	list-style: none;
}

.wp-block-details summary::-webkit-details-marker {
	display: none;
}

.wp-block-details summary::after {
	content: "+";
	float: right;
	color: var(--gold);
	font-size: 1.3rem;
	line-height: 1;
}

.wp-block-details[open] summary::after {
	content: "–";
}

.wp-block-columns {
	display: flex;
	flex-wrap: wrap;
	gap: 32px;
}

.wp-block-column {
	flex: 1 1 240px;
	min-width: 0;
}

.wp-block-group.has-background {
	padding: 26px 22px;
	border-radius: 2px;
}

.wp-block-button__link,
.wp-element-button {
	display: inline-block;
	padding: 13px 28px;
	border: 0;
	border-radius: 2px;
	background: linear-gradient(135deg, var(--gold), var(--gold2));
	box-shadow: 0 2px 0 rgba(0, 0, 0, .15);
	color: var(--brown);
	font: 500 1rem 'Jost', sans-serif;
	text-decoration: none;
}

.is-style-outline .wp-block-button__link {
	background: transparent;
	border: 1px solid var(--gold);
	box-shadow: none;
	color: var(--goldd);
}

.alignwide {
	max-width: 1180px;
	margin-inline: auto;
}

.alignfull {
	max-width: none;
}

.aligncenter {
	margin-inline: auto;
	text-align: center;
}

/* ---- Coordonnées et horaires ---- */
.coords p {
	margin-bottom: 1em;
}

.coords strong {
	font-weight: 500;
	color: var(--goldd);
}

.hours {
	max-width: 340px;
	margin: 0 0 1.2em;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--rose);
}

.hours li {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 9px 0;
	border-bottom: 1px solid var(--rose);
	font-size: .98rem;
}

.hours li span:first-child {
	color: var(--brown2);
}

.hours-line {
	margin-top: 14px;
	color: var(--brown2);
	font-size: .98rem;
}

/* ---- Comparateur avant/après ---- */
.ba-tag-left {
	left: 10px;
}

.ba-tag-right {
	right: 10px;
}

/* ---- Galerie ---- */
.grid.gallery figcaption {
	margin-top: 10px;
	color: var(--brown2);
	font-size: .95rem;
	text-align: center;
}

.grid.gallery .photo {
	width: 100%;
	height: auto;
	border-radius: 2px;
}

/* ---- Fiche de prestation ---- */
.svc .photo,
.asym .photo,
.two .photo {
	width: 100%;
	height: auto;
	border-radius: 2px;
}

/* ---- Pagination et recherche ---- */
.pagination {
	display: flex;
	justify-content: center;
	gap: 10px;
	margin-top: 42px;
}

.pagination .page-numbers {
	padding: 9px 16px;
	border: 1px solid var(--gold);
	border-radius: 2px;
	text-decoration: none;
}

.pagination .current {
	background: linear-gradient(135deg, var(--gold), var(--gold2));
}

/* ---- Réglages fins ---- */
.photo {
	display: block;
	border-radius: 2px;
}

figure {
	margin: 0;
}

.entry-meta {
	color: var(--brown2);
	font-size: .95rem;
}

@media (max-width: 760px) {
	.wp-block-columns {
		gap: 22px;
	}

	.hours {
		max-width: none;
	}

	/* Le menu déroulant reprend la mise en colonne de la charte. */
	nav ul {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		width: 100%;
	}

	nav li {
		width: 100%;
	}

	nav li a {
		display: block;
	}
}

/* ---- Bandeau de repères, juste sous le grand titre ---- */
.facts-band {
	padding: 46px 0 36px;
}

.facts-band .facts {
	margin: 0 auto;
}

.facts-band .hours-line {
	margin-top: 22px;
	text-align: center;
}

/* ---- Carte des prestations ---- */
.carte .item h3 a {
	text-decoration: none;
}

.carte .item h3 a:hover {
	color: var(--goldd);
}

/* ---- Fiche de prestation ---- */
.svc .prose {
	margin-bottom: 1.6em;
}

@media (max-width: 760px) {
	.facts-band {
		padding: 34px 0 28px;
	}
}


/* ============================================================
   Page de réservation : le choix du soin à gauche, le
   calendrier Cal.com à droite, dans la charte de l'institut.
   ============================================================ */
.reserve {
	margin: 0 auto;
}

/* Le choix de la prestation, en pastilles alignées */
.reserve-pick {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 38px;
	padding-bottom: 28px;
	border-bottom: 1px solid var(--rose);
}

.reserve-chip {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 11px 18px;
	border: 1px solid var(--gold2);
	border-radius: 2px;
	background: #FAF3E8;
	color: var(--brown);
	font: inherit;
	text-align: left;
	cursor: pointer;
	transition: border-color .2s, background .2s;
}

.reserve-chip:hover {
	border-color: var(--gold);
}

.reserve-chip strong {
	font-weight: 500;
}

.reserve-chip span {
	color: var(--brown2);
	font-size: .88rem;
}

.reserve-chip[aria-pressed="true"] {
	background: linear-gradient(135deg, var(--gold), var(--gold2));
	border-color: var(--gold);
}

.reserve-chip[aria-pressed="true"] span {
	color: var(--goldd);
}

/* Les deux colonnes */
.reserve-body {
	display: grid;
	grid-template-columns: minmax(240px, 300px) 1fr;
	gap: 48px;
	align-items: start;
}

.reserve-recap {
	position: sticky;
	top: 96px;
}

.reserve-eyebrow {
	margin-bottom: 6px;
	color: var(--brown2);
	font-size: .82rem;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.reserve-name {
	margin-bottom: .35em;
	font-family: 'Playfair Display', Georgia, serif;
	font-size: clamp(1.7rem, 3.2vw, 2.3rem);
	font-weight: 500;
	line-height: 1.1;
}

.reserve-meta {
	display: flex;
	align-items: baseline;
	gap: 14px;
	margin-bottom: 1em;
	padding-bottom: 14px;
	border-bottom: 1px solid var(--rose);
}

.reserve-duration {
	color: var(--brown2);
	font-size: .95rem;
}

.reserve-price {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 1.65rem;
	font-variant-numeric: tabular-nums;
	color: var(--goldd);
}

.reserve-intro {
	margin-bottom: 1.2em;
	color: var(--brown2);
}

.reserve-trust {
	margin: 0 0 1.2em;
	padding: 0;
	list-style: none;
	font-size: .95rem;
}

.reserve-trust li {
	position: relative;
	padding: 7px 0 7px 22px;
	border-bottom: 1px solid var(--rose);
}

.reserve-trust li::before {
	content: "";
	position: absolute;
	top: 15px;
	left: 2px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--gold);
}

.reserve-link {
	font-size: .95rem;
}

/* Le calendrier */
.reserve-calendar {
	min-width: 0;
}

.reserve-embed {
	min-height: 580px;
	padding: 10px;
	border: 1px solid var(--rose);
	border-radius: 2px;
	background: #FAF3E8;
	overflow: hidden;
}

.reserve-embed > .hint {
	padding: 40px 0;
	text-align: center;
}

.reserve-embed iframe {
	width: 100%;
	border: 0;
}

.reserve--waiting .reserve-body {
	grid-template-columns: 1fr;
}

.reserve--waiting .reserve-recap {
	position: static;
	max-width: 560px;
}

@media (max-width: 900px) {
	.reserve-body {
		grid-template-columns: 1fr;
		gap: 30px;
	}

	.reserve-recap {
		position: static;
	}

	.reserve-embed {
		min-height: 520px;
		padding: 6px;
	}

	.reserve-chip {
		flex: 1 1 calc(50% - 10px);
	}
}

/* ---- Vidéo du grand titre : apparition en douceur ----

   L'image et la vidéo cohabitent le temps du fondu, donc les deux se
   superposent au lieu de s'empiler. */
.hero-media img,
.hero-media video {
	position: absolute;
	inset: 0;
}

.hero-media video {
	opacity: 0;
}

.hero-media img,
.hero-media video {
	transition: opacity .9s ease;
}

.hero-media--playing video {
	opacity: 1;
}

.hero-media--playing img {
	opacity: 0;
}

@media (prefers-reduced-motion: reduce) {
	.hero-media video {
		transition: none;
	}
}

/* ---- Le comparateur épouse la forme des photos ---- */
.ba {
	aspect-ratio: var(--ba-ratio, 4 / 3);
}

/* Le style en ligne autorisé sur le comparateur ne porte que ce rapport. */
.ba .photo {
	border-radius: 0;
}

/* ---- Réservation en attente de configuration ---- */
.reserve-lead {
	max-width: 46ch;
	margin-bottom: 1.4em;
	font-size: 1.1rem;
}

.reserve--waiting .quick {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}