@font-face{font-family:Poppins;src:url('assets/fonts/poppins.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:Figtree;src:url('assets/fonts/figtree.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}

:root{--ink:#2E2E2E;--muted:#6F6C5C;--cream:#F8F3EE;--paper:#FFFFFF;--accent:#997D68;--olive:#898973;--rose:#B2A09A;--peach:#F6E4D6;--line:#E8DCD3;--serif:Poppins,sans-serif;--sans:Figtree,Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.65}img{display:block;max-width:100%;height:auto}a{color:inherit}.shell{width:min(1160px,calc(100% - 48px));margin-inline:auto}.narrow{width:min(720px,100%);margin-inline:auto}.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:1rem;top:1rem;background:#fff;padding:.6rem 1rem;z-index:10}
.site-header{position:sticky;top:0;z-index:5;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid transparent}.site-header.scrolled{border-color:var(--line);box-shadow:0 8px 30px #332b1e0b}.header-inner{min-height:90px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand img{width:62px;height:62px;object-fit:contain}.site-nav{display:flex;align-items:center;gap:clamp(16px,2.3vw,32px);font-size:.82rem;letter-spacing:.02em}.site-nav a{text-decoration:none}.nav-dropdown{position:relative}.nav-dropdown summary{cursor:pointer;list-style:none}.nav-dropdown summary::-webkit-details-marker{display:none}.nav-dropdown summary:after{content:'⌄';margin-left:6px;color:var(--accent)}.nav-submenu{position:absolute;top:calc(100% + 18px);left:50%;transform:translateX(-50%);display:grid;gap:12px;min-width:205px;padding:16px;background:#fff;border:1px solid var(--line);box-shadow:0 18px 30px #332b1e12}.nav-submenu a{white-space:nowrap}.nav-cta,.button{display:inline-flex;align-items:center;justify-content:center;padding:.8rem 1.2rem;text-decoration:none;transition:.25s;border:1px solid transparent}.nav-cta,.button-dark{background:var(--accent);color:#fff}.nav-cta:hover,.button-dark:hover{background:var(--ink);transform:translateY(-2px)}.menu-toggle{display:none;background:none;border:1px solid var(--line);padding:.5rem .8rem}
.hero{padding-block:clamp(64px,10vw,140px)}.section-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(40px,7vw,100px);align-items:center}.hero-copy{max-width:530px}.eyebrow{margin:0 0 1.2rem;color:var(--accent);font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.hero h1,.page-hero h1{font-family:var(--serif);font-weight:500;line-height:1.05;letter-spacing:-.04em}.hero h1{font-size:clamp(3.5rem,7vw,6.8rem);margin:0 0 1.4rem}.lead{font-size:1.15rem;color:var(--muted);max-width:680px}.hero-media img,.service-media img{width:100%;aspect-ratio:1/1.12;object-fit:cover}.hero-media{position:relative}.hero-media:after{content:'';position:absolute;inset:24px -24px -24px 24px;border:1px solid var(--accent);z-index:-1}.actions{display:flex;flex-wrap:wrap;gap:20px;align-items:center;margin-top:2rem}.text-link{font-size:.9rem;text-decoration:none;border-bottom:1px solid var(--accent);padding-bottom:3px}.text-link span{color:var(--accent);margin-left:5px}
.band{background:var(--cream);padding-block:clamp(70px,9vw,130px)}.intro{text-align:center}.intro h2,.contact h2{font-size:clamp(2.5rem,5vw,4.6rem);margin:.4rem 0 1.4rem}.intro p,.value-card p,.service-copy>p,.contact p{color:var(--muted)}.values{padding-block:clamp(65px,9vw,120px);grid-template-columns:repeat(3,1fr);gap:24px}.value-card{border-top:1px solid var(--line);padding-top:20px}.value-card span{color:var(--accent);font-size:.75rem}.value-card h3,.mini-grid h3{font-family:var(--serif);font-weight:500}.value-card h3{font-size:1.5rem;margin:.7rem 0}.service{padding-block:clamp(80px,11vw,150px)}.service-reverse .service-copy{order:2}.service-copy h2,.intro h2,.contact h2,.image-banner h2{font-family:var(--serif);font-weight:500;line-height:1.1}.service-copy h2{font-size:clamp(2.4rem,5vw,4.5rem);margin:0 0 1.5rem}.check-list{list-style:none;padding:0;margin:2rem 0;display:grid;gap:10px}.check-list li:before{content:'✦';color:var(--accent);margin-right:12px}.mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:2rem 0}.mini-grid h3{font-size:.9rem;margin:0 0 .35rem}.mini-grid p{font-size:.86rem;color:var(--muted);margin:0}.button-outline{border-color:var(--ink)}.button-outline:hover{background:var(--ink);color:#fff}.image-banner{position:relative;min-height:590px;display:grid;place-items:center;overflow:hidden;color:#fff}.image-banner:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#1d1b178c,#1d1b1733)}.image-banner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.image-banner-content{position:relative;z-index:1;width:min(700px,calc(100% - 48px));text-align:center}.image-banner h2{font-size:clamp(2.7rem,5vw,5.4rem);margin:0 0 1rem}.image-banner p:not(.eyebrow){max-width:550px;margin:0 auto 1.6rem}.button-light{background:#fff;color:var(--ink)}.benefit-list{display:flex;flex-wrap:wrap;gap:10px;margin:2rem 0}.benefit-list span{border:1px solid var(--line);padding:.45rem .7rem;font-size:.78rem}.tall img{aspect-ratio:4/5;object-fit:cover}
.page-hero{padding-block:clamp(70px,10vw,150px);border-bottom:1px solid var(--line)}.page-hero h1{font-size:clamp(3rem,7vw,6rem);margin:0 0 18px}.page-hero .lead{max-width:680px}.section-heading{margin-bottom:38px}.section-heading h2{font-family:var(--serif);font-weight:500;line-height:1.1;font-size:clamp(2rem,4vw,3.8rem);margin:0}.review-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.review-card{margin:0;padding:24px;background:#fff;border:1px solid var(--line);min-height:220px;display:flex;flex-direction:column;justify-content:space-between}.review-card p{margin:0;color:var(--muted);font-size:.95rem}.review-card cite{font-style:normal;font-weight:600;color:var(--accent);font-size:.82rem}.faq{padding-block:clamp(70px,9vw,120px)}.faq-list{border-top:1px solid var(--line)}.faq-item{border-bottom:1px solid var(--line);padding:20px 0}.faq-item summary{cursor:pointer;font-family:var(--serif);font-size:1.05rem;list-style:none;padding-right:35px;position:relative}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary:after{content:'+';position:absolute;right:0;color:var(--accent);font-size:1.5rem;font-weight:300}.faq-item[open] summary:after{content:'−'}.faq-item p{max-width:750px;color:var(--muted);margin:14px 0 0}.contact-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:80px;align-items:end}.contact h2{max-width:650px}.contact-card{border-left:1px solid var(--accent);padding-left:28px}.contact-card p{margin:.3rem 0}.contact-card a{text-decoration:none;border-bottom:1px solid var(--line)}.site-footer{background:var(--ink);color:#fff;padding:22px 0;font-size:.78rem}.footer-inner{display:flex;justify-content:space-between;gap:20px}.footer-inner a{text-decoration:none;color:#d8c8b1}.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:900px){.review-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:800px){.shell{width:min(100% - 32px,600px)}.menu-toggle{display:block}.site-nav{position:absolute;display:none;left:16px;right:16px;top:82px;flex-direction:column;align-items:stretch;background:#fff;border:1px solid var(--line);padding:18px;box-shadow:0 20px 30px #332b1e12}.site-nav.open{display:flex}.nav-dropdown{width:100%}.nav-dropdown summary{padding:4px 0}.nav-submenu{position:static;transform:none;box-shadow:none;border:0;border-left:1px solid var(--line);margin:8px 0 4px;padding:5px 0 5px 16px;gap:8px}.nav-cta{text-align:center}.section-grid,.contact-grid{grid-template-columns:1fr;gap:42px}.hero{padding-top:65px}.hero-media{order:-1}.hero-media:after{inset:12px -12px -12px 12px}.values{grid-template-columns:1fr;gap:38px}.service-reverse .service-copy{order:initial}.mini-grid{grid-template-columns:1fr 1fr}.image-banner{min-height:500px}.footer-inner{flex-direction:column}}@media(max-width:480px){.review-grid,.mini-grid{grid-template-columns:1fr}.hero h1{font-size:3.4rem}.actions{align-items:stretch;flex-direction:column}.actions>*{text-align:center}.contact-card{padding-left:18px}}
.hero h1{font-size:clamp(2.8rem,5.5vw,5.2rem)}
.site-nav{font-size:.9rem}
.hero{padding-top:clamp(32px,4vw,64px);padding-bottom:clamp(64px,10vw,140px)}
@media(max-width:800px){.hero{padding-top:32px}}

/* Hauteur et alignement communs des visuels principaux. */
.hero,.page-hero-with-media{padding-top:clamp(32px,4vw,64px);padding-bottom:clamp(48px,6vw,80px)}
.hero-media img,.page-hero-with-media .service-media img{height:clamp(360px,58vh,620px);aspect-ratio:auto;object-fit:cover}
.hero-media,.page-hero-with-media .service-media{align-self:center}

@media(max-width:800px){
  .hero,.page-hero-with-media{padding-top:32px;padding-bottom:52px}
  .hero-media img,.page-hero-with-media .service-media img{height:min(78vw,420px)}
}

/* Rythme vertical et hiérarchie des sections internes. */
.service,.faq{padding-block:clamp(52px,6vw,92px)}
.page-hero-with-media + .service{padding-top:clamp(42px,5vw,72px)}
.service + .band{padding-top:clamp(48px,6vw,84px)}
.service-copy h2{font-size:clamp(2rem,3.5vw,3.35rem);margin-bottom:1.15rem}
.service-copy>p{max-width:780px}
.mini-grid{gap:28px;margin:1.6rem 0 2rem}
.mini-grid>div{border-top:1px solid var(--line);padding-top:15px}
.mini-grid h3{line-height:1.3}
.check-list{gap:8px;margin:1.5rem 0 2rem}
.check-list li{padding:12px 14px;background:var(--cream);border-left:2px solid var(--accent)}
.band .narrow>h2{font-size:clamp(2rem,3.5vw,3.2rem);margin:1rem 0 1.25rem}
.band .narrow>p{max-width:900px}
.band .narrow>h2+h2{margin-top:2.5rem}
.faq{padding-top:clamp(48px,6vw,86px)}
.faq .section-heading{margin-bottom:28px}
.faq .section-heading h2{font-size:clamp(2.2rem,3.8vw,3.25rem)}
.faq-item{padding:16px 0}

@media(max-width:800px){
  .service,.faq{padding-block:48px}
  .page-hero-with-media + .service{padding-top:40px}
  .mini-grid{gap:20px}
}

/* Bandeaux de déroulé : trois étapes lisibles et mieux structurées. */
.process-band .narrow{width:min(1040px,100%);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 22px}
.process-band .narrow>.eyebrow,.process-band .narrow>h2,.process-band .narrow>p:nth-of-type(5),.process-band .narrow>a{grid-column:1/-1}
.process-band .narrow>.eyebrow{margin-bottom:0}
.process-band .narrow>h2{margin:0 0 12px}
.process-band .narrow>p:nth-of-type(2),.process-band .narrow>p:nth-of-type(3),.process-band .narrow>p:nth-of-type(4){height:100%;margin:0;padding:22px 22px 24px;background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--accent);box-shadow:0 12px 24px #332b1e08;color:var(--muted)}
.process-band .narrow>p:nth-of-type(2) strong,.process-band .narrow>p:nth-of-type(3) strong,.process-band .narrow>p:nth-of-type(4) strong{display:block;margin-bottom:9px;color:var(--ink);font-family:var(--serif);font-weight:500;font-size:1.05rem}
.process-band .narrow>p:nth-of-type(5){margin:12px 0 0;max-width:900px}
.process-band .narrow>a{justify-self:start;margin-top:8px}
@media(max-width:800px){.process-band .narrow{display:block}.process-band .narrow>h2{margin-bottom:20px}.process-band .narrow>p:nth-of-type(2),.process-band .narrow>p:nth-of-type(3),.process-band .narrow>p:nth-of-type(4){margin:14px 0}.process-band .narrow>p:nth-of-type(5){margin-top:24px}}

.zones-band .narrow{width:min(1040px,100%)}
.zones-band h2{margin:0 0 22px}
.zones-band .benefit-list{max-width:900px;margin:0 0 30px;gap:10px}
.zones-band .benefit-list span{background:var(--paper);border-color:var(--line);padding:.62rem .9rem;color:var(--muted)}
.zones-band .benefit-list span:hover{border-color:var(--accent);color:var(--ink)}

/* Les intitulés des étapes restent légers ; le titre LED devient un second temps de lecture. */
.process-band .narrow>p:nth-of-type(2) strong,.process-band .narrow>p:nth-of-type(3) strong,.process-band .narrow>p:nth-of-type(4) strong{font-family:var(--sans);font-size:.74rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.process-band .narrow>p:nth-of-type(2),.process-band .narrow>p:nth-of-type(3),.process-band .narrow>p:nth-of-type(4){font-size:.95rem;line-height:1.65}
.process-band .narrow>h2:nth-of-type(2){font-size:clamp(1.9rem,3vw,2.75rem);margin-top:2rem;margin-bottom:.35rem}
.process-band .narrow>p:nth-of-type(5){font-size:1rem;line-height:1.7;color:var(--muted)}
.process-band .narrow>a{margin-top:14px}

/* Les pages internes reprennent la composition de l'accueil. */
.page-hero-with-media{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,7vw,100px);align-items:center;padding-block:clamp(54px,7vw,96px);border-bottom:0}
.page-hero-with-media .page-hero-copy{max-width:560px}
.page-hero-with-media h1{font-size:clamp(2.8rem,5.5vw,5.2rem);margin:0 0 1.4rem}
.page-hero-with-media .lead{margin:0}
.page-hero-with-media .service-media{position:relative}
.page-hero-with-media .service-media img{width:100%;aspect-ratio:1/1.12;object-fit:cover}
.page-hero-with-media .service-media:after{content:'';position:absolute;inset:24px -24px -24px 24px;border:1px solid var(--accent);z-index:-1}
.service-copy-only{display:block}
.service-copy-only .service-copy{max-width:900px;margin-inline:auto}
@media(max-width:800px){.page-hero-with-media{grid-template-columns:1fr;gap:34px;padding-top:42px}.page-hero-with-media .page-hero-copy{max-width:none}.page-hero-with-media .service-media{order:2}.page-hero-with-media .service-media:after{inset:12px -12px -12px 12px}.service-copy-only .service-copy{max-width:none}}

/* Dernière règle commune : même départ sous le menu que sur l'accueil. */
.hero,.page-hero-with-media{padding-top:clamp(32px,4vw,64px);padding-bottom:clamp(48px,6vw,80px);margin-top:0}
@media(max-width:800px){.hero,.page-hero-with-media{padding-top:32px;padding-bottom:52px}}

/* Repère visuel entre le premier bloc et le contenu suivant. */
.hero,.page-hero-with-media{position:relative;border-bottom:1px solid var(--line)}
.hero:after,.page-hero-with-media:after{content:'';position:absolute;left:0;bottom:-1px;width:86px;height:3px;background:var(--accent)}

/* Fil conducteur : chaque séparation avance vers la droite au fil des blocs. */
.hero,.page-hero-with-media{border-bottom:0}
.hero:after,.page-hero-with-media:after{display:none}
main>section+section{position:relative;border-top:1px solid var(--line)}
main>section+section:before{content:'';position:absolute;top:-1px;left:18%;width:86px;height:3px;background:var(--accent)}
main>section:nth-of-type(3):before{left:42%}
main>section:nth-of-type(4):before{left:66%}
main>section:nth-of-type(5):before{left:84%}
@media(max-width:800px){main>section+section:before{left:16%;width:70px}main>section:nth-of-type(3):before{left:40%}main>section:nth-of-type(4):before{left:64%}main>section:nth-of-type(5):before{left:80%}}

/* Progression régulière : le repère avance d'une seule largeur à chaque bloc. */
main>section+section:before{left:0}
main>section:nth-of-type(3):before{left:min(86px,calc(100% - 86px))}
main>section:nth-of-type(4):before{left:min(172px,calc(100% - 86px))}
main>section:nth-of-type(5):before{left:min(258px,calc(100% - 86px))}
main>section:nth-of-type(6):before{left:min(344px,calc(100% - 86px))}
main>section:nth-of-type(7):before{left:min(430px,calc(100% - 86px))}
main>section:nth-of-type(8):before{left:min(516px,calc(100% - 86px))}
main>section:nth-of-type(9):before{left:min(602px,calc(100% - 86px))}
main>section:nth-of-type(10):before{left:min(688px,calc(100% - 86px))}
main>section:nth-of-type(11):before{left:min(774px,calc(100% - 86px))}
main>section:nth-of-type(12):before{left:min(860px,calc(100% - 86px))}
@media(max-width:800px){
  main>section+section:before{left:0}
  main>section:nth-of-type(3):before{left:min(70px,calc(100% - 70px))}
  main>section:nth-of-type(4):before{left:min(140px,calc(100% - 70px))}
  main>section:nth-of-type(5):before{left:min(210px,calc(100% - 70px))}
  main>section:nth-of-type(6):before{left:min(280px,calc(100% - 70px))}
  main>section:nth-of-type(7):before{left:min(350px,calc(100% - 70px))}
  main>section:nth-of-type(8):before{left:min(420px,calc(100% - 70px))}
  main>section:nth-of-type(9):before{left:min(490px,calc(100% - 70px))}
  main>section:nth-of-type(10):before{left:min(560px,calc(100% - 70px))}
  main>section:nth-of-type(11):before{left:min(630px,calc(100% - 70px))}
  main>section:nth-of-type(12):before{left:min(700px,calc(100% - 70px))}
}

/* Ancrage global : les sections pleine largeur et les sections .shell partagent la même origine. */
main>section+section:before{left:max(24px,calc((100% - 1160px)/2))}
main>section:nth-of-type(3):before{left:max(24px,calc((100% - 1160px)/2 + 86px))}
main>section:nth-of-type(4):before{left:max(24px,calc((100% - 1160px)/2 + 172px))}
main>section:nth-of-type(5):before{left:max(24px,calc((100% - 1160px)/2 + 258px))}
main>section:nth-of-type(6):before{left:max(24px,calc((100% - 1160px)/2 + 344px))}
main>section:nth-of-type(7):before{left:max(24px,calc((100% - 1160px)/2 + 430px))}
main>section:nth-of-type(8):before{left:max(24px,calc((100% - 1160px)/2 + 516px))}
main>section:nth-of-type(9):before{left:max(24px,calc((100% - 1160px)/2 + 602px))}
main>section:nth-of-type(10):before{left:max(24px,calc((100% - 1160px)/2 + 688px))}
main>section:nth-of-type(11):before{left:max(24px,calc((100% - 1160px)/2 + 774px))}
main>section:nth-of-type(12):before{left:max(24px,calc((100% - 1160px)/2 + 860px))}
@media(max-width:800px){
  main>section+section:before{left:16px}
  main>section:nth-of-type(3):before{left:min(86px,calc(100% - 70px))}
  main>section:nth-of-type(4):before{left:min(156px,calc(100% - 70px))}
  main>section:nth-of-type(5):before{left:min(226px,calc(100% - 70px))}
  main>section:nth-of-type(6):before{left:min(296px,calc(100% - 70px))}
  main>section:nth-of-type(7):before{left:min(366px,calc(100% - 70px))}
  main>section:nth-of-type(8):before{left:min(436px,calc(100% - 70px))}
  main>section:nth-of-type(9):before{left:min(506px,calc(100% - 70px))}
  main>section:nth-of-type(10):before{left:min(576px,calc(100% - 70px))}
  main>section:nth-of-type(11):before{left:min(646px,calc(100% - 70px))}
  main>section:nth-of-type(12):before{left:min(716px,calc(100% - 70px))}
}

/* Position fixe demandée : le repère reste toujours à gauche. */
main>section+section:before{left:max(24px,calc((100% - 1160px)/2))}
main>section:nth-of-type(3):before,main>section:nth-of-type(4):before,main>section:nth-of-type(5):before,main>section:nth-of-type(6):before,main>section:nth-of-type(7):before,main>section:nth-of-type(8):before,main>section:nth-of-type(9):before,main>section:nth-of-type(10):before,main>section:nth-of-type(11):before,main>section:nth-of-type(12):before{left:max(24px,calc((100% - 1160px)/2))}
@media(max-width:800px){main>section+section:before,main>section:nth-of-type(3):before,main>section:nth-of-type(4):before,main>section:nth-of-type(5):before,main>section:nth-of-type(6):before,main>section:nth-of-type(7):before,main>section:nth-of-type(8):before,main>section:nth-of-type(9):before,main>section:nth-of-type(10):before,main>section:nth-of-type(11):before,main>section:nth-of-type(12):before{left:16px}}

/* Alignement exact : le segment épais commence au bord de sa ligne. */
main>section+section:before,main>section:nth-of-type(3):before,main>section:nth-of-type(4):before,main>section:nth-of-type(5):before,main>section:nth-of-type(6):before,main>section:nth-of-type(7):before,main>section:nth-of-type(8):before,main>section:nth-of-type(9):before,main>section:nth-of-type(10):before,main>section:nth-of-type(11):before,main>section:nth-of-type(12):before{left:0}

/* Toutes les lignes sont pleine largeur : leur repère et leur bord gauche coïncident. */
main>section+section{border-top:0}
main>section+section:after{content:'';position:absolute;top:0;left:50%;width:100vw;height:1px;transform:translateX(-50%);background:var(--line)}
main>section+section:before,main>section:nth-of-type(3):before,main>section:nth-of-type(4):before,main>section:nth-of-type(5):before,main>section:nth-of-type(6):before,main>section:nth-of-type(7):before,main>section:nth-of-type(8):before,main>section:nth-of-type(9):before,main>section:nth-of-type(10):before,main>section:nth-of-type(11):before,main>section:nth-of-type(12):before{left:calc(50% - 50vw);z-index:1}

/* Alignement sur le bord gauche du conteneur principal et de l'eyebrow. */
main>section+section:before,main>section:nth-of-type(3):before,main>section:nth-of-type(4):before,main>section:nth-of-type(5):before,main>section:nth-of-type(6):before,main>section:nth-of-type(7):before,main>section:nth-of-type(8):before,main>section:nth-of-type(9):before,main>section:nth-of-type(10):before,main>section:nth-of-type(11):before,main>section:nth-of-type(12):before{left:calc(50% - 50vw + max(16px,calc((100vw - 1160px)/2)))}

/* La ligne suit exactement la largeur du conteneur principal. */
main>section+section:after{left:calc(50% - min(580px,calc(50vw - 24px)));width:min(1160px,calc(100vw - 48px));transform:none}
main>section+section:before,main>section:nth-of-type(3):before,main>section:nth-of-type(4):before,main>section:nth-of-type(5):before,main>section:nth-of-type(6):before,main>section:nth-of-type(7):before,main>section:nth-of-type(8):before,main>section:nth-of-type(9):before,main>section:nth-of-type(10):before,main>section:nth-of-type(11):before,main>section:nth-of-type(12):before{left:calc(50% - min(580px,calc(50vw - 24px)))}
@media(max-width:800px){main>section+section:after{left:calc(50% - min(300px,calc(50vw - 16px)));width:min(600px,calc(100vw - 32px))}main>section+section:before,main>section:nth-of-type(3):before,main>section:nth-of-type(4):before,main>section:nth-of-type(5):before,main>section:nth-of-type(6):before,main>section:nth-of-type(7):before,main>section:nth-of-type(8):before,main>section:nth-of-type(9):before,main>section:nth-of-type(10):before,main>section:nth-of-type(11):before,main>section:nth-of-type(12):before{left:calc(50% - min(300px,calc(50vw - 16px)))}}

/* Accueil : alternance régulière des photos autour du contenu. */
#visage .service-media,#laser .service-media,#pieds .service-media{order:0}
#visage .service-copy,#laser .service-copy,#pieds .service-copy{order:1}
#ongles .service-media,#epilation .service-media{order:1}
#ongles .service-copy,#epilation .service-copy{order:0}
@media(max-width:800px){
  #visage .service-media,#ongles .service-media,#laser .service-media,#epilation .service-media,#pieds .service-media{order:0}
  #visage .service-copy,#ongles .service-copy,#laser .service-copy,#epilation .service-copy,#pieds .service-copy{order:1}
}

/* Pages internes : tous les blocs suivent le même axe que le premier bloc. */
.internal-page .service-copy-only .service-copy{max-width:none;margin-inline:0}
.internal-page .band .narrow{width:min(1160px,calc(100% - 48px))}
@media(max-width:800px){.internal-page .band .narrow{width:min(100% - 32px,600px)}}

/* Accueil : les photos des blocs de prestations sont carrées et centrées. */
#visage .service-media,#ongles .service-media,#laser .service-media,#epilation .service-media,#pieds .service-media{align-self:center}
#visage .service-media img,#ongles .service-media img,#laser .service-media img,#epilation .service-media img,#pieds .service-media img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}

#epilation .benefit-list{max-width:900px;margin:1.6rem 0 2rem;gap:10px}
#epilation .benefit-list span{background:var(--paper);border-color:var(--line);padding:.62rem .9rem;color:var(--muted)}
#epilation .benefit-list span:hover{border-color:var(--accent);color:var(--ink)}
.zones-inline{margin:1.8rem 0 2rem}
.zones-inline .eyebrow{margin-bottom:.75rem}
.zones-inline .benefit-list{margin:0;gap:10px}
.zones-inline .benefit-list span{background:var(--paper);border-color:var(--line);padding:.62rem .9rem;color:var(--muted)}
.faq-intro{max-width:900px;color:var(--muted);margin:1rem 0 0}
.faq-intro strong{color:var(--ink)}
.service-copy-block{padding-block:clamp(56px,7vw,96px)}
.service-copy-block h2{font-family:var(--serif);font-weight:500;line-height:1.1;font-size:clamp(2rem,3.6vw,3.4rem);margin:.8rem 0 1.2rem}
.service-copy-block p{max-width:900px;color:var(--muted)}
.audience-list{max-width:800px;color:var(--muted);display:grid;gap:7px;padding-left:1.2rem}
.zones-columns{display:grid;grid-template-columns:1fr 1fr;gap:80px;margin-top:2rem}.zones-columns h3{font-family:var(--serif);font-weight:500;margin:0 0 .7rem}.zones-columns ul{margin:0;padding-left:1.2rem;color:var(--muted);display:grid;gap:.35rem}
.final-cta{text-align:left}.final-cta .button{margin-top:1rem}
.gallery-section{text-align:center}.gallery-section h2{font-family:var(--serif);font-weight:500;font-size:clamp(2rem,3.8vw,3.2rem);margin:.4rem 0 2rem}.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:2rem}.gallery-grid img{width:100%;height:320px;object-fit:cover}.gallery-section .button{margin-top:1.2rem}
.map-card{position:relative;min-height:300px;background:var(--line);overflow:hidden}.map-card iframe{display:block;width:100%;height:300px;border:0}.map-card a{position:absolute;left:16px;bottom:16px;background:#fff;padding:.55rem .8rem;text-decoration:none;font-size:.8rem;box-shadow:0 8px 18px #332b1e18}.contact-social{display:grid;grid-template-columns:1fr 1fr;gap:80px;padding-block:clamp(56px,7vw,96px)}.contact-social h2{font-family:var(--serif);font-weight:500;font-size:clamp(1.7rem,3vw,2.5rem);margin:0 0 .8rem}.contact-social p{color:var(--muted)}
@media(max-width:800px){.gallery-grid,.contact-social{grid-template-columns:1fr}.gallery-grid img{height:260px}.map-card iframe{height:260px}}
@media(max-width:800px){.zones-columns{grid-template-columns:1fr;gap:28px}}

/* Hiérarchie typographique commune : les titres de blocs restent élégants
   et réguliers, tandis que seuls les libellés de détail gardent un accent. */
main h2,
main h3,
.faq-item summary,
.service-copy-block h2,
.gallery-section h2,
.contact-social h2,
.zones-columns h3 {
  font-weight: 500;
}

.process-band .narrow > p:nth-of-type(2) strong,
.process-band .narrow > p:nth-of-type(3) strong,
.process-band .narrow > p:nth-of-type(4) strong {
  font-weight: 600;
}

.mini-grid h3,
.value-card h3,
.benefit-list span,
.button,
.nav-cta {
  font-weight: 500;
}

/* Alternance stable des fonds sur les pages internes. */
body.internal-page main > section.band,
body.internal-page main > section.process-band,
body.internal-page main > section.final-cta,
body.internal-page main > section.gallery-section,
body.internal-page main > section.contact {
  background: var(--cream);
}

body.internal-page main > section.service,
body.internal-page main > section.service-copy-block,
body.internal-page main > section.zones-band,
body.internal-page main > section.faq,
body.internal-page main > section.contact-social {
  background: var(--paper);
}

/* L'alternance commence immédiatement après le bloc titre + photo. */
body.internal-page .page-hero-with-media + .service,
body.internal-page .page-hero-with-media + .contact {
  background: var(--cream);
}

/* Les sections qui portent aussi la classe .shell gardent leur contenu
   centré, mais leur couleur de fond s'étend jusqu'aux deux bords de l'écran. */
body.internal-page .page-hero-with-media + .service {
  width: 100%;
  max-width: none;
  margin-inline: 0;
  padding-inline: max(24px, calc((100% - 1160px) / 2));
  background: var(--cream);
  box-shadow: none;
}

body.internal-page .page-hero-with-media + .service::after {
  display: none;
}

@media(max-width:800px) {
  body.internal-page .page-hero-with-media + .service {
    padding-inline: 16px;
  }
}

body.page-visage .service + .process-band,
body.page-pieds .service + .process-band,
body.page-laser .service + .process-band,
body.page-ongles .service + .gallery-section,
body.page-a-propos .service + .final-cta {
  background: var(--paper);
}

/* Page Visage : quatre bénéfices équilibrés et plus raffinés. */
body.page-visage .service-copy .mini-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 1.8rem;
}

body.page-visage .service-copy .mini-grid > div {
  min-height: 146px;
  padding: 20px 20px 18px;
  background: rgb(255 255 255 / 62%);
  border: 1px solid var(--line);
  border-top: 2px solid var(--accent);
}

body.page-visage .service-copy .mini-grid h3 {
  font-size: 1rem;
  line-height: 1.35;
  margin-bottom: .55rem;
}

body.page-laser .service-copy .mini-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 1.8rem;
}

body.page-laser .service-copy .mini-grid > div {
  min-height: 146px;
  padding: 20px 20px 18px;
  background: rgb(255 255 255 / 62%);
  border: 1px solid var(--line);
  border-top: 2px solid var(--accent);
}

body.page-laser .service-copy .mini-grid h3 {
  font-size: 1rem;
  line-height: 1.35;
  margin-bottom: .55rem;
}

body.page-cire .service-copy .mini-grid,
body.page-pieds .service-copy .mini-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 1.8rem;
}

body.page-cire .service-copy .mini-grid > div,
body.page-pieds .service-copy .mini-grid > div {
  min-height: 146px;
  padding: 20px 20px 18px;
  background: rgb(255 255 255 / 62%);
  border: 1px solid var(--line);
  border-top: 2px solid var(--accent);
}

body.page-cire .service-copy .mini-grid h3,
body.page-pieds .service-copy .mini-grid h3 {
  font-size: 1rem;
  line-height: 1.35;
  margin-bottom: .55rem;
}

/* Page Cire : les zones sont présentées comme deux familles de prestations. */
/* Page Cire : seules les zones reprennent les pastilles de l'accueil. */
body.page-cire .zones-band .narrow {
  width: min(1160px, 100%);
  margin-inline: auto;
}

body.page-cire .zones-band h2 {
  font-size: clamp(2rem, 3.5vw, 3.2rem);
  margin: .4rem 0 1.4rem;
}

body.page-cire .zones-band .zone-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 12px 0 0;
  padding: 0;
  border: 0;
  background: transparent;
}

body.page-cire .zones-band .zone-pills span {
  padding: .7rem 1rem;
  background: var(--paper);
  border: 1px solid var(--line);
  color: var(--muted);
  font-size: .95rem;
}

/* Liens de navigation éditoriale ajoutés aux blocs de l'accueil. */
.home-page-link {
  display: inline-flex;
  width: fit-content;
  margin: 0;
}

/* Desktop : le sous-menu du corps s'ouvre au survol ou au focus clavier. */
@media(min-width:801px) {
  .site-nav > a:not(.nav-cta),
  .nav-dropdown > summary {
    display: inline-flex;
    align-items: center;
    transition: color .2s ease, transform .2s ease;
  }

  .site-nav > a:not(.nav-cta):hover,
  .site-nav > a:not(.nav-cta):focus-visible,
  .nav-dropdown > summary:hover,
  .nav-dropdown > summary:focus-visible {
    color: var(--accent);
    transform: translateY(-2px);
    outline: none;
  }

  .nav-dropdown::after {
    content: '';
    position: absolute;
    top: 100%;
    left: -14px;
    right: -14px;
    height: 7px;
  }

  .nav-submenu {
    top: calc(100% + 7px);
    min-width: 232px;
    gap: 0;
    padding: 7px;
    background: var(--paper);
    border-color: var(--line);
    box-shadow: 0 16px 28px #332b1e18;
  }

  .nav-submenu::before {
    content: '';
    position: absolute;
    top: -7px;
    left: 50%;
    width: 1px;
    height: 7px;
    background: var(--accent);
  }

  .nav-submenu a {
    display: block;
    padding: .75rem .9rem;
    color: var(--ink);
    border-bottom: 1px solid transparent;
    transition: background-color .2s ease, color .2s ease, padding-left .2s ease;
  }

  .nav-submenu a:last-child {
    border-bottom: 0;
  }

  .nav-submenu a:hover,
  .nav-submenu a:focus-visible {
    padding-left: 1.05rem;
    color: var(--accent);
    background: #fff;
    outline: none;
  }

  .nav-dropdown:hover > .nav-submenu,
  .nav-dropdown:focus-within > .nav-submenu {
    display: grid !important;
  }

  .nav-dropdown:hover > summary,
  .nav-dropdown:focus-within > summary {
    color: var(--accent);
  }
}

.service-actions {
  display: flex;
  align-items: center;
  gap: 25px;
  flex-wrap: wrap;
  margin-top: 1.8rem;
}

.service-actions .button,
.service-actions .home-page-link {
  margin: 0;
}

/* Réservation mieux détachée du texte sur les pages internes. */
body.internal-page .page-hero-copy .hero-cta {
  margin-top: 1.7rem;
}

body.internal-page .final-cta .button,
body.internal-page .service-copy-block .button {
  margin-top: 1rem;
}

/* Bandeau Cire : respiration plus régulière entre les différents niveaux. */
body.page-cire .page-hero-with-media .page-hero-copy {
  padding-block: 12px;
}

body.page-cire .page-hero-with-media h1 {
  margin-bottom: 1.5rem;
}

body.page-cire .page-hero-with-media .lead {
  line-height: 1.7;
}

@media(max-width:800px) {
  .service-actions {
    align-items: flex-start;
    gap: 18px;
  }

  body.internal-page .page-hero-copy .hero-cta {
    margin-top: 1.4rem;
  }
}

@media(max-width:800px) {
  body.page-visage .service-copy .mini-grid,
  body.page-laser .service-copy .mini-grid,
  body.page-cire .service-copy .mini-grid,
  body.page-pieds .service-copy .mini-grid {
    grid-template-columns: 1fr;
  }
}

/* Alternance universelle des pages internes : le premier bloc après le
   titre/photo commence en crème, puis les couleurs alternent régulièrement. */
body.internal-page main > section:not(.page-hero-with-media):nth-of-type(odd) {
  background: var(--paper);
}

body.internal-page main > section:not(.page-hero-with-media):nth-of-type(even) {
  background: var(--cream);
}

/* Les sections qui étaient aussi des conteneurs .shell deviennent pleine
   largeur ; leurs contenus restent alignés sur la grille centrale. */
body.internal-page main > section:not(.page-hero-with-media).shell {
  width: 100%;
  max-width: none;
  margin-inline: 0;
  padding-inline: max(24px, calc((100% - 1160px) / 2));
}

@media(max-width:800px) {
  body.internal-page main > section:not(.page-hero-with-media).shell {
    padding-inline: 16px;
  }
}

/* Rythme vertical commun à toutes les sections internes. */
body.internal-page main > section:not(.page-hero-with-media) {
  padding-top: clamp(64px, 7vw, 96px);
  padding-bottom: clamp(64px, 7vw, 96px);
}

/* Les zones traitées sont un bloc de transition compact : elles ne doivent
   pas reprendre la hauteur des sections éditoriales principales. */
body.internal-page main > section.zones-band {
  padding-top: 56px;
  padding-bottom: 56px;
}

@media(max-width:800px) {
  body.internal-page main > section:not(.page-hero-with-media) {
    padding-top: 48px;
    padding-bottom: 48px;
  }

  body.internal-page main > section.zones-band {
    padding-top: 40px;
    padding-bottom: 40px;
  }
}

/* Accessibilité et réservation mobile. */
html:not(.js) .reveal { opacity: 1; transform: none; }
.js .reveal { opacity: 0; transform: translateY(18px); }
.js .reveal.visible { opacity: 1; transform: none; }
.button:focus-visible,
.nav-cta:focus-visible,
.text-link:focus-visible,
.mobile-booking:focus-visible,
.menu-toggle:focus-visible { outline: 3px solid var(--olive); outline-offset: 4px; }
.mobile-booking { display: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .js .reveal { opacity: 1; transform: none; transition: none; }
  .nav-cta, .button { transition: none; }
}

@media (max-width: 800px) {
  body { padding-bottom: 76px; }
  .mobile-booking {
    position: fixed;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    left: 16px;
    right: 16px;
    bottom: 16px;
    z-index: 8;
    padding: .85rem 1.2rem;
    background: var(--accent);
    color: #fff;
    text-decoration: none;
    box-shadow: 0 10px 24px #332b1e2b;
  }
  .mobile-booking:hover { background: var(--ink); }
}

/* Sur iPad et autres écrans tactiles, l’ouverture se fait uniquement au clic. */
@media (hover: none), (pointer: coarse) {
  .site-header .nav-dropdown:hover > .nav-submenu,
  .site-header .nav-dropdown:focus-within > .nav-submenu {
    display: none !important;
  }

  .site-header .nav-dropdown[open] > .nav-submenu {
    display: grid !important;
  }
}

/* À propos : trois repères éditoriaux alignés sur le même langage de cartes. */
body.page-a-propos .service-copy .mini-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  margin-top: 2rem;
}

body.page-a-propos .service-copy .mini-grid > div {
  min-height: 178px;
  padding: 22px 20px 20px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-top: 2px solid var(--accent);
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease, background-color .25s ease;
}

body.page-a-propos .service-copy .mini-grid > div:hover {
  transform: translateY(-5px);
  border-color: var(--accent);
  background: var(--cream);
  box-shadow: 0 14px 26px rgb(51 43 30 / 10%);
}

body.page-a-propos .service-copy .mini-grid h3 {
  margin: 0 0 .65rem;
  font-size: 1rem;
  line-height: 1.35;
}

body.page-a-propos .service-copy .mini-grid p {
  margin: 0;
  font-size: .9rem;
  line-height: 1.6;
}

@media (max-width: 800px) {
  body.page-a-propos .service-copy .mini-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  body.page-a-propos .service-copy .mini-grid > div {
    min-height: 0;
    padding: 20px 18px 18px;
  }
}

/* Contact : la carte est l’élément principal du bloc pratique. */
body.page-contact .contact-grid {
  grid-template-columns: minmax(0, 1.45fr) minmax(360px, .85fr);
  gap: clamp(42px, 6vw, 88px);
  align-items: stretch;
}

body.page-contact .map-card,
body.page-contact .map-card iframe {
  min-height: 520px;
  height: 520px;
}

body.page-contact .contact-details {
  padding-block: 12px;
}

body.page-contact .contact-details h1 {
  margin-top: .35rem;
}

body.page-contact .contact-details address {
  font-style: normal;
  color: var(--muted);
  line-height: 1.75;
}

body.page-contact .contact-details address a {
  text-decoration: none;
  border-bottom: 1px solid var(--line);
}

body.page-contact .contact-access {
  list-style: none;
  padding: 0;
  margin: 1.4rem 0;
  color: var(--muted);
  display: grid;
  gap: .45rem;
}

body.page-contact .contact-access li::before {
  content: '✦';
  color: var(--accent);
  margin-right: .65rem;
}

@media (max-width: 800px) {
  body.page-contact .contact-grid {
    grid-template-columns: 1fr;
  }

  body.page-contact .map-card,
  body.page-contact .map-card iframe {
    min-height: 360px;
    height: 360px;
  }
}

/* Zones traitées : pastilles et cartes plus vivantes au survol. */
.benefit-list span,
.zone-pills span,
.zones-columns li {
  position: relative;
  overflow: hidden;
  transition: transform .25s ease, background-color .25s ease, border-color .25s ease, color .25s ease, box-shadow .25s ease;
}

.benefit-list span:hover,
.benefit-list span:focus-visible,
.zone-pills span:hover,
.zone-pills span:focus-visible,
.zones-columns li:hover,
.zones-columns li:focus-visible {
  background: var(--peach);
  border-color: var(--accent);
  color: var(--ink);
  transform: translateY(-4px);
  box-shadow: 0 10px 18px rgb(51 43 30 / 10%);
}

.zones-columns ul {
  padding-left: 0;
  list-style: none;
}

.zones-columns li {
  margin-bottom: .65rem;
  padding: .72rem .9rem;
  background: var(--paper);
  border: 1px solid var(--line);
  color: var(--muted);
}

@media (prefers-reduced-motion: reduce) {
  .benefit-list span,
  .zone-pills span,
  .zones-columns li { transition: none; }
}

/* FAQ : accordéon éditorial plus lisible sur toutes les pages. */
.faq-list {
  display: grid;
  gap: 12px;
  border-top: 0;
}

.faq-item {
  position: relative;
  margin: 0;
  padding: 0;
  background: var(--paper);
  border: 1px solid var(--line);
  transition: background-color .25s ease, border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}

.faq-item:hover {
  border-color: var(--accent);
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgb(51 43 30 / 7%);
}

.faq-item[open] {
  background: var(--cream);
  border-color: var(--accent);
  box-shadow: 0 10px 22px rgb(51 43 30 / 8%);
}

.faq-item summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 30px;
  align-items: center;
  gap: 16px;
  min-height: 76px;
  padding: 18px 22px;
  color: var(--ink);
  font-family: var(--sans);
  font-size: 1.05rem;
  font-weight: 600;
}

.faq-item summary::after {
  content: '+';
  position: static;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 1px solid var(--accent);
  border-radius: 50%;
  color: var(--accent);
  font-size: 1.15rem;
  font-weight: 400;
  line-height: 1;
  transition: transform .25s ease, background-color .25s ease, color .25s ease;
}

.faq-item[open] summary::after {
  content: '−';
  background: var(--accent);
  color: #fff;
  transform: rotate(180deg);
}

.faq-item summary:focus-visible {
  outline: 3px solid var(--olive);
  outline-offset: -3px;
}

.faq-item p {
  max-width: none;
  margin: 0 22px 22px 80px;
  padding: 15px 22px 2px;
  border-left: 2px solid var(--accent);
  color: var(--muted);
}

@media (max-width: 600px) {
.faq-item summary {
    grid-template-columns: minmax(0, 1fr) 28px;
    gap: 10px;
    min-height: 68px;
    padding: 16px;
    font-size: .98rem;
  }

  .faq-item p {
    margin: 0 16px 18px 46px;
    padding: 12px 16px 2px;
    font-size: .94rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .faq-item,
  .faq-item summary::after { transition: none; }
}

/* Cartes éditoriales : un mouvement discret au survol. */
.mini-grid > div,
.value-card,
.review-card,
.process-band .narrow > p:nth-of-type(2),
.process-band .narrow > p:nth-of-type(3),
.process-band .narrow > p:nth-of-type(4) {
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease, background-color .25s ease;
}

.mini-grid > div:hover,
.value-card:hover,
.review-card:hover,
.process-band .narrow > p:nth-of-type(2):hover,
.process-band .narrow > p:nth-of-type(3):hover,
.process-band .narrow > p:nth-of-type(4):hover {
  transform: translateY(-5px);
  border-color: var(--accent);
  box-shadow: 0 14px 26px rgb(51 43 30 / 10%);
}

.mini-grid > div:hover {
  background: var(--cream);
}

.value-card {
  min-height: 190px;
  padding: 20px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-top: 2px solid var(--accent);
}

.value-card:hover {
  background: var(--peach);
}

/* Lignes de bénéfices et de points forts. */
.check-list li {
  transition: transform .25s ease, background-color .25s ease, border-color .25s ease, box-shadow .25s ease;
}

.check-list li:hover {
  background: var(--peach);
  border-left-color: var(--accent);
  transform: translateX(5px);
  box-shadow: 0 8px 16px rgb(51 43 30 / 8%);
}

/* Galerie : même mouvement discret pour les visuels présentés en cartes. */
.gallery-grid img {
  transition: transform .3s ease, box-shadow .3s ease, filter .3s ease;
}

.gallery-grid img:hover {
  transform: translateY(-5px) scale(1.015);
  box-shadow: 0 14px 26px rgb(51 43 30 / 12%);
  filter: saturate(1.04);
}

/* Page Ongles : cartes plus lisibles sur le fond crème. */
body.page-ongles .service-copy .mini-grid > div {
  min-height: 190px;
  padding: 22px 22px 20px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-top: 2px solid var(--accent);
}

body.page-ongles .service-copy .mini-grid > div:hover {
  background: var(--peach);
}

/* Accueil, bloc 02 : même respiration que sur la page Ongles. */
#ongles .service-copy .mini-grid > div {
  min-height: 158px;
  padding: 20px 20px 18px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-top: 2px solid var(--accent);
}

#ongles .service-copy .mini-grid > div:hover {
  background: var(--peach);
}

/* Accueil, bloc 05 : cartes des soins des pieds. */
#pieds .service-copy .mini-grid > div {
  min-height: 158px;
  padding: 20px 20px 18px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-top: 2px solid var(--accent);
}

#pieds .service-copy .mini-grid > div:hover {
  background: var(--peach);
}

#pieds .service-copy .mini-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 800px) {
  body.page-ongles .service-copy .mini-grid > div {
    min-height: 0;
    padding: 20px 18px 18px;
  }

  #ongles .service-copy .mini-grid > div {
    min-height: 0;
    padding: 20px 18px 18px;
  }

  #pieds .service-copy .mini-grid > div {
    min-height: 0;
    padding: 20px 18px 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mini-grid > div,
  .review-card,
  .process-band .narrow > p:nth-of-type(2),
  .process-band .narrow > p:nth-of-type(3),
  .process-band .narrow > p:nth-of-type(4),
  .value-card,
  .check-list li { transition: none; }

  .gallery-grid img { transition: none; }
}

/* Page Visage : séquence éditoriale en trois temps. */
.facial-signature {
  padding-top: clamp(56px, 7vw, 96px);
  padding-bottom: clamp(56px, 7vw, 96px);
}

.facial-signature-card {
  max-width: 1040px;
  margin-inline: auto;
  padding: clamp(28px, 5vw, 56px);
  background: var(--cream);
  border: 1px solid var(--line);
  border-top: 3px solid var(--accent);
  box-shadow: 0 16px 32px rgb(51 43 30 / 7%);
}

.facial-signature-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 36px;
}

.facial-signature h2,
.facial-approach h2 {
  margin: .5rem 0 1rem;
  font-family: var(--serif);
  font-size: clamp(2.1rem, 4vw, 3.7rem);
  font-weight: 500;
  line-height: 1.08;
}

.facial-signature p:not(.eyebrow),
.facial-approach p:not(.eyebrow) {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
}

.facial-duration {
  color: var(--accent);
  font-family: var(--serif);
  font-size: clamp(3.2rem, 7vw, 5.6rem);
  line-height: .85;
  text-align: center;
  white-space: nowrap;
}

.facial-duration span {
  display: block;
  margin-top: .75rem;
  color: var(--muted);
  font-family: var(--sans);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.facial-benefits {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 2rem 0 1.8rem;
}

.facial-benefits span {
  padding: .62rem .9rem;
  background: var(--paper);
  border: 1px solid var(--line);
  color: var(--muted);
  transition: transform .25s ease, background-color .25s ease, border-color .25s ease;
}

.facial-benefits span:hover {
  background: var(--peach);
  border-color: var(--accent);
  color: var(--ink);
  transform: translateY(-3px);
}

body.page-visage .light-boost-band {
  background: var(--peach);
}

.light-boost-band .narrow {
  max-width: 900px;
  padding-left: 28px;
  border-left: 3px solid var(--accent);
}

.light-boost-band h2 {
  margin: .5rem 0 1rem;
  font-family: var(--serif);
  font-size: clamp(2.4rem, 5vw, 4.3rem);
  font-weight: 500;
  line-height: 1.05;
}

.light-boost-band p:not(.eyebrow) {
  max-width: 720px;
  color: var(--muted);
}

.facial-approach-inner {
  max-width: 820px;
  margin-inline: auto;
  text-align: center;
}

.facial-approach h2 {
  font-size: clamp(2.8rem, 6vw, 5.4rem);
}

.facial-approach p:not(.eyebrow) {
  max-width: 610px;
  margin-inline: auto;
  font-size: 1.08rem;
}

@media (max-width: 700px) {
  .facial-signature-head {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .facial-duration {
    justify-self: start;
    text-align: left;
  }

  .light-boost-band .narrow {
    padding-left: 20px;
  }
}

/* CTA final Visage : composition verticale, plus naturelle et lisible. */
body.page-visage .facial-approach + .final-cta .shell.narrow {
  display: block;
  width: min(1160px, calc(100% - 48px));
}

body.page-visage .facial-approach + .final-cta h2 {
  max-width: 820px;
  margin: 0 0 1rem;
  font-size: clamp(2.2rem, 4vw, 3.8rem);
  line-height: 1.08;
}

body.page-visage .facial-approach + .final-cta p {
  max-width: 760px;
  margin: 0;
}

body.page-visage .facial-approach + .final-cta .button {
  display: inline-flex;
  margin-top: 1.6rem;
}

@media (prefers-reduced-motion: reduce) {
  .facial-benefits span { transition: none; }
}

/* Alignement final : la séquence Visage reprend l’axe principal du site. */
.facial-signature-card {
  max-width: none;
  margin: 0;
  box-shadow: none;
}

.light-boost-band .narrow {
  width: 100%;
  max-width: none;
  padding-left: 0;
  border-left: 0;
}

.facial-approach-inner {
  max-width: none;
  text-align: left;
}

.facial-approach p:not(.eyebrow) {
  margin-inline: 0;
}

/* Le soin personnalisé reprend le contenu détaillé de Planity, sans encart. */
.facial-signature-card {
  padding: 0;
  background: transparent;
  border: 0;
}

.facial-signature h2 {
  max-width: 900px;
}

.facial-intro {
  max-width: 860px !important;
  font-size: 1.08rem;
}

.facial-treatment {
  max-width: 980px;
  margin-top: 2rem;
}

.facial-treatment > p {
  margin-bottom: 1rem !important;
  color: var(--ink) !important;
}

.facial-treatment .check-list {
  margin-top: 0;
}

.facial-signature-card > .button {
  margin-top: 1.2rem;
}

/* Présentations de prestations : informations détaillées mais compactes. */
.facial-signature h2,
.light-boost-band h2 {
  font-size: clamp(1.9rem, 3.4vw, 3.1rem);
}

.facial-intro,
.light-boost-intro {
  font-size: 1rem;
  line-height: 1.55;
}

.facial-treatment {
  margin-top: 1.5rem;
}

.facial-treatment .check-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 0;
}

.facial-treatment .check-list li {
  padding: 10px 12px;
  font-size: .9rem;
  line-height: 1.45;
}

@media (max-width: 700px) {
  .facial-treatment .check-list {
    grid-template-columns: 1fr;
  }
}

/* Ajustements de lisibilité des deux prestations Visage. */
.facial-signature .facial-treatment .check-list li {
  background: var(--paper);
}

.facial-signature .facial-treatment .check-list li:hover {
  background: var(--peach);
}

.light-boost-band .facial-treatment + .button {
  margin-top: 1.6rem;
}

/* Page Visage : conclusion plus compacte et mieux rythmée. */
body.page-visage .facial-approach {
  padding-top: clamp(52px, 6vw, 82px);
  padding-bottom: clamp(52px, 6vw, 82px);
  background: var(--paper);
}

body.page-visage .facial-approach-inner {
  max-width: 900px;
  margin-inline: 0;
  padding-left: 28px;
  border-left: 3px solid var(--accent);
}

body.page-visage .facial-approach h2 {
  max-width: 760px;
  margin: .45rem 0 1rem;
  font-size: clamp(2.4rem, 4.6vw, 4.3rem);
  line-height: 1.05;
}

body.page-visage .facial-approach p:not(.eyebrow) {
  max-width: 620px;
  font-size: 1rem;
}

body.page-visage .facial-approach + .final-cta {
  background: var(--cream);
  padding-block: clamp(48px, 6vw, 78px);
}

body.page-visage .facial-approach + .final-cta .shell.narrow {
  width: min(1160px, calc(100% - 48px));
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 36px;
}

body.page-visage .facial-approach + .final-cta h2 {
  max-width: 780px;
  margin: 0 0 .8rem;
  font-size: clamp(2rem, 3.5vw, 3.4rem);
  line-height: 1.08;
}

body.page-visage .facial-approach + .final-cta p {
  max-width: 680px;
  margin: 0;
}

body.page-visage .facial-approach + .final-cta .button {
  margin: 0;
  white-space: nowrap;
}

@media (max-width: 700px) {
  body.page-visage .facial-approach-inner {
    padding-left: 20px;
  }

  body.page-visage .facial-approach + .final-cta .shell.narrow {
    width: min(100% - 32px, 600px);
    grid-template-columns: 1fr;
    gap: 24px;
  }

  body.page-visage .facial-approach + .final-cta .button {
    justify-self: start;
  }
}

/* Override final : le CTA reste volontairement vertical. */
body.page-visage .facial-approach + .final-cta .shell.narrow {
  display: block !important;
  grid-template-columns: none !important;
  width: min(1160px, calc(100% - 48px)) !important;
}

body.page-visage .facial-approach + .final-cta h2 {
  max-width: 820px !important;
  margin: 0 0 1rem !important;
  font-size: clamp(2.2rem, 4vw, 3.8rem) !important;
  line-height: 1.08 !important;
}

body.page-visage .facial-approach + .final-cta p {
  max-width: 760px !important;
  margin: 0 !important;
}

body.page-visage .facial-approach + .final-cta .button {
  display: inline-flex !important;
  margin-top: 1.6rem !important;
  white-space: normal !important;
}

@media (max-width: 700px) {
  body.page-visage .facial-approach + .final-cta .shell.narrow {
    width: min(100% - 32px, 600px) !important;
  }
}

/* Page Pieds : bloc "Pour qui ?" plus structuré. */
body.page-pieds main > section.service-copy-block {
  padding-top: clamp(52px, 6vw, 82px);
  padding-bottom: clamp(52px, 6vw, 82px);
}

body.page-pieds main > section.service-copy-block h2 {
  max-width: 760px;
  margin-bottom: 1rem;
  font-size: clamp(2.2rem, 4.2vw, 4rem);
}

body.page-pieds main > section.service-copy-block > p:not(.eyebrow) {
  margin-bottom: 1.6rem;
  color: var(--ink);
  font-size: 1.08rem;
}

body.page-pieds .audience-list {
  max-width: 1040px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 0;
  margin: 0;
  list-style: none;
}

body.page-pieds .audience-list li {
  position: relative;
  padding: 15px 18px 15px 38px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-left: 2px solid var(--accent);
  color: var(--muted);
  transition: transform .25s ease, background-color .25s ease, border-color .25s ease, box-shadow .25s ease;
}

body.page-pieds .audience-list li::before {
  content: '✦';
  position: absolute;
  left: 16px;
  color: var(--accent);
}

body.page-pieds .audience-list li:hover {
  background: var(--peach);
  border-color: var(--accent);
  transform: translateY(-4px);
  box-shadow: 0 10px 20px rgb(51 43 30 / 8%);
}

@media (max-width: 700px) {
  body.page-pieds .audience-list {
    grid-template-columns: 1fr;
  }

}

@media (prefers-reduced-motion: reduce) {
  body.page-pieds .audience-list li { transition: none; }
}

/* Harmonisation finale des espacements internes des blocs. */
.mini-grid > div,
.review-card,
.process-band .narrow > p:nth-of-type(2),
.process-band .narrow > p:nth-of-type(3),
.process-band .narrow > p:nth-of-type(4) {
  padding-block: 20px;
}

.mini-grid > div h3,
.mini-grid > div p,
.review-card p,
.review-card cite {
  margin-top: 0;
}

.mini-grid > div h3 {
  margin-bottom: .65rem;
}

.mini-grid > div p:last-child,
.review-card p:last-child {
  margin-bottom: 0;
}

.process-band .narrow > p:nth-of-type(2),
.process-band .narrow > p:nth-of-type(3),
.process-band .narrow > p:nth-of-type(4) {
  padding-inline: 22px;
}

.check-list li {
  padding-block: 13px;
}

.zones-columns li,
.benefit-list span,
.zone-pills span {
  line-height: 1.4;
}

@media (max-width: 800px) {
  .mini-grid > div,
  .review-card,
  .process-band .narrow > p:nth-of-type(2),
  .process-band .narrow > p:nth-of-type(3),
  .process-band .narrow > p:nth-of-type(4) {
    padding-block: 18px;
  }
}

/* Alignement commun des blocs "Zones traitées" et des CTA finaux. */
body.internal-page main > section.zones-band {
  padding-block: clamp(56px, 6vw, 82px) !important;
}

body.internal-page .zones-band .narrow {
  width: min(1160px, calc(100% - 48px));
  margin-inline: auto;
}

body.internal-page .zones-band h2 {
  max-width: 900px;
  margin: 0 0 1.8rem;
  font-size: clamp(2.4rem, 4.5vw, 4.2rem);
  line-height: 1.08;
}

body.internal-page .zones-columns {
  gap: clamp(32px, 5vw, 72px);
  margin-top: 0;
}

body.internal-page main > section.final-cta {
  padding-block: clamp(56px, 6vw, 82px) !important;
}

body.internal-page .final-cta .narrow {
  width: min(1160px, calc(100% - 48px));
  margin-inline: auto;
}

body.internal-page .final-cta h2 {
  max-width: 900px;
  margin: 0 0 1rem;
  font-size: clamp(2.2rem, 4vw, 3.8rem);
  line-height: 1.08;
}

body.internal-page .final-cta p {
  max-width: 760px;
  margin: 0;
}

body.internal-page .final-cta .button {
  margin-top: 1.5rem;
}

@media (max-width: 800px) {
  body.internal-page .zones-band .narrow,
  body.internal-page .final-cta .narrow {
    width: min(100% - 32px, 600px);
  }
}

/* Logo plus lisible dans l’en-tête. */
.brand img {
  width: 104px;
  height: 104px;
  margin-top: 7px;
}

.header-inner {
  min-height: 112px;
}

.site-nav {
  font-size: 1rem;
}

@media (max-width: 800px) {
  .brand img {
    width: 94px;
    height: 94px;
    margin-top: 5px;
  }

  .header-inner {
    min-height: 104px;
  }

  .site-nav {
    top: 96px;
  }
}

/* Photo d'accueil : conserver toute la largeur de l'atelier, notamment le laser et le miroir. */
.hero-media img[src*="atelier-institut-beaute"] {
  height: auto;
  aspect-ratio: auto;
  object-fit: contain;
}

.hero-media-home::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(246, 240, 232, 0.22);
  pointer-events: none;
  z-index: 1;
}

.hero-media-home img[src*="atelier-institut-beaute"] {
  filter: saturate(0.88) contrast(1.04) sepia(0.06);
}

/* Accueil : traitement colorimétrique commun pour harmoniser les photos des prestations. */
body:not(.internal-page) .service-media img {
  filter: saturate(0.92) contrast(0.98) brightness(1.02) sepia(0.025);
}

/* Test de palette : un kaki très clair pour les pastilles et les témoignages. */
body:not(.internal-page) .benefit-list span {
  background: #F0EEE8;
}

body:not(.internal-page) .reviews.band {
  background: #F3F0E9;
}

.instagram-link {
  display: inline-flex;
  align-items: center;
  gap: 0.42em;
}

.instagram-link svg {
  width: 1.05em;
  height: 1.05em;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
}

.instagram-link .instagram-dot {
  fill: currentColor;
  stroke: none;
}

.contact-instagram {
  margin-top: 1rem;
}

.contact-social-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 1.5rem;
  margin-top: 1.25rem;
}

/* Test de fond pour l'en-tête. */
.site-header,
.site-header.scrolled {
  background: #A29D8D;
  color: #fff;
}

.site-header .site-nav a,
.site-header .nav-dropdown summary {
  color: #fff;
}

.site-header .nav-submenu {
  background: #fff;
}

.site-header .nav-submenu a {
  color: var(--ink) !important;
}

.header-inner {
  min-height: 128px;
}

@media (max-width: 800px) {
  .header-inner {
    min-height: 116px;
  }

  .site-nav {
    color: var(--ink);
  }

  .site-nav > a,
  .site-nav > .nav-dropdown > summary {
    color: var(--ink) !important;
  }

  .site-nav .nav-cta {
    color: #fff !important;
  }
}

/* Menu sombre sur le header kaki et interaction plus visible du sous-menu. */
.site-header .site-nav a,
.site-header .nav-dropdown summary {
  color: var(--ink) !important;
}

.site-header .site-nav .nav-cta {
  color: #fff !important;
}

.site-header .nav-submenu a {
  display: block;
  padding: .55rem .7rem;
  transition: background-color .2s ease, color .2s ease;
}

.site-header .nav-submenu a:hover,
.site-header .nav-submenu a:focus-visible {
  background: #706B5D;
  color: #fff !important;
}

.site-header .site-nav > a:hover,
.site-header .site-nav > a:focus-visible,
.site-header .nav-dropdown > summary:hover,
.site-header .nav-dropdown > summary:focus-visible {
  color: #fff !important;
}

/* Logo : centrage réel dans le bandeau et taille augmentée. */
.brand {
  display: flex;
  align-items: center;
  align-self: stretch;
}

.brand img {
  width: 100px;
  height: 127px;
  margin-top: 0;
  object-fit: contain;
}

.header-inner {
  min-height: 154px;
}

@media (max-width: 800px) {
  .brand img {
    width: 88px;
    height: 112px;
    margin-top: 0;
    object-fit: contain;
  }

  .header-inner {
    min-height: 138px;
  }
}

.site-nav {
  font-size: 1.08rem;
}

.site-header .nav-submenu {
  font-size: 1.02rem;
}

.site-header .nav-dropdown summary::after {
  content: '+';
  display: inline-block;
  margin-left: 8px;
  color: currentColor;
  font-size: 1.15em;
  font-weight: 400;
  line-height: 1;
}

.site-header .nav-dropdown[open] summary::after {
  content: '−';
}

/* Indicateur moderne du sous-menu : chevron fin qui pivote à l'ouverture. */
.site-header .nav-dropdown summary::after {
  content: '';
  width: 7px;
  height: 7px;
  margin-left: 10px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  transition: transform .22s ease;
  vertical-align: middle;
}

.site-header .nav-dropdown[open] summary::after {
  content: '';
  transform: rotate(225deg) translateY(-2px);
}

/* Encadrement commun pour les images principales des blocs de contenu. */
.service > .service-media {
  position: relative;
  isolation: isolate;
}

.service > .service-media::after {
  content: '';
  position: absolute;
  inset: 24px -24px -24px 24px;
  border: 1px solid var(--accent);
  z-index: -1;
  pointer-events: none;
}

.service-media img[src*="interieur-atelier-beaute"] {
  width: 100%;
  height: auto !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  background: var(--cream);
}

/* À propos : conserver le cadrage vertical du portrait pour laisser apparaître davantage la tenue. */
.service-media img[src*="alix-fondatrice-tulipe-noire"] {
  width: 100%;
  height: auto !important;
  aspect-ratio: 3 / 4 !important;
  object-fit: cover !important;
  object-position: center bottom !important;
}

/* À propos : image secondaire plus discrète pour laisser respirer le bloc. */
.internal-page .service.service-reverse > .service-media {
  width: 50%;
  justify-self: start;
}

/* À propos : rapprocher l’image secondaire de son texte sans la rendre envahissante. */
body.page-a-propos .service.service-reverse {
  grid-template-columns: minmax(0, .65fr) minmax(0, 1fr);
  gap: clamp(32px, 4vw, 64px);
}

body.page-a-propos .service.service-reverse > .service-media {
  width: 90%;
}

.service-media:has(img[src*="alix-fondatrice-tulipe-noire"])::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.16);
  pointer-events: none;
  z-index: 1;
}

.service > .service-media:has(img[src*="alix-fondatrice-tulipe-noire"]) {
  width: 94%;
  justify-self: center;
}

@media (max-width: 800px) {
  .internal-page .service.service-reverse > .service-media {
    width: 100%;
  }

  body.page-a-propos .service.service-reverse {
    grid-template-columns: 1fr;
  }

  .service > .service-media::after {
    inset: 12px -12px -12px 12px;
  }
}

/* Accueil : conserver le format carré des visuels de prestations, notamment les mains et ongles. */
body:not(.internal-page) #ongles .service-media {
  aspect-ratio: 1 / 1;
  overflow: visible;
}

body:not(.internal-page) #ongles .service-media img {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: cover;
}

/* Réalisations : galerie horizontale extensible, avec vignettes carrées. */
body.page-ongles .gallery-carousel {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
}

body.page-ongles .gallery-arrow {
  width: 48px;
  height: 48px;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 3px;
  background: var(--cream);
  color: var(--ink);
  font: 1.8rem/1 var(--sans);
  cursor: pointer;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

body.page-ongles .gallery-arrow:hover,
body.page-ongles .gallery-arrow:focus-visible {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  transform: translateY(-2px);
}

body.page-photobiomodulation .page-hero h1 {
  max-width: none;
  white-space: nowrap;
  font-size: clamp(2.55rem, 4.2vw, 4.2rem);
}

body.page-photobiomodulation .service {
  grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr);
}

body.page-photobiomodulation .service-media {
  width: 88%;
  justify-self: center;
}

@media (max-width: 800px) {
  body.page-photobiomodulation .page-hero h1 {
    white-space: normal;
    font-size: clamp(2.4rem, 10vw, 4rem);
  }

  body.page-photobiomodulation .service {
    grid-template-columns: 1fr;
  }

  body.page-photobiomodulation .service-media {
    width: 100%;
  }
}

body.page-ongles .gallery-grid {
  display: flex;
  justify-content: flex-start;
  gap: 18px;
  overflow: hidden;
  overflow-y: hidden;
  padding: 4px 4px 16px;
  scroll-behavior: smooth;
}

body.page-ongles .gallery-grid img {
  flex: 0 0 calc((100% - 36px) / 3);
  width: calc((100% - 36px) / 3);
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

@media (max-width: 800px) {
  body.page-ongles .gallery-grid img {
    flex-basis: calc((100% - 18px) / 2);
    width: calc((100% - 18px) / 2);
  }
}

@media (max-width: 480px) {
  body.page-ongles .gallery-carousel {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 8px;
  }

  body.page-ongles .gallery-arrow {
    width: 36px;
    height: 36px;
    font-size: 1.5rem;
  }

  body.page-ongles .gallery-grid img {
    flex-basis: 100%;
    width: 100%;
  }
}