:root{
  --cream:#FBF6F1;
  --cream-deep:#F3EADF;
  --blush:#F0D6CC;
  --peach:#F0BFA6;
  --rose:#B5726B;
  --rose-deep:#8F4F49;
  --plum:#3E2723;
  --plum-soft:#5C3A35;
  --sand:#D9B98B;
  --line:rgba(62,39,35,0.14);
  --radius-lg:28px;
  --header-h:93px;
  --shadow:0 20px 50px -25px rgba(62,39,35,0.35);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'Nunito Sans', sans-serif;
  color:var(--plum);
  background:var(--cream);
  -webkit-font-smoothing:antialiased;
  font-weight:400;
  line-height:1.6;
}
h1,h2,h3,.serif{
  font-family:'Fraunces', serif;
  font-weight:500;
  line-height:1.08;
  margin:0;
  color:var(--plum);
}
a{color:inherit;}
img{max-width:100%;display:block;}
.wrap{max-width:1160px;margin:0 auto;padding:0 32px;}
.wrap-narrow{max-width:760px;margin:0 auto;padding:0 32px;}
.eyebrow{
  font-size:13px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--rose-deep);font-weight:500;margin-bottom:14px;display:inline-block;
}
.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:15px 30px;border-radius:999px;background:var(--rose-deep);color:#fff;
  text-decoration:none;font-size:15px;letter-spacing:.02em;border:1px solid var(--rose-deep);
  transition:background .25s ease, border-color .25s ease, transform .2s ease;
  cursor:pointer;font-family:'Nunito Sans',sans-serif;
}
.btn:hover{background:var(--plum);border-color:var(--plum);transform:translateY(-2px);}
.btn-ghost{background:transparent;color:var(--plum);border:1px solid var(--plum);}
.btn-ghost:hover{background:var(--plum);color:#fff;}
:focus-visible{outline:3px solid var(--rose-deep);outline-offset:3px;}

/* Header */
header{position:sticky;top:0;z-index:50;background:rgba(251,246,241,0.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);}
.nav{display:flex;align-items:center;justify-content:space-between;padding:18px 32px;max-width:1160px;margin:0 auto;}
.brand{display:inline-flex;align-items:center;gap:10px;line-height:1;font-family:'Fraunces',serif;font-size:22px;letter-spacing:.03em;font-style:italic;text-decoration:none;}
.brand-logo{width:52px;height:auto;flex-shrink:0;}
.brand small{display:block;line-height:1.5;margin-top:2px;font-family:'Nunito Sans',sans-serif;font-style:normal;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--rose-deep);}
nav ul{list-style:none;display:flex;gap:18px;margin:0;padding:0;font-size:14.5px;flex-wrap:wrap;}
nav ul li{position:relative;}
nav ul a{text-decoration:none;position:relative;transition:color .2s ease;}
nav ul a::after{content:'';position:absolute;left:0;bottom:-6px;width:0;height:1px;background:var(--rose-deep);transition:width .25s ease;}
nav ul a:hover, nav ul a.current{color:var(--rose-deep);}
nav ul a:hover::after, nav ul a.current::after{width:100%;}
.has-dropdown > a{display:inline-flex;align-items:center;}
.has-dropdown > a::before{content:'';order:1;display:inline-block;width:5px;height:5px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin-left:14px;margin-bottom:1px;opacity:.6;transition:transform .2s ease;}
.has-dropdown:hover > a::before, .has-dropdown:focus-within > a::before{transform:rotate(225deg);margin-bottom:-2px;}
.dropdown{list-style:none;position:absolute;top:100%;left:-14px;margin:0;padding:10px;min-width:240px;background:#fff;border-radius:14px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:2px;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .2s ease,transform .2s ease,visibility 0s linear .2s;}
.has-dropdown:hover .dropdown, .has-dropdown:focus-within .dropdown{opacity:1;visibility:visible;transform:translateY(0);transition:opacity .2s ease,transform .2s ease;}
.dropdown a{display:block;padding:10px 14px;font-size:14px;border-radius:8px;color:var(--plum);white-space:nowrap;}
.dropdown a::after{display:none;}
.dropdown a:hover{background:var(--cream-deep);color:var(--rose-deep);}
.dropdown a.current{background:var(--blush);color:var(--rose-deep);}
.nav-cta{display:flex;align-items:center;gap:22px;}
.menu-toggle{display:none;background:none;border:none;font-size:26px;cursor:pointer;color:var(--plum);}
.menu-toggle.open{color:var(--rose-deep);}
.nav-mobile{display:none;position:absolute;top:100%;left:0;right:0;background:var(--cream);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:8px 32px 20px;flex-direction:column;z-index:299;box-shadow:0 16px 30px -20px rgba(62,39,35,.3);max-height:calc(100vh - 100%);overflow-y:auto;}
.nav-mobile.open{display:flex;}
.nav-mobile a{font-family:'Nunito Sans',sans-serif;font-size:15px;color:var(--plum);text-decoration:none;padding:14px 0;border-bottom:1px solid var(--line);display:block;}
.nav-mobile a:last-of-type{border-bottom:none;}
.nav-mobile a.current{color:var(--rose-deep);}
.nav-mobile a.sub{padding-left:20px;font-size:13.5px;color:var(--plum-soft);}
.nav-mobile .mob-cta{margin-top:10px;background:var(--rose-deep);color:#fff;padding:14px;border-radius:999px;text-align:center;font-weight:500;border-bottom:none;}

/* Page header (pages secondaires) */
.page-hero{background:linear-gradient(180deg, var(--blush) 0%, var(--cream) 100%);padding:49px 0 42px;text-align:center;}
.page-hero .eyebrow{display:block;}
.page-hero h1{font-size:clamp(30px,4vw,46px);max-width:16ch;margin:0 auto;}
.page-hero p{max-width:52ch;margin:18px auto 0;color:var(--plum-soft);font-size:16.5px;}
.breadcrumb{font-size:13px;color:var(--plum-soft);margin-bottom:16px;}
.breadcrumb a{color:var(--rose-deep);text-decoration:none;}

/* Hero (accueil) */
.hero{position:relative;background:linear-gradient(180deg, var(--blush) 0%, var(--cream) 100%);padding:64px 0 0;overflow:hidden;}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;}
.hero-media{position:relative;}
.hero h1{font-size:clamp(34px,4.6vw,54px);max-width:12ch;}
.hero p.lede{margin:22px 0 32px;font-size:18px;max-width:42ch;color:var(--plum-soft);}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap;}
.hero-photo-frame{position:relative;border-radius:200px 200px 24px 24px;overflow:hidden;aspect-ratio:4/5;box-shadow:var(--shadow);}
.hero-photo-frame img{width:100%;height:100%;object-fit:cover;}
.hero-outline{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2;overflow:visible;}
.hero-outline path{fill:none;stroke:var(--rose-deep);stroke-width:2.1;stroke-linecap:round;}
.hero-outline .outline-shape-lead{transition:stroke-dashoffset 1s ease-out;}
.hero-strip{text-align:center;font-family:'Fraunces',serif;font-style:italic;font-size:19px;color:var(--plum-soft);padding:63px 24px 38px;}


section{padding:62px 0;}
.section-head{text-align:center;max-width:640px;margin:0 auto 36px;}
.section-head h2{font-size:clamp(28px,3.4vw,40px);}
.alt{background:var(--cream-deep);}

/* Cabinet / about */
.about-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:center;}
.about-photo{border-radius:22px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/5;}
.about-photo img{width:100%;height:100%;object-fit:cover;}
/* Section "Le cabinet" (index.html) : carrousel photos + texte */
.cabinet-grid{grid-template-columns:1.1fr .9fr;}
.carousel{position:relative;border-radius:22px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/3;background:var(--cream-deep);}
.carousel-track{display:flex;height:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none;}
.carousel-track::-webkit-scrollbar{display:none;}
.carousel-track:focus-visible{outline:3px solid var(--rose-deep);outline-offset:-3px;}
.carousel-slide{flex:0 0 100%;height:100%;margin:0;scroll-snap-align:start;}
.carousel-slide img{width:100%;height:100%;object-fit:cover;display:block;}
.carousel-btn{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:50%;border:none;background:rgba(255,255,255,.88);color:var(--plum);font-size:26px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0 0 3px;transition:background .2s ease;}
.carousel-btn:hover{background:#fff;}
.carousel-btn:focus-visible, .carousel-dot:focus-visible{outline:3px solid var(--rose-deep);outline-offset:2px;}
.carousel-prev{left:12px;}
.carousel-next{right:12px;}
.carousel-dots{position:absolute;left:0;right:0;bottom:12px;display:flex;justify-content:center;gap:8px;}
.carousel-dot{width:9px;height:9px;padding:0;border-radius:50%;border:1px solid #fff;background:rgba(255,255,255,.35);cursor:pointer;box-shadow:0 0 0 1px rgba(62,39,35,.15);}
.carousel-dot[aria-current="true"]{background:#fff;}
.cabinet-address{font-size:14.5px;}
.cabinet-address strong{color:var(--plum);font-weight:600;}
.cabinet-who{display:flex;align-items:center;gap:12px;margin-top:26px;padding-top:20px;border-top:1px solid var(--line);color:var(--plum);font-size:14.5px;font-weight:500;text-decoration:none;width:fit-content;}
.cabinet-who img{width:56px;height:56px;border-radius:50%;object-fit:cover;object-position:center top;flex-shrink:0;}
.cabinet-who span{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--rose-deep);}
.cabinet-who:hover span{color:var(--rose-deep);}
.cred-list{list-style:none;margin:20px 0 26px;padding:0;display:flex;flex-direction:column;gap:14px;}
.cred-list li{display:flex;gap:14px;align-items:center;font-size:15px;}
.cred-list .icon-line{width:44px;height:44px;margin-bottom:0;flex-shrink:0;}
.about-grid h3{font-size:26px;margin-bottom:4px;}
.about-grid p{color:var(--plum-soft);}

/* Cartes prestations (grille accueil) */
.service-cards{display:flex;flex-wrap:wrap;justify-content:center;gap:22px;}
.service-cards > *{flex:0 0 calc((100% - 44px)/3);min-width:0;}
.service-card{background:#fff;border-radius:22px;overflow:hidden;box-shadow:var(--shadow);text-decoration:none;color:var(--plum);display:flex;flex-direction:column;transition:transform .2s ease;}
.service-card:hover{transform:translateY(-4px);}
.service-card-media{position:relative;aspect-ratio:4/3;}
.service-card-body{padding:22px;flex:1;display:flex;flex-direction:column;}
.service-card h3{font-size:20px;margin-bottom:8px;}
.service-card p{font-size:13.5px;color:var(--plum-soft);margin:0 0 16px;flex:1;}
.service-card span.link{color:var(--rose-deep);font-size:13.5px;font-weight:500;}

/* Détail prestation */
.service-detail{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center;}
.service-detail-media{border-radius:26px;overflow:hidden;aspect-ratio:5/4;box-shadow:var(--shadow);}
.service-detail-media img{width:100%;height:100%;object-fit:cover;}
.service-cta{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:22px;}
.steps-list{list-style:none;margin:20px 0;padding:0;counter-reset:step;}
.steps-list li{counter-increment:step;padding:14px 0 14px 40px;position:relative;border-bottom:1px solid var(--line);font-size:14.5px;color:var(--plum-soft);}
.steps-list li::before{content:counter(step);position:absolute;left:0;top:12px;width:24px;height:24px;border-radius:50%;background:var(--blush);color:var(--rose-deep);font-size:12px;display:flex;align-items:center;justify-content:center;font-weight:600;}

/* Page Tarifs */
.tarifs-list{list-style:none;margin:28px 0;padding:0;}
.tarifs-list li{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:18px 0;border-bottom:1px solid var(--line);}
/* Cartes tarifs (tarifs.html) */
.tarif-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;align-items:stretch;}
.tarif-card{background:#fff;border-radius:22px;box-shadow:var(--shadow);padding:32px 30px;display:flex;flex-direction:column;}
.tarif-card .icon-line{width:46px;height:46px;margin-bottom:14px;}
.tarif-card h3{font-size:24px;margin-bottom:8px;}
.tarif-intro{color:var(--plum-soft);font-size:14.5px;margin:0 0 20px;}
.tarif-main{background:var(--cream);border-radius:16px;padding:18px 20px;display:grid;grid-template-columns:1fr auto;gap:4px 16px;align-items:center;}
.tarif-main-info{display:flex;flex-direction:column;gap:2px;}
.tarif-main-nom{font-family:'Fraunces',serif;font-size:19px;color:var(--plum);}
.tarif-main-duree{font-size:13px;color:var(--plum-soft);}
.tarif-main-prix{font-family:'Fraunces',serif;font-size:30px;color:var(--rose-deep);white-space:nowrap;text-align:right;}
.tarif-main .btn{grid-column:1 / -1;justify-self:start;margin-top:10px;padding:11px 24px;font-size:14px;}
.tarif-others{margin:12px 0 0;}
.tarif-others li{padding:11px 0;}
.tarif-others .tarifs-nom{font-size:15px;color:var(--plum-soft);}
.tarif-others .tarifs-duree{font-size:12.5px;}
.tarif-others .tarifs-prix{font-size:16px;min-width:64px;}
.tarif-packs{padding-top:22px;}
.tarif-packs h4{font-family:'Nunito Sans',sans-serif;font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--rose-deep);margin:0;}
/* Desktop : Réflexologie + Massages bien-être, puis Kobido + Toucher métamorphique
   (l'ordre du HTML, utilisé en mobile, reste Réflexologie, Kobido, Massages, Toucher). */
@media (min-width:861px){
  .tarif-card:nth-child(3){order:1;}
  .tarif-card:nth-child(2){order:2;}
  .tarif-card:nth-child(4){order:3;}
}
.tarifs-note{text-align:center;margin-top:34px;font-size:13px;color:var(--rose-deep);}
.tarifs-nom{font-family:'Fraunces',serif;font-size:17px;color:var(--plum);flex:1;}
.tarifs-duree{font-size:13px;color:var(--plum-soft);white-space:nowrap;}
.tarifs-prix{font-family:'Fraunces',serif;font-size:18px;color:var(--rose-deep);white-space:nowrap;min-width:80px;text-align:right;}

/* Booking */
.booking{position:relative;overflow:hidden;background:var(--plum);color:var(--cream);border-radius:var(--radius-lg);margin:0 32px;padding:64px 40px;}
/* Lierre suspendu depuis le haut du bloc, le long du bord droit (remplace l'ancien
   filigrane soleil) — hauteur fixe (pas 100%) pour un rendu constant quelle que soit
   la hauteur du bloc (CTA compact ou module de reservation complet sur contact.html),
   simplement rogne par overflow:hidden sur les blocs plus courts. */
.booking > *{position:relative;}
.booking h2, .booking .section-head p{color:var(--cream);}
.booking .eyebrow{color:var(--sand);}
.booking-flow{max-width:820px;margin:0 auto;}
.booking-steps{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;margin-bottom:34px;}
.booking-steps > *{flex:0 0 calc((100% - 16px)/2);min-width:0;}
.booking-step{background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.14);border-radius:18px;padding:22px 20px;cursor:pointer;transition:background .2s ease, border-color .2s ease;text-align:left;}
.booking-step.active{background:rgba(240,214,204,0.14);border-color:var(--peach);}
.booking-step .num{font-family:'Fraunces',serif;font-size:13px;color:var(--sand);letter-spacing:.15em;text-transform:uppercase;}
.booking-step h3, .booking-step h4{font-family:'Fraunces',serif;font-size:21px;font-weight:500;margin:8px 0 6px;color:#fff;}
.booking-step p{margin:0;font-size:13.5px;color:#D9CFC8;}
.booking-extra{margin:-14px 0 30px;text-align:center;font-size:13px;color:#D9CFC8;}
.booking-extra a{color:var(--sand);text-decoration:underline;text-underline-offset:3px;}
.cal-mock{background:var(--cream);color:var(--plum);border-radius:20px;padding:26px;}
.cal-mock-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;}
.cal-mock-head h3, .cal-mock-head h4{font-family:'Fraunces',serif;font-size:20px;}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-bottom:18px;}
.cal-day{aspect-ratio:1;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:13px;background:#fff;border:1px solid var(--line);color:var(--plum-soft);}
.cal-day.avail{background:var(--blush);color:var(--rose-deep);font-weight:500;cursor:pointer;}
.cal-day.sel{background:var(--rose-deep);color:#fff;}
.slot-row{display:flex;gap:10px;flex-wrap:wrap;}
.slot{padding:9px 16px;border-radius:999px;border:1px solid var(--line);font-size:13.5px;background:#fff;cursor:pointer;}
.slot.sel{background:var(--rose-deep);color:#fff;border-color:var(--rose-deep);}
.booking-note{text-align:center;margin-top:26px;font-size:13px;color:#D9CFC8;}

/* Contact */
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;}
.contact-info-card{background:#fff;border-radius:22px;padding:32px;box-shadow:var(--shadow);}
.contact-info-card h2, .contact-info-card h3{font-size:22px;margin-bottom:18px;}
.contact-info-card ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:14px;font-size:14.5px;color:var(--plum-soft);}
.contact-form{background:#fff;border-radius:22px;padding:32px;box-shadow:var(--shadow);}
.contact-form label{display:block;font-size:13px;margin:0 0 6px;color:var(--plum-soft);}
.contact-form input, .contact-form select, .contact-form textarea{
  width:100%;padding:12px 14px;border-radius:12px;border:1px solid var(--line);margin-bottom:18px;font-family:'Nunito Sans',sans-serif;font-size:14.5px;background:var(--cream);
}
.contact-form textarea{resize:vertical;min-height:110px;}

/* Page Bons cadeaux */
.giftcard-mock{background:linear-gradient(135deg, var(--rose-deep), var(--plum));color:#fff;border-radius:22px;padding:44px 32px;text-align:center;box-shadow:var(--shadow);}
.giftcard-mock p{color:#fff;}
.giftcard-mock .icon-line-section{background-color:rgba(255,255,255,.3);width:175px;height:175px;margin:0 auto 20px;}
.giftcard-mock .icon-cadeau{-webkit-mask-image:url(images/iconecadeau.webp);mask-image:url(images/iconecadeau.webp);background-color:rgba(255,255,255,.7);width:140px;height:140px;margin:0 auto 22px;}
.giftcard-label{font-family:'Fraunces',serif;font-style:italic;font-size:15px;letter-spacing:.15em;text-transform:uppercase;color:var(--sand);margin:0 0 10px;}
.giftcard-brand{font-family:'Fraunces',serif;font-size:26px;margin:0;}
.giftcard-sub{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.7);margin:6px 0 26px;}
.giftcard-amount{display:block;font-size:13px;letter-spacing:.05em;color:rgba(255,255,255,.85);}
.giftcard-note{margin-top:22px;font-size:13.5px;color:var(--plum-soft);}
.demo-modal{position:fixed;inset:0;background:rgba(62,39,35,.55);display:flex;align-items:center;justify-content:center;z-index:10000;padding:20px;}
.demo-modal[hidden]{display:none;}
.demo-modal-box{background:#fff;border-radius:20px;padding:34px;max-width:420px;text-align:center;box-shadow:var(--shadow);}
.demo-modal-title{font-family:'Fraunces',serif;font-size:20px;color:var(--rose-deep);margin:0 0 12px;}
.demo-modal-box p:not(.demo-modal-title){color:var(--plum-soft);font-size:14.5px;margin:0 0 22px;}

/* Blog */
.blog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;}
.blog-card-sm{background:#fff;border-radius:20px;overflow:hidden;box-shadow:var(--shadow);text-decoration:none;color:var(--plum);}
.blog-card-sm img{aspect-ratio:4/3;object-fit:cover;width:100%;height:auto;display:block;}
.blog-card-sm-body{padding:20px;}
.blog-card-sm h3{font-size:18px;margin:8px 0;}
.blog-card-sm p{font-size:13.5px;color:var(--plum-soft);margin:0;}
.blog-date{font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--rose-deep);}
.article-body{max-width:700px;margin:0 auto;font-size:16px;color:var(--plum-soft);}
.article-body h2{color:var(--plum);font-size:26px;margin:36px 0 14px;}
.article-body p{margin:0 0 18px;}
.article-cover{border-radius:24px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:16/8;margin:0 auto 50px;max-width:900px;}
.article-cover img{width:100%;height:100%;object-fit:cover;}

/* Avis */
.avis-grid{display:flex;gap:24px;overflow-x:auto;scroll-behavior:auto;padding:4px 32px 12px;margin:0 -32px;-ms-overflow-style:none;scrollbar-width:none;}
.avis-grid::-webkit-scrollbar{display:none;}
.avis-grid{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 32px,#000 calc(100% - 32px),transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 32px,#000 calc(100% - 32px),transparent 100%);}
.avis-card{flex:0 0 auto;width:320px;background:#fff;border-radius:20px;padding:30px 26px;box-shadow:var(--shadow);}
.avis-card .stars{color:var(--rose-deep);letter-spacing:2px;margin-bottom:14px;display:block;}
.avis-card p{font-size:14.5px;color:var(--plum-soft);margin:0 0 18px;}
.avis-who{display:flex;align-items:center;gap:12px;}
.avis-avatar{width:40px;height:40px;border-radius:50%;background:var(--blush);color:var(--rose-deep);display:flex;align-items:center;justify-content:center;font-family:'Fraunces',serif;font-weight:600;}
.avis-who strong{display:block;font-size:14px;}
.avis-who span{font-size:12px;color:var(--plum-soft);}

/* FAQ */
.faq-groups{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:36px;}
.faq-group h3{font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--rose-deep);font-family:'Nunito Sans',sans-serif;font-weight:500;margin-bottom:14px;}
details{border-bottom:1px solid var(--line);padding:16px 0;}
summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;font-size:16px;font-weight:500;gap:12px;}
summary::-webkit-details-marker{display:none;}
summary::after{content:'+';font-size:20px;color:var(--rose-deep);transition:transform .2s ease;flex-shrink:0;}
details[open] summary::after{transform:rotate(45deg);}
details p{margin:12px 0 0;color:var(--plum-soft);font-size:14.5px;max-width:60ch;}

/* Légal */
.legal-body{max-width:760px;margin:0 auto;font-size:15px;color:var(--plum-soft);}
.legal-body h2{color:var(--plum);font-size:22px;margin:34px 0 12px;}
.legal-body p, .legal-body li{margin:0 0 12px;}

/* Sticky CTA mobile */
.sticky-cta{position:fixed;bottom:0;left:0;right:0;z-index:60;background:#fff;border-top:1px solid var(--line);padding:14px 20px;display:none;box-shadow:0 -10px 30px -20px rgba(0,0,0,.3);}
.sticky-cta .btn{width:100%;justify-content:center;}

/* Footer */
footer{background:var(--plum);color:#D9CFC8;padding:60px 0 30px;font-size:14px;}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:32px;align-items:start;margin-bottom:40px;}
/* Plus d'air entre la colonne marque et les liens (88px) qu'entre les colonnes de liens (32px). */
.footer-grid > div:first-child{margin-right:56px;}
.footer-grid h4{color:#fff;font-family:'Fraunces',serif;font-size:17px;margin:0 0 14px;font-weight:500;}
/* Logo au-dessus du nom (empile au lieu de cote-a-cote comme en nav), bloc centre
   dans la colonne ; sous-titre en sable (rose-deep de la nav est trop peu contraste
   sur le fond plum tres sombre du footer). */
footer .brand{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;}
footer .brand{font-size:26px;}
footer .brand-logo{width:84px;}
footer .brand small{color:var(--sand);margin-top:4px;font-size:11px;letter-spacing:.14em;}
/* Le paragraphe de description sous le logo garde un max-width (32ch, en style
   inline) pour ne pas s'etirer sur toute la colonne : il faut donc le recentrer
   via margin auto (text-align seul ne recentre pas la boite elle-meme). */
.footer-grid > div:first-child p{margin-left:auto;margin-right:auto;text-align:center;}
.footer-social{margin-top:22px;text-align:center;}
.footer-social > span{display:block;font-size:12.5px;letter-spacing:.04em;color:#D9CFC8;margin-bottom:10px;}
.footer-social-links{display:flex;justify-content:center;gap:12px;}
.footer-social-links a{width:44px;height:44px;border:1px solid #D9CFC8;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#D9CFC8;transition:background .25s ease,color .25s ease,border-color .25s ease;}
.footer-social-links a:hover{background:rgba(255,255,255,.12);border-color:#fff;color:#fff;}
.footer-social-links a:focus-visible{outline:2px solid var(--sand);outline-offset:3px;background:rgba(255,255,255,.12);color:#fff;}
.footer-social-links svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;}
.footer-grid ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px;}
.footer-grid a{text-decoration:none;color:#D9CFC8;}
.footer-grid a:hover{color:#fff;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:22px;display:flex;justify-content:space-between;align-items:center;gap:24px;text-align:left;font-size:12.5px;color:#A79892;}
.footer-bottom .footer-credit{text-align:right;}
.footer-bottom a{color:#D9CFC8;text-decoration:underline;text-underline-offset:3px;}
.footer-bottom a:hover{color:#fff;}
@media (max-width:900px){.footer-bottom{flex-direction:column;gap:6px;text-align:center;}.footer-bottom .footer-credit{text-align:center;}}

/* Reveal au scroll */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease;}
.reveal-img{opacity:0;transform:translateY(28px);transition:opacity .7s ease-out,transform .7s ease-out;}
.reveal-img.vis{opacity:1;transform:translateY(0);}
.reveal.vis{opacity:1;transform:none;}

/* Photos : entrée fondu+montée (reveal-img sur le conteneur) + parallaxe légère au
   scroll une fois affichées (photo-parallax sur l'img, pilotée en JS par
   photo-effects.js). Remplace l'ancien effet de survol scale+brightness (crossfade). */
.service-card-media{overflow:hidden;}
.service-card-media img{width:100%;height:100%;object-fit:cover;}
.photo-parallax{will-change:auto;}
.photo-parallax.pp-active{transform:scale(1.12);will-change:transform;}

/* Icônes ligne-art (masque CSS pour controler la couleur et le contraste) */
.icon-line, .icon-line-section{
  display:inline-block;
  background-color:var(--rose-deep);
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-size:contain;mask-size:contain;
}
.icon-reflexologie{-webkit-mask-image:url(images/icons/iconreflexologie.webp);mask-image:url(images/icons/iconreflexologie.webp);}
.icon-reflexoentreprise{-webkit-mask-image:url(images/iconereflexoentreprise.webp);mask-image:url(images/iconereflexoentreprise.webp);}
.icon-kobido{-webkit-mask-image:url(images/icons/iconkobido.webp);mask-image:url(images/icons/iconkobido.webp);}
.icon-liberation{-webkit-mask-image:url(images/icons/iconliberation.webp);mask-image:url(images/icons/iconliberation.webp);}
.icon-bienetre{-webkit-mask-image:url(images/icons/iconbienetre.webp);mask-image:url(images/icons/iconbienetre.webp);}
.icon-branche{-webkit-mask-image:url(images/iconebranche.webp);mask-image:url(images/iconebranche.webp);}
.icon-soleil{-webkit-mask-image:url(images/iconesoleil.webp);mask-image:url(images/iconesoleil.webp);}
.icon-etre{-webkit-mask-image:url(images/iconeetre.webp);mask-image:url(images/iconeetre.webp);}
.icon-effr{-webkit-mask-image:url(images/iconeffr.webp);mask-image:url(images/iconeffr.webp);}
.service-card .icon-line{width:46px;height:46px;margin-bottom:14px;}
.icon-line-section{display:block;width:190px;height:103px;margin:0 auto 24px;}
@media (max-width:640px){.icon-line-section{width:150px;height:81px;margin-bottom:20px;}}
/* Blocs sombres (reservation/demo) et section Avis : la fleur groupee
   (iconebranche.webp) est l'icone centree et bien visible, quelle que soit la classe
   presente sur le span en HTML — les autres sections (FAQ, blog...) gardent leur
   propre icone. Sur fond sombre, en plus la couleur passe en sable pour le contraste. */
.booking .icon-line-section, #avis .icon-line-section{
  -webkit-mask-image:url(images/iconebranche.webp);
  mask-image:url(images/iconebranche.webp);
}
.booking .icon-line-section{
  background-color:var(--sand);
}
/* La fleur groupee (iconebranche.webp, 300x162) est plus large que haute : sur
   le bloc de reservation, la boite passe de 84x84 (carre, avec beaucoup de vide
   vertical en mask-size:contain) a un ratio proche du visuel reel pour un rendu
   plus grand et net — meme taille sur les deux blocs sombres. */
.booking .icon-line-section{width:220px;height:119px;margin:0 auto 22px;}

/* Separateur decoratif pleine largeur, entre les sections de toutes les pages */
.section-divider{max-width:1040px;margin:0 auto;padding:8px 32px 0;}
.section-divider img{width:100%;height:auto;display:block;opacity:.85;}
/* Trait "écrit" de gauche à droite, une seule fois, quand il est bien entré dans l'écran
   (photo-effects.js pose .lr-on sur <html> puis .drawn sur le trait). Sans JS ou en
   reduced-motion, .lr-on n'est jamais posé : le trait s'affiche directement. */
.lr-on .line-reveal img{clip-path:inset(0 100% 0 0);transition:clip-path 3s ease-in-out;}
.lr-on .line-reveal.drawn img{clip-path:inset(0 0 0 0);}

/* Illustration de transition (a-propos.html) */
.philosophy-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:center;}
.philosophy-figurine img{width:100%;height:auto;border-radius:20px;box-shadow:var(--shadow);}
.philosophy-text{margin-top:36px;}
.philosophy-text .icon-line-section{margin:0 0 18px;}

@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none;}
  .reveal-img{opacity:1;transform:none;transition:none;}
  .line-reveal img{clip-path:none;transition:none;}
  .hero-outline path{transition:none;}
}

@media (max-width:860px){
  .nav ul, .nav-cta .btn{display:none;}
  .menu-toggle{display:block;}
  .hero-grid, .about-grid, .service-detail, .contact-grid, .philosophy-grid{grid-template-columns:1fr;}
  .philosophy-text{margin-top:24px;text-align:center;}
  .philosophy-text .icon-line-section{margin:0 auto 18px;}
  .philosophy-figurine img{max-width:280px;margin:0 auto;}
  .service-cards > *{flex-basis:calc((100% - 22px)/2);}
  .service-card h3{font-size:18px;}
  .blog-grid{grid-template-columns:1fr;}
  .avis-card{width:260px;}
  .booking-steps > *{flex-basis:100%;}
  .tarif-cards{grid-template-columns:1fr;}
  .tarif-card{padding:26px 22px;}
  .tarif-others .tarifs-nom{flex:1 1 0;}
  .tarifs-list li{flex-wrap:wrap;}
  .tarifs-nom{flex:1 1 100%;}
  .tarifs-list li:not(:has(.tarifs-duree)) .tarifs-nom{flex:1 1 0;}
  .tarifs-prix{margin-left:auto;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .footer-grid > div:first-child{grid-column:1/-1;margin-right:0;margin-bottom:8px;}
  .footer-grid > div:last-child{grid-column:1/-1;}
  section{padding:42px 0;}
  .sticky-cta{display:block;}
  body{padding-bottom:74px;}
  .service-detail-media-lib{aspect-ratio:3/2;}
  .service-detail-media-lib img{object-position:center 68%;}
  .booking{margin:0 16px;padding:48px 20px;}
  .booking .icon-line-section{width:120px;height:65px;margin:0 auto 16px;}
  .cal-mock{padding:16px;}
  .cal-grid{gap:5px;}
  .slot-row{gap:6px;}
  .slot{padding:7px 12px;font-size:12.5px;}
}

@media (max-width:480px){
  .service-cards > *{flex-basis:100%;}
}

/* Le menu desktop (7 items + logo + CTA) ne tient plus sur une ligne entre 861px
   et le plein .nav max-width (1160px) depuis l'ajout de Bons cadeaux/Tarifs :
   bascule sur le menu mobile (hamburger) plus tot plutot que de laisser le menu
   passer sur 2 lignes. Les grilles de mise en page (hero, cards...) gardent leur
   propre seuil a 860px ci-dessus, inchange. */
@media (min-width:861px) and (max-width:1159px){
  .nav ul, .nav-cta .btn{display:none;}
  .menu-toggle{display:block;}
}

/* ===== Surcharges de la démo : bandeau cookies, bouton cookies, badge N' Studio Digital =====
   /js/cookie-consent.js (et ses styles injectés) est partagé avec nstudiodigital.fr et les
   autres démos : on ne le modifie pas. Les styles injectés arrivent après style.css, donc les
   surcharges ci-dessous passent par #nsdc-root (id) pour gagner en spécificité. */
#nsdc-root .nsdc-btn-dark{background:var(--rose-deep);color:#fff;}
#nsdc-root .nsdc-btn-dark:hover{background:var(--plum);}
#nsdc-root .nsdc-btn-outline{color:var(--rose-deep);border-color:var(--rose-deep);}
#nsdc-root .nsdc-btn-outline:hover{background:var(--blush);}
#nsdc-root .nsdc-btn-text{color:var(--rose-deep);}
#nsdc-root .nsdc-switch input:checked + .nsdc-slider{background:var(--rose-deep);}
#nsdc-root .nsdc-switch input:disabled + .nsdc-slider{background:var(--rose);}
#nsdc-root #nsdc-float{background:var(--rose-deep);border-color:rgba(255,255,255,.25);}
#nsdc-root #nsdc-float:hover{background:var(--plum);}
/* La "morsure" et les pépites du pictogramme étaient noires / vertes : on les aligne sur le bouton. */
#nsdc-root #nsdc-float svg circle[fill="#0D0D0D"]{fill:var(--rose-deep);}
#nsdc-root #nsdc-float:hover svg circle[fill="#0D0D0D"]{fill:var(--plum);}
#nsdc-root #nsdc-float svg circle[fill="#7A9478"]{fill:var(--rose-deep);}
/* Bandeau ouvert (fixe, en bas à gauche) : le pied de page gagne de la marge basse pour que
   les icônes Facebook / Instagram puissent toujours défiler au-dessus du bandeau. */
body:has(#nsdc-banner:not(.nsdc-hidden)) footer{padding-bottom:130px;}

@media (max-width:860px){
  /* Bouton cookies au-dessus de la barre fixe "Prendre rendez-vous" (qui s'affiche sous 860px). */
  #nsdc-root #nsdc-float.nsdc-float--badge{left:16px;bottom:94px;}
}
@media (max-width:767px){
  /* Badge démo : plus de position fixe par-dessus le contenu, il clôt le pied de page sous le copyright. */
  body #ns-demo-badge{position:static;display:block;background:var(--plum);border-radius:0;opacity:1;text-align:center;font-size:11px;padding:4px 16px 22px;}
  body #ns-demo-badge a{color:#A79892;}
  footer{padding-bottom:12px;}
  body:has(#nsdc-banner:not(.nsdc-hidden)) footer{padding-bottom:60px;}
}

/* ===== Ancres : le titre ciblé ne doit pas passer sous l'en-tête sticky =====
   --header-h = hauteur réelle de l'en-tête (mesurée : 93px en desktop, ~90px entre 861 et 1159px,
   90.2px dès que le menu passe en hamburger, sous-titre de la marque sur une seule ligne) ; +24px de respiration. */
@media (max-width:1159px){:root{--header-h:90.2px;}}
[id]{scroll-margin-top:calc(var(--header-h) + 24px);}
/* Les blocs .reveal démarrent décalés de 20px (translateY) : le navigateur aligne la boîte décalée, ce qui
   les ramène 20px trop haut une fois l'animation finie. On compense pour garder 24px de respiration. */
[id].reveal{scroll-margin-top:calc(var(--header-h) + 44px);}
.nowrap{white-space:nowrap;}

/* ===== Corrections mobile (< 768px) : le rendu desktop ne change pas ===== */
.avis-dots{display:none;}
@media (max-width:767px){
  /* Mots composés : jamais coupés en fin de ligne dans les titres, sous-titres, étiquettes (span.nb posé en HTML). */
  .nb{white-space:nowrap;}
  h1,h2,h3,h4,summary,.eyebrow,.lede,.breadcrumb,.giftcard-sub,.hero-strip{-webkit-hyphens:none;hyphens:none;}

  /* En-tête : le sous-titre de la marque tient sur une seule ligne. */
  header .brand small{font-size:clamp(6.5px,2.1vw,9px);letter-spacing:.08em;white-space:nowrap;}

  /* Hero de l'accueil : la photo apparaît dès l'arrivée sur un écran de 390x844. */
  .hero{padding-top:18px;}
  .hero-grid{gap:18px;}
  .hero .eyebrow{margin-bottom:6px;font-size:12px;}
  .hero h1{font-size:30px;max-width:none;}
  .hero p.lede{margin:12px 0 16px;font-size:15.5px;line-height:1.5;}
  .hero-actions{gap:10px;flex-wrap:nowrap;}
  .hero-actions .btn{flex:1 1 0;justify-content:center;padding:12px 8px;font-size:13.5px;white-space:nowrap;}

  /* Barre fixe "Prendre rendez-vous" : masquée tant que le hero est visible, et quand le bloc de
     réservation ou le pied de page l'est (la classe .is-shown est posée par photo-effects.js). */
  body{padding-bottom:0;}
  .sticky-cta{transform:translateY(105%);visibility:hidden;transition:transform .3s ease,visibility 0s linear .3s;}
  .sticky-cta.is-shown{transform:none;visibility:visible;transition:transform .3s ease;}
  /* Bouton cookies : au-dessus de la barre quand elle est affichée, sinon dans le coin. */
  #nsdc-root #nsdc-float{transition:transform .2s,background .2s,opacity .25s,bottom .3s ease;}
  #nsdc-root #nsdc-float.nsdc-float--badge{bottom:16px;}
  body:has(.sticky-cta.is-shown) #nsdc-root #nsdc-float.nsdc-float--badge{bottom:94px;}


  /* Bloc de réservation : mêmes marges latérales que les autres sections (celles du .wrap). */
  .booking{margin-left:0;margin-right:0;}

  /* Page contact : l'e-mail (une seule "longue" chaîne) ne doit pas élargir la carte au-delà de l'écran. */
  .contact-grid > *{min-width:0;}
  .contact-info-card, .contact-form{padding:24px 20px;}
  .contact-info-card li{overflow-wrap:anywhere;}

  /* Avis : fondu plus marqué à droite + points de navigation sous les cartes. */
  .avis-grid{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 24px,#000 calc(100% - 64px),transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 24px,#000 calc(100% - 64px),transparent 100%);}
  .avis-dots{display:flex;justify-content:center;gap:2px;margin-top:10px;}
  .avis-dot{width:22px;height:22px;padding:0;border:0;background:none;position:relative;cursor:pointer;}
  .avis-dot::before{content:"";position:absolute;inset:6.5px;border-radius:50%;border:1px solid var(--rose-deep);}
  .avis-dot[aria-current="true"]::before{background:var(--rose-deep);}
}
@media (max-width:767px) and (scripting:none){
  .sticky-cta{transform:none;visibility:visible;}
}

/* ===== Pages prestation : prix et durée à côté du bouton "Réserver" ===== */
.service-detail .service-price{margin-top:24px;}
.service-price-note{margin:22px 0 0;color:var(--rose-deep);font-size:15px;font-weight:500;}
.service-price-note + .service-cta{margin-top:12px;}
/* Page Massages bien-être : une carte par massage (composants .tarif-card / .tarif-main de la page Tarifs). */
.massage-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;align-items:stretch;}
.massage-cards .tarif-main{margin-top:auto;}
.massage-cards .tarif-intro{margin-bottom:22px;}
@media (max-width:860px){.massage-cards{grid-template-columns:1fr;}}
/* Les cartes massages ne suivent pas le réordonnancement desktop de la page Tarifs (.tarif-card:nth-child). */
.massage-cards > .tarif-card{order:0;}
/* Titres : un mot composé ne se coupe pas au tiret, y compris en desktop (ex. h1 "Les massages bien-être"). */
h1 .nb, h2 .nb, h3 .nb{white-space:nowrap;}
/* Titres : pas de mot seul sur la dernière ligne. */
h1, h2, h3{text-wrap:balance;}
/* Hero de l'accueil : photo verticale (sans zoom ni parallaxe), cadrée pour garder la praticienne, ses mains, le pied
   et le visage de la cliente dans l'arche. */
.hero-photo-frame img{object-position:75% center;}

/* Articles de blog : titre du hero plus large, pour tenir sur deux lignes au maximum en desktop. */
.page-hero:has(+ section .article-cover) .wrap-narrow{max-width:980px;}
.page-hero:has(+ section .article-cover) h1{max-width:none;}

/* ===== Articles : temps de lecture, encart auteur, "À lire aussi", lien dans le texte ===== */
.page-hero p.article-meta{margin:-6px auto 14px;max-width:none;font-size:13.5px;letter-spacing:.02em;color:var(--plum-soft);}
.article-body p a{color:var(--rose-deep);text-decoration:underline;text-underline-offset:3px;}
.article-body p a:hover{color:var(--plum);}
.service-detail p a{color:var(--rose-deep);text-decoration:underline;text-underline-offset:3px;}
.service-detail p a:hover{color:var(--plum);}
.page-hero p:not(.breadcrumb) a{color:var(--rose-deep);text-decoration:underline;text-underline-offset:3px;}
.page-hero p:not(.breadcrumb) a:hover{color:var(--plum);}
.author-box{display:flex;align-items:center;gap:20px;margin-top:48px;padding:24px;background:#fff;border-radius:22px;box-shadow:var(--shadow);}
.author-box img{width:84px;height:84px;border-radius:50%;object-fit:cover;flex-shrink:0;}
.author-box p{margin:0;}
.author-name{font-family:'Fraunces',serif;font-size:19px;line-height:1.25;color:var(--plum);}
.author-text{margin-top:6px;font-size:14.5px;color:var(--plum-soft);}
.author-link{display:inline-block;margin-top:10px;font-size:14.5px;font-weight:500;color:var(--rose-deep);text-decoration:underline;text-underline-offset:3px;}
.author-link:hover{color:var(--plum);}
@media (max-width:480px){.author-box{flex-direction:column;text-align:center;}}
@media (min-width:861px){.blog-grid-2{grid-template-columns:repeat(2,1fr);max-width:780px;margin-left:auto;margin-right:auto;}}

/* ===== Page contact : calendrier du mois en cours, photo du cabinet ===== */
.cal-grid .cal-day{aspect-ratio:auto;height:46px;}
.cal-weekday{text-align:center;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--plum-soft);padding-bottom:2px;}
.cal-day.past{background:#EFE8E2;border-color:transparent;color:#B7ABA3;cursor:default;pointer-events:none;}
.cal-day.today{outline:1.5px solid var(--rose-deep);outline-offset:1px;}
.cal-day.avail:focus-visible{outline:3px solid var(--rose-deep);outline-offset:2px;}
.contact-info-card{display:flex;flex-direction:column;}
.contact-info-card img{flex:1 1 auto;width:100%;min-height:240px;margin-top:26px;border-radius:16px;object-fit:cover;object-position:30% center;}
@media (max-width:767px){.cal-grid .cal-day{height:38px;}}
@media (max-width:860px){.contact-info-card img{flex:none;aspect-ratio:4/3;min-height:0;}}

/* ===== Page bons cadeaux : récapitulatif du prix, infos pratiques, mention de paiement ===== */
.giftcard-price{display:block;margin-top:10px;font-family:'Fraunces',serif;font-size:34px;line-height:1.1;color:#fff;}
.giftcard-infos{margin-top:24px;}
.giftcard-secure{margin:10px 0 0;text-align:center;font-size:12.5px;color:var(--plum-soft);}

#cal-month{white-space:nowrap;flex-shrink:0;margin-left:12px;}
/* Footer desktop : le haut des titres de colonnes est aligné sur le haut du logo (mesuré au pixel : le texte
   du h4 démarrait 7px plus bas que le dessin du logo). */
@media (min-width:861px){.footer-grid h4{margin-top:-7px;}}

/* Footer desktop : marge sous la ligne du bas pour que le badge fixe "Démo réalisée par N' Studio Digital"
   (en bas à droite, ~48px de haut) ne recouvre plus le crédit quand on est tout en bas de la page. */
@media (min-width:861px){footer{padding-bottom:76px;}}
/* Sous-titre de la marque en pied de page : une seule ligne à partir de 1024px (l'en-tête n'est pas touché). */
@media (min-width:1024px){footer .brand small{font-size:9.5px;letter-spacing:.06em;white-space:nowrap;}}
@media (min-width:861px) and (max-width:1279px){.footer-grid > div:first-child{margin-right:36px;}}

/* Icônes des cartes massages (images décoratives, même taille pour les 7 : le trait fin des dessins demande plus
   que les 46px des autres pictogrammes pour rester lisible). */
.massage-cards .massage-icon{display:block;width:88px;height:88px;margin-bottom:10px;}
/* Prana et prénatal : dessins plus fins et moins larges que les autres, +15% (101px au lieu de 88px) ; les marges
   négatives compensent l'agrandissement (hauteur de carte et alignement du dessin inchangés). */
.massage-cards .massage-icon-xl{width:101px;height:101px;margin:-6.5px 0 3.5px -6.5px;}
/* Desktop : la dernière carte, seule sur sa ligne, est centrée (une colonne de large). */
@media (min-width:861px){.massage-cards > .tarif-card:last-child:nth-child(odd){grid-column:1 / -1;justify-self:center;width:calc((100% - 24px) / 2);}}

/* Mention discrète sous le titre des avis (avis fictifs de la démonstration). */
.avis-note{margin:10px auto 0;font-size:13px;font-style:italic;color:var(--plum-soft);}

/* Avis : flèches précédent / suivant (boutons .carousel-btn du carrousel du cabinet), desktop et tablette. */

/* Contact (desktop) : la photo du cabinet garde un ratio 4/3 pour que les deux colonnes aient une hauteur proche. */
@media (min-width:861px){.contact-info-card img{flex:none;height:auto;aspect-ratio:4/3;min-height:0;}}

/* Cartes massages : seulement le prix et le bouton, alignés sur une ligne (le bouton passe dessous si la carte est étroite). */
.massage-cards .tarif-main{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 16px;}
.massage-cards .tarif-main .btn{margin-top:0;}
.massage-cards .tarif-main-prix{text-align:left;}

/* En-tête des pages massages et articles : fil d'Ariane, sur-titre / date, auteur et titre espacés de façon régulière. */
.page-hero-spaced .breadcrumb{margin-bottom:24px;}
.page-hero-spaced .eyebrow{margin-bottom:10px;}
.page-hero-spaced .eyebrow + h1{margin-top:16px;}
.page-hero-spaced p.article-meta{margin:0 auto 22px;}

/* Contact (desktop) : le champ Message occupe la hauteur restante du formulaire, pour qu'il n'y ait pas de vide sous le bouton. */
@media (min-width:861px){
  .contact-form{display:flex;flex-direction:column;}
  .contact-form form{flex:1;display:flex;flex-direction:column;}
  .contact-form textarea{flex:1;min-height:110px;resize:vertical;}
}

/* Pages prestation : le h1 contient maintenant "à Lyon" ; un peu plus de largeur pour qu'il tienne sur deux lignes. */
.page-hero:has(+ section .service-detail) h1{max-width:22ch;}

/* E-mail du pied de page : une seule ligne en desktop ; en mobile, retour à la ligne possible uniquement avant le @ (<wbr>). */
@media (min-width:861px){.footer-grid a[href^="mailto:"]{white-space:nowrap;}.footer-grid .mail-wbr{display:none;}}

/* Contact : choix des massages bien-être (carte « Massages bien-être » du module de réservation), même style que les cartes de prestations. */
.booking-sub{margin:-14px 0 34px;}
.booking-sub[hidden]{display:none;}
.booking-sub-title{margin:0 0 14px;text-align:center;font-family:'Fraunces',serif;font-size:17px;color:var(--sand);}
.booking-sub-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;}
.booking-sub-grid > *{flex:0 0 calc((100% - 12px)/2);min-width:0;}
.booking-sub-step{background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.14);border-radius:18px;padding:16px 20px;cursor:pointer;transition:background .2s ease, border-color .2s ease;text-align:left;}
.booking-sub-step.active{background:rgba(240,214,204,0.14);border-color:var(--peach);}
.booking-sub-step:focus-visible{outline:2px solid var(--sand);outline-offset:2px;}
.booking-sub-step h4{font-family:'Fraunces',serif;font-size:18px;font-weight:500;margin:0 0 4px;color:#fff;}
.booking-sub-step p{margin:0;font-size:13.5px;color:#D9CFC8;}
@media (max-width:767px){.booking-sub-grid > *{flex-basis:100%;}}

/* « Offre du moment » : badge discret sur le massage mis en avant (repéré par data-offre-du-moment). */
.badge-offre{display:inline-block;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;line-height:1;color:var(--rose-deep);background:var(--blush);border:1px solid var(--rose);border-radius:999px;padding:6px 11px;}
.tarif-card[data-offre-du-moment]{position:relative;}
.tarif-card .badge-offre{position:absolute;top:18px;right:18px;}
.booking-sub-step[data-offre-du-moment]{position:relative;}
.booking-sub-step .badge-offre{position:absolute;top:14px;right:14px;color:var(--cream);background:rgba(240,214,204,.16);border-color:var(--peach);}
@media (max-width:767px){.booking-sub-step .badge-offre{position:static;margin-bottom:8px;}}

/* ===== Bouton « retour en haut » (back-to-top.js) =====
   Coin bas droit, au-dessus des éléments fixes déjà présents :
   - > 860px : badge « Démo réalisée par N' Studio Digital » (#ns-demo-badge, bas droite, bottom 14px) ;
   - 768-860px : badge à bottom 104px (au-dessus de la barre « Prendre rendez-vous », toujours affichée) ;
   - ≤ 767px : le badge est dans le flux (plus fixe) ; seule la barre « Prendre rendez-vous » est fixe, et
     seulement quand .sticky-cta.is-shown (posé par photo-effects.js).
   Le bouton cookies (#nsdc-float) est à gauche : aucun chevauchement. */
.back-to-top{position:fixed;right:14px;bottom:62px;z-index:45;width:44px;height:44px;padding:0;display:flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid var(--rose-deep);background:rgba(251,246,241,.94);color:var(--rose-deep);cursor:pointer;box-shadow:0 8px 20px -12px rgba(62,39,35,.4);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(calc(var(--btt-lift,0px) * -1));transition:opacity .35s ease,visibility 0s linear .35s,background .2s ease,color .2s ease;}
.back-to-top.is-visible{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .35s ease,background .2s ease,color .2s ease;}
.back-to-top:hover{background:var(--rose-deep);color:var(--cream);}
.back-to-top:focus-visible{outline:3px solid var(--rose-deep);outline-offset:3px;}
@media (max-width:860px){.back-to-top{right:10px;bottom:146px;}}
@media (max-width:767px){
  .back-to-top{bottom:16px;transition:opacity .35s ease,visibility 0s linear .35s,bottom .3s ease,background .2s ease,color .2s ease;}
  .back-to-top.is-visible{transition:opacity .35s ease,bottom .3s ease,background .2s ease,color .2s ease;}
  body:has(.sticky-cta.is-shown) .back-to-top{bottom:100px;}
}
/* Bandeau cookies pleine largeur sous 480px : il passerait sous le bouton, on masque celui-ci le temps du choix. */
@media (max-width:480px){body:has(#nsdc-banner:not(.nsdc-hidden)) .back-to-top{opacity:0;visibility:hidden;pointer-events:none;}}
@media (prefers-reduced-motion:reduce){.back-to-top,.back-to-top.is-visible{transition:none !important;}}