/* ═══════════════════════════════════════════════════════════════
   JÉRÉMIE BEAUTÉ · Louviers
   Direction artistique « Couture » (validée le 26/10/2026) :
   la photo d'abord, texte rare et petit, gris clair, aucun ornement.
   ═══════════════════════════════════════════════════════════════ */

/* ── Tokens ─────────────────────────────────────────────────── */
:root{
  --blanc:   #FFFFFF;
  --fond:    #F5F5F4;   /* fond du site */
  --tuile:   #ECEBE9;   /* vitrines, sections calmes */
  --trait:   #DAD9D6;
  --decor:   #B9B7B3;   /* filets, jamais de texte */
  --doux:    #5E5C57;   /* petits textes : 4,5:1 minimum sur fond, tuile et blanc */
  --texte:   #2A2928;
  --sombre:  #2A2928;   /* bandeau, bouton, section rendez-vous */

  --serif: 'Gilda Display', 'Times New Roman', Times, serif;
  --sans:  'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;

  --max: 1320px;
  --marge: clamp(1rem, 4.2vw, 3.75rem);
  --section: clamp(4.5rem, 9vw, 7.5rem);

  --ease: cubic-bezier(.2,.6,.2,1);
  --vite: .3s var(--ease);
}

/* ── Base ───────────────────────────────────────────────────── */
/* Page masquée tant que les polices ne sont pas prêtes (1,5 s au plus) : les titres ne bougent jamais */
html.fontes body{visibility:hidden;}
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
body{
  margin:0;background:var(--fond);color:var(--texte);
  font-family:var(--sans);font-size:.9375rem;font-weight:300;line-height:1.7;letter-spacing:.01em;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;
}
img,svg,video{max-width:100%;display:block;height:auto;}
a{color:inherit;text-decoration:none;}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0;}
::selection{background:var(--texte);color:var(--blanc);}
:focus-visible{outline:1px solid var(--texte);outline-offset:4px;}

/* ── Typographie ────────────────────────────────────────────── */
h1,h2,h3,h4{font-family:var(--serif);font-weight:400;line-height:1.12;letter-spacing:0;color:var(--texte);margin:0;text-wrap:balance;hyphens:none;-webkit-hyphens:none;overflow-wrap:normal;word-break:normal;}
h1{font-size:clamp(2.3rem,1.5rem + 2.6vw,3.6rem);}
h2{font-size:clamp(1.9rem,1.4rem + 1.6vw,2.7rem);}
h3{font-size:clamp(1.2rem,1.1rem + .35vw,1.45rem);}
h4{font-size:1.15rem;}
p{margin:0 0 1.1em;text-wrap:pretty;}
p:last-child{margin-bottom:0;}
li,blockquote,figcaption{text-wrap:pretty;}
.chapo,blockquote,.cta-final p,.hero__intro p,.piece p,.duo__texte p,.equipe__membre p{text-wrap:balance;}
em,i{font-style:italic;}
.sur-titre{display:block;font-size:.875rem;font-weight:400;letter-spacing:.04em;color:var(--doux);margin:0 0 1rem;}
/* sur-titre placé dans le h1 (référencement) : il garde l'allure du texte courant */
h1 .sur-titre{font-family:var(--sans);line-height:1.7;text-wrap:pretty;}
.chapo{font-size:1.02rem;line-height:1.75;color:var(--doux);max-width:36rem;}
.mention{font-size:.875rem;color:var(--doux);line-height:1.7;}
.insecable{white-space:nowrap;}

/* ── Structure ──────────────────────────────────────────────── */
.enveloppe{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--marge);}
.enveloppe--large{max-width:var(--max);}
.enveloppe--etroite{max-width:calc(56rem + 2 * var(--marge));}
.section:has(.galerie) .enveloppe{max-width:calc(56rem + 2 * var(--marge));}
.section{padding-block:var(--section);background:var(--fond);}
.section--porcelaine{background:var(--blanc);}
.section--perle,.section--encre{background:var(--blanc);}
.section--cta{background:var(--sombre);color:#D9D8D5;}
.section--cta h2{color:var(--blanc);}
.section--cta .chapo{color:#BDBBB7;}
.section--cta .sur-titre{color:#A9A7A3;}
.mb-l{margin-bottom:clamp(2.25rem,4vw,3.25rem);}
.mb-m{margin-bottom:clamp(1.5rem,3vw,2.25rem);}
.mb-l:not(.duo),.mb-m:not(.duo){text-align:center;}
.mb-l .chapo,.mb-m .chapo{margin-inline:auto;}
.centre{text-align:center;}
.centre .chapo{margin-inline:auto;}

/* ── Liens et boutons ───────────────────────────────────────── */
.lien,.lien-fleche,.carte__lien{
  display:inline-block;font-size:.875rem;font-weight:400;
  text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.45em;transition:opacity var(--vite);
}
.lien:hover,.lien-fleche:hover{opacity:.6;}
.lien-fleche i{display:none;}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.95rem 1.9rem;font-family:var(--sans);font-size:.875rem;font-weight:400;letter-spacing:.02em;
  border:1px solid var(--sombre);background:var(--sombre);color:var(--blanc);
  transition:background var(--vite),color var(--vite),border-color var(--vite);white-space:nowrap;cursor:pointer;
}
.btn:hover{background:transparent;color:var(--texte);}
.btn--ligne{background:transparent;color:var(--texte);border-color:var(--decor);}
.btn--ligne:hover{border-color:var(--texte);}
.btn--clair{background:var(--blanc);color:var(--texte);border-color:var(--blanc);}
.btn--clair:hover{background:transparent;color:var(--blanc);}
.btn--ligne-clair{background:transparent;color:var(--blanc);border-color:rgba(255,255,255,.45);}
.btn--ligne-clair:hover{border-color:var(--blanc);}
.reserver{
  display:inline-flex;align-items:center;gap:.5rem;font-size:.875rem;padding:.55rem 1rem;
  border:1px solid var(--trait);background:var(--fond);transition:border-color var(--vite);
}
.reserver:hover{border-color:var(--texte);}
.reserver svg{width:.8rem;height:.8rem;}
.hero__actions,.cta-final__actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2rem;}

/* ── Bandeau et en-tête ─────────────────────────────────────── */
.annonce{background:var(--sombre);color:#E5E4E1;text-align:center;font-size:.875rem;padding:.6rem var(--marge);}
.annonce a{white-space:nowrap;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.3em;}
.entete{
  position:sticky;top:0;z-index:60;background:rgba(255,255,255,.96);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid transparent;transition:border-color var(--vite);
}
.entete.est-fixe{border-bottom-color:var(--trait);}
.entete__interieur{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:4.25rem;max-width:var(--max);margin-inline:auto;padding-inline:var(--marge);}
.burger{display:inline-flex;align-items:center;gap:.75rem;font-size:.875rem;justify-self:start;min-height:2.75rem;min-width:2.75rem;}
.burger i{display:block;width:1.15rem;height:.55rem;border-top:1px solid var(--texte);border-bottom:1px solid var(--texte);}
.logo{display:block;transition:opacity var(--vite);}
.logo:hover{opacity:.7;}
.logo img{width:6.4rem;}
.entete__droite{justify-self:end;display:flex;align-items:center;gap:1.75rem;font-size:.875rem;white-space:nowrap;}
.entete__tel{color:var(--doux);}

/* Menu plein écran */
.menu{
  position:fixed;inset:0;z-index:80;background:var(--blanc);display:flex;flex-direction:column;
  padding:0 var(--marge) 2rem;overflow-y:auto;opacity:0;visibility:hidden;
  transition:opacity .4s var(--ease),visibility 0s .4s;
}
.menu.est-ouvert{opacity:1;visibility:visible;transition:opacity .4s var(--ease);}
.menu__haut{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:4.25rem;}
.menu__haut .logo{grid-column:2;}
.menu__fermer{justify-self:end;grid-column:3;font-size:.875rem;min-height:2.75rem;min-width:2.75rem;}
.menu__liens{display:flex;flex-direction:column;align-items:center;gap:.2rem;margin:auto 0;padding-block:2rem;}
.menu__liens a{font-family:var(--serif);font-size:clamp(1.6rem,1.2rem + 1.4vw,2.3rem);line-height:1.35;transition:opacity var(--vite);}
.menu__liens a:hover{opacity:.55;}
.menu__liens a span{display:none;}
.menu__bas{display:flex;flex-direction:column;align-items:center;gap:1.25rem;text-align:center;}
.menu__contact{font-size:.875rem;color:var(--doux);margin:0;}
.menu__contact strong{display:block;font-weight:400;color:var(--texte);font-size:1rem;}

/* ── Héro : grand encart photo, titre posé dessus ───────────── */
.hero{max-width:var(--max);margin-inline:auto;padding:0 var(--marge);}
.hero,.ouverture,.entete-page{background:var(--blanc);}
body:has(.hero) .hero{box-shadow:0 0 0 100vmax var(--blanc);clip-path:inset(0 -100vmax);}
.hero figure{position:relative;margin:0;height:min(80svh,46rem);overflow:hidden;background:var(--tuile);}
.hero--page figure{height:min(58svh,30rem);}
.hero figure > img{width:100%;height:100%;object-fit:cover;}
.hero figure::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(20,19,18,.66) 0%,rgba(20,19,18,.38) 38%,rgba(20,19,18,0) 70%);pointer-events:none;}
.hero figcaption{text-wrap:balance;text-shadow:0 1px 14px rgba(0,0,0,.28);position:absolute;left:0;right:0;bottom:clamp(2.25rem,7vh,4.5rem);z-index:1;text-align:center;color:var(--blanc);padding-inline:1.5rem;}
.hero .sur-titre{color:#fff;font-size:.875rem;}
.hero h1{color:var(--blanc);margin-bottom:1.3rem;}
.hero .lien{color:var(--blanc);}

/* Introduction sous le héro */
.ouverture,.hero__intro{padding:clamp(4rem,9vw,7rem) var(--marge) clamp(3.5rem,7vw,5.5rem);text-align:center;}
.hero__intro{padding-inline:0;text-align:center;}
.hero__intro .chapo{margin-inline:auto;max-width:40rem;}
.hero .hero__intro .chapo{color:var(--doux);}
.ouverture h2,.ouverture .phrase,.hero__intro .ouverture__phrase{font-family:var(--serif);font-size:clamp(1.5rem,1.2rem + 1.1vw,2.2rem);line-height:1.3;max-width:40rem;margin:0 auto 1.5rem;color:var(--texte);}
.ouverture .chapo{margin-inline:auto;}
.ouverture--fine{padding-block:clamp(2rem,4vw,2.75rem);border-top:1px solid var(--trait);}
.fil{font-size:.875rem;color:var(--doux);margin:0 0 1.5rem;}
.fil a{text-decoration:underline;text-decoration-color:var(--decor);text-underline-offset:.3em;}
.faits{display:flex;justify-content:center;flex-wrap:wrap;gap:.35rem 1.4rem;font-size:.875rem;color:var(--doux);margin:0;}
.faits span+span::before{content:"·";margin-right:1.4rem;color:var(--decor);}
.sommaire{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem 1.6rem;margin-top:1.75rem;}
.sommaire a{font-size:.875rem;text-decoration:underline;text-decoration-color:var(--decor);text-underline-offset:.4em;transition:text-decoration-color var(--vite);}
.sommaire a:hover{text-decoration-color:var(--texte);}

/* ── Vitrine de savoir-faire (tuiles) ───────────────────────── */
.tuiles{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;}
.tuile{background:var(--tuile);display:block;}
.tuile figure{margin:0;aspect-ratio:4/5;overflow:hidden;}
.tuile img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease);}
.tuile:hover img{transform:scale(1.035);}
.tuile div{padding:1.15rem 1.25rem 1.5rem;text-align:center;}
.tuile h3{font-size:1.2rem;}
.tuile p{font-size:.875rem;color:var(--doux);margin:.25rem 0 0;}

/* Soins signature (pièces) */
.pieces{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;}
.piece{background:var(--blanc);text-align:center;padding-bottom:1.75rem;}
.piece figure{margin:0 0 1.25rem;aspect-ratio:1;overflow:hidden;background:var(--tuile);}
.piece figure img{width:100%;height:100%;object-fit:cover;}
.piece h3{font-size:1.15rem;}
.piece p{font-size:.875rem;color:var(--doux);margin:.3rem 0 1.1rem;}

/* ── Éditorial : grande image + texte court ─────────────────── */
.edito{display:grid;grid-template-columns:7fr 5fr;align-items:center;background:var(--blanc);}
.edito--inverse{grid-template-columns:5fr 7fr;}
.edito--inverse figure{order:2;}
.edito figure{margin:0;height:100%;min-height:34rem;overflow:hidden;}
.edito figure img{width:100%;height:100%;object-fit:cover;}
.edito > div{padding-block:clamp(3rem,6vw,6rem);padding-left:clamp(2.5rem,5vw,5rem);padding-right:calc(max((100vw - var(--max)) / 2, 0px) + var(--marge));max-width:calc(34rem + max((100vw - var(--max)) / 2, 0px) + var(--marge));}
.edito--inverse > div{justify-self:start;padding-right:clamp(2.5rem,5vw,5rem);padding-left:calc(max((100vw - var(--max)) / 2, 0px) + var(--marge));}
.edito h2{margin-bottom:1.3rem;}
.edito p{color:var(--doux);}
.edito .lien{margin-top:1.2rem;}
.edito dl{margin:0 0 1.5rem;font-size:.88rem;}
.edito dt{color:var(--doux);font-size:.875rem;margin-top:1rem;}
.edito dd{margin:0;}

/* Duo (pages intérieures) */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem,6vw,6rem);align-items:center;}
.duo--inverse .duo__media{order:-1;}
.duo--texte-seul{grid-template-columns:1fr;max-width:44rem;margin-inline:auto;}
.duo--texte-seul .duo__texte{text-align:center;}
.duo--texte-seul .duo__texte p{margin-inline:auto;}
.duo__media{position:relative;margin:0;}
.duo__media img{width:100%;aspect-ratio:4/5;object-fit:cover;}
.duo__texte h2{margin-bottom:1.3rem;}
.duo__texte p{color:var(--doux);max-width:34rem;}
.duo__texte .btn,.duo__texte .lien-fleche{margin-top:1.75rem;}
.duo.mb-l,.duo.mb-m{align-items:end;}
.signature{font-family:var(--serif);font-size:1.6rem;color:var(--texte);line-height:1.2;margin-top:2rem;}
.signature span{display:block;font-family:var(--sans);font-size:.875rem;color:var(--doux);margin-top:.4rem;}

/* ── Avis ───────────────────────────────────────────────────── */
.avis-une{background:var(--blanc);padding:clamp(4.5rem,9vw,7rem) var(--marge);text-align:center;}
.avis-une blockquote{font-family:var(--serif);font-size:clamp(1.35rem,1.1rem + 1vw,1.9rem);line-height:1.4;max-width:40rem;margin:0 auto 1.4rem;}
.avis-une p{font-size:.875rem;color:var(--doux);}

/* ── Marques ────────────────────────────────────────────────── */
.marques{display:grid;grid-template-columns:repeat(6,auto);justify-content:center;gap:.6rem 2.25rem;font-family:var(--serif);font-size:1.1rem;color:var(--doux);margin:0;}
.marques span{white-space:nowrap;}

/* ── Équipe ─────────────────────────────────────────────────── */
.equipe{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;}
.equipe__membre{background:var(--blanc);padding:2.25rem 1.5rem;text-align:center;display:flex;flex-direction:column;align-items:center;gap:.6rem;}
.equipe__initiale{font-family:var(--serif);font-size:2.6rem;line-height:1;color:var(--decor);user-select:none;}
.equipe__membre h3{font-size:1.35rem;}
.equipe__role{font-size:.875rem;color:var(--doux);margin:0;}
.equipe__membre p{font-size:.875rem;color:var(--doux);margin:0;max-width:24ch;}

/* ── Plateau technique ──────────────────────────────────────── */
.techno{display:grid;grid-template-columns:repeat(2,1fr);gap:0 clamp(2.5rem,6vw,6rem);}
.techno__item{display:grid;grid-template-columns:2.5rem 1fr;gap:1.25rem;padding-block:1.5rem;border-bottom:1px solid var(--trait);align-items:baseline;}
.techno__num{font-family:var(--serif);font-size:1rem;color:var(--doux);}
.techno__titre,.techno__item h3{font-size:1.25rem;margin-bottom:.35rem;}
.techno__item p{font-size:.875rem;color:var(--doux);margin:0;}

/* ── Carte des soins ────────────────────────────────────────── */
.tarifs__groupe{margin:0 auto clamp(3rem,6vw,4.5rem);max-width:56rem;}
.tarifs__groupe > h2,.tarifs__groupe > h3{
  display:flex;align-items:baseline;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  font-size:clamp(1.5rem,1.25rem + .8vw,1.95rem);padding-bottom:1rem;border-bottom:1px solid var(--texte);margin-bottom:.25rem;
}
.tarifs__groupe > h2 small,.tarifs__groupe > h3 small{font-family:var(--sans);font-size:.875rem;color:var(--doux);font-weight:300;}
.tarifs__intro{font-size:.9rem;color:var(--doux);margin:1.25rem 0 1.5rem;max-width:64ch;}
.tarifs__sous{font-family:var(--serif);font-size:1.18rem;color:var(--texte);margin:2.25rem 0 .25rem;padding-bottom:.55rem;border-bottom:1px solid var(--trait);}
.ligne{display:grid;grid-template-columns:1fr auto;gap:.35rem 2rem;align-items:baseline;padding-block:1.05rem;border-bottom:1px solid var(--trait);}
.ligne__nom{font-family:var(--serif);font-size:1.12rem;line-height:1.28;color:var(--texte);}
.tarifs__sous + p,.tarifs__intro{margin-bottom:1.5rem;}
.tarifs__sous + p + .ligne{border-top:1px solid var(--trait);}
.ligne__duree{display:inline-block;font-family:var(--sans);font-size:.875rem;color:var(--doux);margin-left:.75rem;}
.ligne__prix{font-size:.95rem;font-weight:400;color:var(--texte);white-space:nowrap;font-variant-numeric:tabular-nums;}
.ligne__prix small{font-size:.875rem;color:var(--doux);}
.ligne__desc{grid-column:1/-1;font-size:.875rem;line-height:1.65;color:var(--doux);margin:.15rem 0 0;max-width:70ch;}
.ligne__plus{grid-column:1/-1;font-size:.875rem;margin:.1rem 0 0;}
.ligne__plus a{color:var(--texte);border-bottom:1px solid var(--trait);}
.tableau-enveloppe{overflow-x:auto;margin-block:1.5rem;-webkit-overflow-scrolling:touch;}
table.tarif-table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:.875rem;}
table.tarif-table th:first-child,table.tarif-table td:first-child{width:46%;padding-left:0;}
table.tarif-table th:last-child,table.tarif-table td:last-child{padding-right:0;}
table.tarif-table th{text-align:right;font-weight:400;font-size:.875rem;color:var(--doux);padding:.8rem .75rem;border-bottom:1px solid var(--texte);vertical-align:bottom;}
table.tarif-table th:first-child{text-align:left;}
table.tarif-table td{padding:.8rem .75rem;border-bottom:1px solid var(--trait);text-align:right;font-variant-numeric:tabular-nums;}
table.tarif-table td:first-child{text-align:left;font-family:var(--serif);font-size:1rem;}

/* Forfaits : colonnes calculées pour ne jamais laisser un bloc seul */
.forfaits{display:grid;gap:clamp(1.5rem,4vw,3.5rem);}
.forfaits--3{grid-template-columns:repeat(3,1fr);}
.forfaits--2{grid-template-columns:repeat(2,1fr);}
.forfaits--1{grid-template-columns:1fr;}

/* Galerie onglerie */
.galerie{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;}
.galerie a{display:block;overflow:hidden;aspect-ratio:4/5;background:var(--tuile);}
.galerie img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease);}
.galerie a:hover img{transform:scale(1.035);}

/* ── Questions fréquentes ───────────────────────────────────── */
.faq__item{border-bottom:1px solid var(--trait);}
.faq__q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:1.5rem;padding:1.35rem 0;text-align:left;font-family:var(--serif);font-size:1.15rem;line-height:1.35;}
.faq__q i{font-style:normal;font-family:var(--sans);font-weight:300;font-size:1.3rem;transition:transform var(--vite);flex:none;}
.faq__q[aria-expanded="true"] i{transform:rotate(45deg);}
.faq__r{overflow:hidden;transition:max-height .45s var(--ease);}
.faq__r > div{padding-bottom:1.5rem;color:var(--doux);font-size:.9rem;max-width:68ch;}

/* ── Accès et contact ───────────────────────────────────────── */
.acces{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(2rem,5vw,4.5rem);align-items:start;}
.infos-liste{list-style:none;margin:0;padding:0;}
.infos-liste li{display:grid;grid-template-columns:8rem 1fr;gap:1rem;padding-block:1rem;border-bottom:1px solid var(--trait);font-size:.9rem;}
.infos-liste li:first-child{border-top:1px solid var(--trait);}
.infos-liste .cle{font-size:.875rem;color:var(--doux);padding-top:.15rem;}
.infos-liste .valeur a{text-decoration:underline;text-decoration-color:var(--decor);text-underline-offset:.3em;}
.plan{margin:0;}
.plan > a{display:block;overflow:hidden;border:1px solid var(--trait);}
.plan img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform 1s var(--ease);}
.plan > a:hover img{transform:scale(1.03);}
.plan figcaption{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem 1rem;margin-top:.75rem;font-size:.875rem;color:var(--doux);}
.plan figcaption a{display:inline;color:var(--texte);text-decoration:underline;text-underline-offset:.3em;}
.carte-plan{width:100%;aspect-ratio:4/3;border:1px solid var(--trait);filter:grayscale(1);}
form label{display:block;}
form input,form textarea{
  width:100%;border:0;border-bottom:1px solid var(--trait);background:transparent;padding:.8rem 0;
  font:inherit;color:inherit;border-radius:0;-webkit-appearance:none;transition:border-color var(--vite);
}
form input:focus,form textarea:focus{outline:none;border-color:var(--texte);}
form .sur-titre{margin-bottom:.25rem;}

/* ── Rendez-vous (avant le pied) ────────────────────────────── */
.cta-final{text-align:center;}
.cta-final h2{margin-bottom:1rem;}
.cta-final .chapo{margin-inline:auto;}
.cta-final__actions{justify-content:center;margin-top:2.25rem;}

/* ── Pied de page ───────────────────────────────────────────── */
.pied{background:var(--blanc);border-top:1px solid var(--trait);padding-block:clamp(3.5rem,6vw,4.5rem) 2rem;font-size:.875rem;color:var(--doux);}
.pied__grille{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.1fr;gap:clamp(2rem,4vw,3.5rem);padding-bottom:clamp(2.5rem,5vw,3.5rem);}
.pied .logo img{width:7.2rem;}
.pied__titre{font-size:.875rem;color:var(--texte);margin-bottom:1rem;}
.pied__liens{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.55rem;}
.pied a{transition:color var(--vite);}
.pied a:hover{color:var(--texte);}
.pied__bas{border-top:1px solid var(--trait);padding-top:1.5rem;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;font-size:.875rem;}
.pied__reseaux{display:flex;gap:1.5rem;}

/* ── Barre téléphone ────────────────────────────────────────── */
.barre-mobile{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:55;background:var(--fond);
  border-top:1px solid var(--trait);padding:.55rem .55rem calc(.55rem + env(safe-area-inset-bottom));gap:.5rem;
}
.barre-mobile .btn{flex:1;padding:.9rem .5rem;font-size:.875rem;}

/* ── Défileur et carrousels (téléphone) ─────────────────────── */
.points{display:none;justify-content:center;gap:.5rem;margin-top:1.1rem;}
.points button{width:.38rem;height:.38rem;border-radius:50%;background:var(--trait);}
.points button[aria-current="true"]{background:var(--texte);}
@media (max-width:899px){
  .defileur{display:grid !important;grid-template-columns:1fr !important;overflow:hidden;}
  .defileur > *{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .35s,visibility 0s .35s;}
  .defileur > .est-actif{opacity:1;visibility:visible;transition:opacity .5s .3s;}
  .defileur + .points{display:flex;}
}

/* ── Révélation douce (une fois) ────────────────────────────── */
/* Apparition en fondu, une seule fois, sans aucun déplacement */
.reveal{opacity:0;transition:opacity .9s var(--ease);}
.reveal.est-visible{opacity:1;}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none;}
  .tuile img,.plan img{transition:none;}
}

/* ── Utilitaires ────────────────────────────────────────────── */
.invisible{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
.aller-contenu{position:absolute;left:-9999px;top:0;z-index:100;background:var(--sombre);color:var(--blanc);padding:1rem 1.5rem;font-size:.875rem;}
.aller-contenu:focus{left:0;}

/* ── Adaptatif ──────────────────────────────────────────────── */
@media (max-width:1099px){
  .entete__tel{display:none;}
  .edito,.edito--inverse{grid-template-columns:1fr;}
  .edito figure{min-height:0;aspect-ratio:4/3;}
  .edito--inverse figure{order:-1;}
  .edito > div,.edito--inverse > div{justify-self:center;text-align:center;max-width:36rem;padding-inline:var(--marge);}
  .duo{grid-template-columns:1fr;gap:2.25rem;}
  .duo--inverse .duo__media{order:0;}
  .duo__media img{aspect-ratio:3/2;}
  .duo__texte,.duo > div{text-align:center;}
  .duo__media--portrait{justify-self:center;}
  .duo__texte p{margin-inline:auto;}
  .acces{grid-template-columns:1fr;}
  .tuiles,.equipe{grid-template-columns:repeat(2,1fr);}
  .pied__grille{grid-template-columns:1fr 1fr;}
}
@media (max-width:899px){
  .techno{grid-template-columns:1fr;}
  .marques{grid-template-columns:repeat(3,auto);}
  .forfaits--3,.forfaits--2{grid-template-columns:1fr;}
}
@media (max-width:680px){
  .annonce__long{display:none;}
  .burger span{display:none;}
  .hero{padding:0;}
  .hero__intro{padding-inline:var(--marge);}
  .hero figure{height:calc(100svh - 7.5rem);min-height:30rem;}
  .hero--page figure{height:62svh;min-height:24rem;}
  .hero--page h1{font-size:1.85rem;}
  .sommaire{gap:0 1.1rem;}
  .sommaire a{white-space:nowrap;}
  table.tarif-table{font-size:.875rem;}
  table.tarif-table th,table.tarif-table td{padding:.7rem .3rem;}
  table.tarif-table th:first-child,table.tarif-table td:first-child{width:37%;padding-left:0;}
  table.tarif-table td:first-child{font-size:.94rem;}
  .faits{gap:.35rem .9rem;}
  .marques{grid-template-columns:repeat(2,1fr);gap:.75rem 1rem;}
  .acces > div > .sur-titre,.acces > div > h2{text-align:center;}
  .entete-page .hero__actions{width:100%;}
  table.tarif-table th:first-child,table.tarif-table td:first-child{width:44%;}
  .tarifs__groupe > h2,.tarifs__groupe > h3{flex-direction:column;align-items:flex-start;gap:.25rem;}
  .faits span+span::before{margin-right:.9rem;}
  .hero__actions,.cta-final__actions{flex-direction:column;align-items:stretch;max-width:21rem;margin-inline:auto;}
  .barre-mobile{display:flex;}
  .lien,.sommaire a,.fil a,.pied__reseaux a,.plan figcaption a,.entete__droite .lien{display:inline-block;padding-block:.72rem;}
  .reserver{min-height:2.75rem;}
  .sommaire a{min-width:2.75rem;justify-content:center;}
  .pied__liens a{display:inline-block;padding-block:.6rem;}
  .pied__liens{gap:0;}
  body{padding-bottom:calc(4.75rem + env(safe-area-inset-bottom));}
  .carrousel{
    display:grid !important;grid-auto-flow:column;grid-template-columns:none !important;grid-auto-columns:76%;
    gap:2px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;
    margin-inline:calc(-1 * var(--marge));padding-inline:var(--marge);scroll-padding-inline:var(--marge);
  }
  .carrousel::-webkit-scrollbar{display:none;}
  .carrousel > *{scroll-snap-align:start;}
  .carrousel + .points{display:flex;}
  .equipe{grid-template-columns:1fr;}
  .equipe.carrousel{grid-template-columns:none !important;}
  .infos-liste li{grid-template-columns:1fr;gap:.2rem;}
  .ligne__duree{display:block;margin:.15rem 0 0;}
  .pied__grille{grid-template-columns:1fr 1fr;gap:2rem 1rem;text-align:center;}
  .pied__grille > :first-child,.pied__grille > :last-child{grid-column:1/-1;}
  .pied__grille p{margin-inline:auto;}
  .pied .logo,.pied .logo img{margin-inline:auto;}
  .pied__bas{justify-content:center;text-align:center;}
}

/* ── Impression ─────────────────────────────────────────────── */
@media print{
  .entete,.barre-mobile,.annonce,.menu,.btn,.section--cta{display:none !important;}
  body{color:#000;font-size:11pt;background:#fff;}
  .reveal{opacity:1;transform:none;}
}

/* ── En-tête de page sans photo (carte, contact, mentions) ──── */
.entete-page{padding:clamp(3.5rem,8vw,6rem) var(--marge) clamp(2.75rem,5vw,4rem);text-align:center;}
.entete-page{padding-inline:0;}
.entete-page__grille{display:grid;gap:1.25rem;justify-items:center;}
.entete-page .chapo{margin-inline:auto;}
.entete-page .hero__actions{justify-content:center;}
.entete-page .sommaire{margin-top:.5rem;}

/* Photo verticale dans un duo : jamais étirée en largeur */
.duo__media--portrait{max-width:30rem;justify-self:end;width:100%;}
.galerie{max-width:56rem;margin-inline:auto;}
.duo__media--portrait img{aspect-ratio:4/5;}
@media (max-width:1099px){.duo__media--portrait img{aspect-ratio:4/5;}}

/* Cadrages des bandeaux : le sujet reste dans le cadre */
.hero--page img[src*="cellu-m6"]{object-position:50% 12%;}
.hero--page img[src*="facade"]{object-position:50% 40%;}

/* Bloc de texte seul dans une section : centré comme les titres */
.section > .enveloppe:not(.enveloppe--etroite) > .reveal:only-child:not(.tarifs__groupe){text-align:center;}
.section > .enveloppe:not(.enveloppe--etroite) > .reveal:only-child:not(.tarifs__groupe) .chapo{margin-inline:auto;}

/* Cartes de soins sans photo */
.piece{display:flex;flex-direction:column;align-items:center;padding:2.25rem 1.5rem 2rem;}
.piece p{flex:1;}
.piece .reserver{margin-top:auto;}
.piece .piece__prix{flex:none;font-size:.875rem;color:var(--texte);margin:.2rem 0 1.25rem;}

/* Cadrages des bandeaux sur téléphone : le sujet net reste dans le cadre */
@media (max-width:680px){
  .hero img[src*="masque-visage"]{object-position:22% 50% !important;}
  .hero img[src*="soin-visage"]{object-position:30% 40%;}
  .hero img[src*="portrait-peau"]{object-position:28% 22%;}
  .hero img[src*="epilation-homme"]{object-position:68% 50%;}
  .hero img[src*="cabine-duo"]{object-position:82% 60%;}
  .hero img[src*="facade"]{object-position:35% 40%;}
  .hero img[src*="regard"]{object-position:38% 50%;}
}
@media (min-width:681px){.hero--page img[src*="epilation-homme"]{object-position:50% 22%;}}
.duo__media img[src*="masque-visage"]{object-position:18% 50%;}
.duo__media img[src*="cabine-duo"]{aspect-ratio:3/2;}

.edito figure img[src*="facade"]{object-position:40% 45%;}

/* Sommaires : rangées égales, jamais un lien seul */
.sommaire--grille{display:grid;justify-content:center;justify-items:center;grid-template-columns:repeat(var(--cols),auto);gap:.25rem 1.6rem;}
@media (max-width:1099px){.sommaire--grille{grid-template-columns:repeat(var(--cols-moy),auto);}}
@media (max-width:680px){.sommaire--grille{grid-template-columns:repeat(var(--cols-tel),auto);gap:0 1.1rem;}}

/* Contact : la carte prend la hauteur de la colonne d'informations */
@media (min-width:1100px){
  .acces{align-items:stretch;}
  .acces > .plan{display:flex;flex-direction:column;}
  .plan > a{flex:1;min-height:0;}
  .plan img{height:100%;aspect-ratio:auto;}
}

/* Bandeaux : cadrage et voile adaptés à chaque photo */
@media (min-width:681px){
  .hero--page img[src*="soin-visage"]{object-position:50% 30%;}
  .hero--page img[src*="portrait-peau"]{object-position:35% 12%;}
}
.hero figure:has(img[src*="epilation-homme"])::after{background:linear-gradient(0deg,rgba(20,19,18,.78) 0%,rgba(20,19,18,.52) 45%,rgba(20,19,18,.12) 85%);}
.duo__media img[src*="visage-premium"],.duo__media img[src*="masque-visage"]{aspect-ratio:1;}
.duo__media img[src*="masque-visage"]{object-position:10% 50%;}
.tarifs__intro--sous{margin:.9rem 0 1.1rem;}
.tarifs__intro + .ligne,.tarifs__intro + .forfaits{border-top:1px solid var(--trait);}
.tarifs__retour{margin:1.5rem 0 0;text-align:right;}
.tarifs__retour .lien{font-size:.875rem;color:var(--doux);}
[id]{scroll-margin-top:6rem;}
@media (max-width:680px){
  .pied__liens li:not(:has(a)){padding-block:.6rem;}
  .tarifs__retour{text-align:center;}
}
.ligne__des{font-size:.875rem;color:var(--doux);font-weight:300;}
@media (max-width:680px){
  .ligne{gap:.35rem 1rem;}
  .ligne__prix{text-align:right;}
  .ligne__des{display:block;line-height:1.2;}
}

/* ── Rails à faire glisser sur tous les écrans (soins signature, avis) ── */
.carrousel--partout{
  display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc((100% - 4px) / 3);
  gap:2px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;
}
.carrousel--partout::-webkit-scrollbar{display:none;}
.carrousel--partout > *{scroll-snap-align:start;}
.carrousel--partout + .points{display:flex;margin-top:1.5rem;}
.points button{padding:0;border:0;cursor:pointer;}
@media (max-width:1099px){.carrousel--partout{grid-auto-columns:calc((100% - 2px) / 2);}}
@media (max-width:680px){.carrousel--partout{grid-auto-columns:76%;}}

/* ── Avis clientes ── */
.avis{margin:0;background:var(--blanc);padding:2.5rem 2rem 2.25rem;text-align:center;display:flex;flex-direction:column;justify-content:space-between;gap:1.5rem;}
.avis blockquote{margin:0;font-family:var(--serif);font-size:1.12rem;line-height:1.55;color:var(--texte);text-wrap:balance;}
.avis figcaption{font-size:.875rem;color:var(--doux);letter-spacing:.04em;}
/* Lignes courtes (horaires, TVA) : libellé et valeur restent côte à côte sur téléphone */
@media (max-width:680px){
  .infos-liste--court li,.infos-liste li.court{grid-template-columns:1fr auto;gap:1rem;align-items:baseline;}
}

/* ── Offres du moment (accueil) : cartes grises sur fond blanc ── */
.section--offres{background:var(--blanc);}
.section--offres .piece{background:var(--fond);}
.piece__avant{display:block;margin-top:.2rem;font-size:.875rem;color:var(--doux);}

/* Menu fermé : il ne capte jamais un toucher, même pendant sa transition de fermeture */
.menu{pointer-events:none;}
.menu.est-ouvert{pointer-events:auto;}
