@font-face{font-family:'Avenir XANADU';src:url('fonts/AvenirNextCyr-Light.woff2') format('woff2'),url('fonts/AvenirNextCyr-Light.ttf') format('truetype');font-weight:300;font-display:swap}
@font-face{font-family:'Cormorant XANADU';src:url('fonts/CormorantGaramond-Regular.woff2') format('woff2'),url('fonts/CormorantGaramond-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Cormorant XANADU';src:url('fonts/CormorantGaramond-Italic.woff2') format('woff2'),url('fonts/CormorantGaramond-Italic.ttf') format('truetype');font-weight:400;font-style:italic;font-display:swap}
:root{--brun:#0C2122;--or:#A38333;--creme:#F6F2EA;--ivoire:#F6F2EA;--encre:#0C2122;--muet:#7A6F60;--hair:rgba(26,20,16,.14);--hair-or:rgba(201,162,67,.45);--slab:'Cormorant XANADU',Georgia,serif;--sans:'Avenir XANADU','Helvetica Neue',sans-serif}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);font-weight:400;color:var(--encre);background:var(--ivoire);line-height:1.7;font-size:16px;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
.wrap{max-width:1180px;margin:0 auto;padding:0 32px}
.narrow{max-width:820px;margin:0 auto;padding:0 32px}
.rule{width:44px;height:1px;background:var(--or);border:none;margin:0 0 26px}
.rule.center{margin-left:auto;margin-right:auto}
.eyebrow{font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--or);font-weight:400;margin-bottom:18px}
h1,h2,h3{font-family:var(--slab);font-weight:300;line-height:1.25;color:var(--brun)}
h1{font-size:clamp(32px,4vw,50px)}
h2{font-size:clamp(25px,3vw,34px);margin-bottom:20px}
h3{font-size:19px}
.lede{color:var(--muet);font-size:16.5px}
header{position:sticky;top:0;z-index:50;background:rgba(250,245,234,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--hair)}
.nav{display:flex;align-items:center;justify-content:space-between;height:76px;gap:20px}
.logo{font-family:var(--slab);font-weight:400;font-size:21px;letter-spacing:.26em;color:var(--brun);white-space:nowrap}
.logo span{color:var(--or)}
.menu{display:flex;gap:30px;list-style:none;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:400}
.menu a{padding-bottom:5px;border-bottom:1px solid transparent;transition:border-color .25s}
.menu a:hover,.menu a.on{border-color:var(--or)}
.cta{font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:400;color:var(--brun);border:1px solid var(--brun);padding:13px 24px 11px;transition:all .25s;white-space:nowrap;display:inline-block}
.cta:hover{background:var(--brun);color:var(--creme)}
.cta.gold{border-color:var(--or);color:var(--or)}
.cta.gold:hover{background:var(--or);color:var(--brun)}
.cta.light{border-color:var(--creme);color:var(--creme)}
.cta.light:hover{background:var(--creme);color:var(--brun)}
.crumb{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muet);padding:26px 0 0}
.crumb a:hover{color:var(--or)}
.crumb span{color:var(--or);margin:0 8px}
.page-hero{padding:50px 0 64px;border-bottom:1px solid var(--hair)}
.page-hero .lede{max-width:680px;margin-top:18px}
.notice{font-size:12px;letter-spacing:.08em;color:var(--muet);border:1px solid var(--hair);padding:10px 16px;display:inline-block;margin-top:28px}
.essentiel{border-bottom:1px solid var(--hair)}
.ess-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.ess{padding:34px 26px;border-left:1px solid var(--hair)}
.ess:first-child{border-left:none}
.ess b{display:block;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--or);font-weight:400;margin-bottom:10px}
.ess span{font-family:var(--slab);font-size:17px;color:var(--brun);line-height:1.4}
section{padding:90px 0}
.prose p{margin-bottom:18px;color:var(--encre)}
.prose p.lede{color:var(--muet)}
.pourqui{background:#EDE7D8;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.pq-list{list-style:none;margin-top:36px}
.pq-list li{padding:18px 0;border-bottom:1px solid var(--hair);display:flex;gap:18px;align-items:baseline;font-size:15.5px}
.pq-list li::before{content:'';width:18px;height:1px;background:var(--or);flex:none;transform:translateY(-4px)}
.steps{display:grid;grid-template-columns:repeat(3,1fr);margin-top:50px;border-top:1px solid var(--hair)}
.step{padding:40px 34px 8px;border-left:1px solid var(--hair)}
.step:first-child{border-left:none;padding-left:0}
.step em{display:block;font-family:var(--slab);font-style:normal;font-size:14px;color:var(--or);letter-spacing:.2em;text-transform:uppercase;margin-bottom:14px}
.step h3{margin-bottom:10px}
.step p{font-size:14.5px;color:var(--muet)}
.cadre{background:var(--brun);color:var(--creme)}
.cadre h2{color:var(--creme)}
.cadre p{color:rgba(245,230,200,.72)}
.cadre-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start}
.cadre ul{list-style:none;margin-top:8px}
.cadre li{padding:15px 0;border-bottom:1px solid rgba(245,230,200,.14);font-size:15px;display:flex;gap:16px;align-items:baseline}
.cadre li::before{content:'';width:18px;height:1px;background:var(--or);flex:none;transform:translateY(-4px)}
.consult{text-align:center;border-bottom:1px solid var(--hair)}
.consult .lede{max-width:560px;margin:0 auto 36px}
.related{padding:70px 0 100px}
.rel-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:44px}
.rel{border:1px solid var(--hair);padding:26px 24px;background:#fff;transition:border-color .25s}
.rel:hover{border-color:var(--hair-or)}
.rel b{font-family:var(--slab);font-weight:400;font-size:17px;color:var(--brun);display:block;margin-bottom:6px}
.rel span{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muet)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:56px}
.acard{background:#fff;border:1px solid var(--hair);padding:38px 34px;display:flex;flex-direction:column;transition:transform .3s,box-shadow .3s}
.acard:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(26,20,16,.08)}
.acard h3{margin-bottom:12px}
.acard p{font-size:14px;color:var(--muet);flex:1;line-height:1.65}
.link-line{display:inline-block;margin-top:24px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:400;color:var(--brun);padding-bottom:6px;border-bottom:1px solid var(--or);transition:letter-spacing .25s;align-self:flex-start}
.link-line:hover{letter-spacing:.24em}
/* Le pied de page reprend la lueur du hero, en plus retenu : il porte
   beaucoup de texte fin, qu'un fond trop clair rendrait laborieux. */
footer{background:var(--brun);background:radial-gradient(105% 130% at 0% 100%,#0C3336 0%,#0C2122 45%,#061518 100%);color:rgba(245,230,200,.6);padding:60px 0 36px;font-size:13.5px}
.foot-legal{border-top:1px solid rgba(245,230,200,.12);padding-top:26px;margin-top:40px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;font-size:12px}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:60px}
.foot-grid .logo{color:var(--creme);margin-bottom:16px;display:block}
footer h4{font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--or);font-weight:400;margin-bottom:18px}
footer ul{list-style:none}
footer li{margin-bottom:10px}
footer a:hover{color:var(--creme)}
@media(max-width:980px){
.menu{display:none}
.ess-grid{grid-template-columns:repeat(2,1fr)}
.ess:nth-child(3){border-left:none}
.ess{border-top:1px solid var(--hair)}
.ess:nth-child(-n+2){border-top:none}
.steps{grid-template-columns:1fr}
.step{border-left:none;border-top:1px solid var(--hair);padding:32px 0 6px}
.step:first-child{border-top:none}
.cadre-grid{grid-template-columns:1fr;gap:36px}
.rel-grid{grid-template-columns:repeat(2,1fr)}
.cards{grid-template-columns:1fr}
.foot-grid{grid-template-columns:1fr;gap:32px}
section{padding:64px 0}
}
@media(max-width:560px){.rel-grid{grid-template-columns:1fr}.ess-grid{grid-template-columns:1fr}.ess{border-left:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto}}

/* espace praticiens — page brun nuit */
.dark-page{background:var(--brun);color:rgba(245,230,200,.75)}
.dark-page h1,.dark-page h2,.dark-page h3{color:var(--creme)}
.dark-page .lede{color:rgba(245,230,200,.6)}
.dark-page header{background:rgba(26,20,16,.92);border-bottom:1px solid rgba(245,230,200,.12)}
.dark-page .logo,.dark-page .menu a{color:var(--creme)}
.dark-page .nav .cta{border-color:var(--creme);color:var(--creme)}
.dark-page .nav .cta:hover{background:var(--creme);color:var(--brun)}
.dark-page .crumb{color:rgba(245,230,200,.45)}
.dark-page .page-hero{border-bottom:1px solid rgba(245,230,200,.12)}
.dark-page .notice{color:rgba(245,230,200,.5);border-color:rgba(245,230,200,.18)}
.dark-page section{border-color:rgba(245,230,200,.12)}
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:56px;border-top:1px solid rgba(245,230,200,.14)}
.feat{padding:40px 34px 34px;border-left:1px solid rgba(245,230,200,.14)}
.feat:first-child,.feat:nth-child(4){border-left:none;padding-left:0}
.feat:nth-child(n+4){border-top:1px solid rgba(245,230,200,.14)}
.feat b{display:block;font-family:var(--slab);font-weight:400;font-size:18px;color:var(--creme);margin-bottom:10px}
.feat b::before{content:'';display:block;width:18px;height:1px;background:var(--or);margin-bottom:16px}
.feat p{font-size:14.5px;color:rgba(245,230,200,.6)}
.dark-page .steps{border-top:1px solid rgba(245,230,200,.14)}
.dark-page .step{border-color:rgba(245,230,200,.14)}
.dark-page .step p{color:rgba(245,230,200,.6)}
.contact-band{background:#123033;border-top:1px solid rgba(245,230,200,.12);border-bottom:1px solid rgba(245,230,200,.12)}
.contact-band .wrap{display:grid;grid-template-columns:1.2fr 1fr;gap:70px;align-items:center}
.contact-list{list-style:none;margin-top:8px}
.contact-list li{padding:15px 0;border-bottom:1px solid rgba(245,230,200,.14);font-size:15px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.contact-list b{font-weight:400;letter-spacing:.1em;text-transform:uppercase;font-size:11.5px;color:rgba(245,230,200,.45);align-self:center}
.contact-list a:hover{color:var(--or)}
.confid{font-size:13px;color:rgba(245,230,200,.45);margin-top:24px}
@media(max-width:980px){
.feat-grid{grid-template-columns:1fr}
.feat{border-left:none;border-top:1px solid rgba(245,230,200,.14);padding:30px 0 24px}
.feat:first-child{border-top:none}
.contact-band .wrap{grid-template-columns:1fr;gap:36px}
}

/* photos actes */
.page-hero.has-photo{display:grid;grid-template-columns:1.15fr 1fr;gap:70px;align-items:center;padding-bottom:0;border-bottom:none}
.hero-photo{height:400px;overflow:hidden}
.hero-photo img{width:100%;height:100%;object-fit:cover;filter:saturate(.78)}
.hero-sep{border-bottom:1px solid var(--hair);margin-top:56px}
.acard{padding:0}
.acard .acard-body{padding:30px 32px 34px;display:flex;flex-direction:column;flex:1}
.acard-img{height:190px;overflow:hidden}
.acard-img img{width:100%;height:100%;object-fit:cover;filter:saturate(.75);transition:transform .5s}
.acard:hover .acard-img img{transform:scale(1.04)}
/* page clinique */
.feat-grid.light{border-top:1px solid var(--hair)}
.feat-grid.light .feat{border-color:var(--hair)}
.feat-grid.light .feat b{color:var(--brun)}
.feat-grid.light .feat p{color:var(--muet)}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:60px}
.duo img{width:100%;height:380px;object-fit:cover;filter:saturate(.8)}
/* fiches chirurgiens */
.doc-hero{display:grid;grid-template-columns:360px 1fr;gap:64px;align-items:center;padding:64px 0}
.doc-hero img,.doc-hero .ph-big{width:360px;max-width:100%;aspect-ratio:1;height:auto;object-fit:cover}
.ph-big{display:flex;align-items:center;justify-content:center;background:var(--creme);color:var(--or);font-family:var(--slab);font-size:52px;border:1px solid var(--hair-or)}
.doc-hero .lede{max-width:560px;margin-top:14px}
.chips{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.chip{border:1px solid var(--hair);padding:11px 20px 9px;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;transition:border-color .25s}
.chip:hover{border-color:var(--or);color:var(--or)}
.cv{list-style:none;margin-top:36px;max-width:720px}
.cv li{padding:16px 0;border-bottom:1px solid var(--hair);display:flex;gap:18px;align-items:baseline;font-size:15.5px}
.cv li::before{content:'';width:18px;height:1px;background:var(--or);flex:none;transform:translateY(-4px)}
@media(max-width:980px){
.page-hero.has-photo{grid-template-columns:1fr;gap:36px}
.hero-photo{height:280px}
.duo{grid-template-columns:1fr}
.duo img{height:260px}
.doc-hero{grid-template-columns:1fr;gap:34px;text-align:left}
}

/* — retouches contraste — */
:root{--muet:#5A6B66;--or-txt:#7E6426}
.eyebrow,.ess b,.step em,.news time,.crumb span{color:var(--or-txt)}
.cadre .eyebrow,.b2b .eyebrow,.dark-page .eyebrow,footer h4{color:#C9A243}
.dark-page .step em{color:var(--or)}
.dark-page{color:rgba(245,230,200,.85)}
.dark-page .lede{color:rgba(245,230,200,.72)}
.feat p{color:rgba(245,230,200,.72)}
.dark-page .step p{color:rgba(245,230,200,.72)}
.cadre p{color:rgba(245,230,200,.82)}
footer{color:rgba(245,230,200,.75)}
.confid{color:rgba(245,230,200,.6)}
.contact-list b{color:rgba(245,230,200,.55)}
.notice{color:#5A6B66}
/* — FAQ — */
.faq{border-top:1px solid var(--hair)}
.faq-list{margin-top:44px;border-top:1px solid var(--hair);max-width:820px}
.faq-list details{border-bottom:1px solid var(--hair)}
.faq-list summary{list-style:none;cursor:pointer;padding:24px 44px 22px 0;font-family:var(--slab);font-size:18px;color:var(--brun);position:relative}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:'+';position:absolute;right:6px;top:22px;font-family:var(--sans);font-weight:300;font-size:22px;color:var(--or-txt);transition:transform .25s}
.faq-list details[open] summary::after{transform:rotate(45deg)}
.faq-list details p{padding:0 0 26px;color:var(--muet);font-size:15px;max-width:720px}
/* — posez vos questions — */
.ask{background:#EDE7D8;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.ask .wrap{display:grid;grid-template-columns:1.3fr 1fr;gap:70px;align-items:center}
.ask small{display:block;font-size:12.5px;color:var(--muet);margin-top:22px;max-width:520px;line-height:1.6}
/* — rencontres — */
.event-feature{background:var(--brun);color:var(--creme);display:grid;grid-template-columns:1.1fr 1fr;margin-top:56px}
.event-feature .ef-txt{padding:56px 54px}
.event-feature h3{color:var(--creme);font-size:26px;margin-bottom:14px}
.event-feature p{color:rgba(245,230,200,.75);font-size:15px}
.event-feature img{width:100%;height:100%;object-fit:cover;opacity:.85;min-height:320px}
.badge{display:inline-block;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--or);border:1px solid var(--hair-or);padding:8px 16px 6px;margin-bottom:22px}
.prog{list-style:none;margin-top:44px;border-top:1px solid var(--hair);max-width:820px}
.prog li{padding:24px 0;border-bottom:1px solid var(--hair);display:grid;grid-template-columns:120px 1fr;gap:28px;align-items:baseline}
.prog b{font-family:var(--slab);font-weight:400;color:var(--or-txt);font-size:16px}
.prog span{font-size:15px;color:var(--encre)}
.prog small{display:block;font-size:13.5px;color:var(--muet);margin-top:4px}
.art-date{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--or-txt);margin-bottom:18px}
@media(max-width:980px){
.ask .wrap{grid-template-columns:1fr;gap:32px}
.event-feature{grid-template-columns:1fr}
.event-feature .ef-txt{padding:40px 30px}
.prog li{grid-template-columns:1fr;gap:6px}
}

/* — nav : une seule ligne — */
.nav{gap:16px}
.menu{gap:22px;font-size:11.5px;letter-spacing:.1em;flex-wrap:nowrap}
.menu a{white-space:nowrap}
.logo{font-size:19px;letter-spacing:.2em}
.nav .cta{padding:12px 20px 10px;font-size:10.5px;letter-spacing:.1em}
@media(max-width:1120px){.menu{gap:16px;font-size:11px}}
/* — état actif : couleur + soulignement or — */
.menu a.on{color:var(--or-txt);border-color:var(--or)}
.dark-page .menu a.on,.hero .menu a.on{color:var(--or)}
/* — hub interventions : bandes visuelles — */
.hub-band{display:grid;grid-template-columns:1fr 1.35fr;gap:64px;align-items:center}
.hub-band.flip{grid-template-columns:1.35fr 1fr}
.hub-band.flip .hub-img{order:2}
.hub-img{height:400px;overflow:hidden}
.hub-img img{width:100%;height:100%;object-fit:cover;filter:saturate(.8)}
.hub-chips{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:32px}
.hub-chip{border:1px solid var(--hair);padding:16px 20px 14px;display:flex;justify-content:space-between;align-items:baseline;gap:14px;transition:border-color .25s;background:#fff}
.hub-chip:hover{border-color:var(--or)}
.hub-chip b{font-family:var(--slab);font-weight:400;font-size:15.5px;color:var(--brun)}
.hub-chip span{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muet);white-space:nowrap}
@media(max-width:980px){
.hub-band,.hub-band.flip{grid-template-columns:1fr;gap:34px}
.hub-band.flip .hub-img{order:0}
.hub-img{height:260px}
.hub-chips{grid-template-columns:1fr}
}

/* — stats & contenus livret praticiens — */
.stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(245,230,200,.14);border-bottom:1px solid rgba(245,230,200,.14)}
.stat{padding:38px 26px;border-left:1px solid rgba(245,230,200,.14)}
.stat:first-child{border-left:none;padding-left:0}
.stat b{display:block;font-family:var(--slab);font-weight:300;font-size:40px;color:var(--creme);line-height:1;margin-bottom:10px}
.stat span{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(245,230,200,.55);line-height:1.6;display:block}
.bigquote{max-width:760px;font-family:var(--slab);font-weight:300;font-size:clamp(20px,2.6vw,27px);line-height:1.5;color:var(--creme)}
.bigquote::before{content:'“';color:var(--or);margin-right:6px}
.bigquote::after{content:'”';color:var(--or);margin-left:6px}
.list-cols{display:grid;grid-template-columns:1fr 1fr;gap:70px;margin-top:50px}
.list-cols h3{color:var(--creme);margin-bottom:6px}
.list-cols h3::after{content:'';display:block;width:18px;height:1px;background:var(--or);margin-top:14px}
.list-cols ul{list-style:none;margin-top:20px}
.list-cols li{padding:11px 0;border-bottom:1px solid rgba(245,230,200,.12);font-size:14.5px;color:rgba(245,230,200,.78)}
.norm-list{list-style:none;margin-top:34px;max-width:760px}
.norm-list li{padding:13px 0;border-bottom:1px solid rgba(245,230,200,.12);font-size:14.5px;color:rgba(245,230,200,.78);display:flex;gap:18px}
.norm-list b{font-weight:400;color:var(--creme);white-space:nowrap;font-size:13.5px;letter-spacing:.04em}
@media(max-width:980px){
.stats{grid-template-columns:repeat(2,1fr)}
.stat{border-left:none;border-top:1px solid rgba(245,230,200,.14);padding-left:0}
.stat:nth-child(-n+2){border-top:none}
.list-cols{grid-template-columns:1fr;gap:40px}
}

/* — icônes filaires or — */
.ico{display:block;margin-bottom:16px}
.ico svg{width:38px;height:38px;stroke:var(--or);fill:none;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;display:block}
.stat .ico{margin-bottom:14px}
.stat .ico svg{width:34px;height:34px}
.feat .ico + b::before{display:none}

/* — honoraires — */
.hon-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:56px}
.hon-card{border:1px solid var(--hair);padding:36px 32px;background:#fff}
.hon-card .ico{margin-bottom:18px}
.hon-card .ico svg{width:34px;height:34px;stroke:var(--or);fill:none;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.hon-card h3{margin-bottom:12px}
.hon-card p{font-size:14.5px;color:var(--muet)}
/* — séjour timeline — */
.stay{margin-top:56px;border-top:1px solid var(--hair)}
.stay-row{display:grid;grid-template-columns:180px 1fr;gap:50px;padding:44px 0;border-bottom:1px solid var(--hair)}
.stay-row .ph{font-family:var(--slab);font-weight:300;font-size:15px;letter-spacing:.2em;text-transform:uppercase;color:var(--or-txt);padding-top:4px}
.stay-row h3{margin-bottom:14px}
.stay-row p{color:var(--muet);font-size:15px;margin-bottom:14px}
.stay-row ul{list-style:none;margin-top:10px}
.stay-row li{padding:9px 0;border-bottom:1px solid var(--hair);font-size:14.5px;display:flex;gap:14px;align-items:baseline}
.stay-row li:last-child{border-bottom:none}
.stay-row li::before{content:'';width:16px;height:1px;background:var(--or);flex:none;transform:translateY(-4px)}
@media(max-width:980px){
.hon-grid{grid-template-columns:1fr}
.stay-row{grid-template-columns:1fr;gap:12px}
}




/* — dropdown compact (v13) — */

.menu li.has-sub{position:relative}
.menu li.has-sub>a::after{content:'\2304';margin-left:5px;font-size:12px;color:var(--muet);vertical-align:2px;transition:color .2s}
.menu li.has-sub:hover>a::after{color:var(--or-txt)}
.menu .submenu{position:absolute;top:calc(100% + 14px);left:-20px;min-width:250px;background:var(--ivoire);border-top:1px solid var(--or);box-shadow:0 20px 40px rgba(26,20,16,.1);padding:16px 0;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .2s,transform .2s,visibility .2s;z-index:59}
.menu li.has-sub::after{content:'';position:absolute;top:100%;left:0;right:0;height:16px}
.menu li.has-sub:hover .submenu,.menu li.has-sub:focus-within .submenu{opacity:1;visibility:visible;transform:translateY(0)}
.menu .submenu a{display:block;padding:11px 24px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--encre);border:none;white-space:nowrap;transition:color .18s,padding-left .2s}
.menu .submenu a:hover{background:none;color:var(--or-txt);padding-left:30px;border-color:transparent}
.menu .submenu a.on{color:var(--or-txt);border-color:transparent}
.menu .submenu .sub-sep{height:1px;background:var(--hair);margin:8px 24px}
.dark-page .menu .submenu{background:#123033;border-top-color:var(--or)}
.dark-page .menu .submenu a{color:rgba(245,230,200,.85)}
.dark-page .menu .submenu a:hover,.dark-page .menu .submenu a.on{color:var(--or)}
@media(max-width:980px){.menu .submenu{display:none!important}}


/* — alignement vertical parfait des entrées de menu — */
.menu{align-items:center}
.menu>li{display:flex;align-items:center}
.menu>li>a{display:inline-flex;align-items:center;line-height:1}
.menu li.has-sub>a::after{line-height:1;position:relative;top:0}


/* ============ MENU MOBILE ============ */
.burger{display:none;background:none;border:none;cursor:pointer;padding:8px;width:44px;height:44px;flex-direction:column;justify-content:center;gap:5px;z-index:120}
.burger span{display:block;width:24px;height:1.5px;background:var(--brun);transition:transform .3s,opacity .3s}
.dark-page .burger span{background:var(--creme)}
.burger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
.mobile-nav{display:none}

@media(max-width:980px){
  .menu{display:none}
  .nav>.cta{display:none}
  .burger{display:flex}
  .nav{height:64px}
  header{position:sticky}

  .mobile-nav{display:block;position:fixed;top:64px;left:0;right:0;bottom:0;background:var(--ivoire);z-index:110;overflow-y:auto;padding:20px 0 60px;transform:translateX(100%);transition:transform .32s cubic-bezier(.4,0,.2,1);visibility:hidden}
  .mobile-nav.open{transform:translateX(0);visibility:visible}
  .dark-page .mobile-nav{background:var(--brun)}
  body.menu-locked{overflow:hidden}

  .m-group{border-bottom:1px solid var(--hair)}
  .dark-page .m-group{border-color:rgba(245,230,200,.14)}
  .m-top{display:flex;justify-content:space-between;align-items:center;width:100%;padding:20px 28px;background:none;border:none;font-family:var(--slab);font-weight:300;font-size:21px;color:var(--brun);letter-spacing:.02em;cursor:pointer;text-align:left}
  .dark-page .m-top{color:var(--creme)}
  .m-top a{color:inherit;flex:1}
  .m-toggle{width:40px;height:40px;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:300;color:var(--or-txt);transition:transform .28s;flex:none}
  .dark-page .m-toggle{color:var(--or)}
  .m-group.open .m-toggle{transform:rotate(45deg)}
  .m-sub{max-height:0;overflow:hidden;transition:max-height .32s ease}
  .m-group.open .m-sub{max-height:600px}
  .m-sub a{display:block;padding:13px 28px 13px 44px;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--muet);border-top:1px solid var(--hair)}
  .dark-page .m-sub a{color:rgba(245,230,200,.7);border-color:rgba(245,230,200,.1)}
  .m-sub a:active{color:var(--or-txt)}
  .m-cta{margin:28px 28px 0;display:block;text-align:center;padding:18px;border:1px solid var(--brun);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--brun)}
  .dark-page .m-cta{border-color:var(--creme);color:var(--creme)}

  /* confort tactile général */
  .cta,.link-line,.menu a{min-height:44px}
  h1{font-size:clamp(30px,8vw,40px)}
  .wrap,.narrow{padding-left:22px;padding-right:22px}
  .page-hero{padding-top:30px}
  .faq-list summary{padding-right:40px}
  .hero-actions{flex-direction:column;align-items:stretch}
  .hero-actions .cta{text-align:center}
}
@media(max-width:560px){
  .stat b{font-size:32px}
  .bigquote{font-size:19px}
  .logo{font-size:17px;letter-spacing:.14em}
}

/* — fix mobile header v16 — */
@media(max-width:980px){
  header .nav > .cta{display:none !important}
  .burger{display:flex !important;position:relative;z-index:130}
  .nav{position:relative}
  .mobile-nav{z-index:125}
}


header .wrap.nav{max-width:none;padding-left:40px;padding-right:40px;gap:32px}






/* logo petrol foncé, sans pastille */
.logo{background:none;padding:0;border-radius:0;display:inline-flex;align-items:center;transition:opacity .2s}
.logo:hover{opacity:.7}
.logo img{height:58px;width:auto;display:block}
@media(max-width:980px){.logo img{height:44px}}

/* grille portraits équipe */
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;margin-top:50px}
.team-card{margin:0}
.team-card img{width:100%;aspect-ratio:1;object-fit:cover;filter:saturate(.92)}
.team-card figcaption{margin-top:16px;text-align:center}
.team-card b{display:block;font-family:var(--slab);font-weight:400;font-size:18px;color:var(--brun);margin-bottom:4px}
.team-card span{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muet)}
@media(max-width:900px){.team-grid{grid-template-columns:repeat(2,1fr);gap:20px}}

/* — confort tactile mobile : la zone cliquable atteint 44 px sans
     modifier la mise en page (extension par pseudo-élément) — */
@media(max-width:980px){
  .coord li a,
  footer li a,
  .foot-legal a{position:relative;display:inline-block}
  .coord li a::after,
  footer li a::after,
  .foot-legal a::after{content:'';position:absolute;left:0;right:0;top:-13px;bottom:-13px}
  .coord li b{align-self:center}
}

/* — mise en page en deux colonnes, commune a plusieurs pages — */
.split{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
@media(max-width:980px){
  .split{grid-template-columns:1fr;gap:40px}
}

/* Sur le fond dégradé du pied de page, l'or profond perd en lisibilité :
   les intitulés de colonne reprennent l'or lumineux de la charte. */
footer h4{color:#C9A243}

/* — Très petits écrans (320 px : iPhone en affichage zoomé, réglage
     d'accessibilité fréquent chez les lecteurs presbytes).
     Une colonne « 1fr » ne descend jamais sous la largeur minimale de
     son contenu : une adresse e-mail insécable de 26 caractères ou un
     intitulé long élargissaient la colonne au-delà de l'écran, et la
     page défilait latéralement. « minmax(0,1fr) » lève cette contrainte,
     et les adresses peuvent désormais se couper. — */
@media(max-width:400px){
  .split,
  .contact-band .wrap{grid-template-columns:minmax(0,1fr)}
  .split > *,
  .contact-band .wrap > *,
  .proof-grid > *{min-width:0}
  a[href^="mailto:"],
  .coord li a,
  .contact-list a,
  .contact-list span{overflow-wrap:anywhere}
  /* les libellés de bouton les plus longs doivent pouvoir passer
     à la ligne plutôt que de dépasser de l'écran */
  .cta{white-space:normal;text-align:center;line-height:1.35}
}

/* Le logo d'en-tête fait 38 px de haut en mobile : on étend sa zone
   tactile à 44 px par du remplissage, sans toucher à son apparence. */
@media(max-width:980px){
  .logo{padding:3px 0}
}

/* — Zones tactiles des pages internes. Le fil d'Ariane et les listes de
     coordonnées sont de véritables cibles de navigation : leur surface
     est portée à 44 px sans décaler la mise en page.
     Les liens situés à l'intérieur d'un paragraphe ne sont pas traités :
     les agrandir ferait déborder leur zone sur les lignes voisines, et
     le critère WCAG 2.5.8 les exclut précisément pour cette raison. — */
@media(max-width:980px){
  .crumb a,
  .contact-list a,
  .contact-list span,
  .legal dd a{position:relative;display:inline-block}
  .crumb a::after,
  .contact-list a::after,
  .legal dd a::after{content:'';position:absolute;left:0;right:0;top:-12px;bottom:-12px}
}

/* ————— Grille tarifaire —————
   Une liste de trente-cinq actes se lit mal en colonnes serrées : l'œil
   perd la ligne entre le libellé et le montant. Chaque famille d'actes
   forme donc un bloc distinct, les lignes respirent, et un filet pointillé
   relie l'acte à son prix. */
.tarifs-zone{border-top:1px solid var(--hair)}
.tarifs-cadre{background:#F3ECDC;border-top:1px solid var(--hair)}
.tarif-consult{border:1px solid var(--hair);background:#fff;padding:34px 32px 36px}

.tarif-bloc{
  border:1px solid var(--hair);
  background:#fff;
  padding:30px 34px 34px;
  margin-top:26px;
}
.tarif-groupe{
  font-family:var(--sans);font-weight:400;font-size:11.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--or-txt);
  margin:0 0 6px;
}

ul.tarifs{list-style:none;margin:0;padding:0}
ul.tarifs li{
  display:flex;align-items:baseline;gap:14px;
  padding:17px 0;
  border-bottom:1px solid var(--hair);
}
ul.tarifs li:last-child{border-bottom:none;padding-bottom:2px}
ul.tarifs li:first-child{padding-top:10px}
ul.tarifs span{flex:0 1 auto;font-size:15.5px;line-height:1.5;color:var(--encre)}
/* le filet relie l'acte à son montant sans les coller */
ul.tarifs li::after{
  content:'';order:1;flex:1 1 24px;min-width:24px;
  border-bottom:1px dotted var(--hair-strong, rgba(12,33,34,.22));
  transform:translateY(-4px);
}
ul.tarifs b{
  order:2;flex:none;
  font-weight:400;font-family:var(--slab);font-size:18px;color:var(--brun);
  white-space:nowrap;font-variant-numeric:tabular-nums;
}

.tarifs-legal{background:var(--brun);color:var(--creme);
  background:radial-gradient(115% 100% at 0% 100%,#0E4448 0%,#0B2B2D 40%,#0C2122 65%,#061518 100%)}
.tarifs-legal h2{color:var(--creme)}
.tarifs-legal .eyebrow{color:#C9A243}
.tarifs-legal .lede{color:rgba(245,230,200,.82)}
.tarifs-legal .cta{border-color:#C9A243;color:#C9A243;margin-top:34px}
.tarifs-legal .cta:hover{background:#C9A243;color:var(--brun)}
@media(max-width:980px){
  .tarif-consult{padding:28px 24px 30px}
  .tarif-bloc{padding:24px 22px 26px;margin-top:20px}
  ul.tarifs li::after{display:none}
  /* Sur un écran étroit, libellé et montant se suivaient sans rupture
     nette : l'œil ne savait plus où finissait l'un et commençait l'autre.
     Le prix passe donc à la ligne, se détache en or, et chaque acte
     dispose de plus d'air. */
  ul.tarifs li{
    display:block;
    padding:18px 0 20px;
  }
  ul.tarifs span{
    display:block;
    font-size:15px;
    line-height:1.5;
    margin-bottom:9px;
  }
  ul.tarifs b{
    display:block;
    font-size:17px;
    color:var(--or-txt);
  }
  .tarif-groupe{margin:38px 0 2px}
}

/* ═══════════ Menu mobile : ouverture en cascade ═══════════
   Le panneau glissait d'un bloc, en ivoire, avec des entrées de 21 px.
   Il adopte le fond pétrole du site, une typographie plus ample, et les
   entrées montent l'une après l'autre à l'ouverture. Les accordéons sont
   conservés : 27 liens ne tiendraient pas sur un écran sans eux. */
@media(max-width:980px){
  .mobile-nav{
    background:var(--brun);
    background:radial-gradient(130% 90% at 0% 100%,
      #0E4448 0%,#0B2B2D 38%,#0C2122 62%,#061518 100%);
    padding:34px 0 70px;
  }
  .dark-page .mobile-nav{background:radial-gradient(130% 90% at 0% 100%,
      #0E4448 0%,#0B2B2D 38%,#0C2122 62%,#061518 100%)}

  /* entrées principales : plus amples, dans le serif de la charte */
  .mobile-nav .m-top{
    font-size:29px;
    padding:16px 28px;
    color:var(--creme);
    letter-spacing:.005em;
  }
  .dark-page .mobile-nav .m-top{color:var(--creme)}
  .mobile-nav .m-group{border-bottom:1px solid rgba(245,230,200,.10)}
  .dark-page .mobile-nav .m-group{border-color:rgba(245,230,200,.10)}
  .mobile-nav .m-toggle{color:#C9A243;font-size:26px}
  .dark-page .mobile-nav .m-toggle{color:#C9A243}

  /* sous-entrées : discrètes, elles ne concurrencent pas le premier niveau */
  .mobile-nav .m-sub a{
    color:rgba(245,230,200,.72);
    border-top-color:rgba(245,230,200,.08);
    padding:13px 28px 13px 44px;
  }
  .dark-page .mobile-nav .m-sub a{color:rgba(245,230,200,.72)}
  .mobile-nav .m-sub a:active{color:#C9A243}

  .mobile-nav .m-cta{
    border-color:#C9A243;color:#C9A243;margin-top:34px;
  }
  .dark-page .mobile-nav .m-cta{border-color:#C9A243;color:#C9A243}

  /* — la cascade —
     Elle repose sur une animation, non sur une transition : au repos les
     entrées sont pleinement visibles, et l'animation ne fait que les
     amener depuis leur état de départ. Si elle ne se déclenche pas, le
     menu reste lisible — la visibilité ne dépend jamais du mouvement. */
  .mobile-nav.open .m-group,
  .mobile-nav.open .m-cta{
    animation:xanaduEntree .5s cubic-bezier(.22,1,.36,1) both;
  }
  .mobile-nav.open .m-group:nth-child(1){animation-delay:.10s}
  .mobile-nav.open .m-group:nth-child(2){animation-delay:.16s}
  .mobile-nav.open .m-group:nth-child(3){animation-delay:.22s}
  .mobile-nav.open .m-group:nth-child(4){animation-delay:.28s}
  .mobile-nav.open .m-group:nth-child(5){animation-delay:.34s}
  .mobile-nav.open .m-group:nth-child(6){animation-delay:.40s}
  .mobile-nav.open .m-cta{animation-delay:.46s}
}

@keyframes xanaduEntree{
  from{opacity:0;transform:translateY(16px)}
  to{opacity:1;transform:none}
}
/* Une animation ne doit jamais s'imposer à qui n'en veut pas. */
@media(prefers-reduced-motion:reduce){
  .mobile-nav.open .m-group,
  .mobile-nav.open .m-cta{animation:none}
}

/* ═══════════ Sous-menus du bandeau supérieur ═══════════
   Le panneau apparaissait d'un bloc. Ses entrées se posent désormais
   l'une après l'autre — 40 ms d'écart, assez pour se remarquer sans
   retarder la lecture. Comme ailleurs, c'est une animation et non une
   transition : si elle ne se déclenche pas, les liens restent lisibles. */
@media(min-width:981px){
  .menu li.has-sub:hover .submenu > *,
  .menu li.has-sub:focus-within .submenu > *{
    animation:xanaduEntree .34s cubic-bezier(.22,1,.36,1) both;
  }
  .menu li.has-sub:hover .submenu > :nth-child(1){animation-delay:.02s}
  .menu li.has-sub:hover .submenu > :nth-child(2){animation-delay:.06s}
  .menu li.has-sub:hover .submenu > :nth-child(3){animation-delay:.10s}
  .menu li.has-sub:hover .submenu > :nth-child(4){animation-delay:.14s}
  .menu li.has-sub:hover .submenu > :nth-child(5){animation-delay:.18s}
  .menu li.has-sub:hover .submenu > :nth-child(6){animation-delay:.22s}
  .menu li.has-sub:hover .submenu > :nth-child(7){animation-delay:.26s}
  .menu li.has-sub:hover .submenu > :nth-child(8){animation-delay:.30s}
}

@media(prefers-reduced-motion:reduce){
  .menu li.has-sub:hover .submenu > *{animation:none}
}

/* ═══════════ Apparitions au défilement ═══════════
   Un observateur pose la classe « vu » quand l'élément entre dans le
   champ. Tout part de l'état visible : sans JavaScript, ou si le script
   échoue, la page s'affiche normalement — le mouvement n'est qu'un
   supplément, jamais une condition d'affichage. */

/* Le filet or se trace de gauche à droite. */
.js .rule{transform-origin:left center}
.js .rule:not(.vu){transform:scaleX(0)}
.js .rule.vu{transform:scaleX(1);transition:transform .7s cubic-bezier(.22,1,.36,1)}
.js .rule.center{transform-origin:center}

/* Les chiffres de réassurance se posent l'un après l'autre. */
.js .proof-item:not(.vu){opacity:0;transform:translateY(14px)}
.js .proof-item.vu{
  opacity:1;transform:none;
  transition:opacity .55s ease, transform .6s cubic-bezier(.22,1,.36,1);
}
.js .proof-item.vu:nth-child(1){transition-delay:.00s}
.js .proof-item.vu:nth-child(2){transition-delay:.09s}
.js .proof-item.vu:nth-child(3){transition-delay:.18s}
.js .proof-item.vu:nth-child(4){transition-delay:.27s}

@media(prefers-reduced-motion:reduce){
  .js .rule:not(.vu),
  .js .proof-item:not(.vu){opacity:1;transform:none}
}

/* ═══════════ Survol des cartes ═══════════
   L'image se rapproche doucement, la carte se soulève. Le cadrage est
   fixe : c'est l'image qui bouge à l'intérieur, jamais la carte. */
.card img,
.pole-img img{transition:transform .8s cubic-bezier(.22,1,.36,1), filter .5s ease}
.card:hover img{transform:scale(1.055);filter:saturate(.95)}
.card{transition:transform .45s cubic-bezier(.22,1,.36,1), box-shadow .45s ease}
.card:hover{transform:translateY(-5px);box-shadow:0 20px 44px rgba(12,33,34,.10)}
.card .link-line,
.pole .pole-body::after{transition:letter-spacing .35s ease, color .3s ease}
.card:hover .link-line{letter-spacing:.24em;color:var(--or-txt)}

@media(prefers-reduced-motion:reduce){
  .card img,.pole-img img,.card{transition:none}
  .card:hover img,.card:hover{transform:none}
}

/* Survol des pastilles d'intervention : le filet et l'intitulé passent à
   l'or. Rien de plus — la pastille reste lisible et cliquable telle quelle. */
.hub-chip b{transition:color .25s ease}
.hub-chip:hover b{color:var(--or-txt)}

/* ═══════════ Menu mobile : la composition ═══════════
   Les entrées se centrent et gagnent en ampleur, comme chez Maison Yokō.
   Le signe de dépli reste discret, à droite : centrer aussi la ligne
   entière déplacerait le texte à chaque ouverture. */
@media(max-width:980px){
  .mobile-nav{padding:44px 0 80px}

  .mobile-nav .m-top{
    justify-content:center;
    position:relative;
    padding:22px 52px;
    font-size:33px;
    line-height:1.15;
  }
  .mobile-nav .m-top a{flex:0 1 auto;text-align:center}
  .mobile-nav .m-toggle{
    position:absolute;right:20px;top:50%;
    transform:translateY(-50%);
    font-size:24px;opacity:.65;
  }
  .mobile-nav .m-group.open .m-toggle{transform:translateY(-50%) rotate(45deg);opacity:1}

  .mobile-nav .m-group{border-bottom:none}
  .mobile-nav .m-group + .m-group{border-top:1px solid rgba(245,230,200,.09)}

  /* les sous-entrées se centrent aussi, en retrait de ton */
  .mobile-nav .m-sub a{
    text-align:center;
    padding:14px 24px;
    border-top:none;
    font-size:12.5px;
    letter-spacing:.14em;
    /* 0,70 et non 0,62 : en dessous, le contraste tombe à 4,37,
       sous le seuil de lisibilité. */
    color:rgba(245,230,200,.70);
  }
  .mobile-nav .m-sub{padding-bottom:12px}

  .mobile-nav .m-cta{margin:40px 32px 0;padding:20px}
}

/* Le bouton de prise de rendez-vous se trouve tantôt directement dans la
   barre, tantôt dans un conteneur « nav-actions » : la règle de masquage
   mobile n'atteignait que le premier cas, si bien qu'il subsistait sur
   l'accueil et les pages de pôles, et disparaissait ailleurs. Il est
   désormais masqué partout sous 980 px — le menu mobile porte son propre
   appel, et l'espace y est trop compté pour le doubler. */
@media(max-width:980px){
  header .nav .nav-actions{display:none}
}

/* ═══════════ Liens vers les réseaux ═══════════
   Des liens, non des flux intégrés : aucun script tiers, aucun cookie,
   et le contenu publié sur les réseaux reste où il a sa place. */
.reseaux{margin-top:30px}
.reseaux h4{margin-bottom:14px}
.reseaux a{
  display:inline-flex;align-items:center;gap:9px;
  margin-right:22px;
  font-size:13px;
  color:rgba(245,230,200,.78);
  position:relative;
}
.reseaux a:last-child{margin-right:0}
.reseaux svg{
  width:19px;height:19px;flex:none;
  fill:none;stroke:currentColor;stroke-width:1.4;
  stroke-linecap:round;stroke-linejoin:round;
  transition:transform .35s cubic-bezier(.22,1,.36,1), color .3s ease;
}
.reseaux a:hover{color:#C9A243}
.reseaux a:hover svg{transform:translateY(-2px) scale(1.06)}
.reseaux a::after{content:'';position:absolute;left:0;right:0;top:-12px;bottom:-12px}

@media(prefers-reduced-motion:reduce){
  .reseaux svg{transition:none}
  .reseaux a:hover svg{transform:none}
}

/* Les cartes d'actualités et d'articles. Communes à l'accueil et à la page
   Actualités : elles vivent donc ici et non dans home.css, qui n'est chargé
   que par l'accueil. Les marges intérieures sont volontairement larges —
   ce sont des blocs de texte, pas des vignettes. */
.news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:56px}
.news{border:1px solid var(--hair);padding:44px 38px;background:#fff;display:flex;flex-direction:column;min-height:250px}
.news time{font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;margin-bottom:24px;font-weight:400}
.news h2,.news h3{font-size:19px;line-height:1.35;margin-bottom:16px}
.news p{font-size:14.5px;line-height:1.75;color:var(--muet);flex:1}
.news .link-line{margin-top:30px}
/* Sur la page Actualités la grille suit directement le chapeau : elle n'a
   pas de titre de section à décoller. */
.articles .news-grid{margin-top:0}

@media(max-width:980px){
  .news-grid{grid-template-columns:1fr;gap:26px;margin-top:44px}
  .news{min-height:0}
}
@media(max-width:560px){
  .news{padding:36px 28px}
  .news time{margin-bottom:20px}
  .news .link-line{margin-top:26px}
}


/* ═══════════ Coins arrondis des photos ═══════════
   Le site est entierement a angles droits : le rayon reste donc discret,
   6 px, 8 px sur les grands visuels ou un angle vif se voit davantage. Une
   photo affleurant le haut d'une carte bordee entraine la carte avec elle,
   sinon l'angle de la bordure depasserait celui de l'image. */
:root{--rayon:6px;--rayon-large:8px}
.doc-photo{border-radius:var(--rayon)}
.doc-hero img,.doc-hero .ph-big{border-radius:var(--rayon)}
.hub-img{border-radius:var(--rayon-large)}
.split img{border-radius:var(--rayon-large)}
.pole-img img,.card img{border-radius:inherit}


/* ═══════════ Thème : le site est conçu en clair ═══════════
   Sans cette declaration, Chrome sur Android inverse d'autorite les
   couleurs des sites qui ne se prononcent pas (Auto Dark Theme) : le
   creme devient un gris sombre, l'or perd son contraste et les photos
   se retrouvent sur un fond qui n'a pas ete pense pour elles. On declare
   donc explicitement le seul thème que le site sait rendre. Les blocs
   sombres du site — hero, bloc praticiens, pied de page — sont des choix
   de mise en page, pas un thème sombre. */
:root{color-scheme:light}


/* Sur les pages sombres, le separateur du fil d'Ariane heritait de l'or
   destine aux fonds clairs : 2,98 contre le brun, sous le seuil AA. Il
   reprend l'or lumineux, comme les surtitres voisins. */
.dark-page .crumb span,.dark-page .crumb{color:#C9A243}
.dark-page .crumb a{color:rgba(246,242,234,.85)}


/* ═══════════ Barre de navigation : une seule et meme barre ═══════════
   Ces regles vivaient dans home.css, feuille chargee par la seule page
   d'accueil. Le menu s'y etalait sur toute la largeur (flex:1 et
   space-evenly) tandis qu'il restait compact et resserre sur les 44 autres
   pages : la barre changeait de forme des qu'on quittait l'accueil. Le
   bloc « Espace praticiens » n'y avait meme aucun style. Tout remonte donc
   ici. Le reglage du bouton reste scope a l'en-tete : applique largement,
   il retrecirait aussi les boutons du corps des pages. */
header .wrap.nav{gap:18px}
.menu{margin-left:0;margin-right:0;gap:14px;font-size:14px;letter-spacing:.12em;flex:1;justify-content:space-evenly}
/* L'onglet « Nos pôles d'excellence » allonge le menu d'une quinzaine de
   caractères. Sans ces paliers, les intitulés se touchaient (0 px d'écart)
   vers 1150, 1200 et 1350 px. Chaque palier a été mesuré pour garder au
   moins 18 px entre deux intitulés ; 14 px reste la taille au-delà de 1480 px.
   Le palier 1350 remonte d'un cran : « Espace praticiens » y disparaît. */
@media(max-width:1480px){.menu{font-size:13.5px;letter-spacing:.1em}}
@media(max-width:1400px){.menu{font-size:12.5px;letter-spacing:.08em}}
@media(max-width:1350px){.menu{font-size:13px;letter-spacing:.09em}}
@media(max-width:1250px){.menu{font-size:12px;letter-spacing:.07em}}
.nav-actions{display:flex;gap:16px;align-items:center}
.link-prat{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--or-txt);white-space:nowrap;padding-bottom:4px;border-bottom:1px solid var(--or);transition:opacity .2s}
.link-prat:hover{opacity:.7}
.link-prat.on{opacity:.75}

@media(max-width:1350px){
  .link-prat{display:none}
}
/* Suite des paliers du menu (voir plus haut) : sous 1200 px, 12 px ; sous
   1150 px, les titres sont au plus serre, d'ou 11 px et 12 px d'ecart. */
@media(max-width:1200px){
  .menu{font-size:12px;letter-spacing:.07em}
}
@media(max-width:1150px){
  .menu{font-size:11px;letter-spacing:.05em;gap:12px}
}

/* ═══════════ Cartes des pôles d'excellence ═══════════
   Déplacées depuis home.css : la page « Nos pôles d'excellence » les
   utilise aussi, et home.css n'est chargée que par l'accueil. Le filtre
   qui désaturait les photos est retiré à la demande du client. */
.poles-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:60px}
.pole{background:var(--ivoire);border:1px solid var(--hair);display:flex;flex-direction:column;transition:transform .3s,box-shadow .3s;cursor:pointer;text-decoration:none;border-radius:var(--rayon);overflow:hidden}
.pole:hover{transform:translateY(-5px);box-shadow:0 20px 44px rgba(26,20,16,.1)}
.pole-img{height:220px;overflow:hidden;border-radius:var(--rayon) var(--rayon) 0 0}
.pole-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.pole:hover .pole-img img{transform:scale(1.05)}
.pole-body{padding:32px 30px 36px;flex:1;position:relative}
.pole-num{font-family:var(--slab);font-weight:300;font-size:14px;letter-spacing:.2em;color:var(--or-txt);display:block;margin-bottom:12px}
.pole-body h3{margin-bottom:14px}
.pole-body p{font-size:14px;color:var(--muet);line-height:1.65}
.pole .pole-body::after{content:'En savoir plus →';display:block;margin-top:16px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--or-txt)}
@media(max-width:980px){.poles-grid{grid-template-columns:1fr;gap:24px}}

/* ═══════════ Équipe : grilles de trois et grille centrée ═══════════ */
.team-grid.trio{grid-template-columns:repeat(3,1fr);max-width:880px;margin-left:auto;margin-right:auto}
.team-grid.centre{display:flex;flex-wrap:wrap;justify-content:center}
.team-grid.centre .team-card{width:calc((100% - 3 * 26px) / 4)}
@media(max-width:900px){
  .team-grid.centre .team-card{width:calc((100% - 20px) / 2)}
}
@media(max-width:560px){
  .team-grid.trio{grid-template-columns:1fr;max-width:320px}
}

/* ═══════════ Retours de septembre ═══════════ */
/* « Cadre légal & sécurité » ne figure plus qu'en fin de page Votre séjour,
   en version claire sur fond beige. */
.cadre.clair{background:#EDE7D8;color:var(--brun);border-top:1px solid var(--hair)}
.cadre.clair h2{color:var(--brun)}
.cadre.clair p{color:var(--muet)}
.cadre.clair .eyebrow{color:var(--or-txt)}
.cadre.clair li{border-bottom-color:var(--hair)}

/* Le lieu : une seule photo, sur toute la largeur */
.duo.solo{grid-template-columns:1fr}
.duo.solo img{height:520px}
@media(max-width:900px){.duo.solo img{height:280px}}

/* Titres de l'équipe cliquables ; lien « En savoir plus » des cartes */
.feat b a{color:inherit;border-bottom:1px solid var(--or);padding-bottom:2px;transition:color .2s}
.feat b a:hover{color:var(--or-txt)}
.feat-lien{display:inline-block;margin-top:12px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#C9A243;border-bottom:1px solid currentColor;padding-bottom:3px;transition:opacity .2s}
.feat-lien:hover{opacity:.75}

/* Espace praticiens : score en couleur, photo du bloc en portrait */
.bigquote .score{color:#C9A243}
.hero-photo.praticiens{height:520px}
.hero-photo.praticiens img{object-position:center 45%}
@media(max-width:900px){.hero-photo.praticiens{height:340px}}

/* Les ancres Avant / Pendant / Après ne passent pas sous l'en-tête fixe */
.stay-row{scroll-margin-top:110px}

/* ═══════════ Formulaire de contact ═══════════ */
.contact-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:70px;align-items:start}
.form-contact{display:grid;gap:22px}
.form-contact label{display:grid;gap:8px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muet)}
.form-contact label small{font-size:12px;letter-spacing:0;text-transform:none}
.form-contact input:not([type=checkbox]),.form-contact select,.form-contact textarea{width:100%;font:inherit;font-size:15px;letter-spacing:normal;text-transform:none;color:var(--brun);background:#fff;border:1px solid var(--hair);border-radius:2px;padding:13px 14px}
.form-contact textarea{min-height:170px;resize:vertical}
.form-contact input:focus-visible,.form-contact select:focus-visible,.form-contact textarea:focus-visible{outline:2px solid var(--or);outline-offset:1px}
.champs-2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.form-contact .case{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.55;letter-spacing:0;text-transform:none}
.form-contact .case input{flex:none;width:17px;height:17px;margin-top:3px;accent-color:var(--brun)}
.form-contact .case a{color:var(--brun);border-bottom:1px solid var(--or)}
.form-note{font-size:14px;line-height:1.6;color:var(--muet);border-left:2px solid var(--or);padding:2px 0 2px 14px}
.form-contact button{justify-self:start;cursor:pointer;background:none;font-family:inherit}
.champ-piege{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-etat{padding:18px 20px;margin-bottom:28px;border:1px solid var(--hair);border-left:3px solid var(--or);background:#fff;font-size:15px;line-height:1.6}
.form-etat.erreur{border-left-color:#A4332B}
.contact-aside ul{list-style:none;margin-top:8px}
.contact-aside li{padding:15px 0;border-bottom:1px solid var(--hair);font-size:15px;display:grid;gap:4px}
.contact-aside li b{font-weight:400;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muet)}
.contact-aside li a{color:var(--brun);justify-self:start;border-bottom:1px solid var(--or)}
@media(max-width:900px){
  .contact-grid{grid-template-columns:minmax(0,1fr);gap:50px}
  .champs-2{grid-template-columns:1fr}
}

/* Tarifs : le bloc « Un prix tout compris » occupe seul la largeur depuis
   que le prix de la premiere consultation a ete retire. */
.narrow-bloc{max-width:760px}

/* ═══════════ Bandeau de consentement aux cookies ═══════════
   Il n'apparait qu'au premier passage, puis plus pendant six mois. Les deux
   boutons ont exactement le meme poids visuel : refuser doit etre aussi
   simple qu'accepter. */
.cookies{position:fixed;left:16px;right:16px;bottom:16px;z-index:200;display:flex;gap:28px;align-items:center;justify-content:space-between;flex-wrap:wrap;
  max-width:1000px;margin:0 auto;padding:22px 26px;background:var(--creme);border:1px solid var(--hair);
  box-shadow:0 18px 50px rgba(12,33,34,.18);opacity:0;transform:translateY(12px);transition:opacity .35s,transform .35s}
.cookies.vu{opacity:1;transform:none}
.cookies-txt{flex:1 1 380px}
.cookies-txt b{display:block;font-family:var(--slab);font-weight:400;font-size:16px;color:var(--brun);margin-bottom:8px}
.cookies-txt p{font-size:13.5px;line-height:1.6;color:var(--muet);margin:0}
.cookies-txt a{color:var(--brun);border-bottom:1px solid var(--or)}
.cookies-btn{display:flex;gap:12px;flex:0 0 auto}
.cookies-btn .cta{cursor:pointer;font-family:inherit;background:none}
@media(prefers-reduced-motion:reduce){.cookies{transition:none;opacity:1;transform:none}}
@media(max-width:700px){
  .cookies{gap:18px;padding:20px}
  .cookies-btn{width:100%}
  .cookies-btn .cta{flex:1;text-align:center}
}

/* Votre séjour : la photo du salon ferme le déroulé, avant le cadre légal */
.photo-sejour{margin-bottom:70px}

/* Confirmation affichée quand un appareil est marqué comme interne */
.note-interne{position:fixed;left:16px;bottom:16px;z-index:210;max-width:340px;margin:0;
  padding:14px 18px;background:var(--brun);color:var(--creme);font-size:13.5px;line-height:1.5;
  box-shadow:0 14px 40px rgba(12,33,34,.3)}