/* ==========================================================================
   Espritmassages — Marie Trémont · finitions V7 (29/08/2026)
   Palette : crème / sable / terre en fond, vert de l'identité en signature.
   Lecture DA : massage ayurvédique local ; rassurer puis réserver ; organique
   chaleureux, hybride éditorial. Variance 2 · motion 1 · densité 2.
   Aucun style en ligne : CSP espritmassages.fr respectée.
   ========================================================================== */

@font-face{font-family:"Fraunces";src:url("fonts/fraunces-var.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Outfit";src:url("fonts/outfit-var.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Pinyon";src:url("fonts/pinyon.woff2") format("woff2");font-weight:400;font-display:swap}

:root{
  --creme:#F7F1E6;      --creme-2:#FBF7EF;
  --sable:#EDE0CC;      --sable-2:#E3D2B8;
  --terre:#9B6A48;      --terre-f:#6E4830;      --terre-c:#C89A74;   --terre-txt:#74492D;
  --chair:#E9C4AE;
  --vert:#3B6B57;       --vert-f:#26473A;       --vert-txt:#2F5B49;       --vert-c:#7FA189;   --sauge:#CBDCC9;
  --or:#C9A24A;         --or-clair:#E8CE8E;
  --encre:#2A2318;      --encre-2:#5A4E3C;
  --blanc:#FFFDF9;
  --r:22px; --r-s:12px;
  --max:1180px;
  --e:cubic-bezier(.22,1,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
/* [hidden] doit gagner sur nos display: sinon menu, visionneuse et champs conditionnels restent visibles */
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--creme);color:var(--encre);
  font-family:"Outfit",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:clamp(16px,.55vw + 14.6px,18px);line-height:1.65;font-weight:350;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{font-family:"Fraunces",Georgia,serif;font-weight:520;line-height:1.05;letter-spacing:-.015em;margin:0}
p{margin:0 0 1em}
.script{font-family:"Pinyon","Fraunces",cursive;font-weight:400;letter-spacing:.01em}
.saut{position:absolute;left:-9999px;top:0;background:var(--vert);color:#fff;padding:.7rem 1.1rem;z-index:200}
.saut:focus{left:8px;top:8px}
:focus-visible{outline:3px solid var(--vert);outline-offset:3px;border-radius:6px}

/* ------------------------------- rideau ------------------------------- */
.rideau{position:fixed;inset:0;z-index:300;background:var(--vert-f);display:grid;place-items:center;
  transition:transform .9s var(--e),opacity .5s ease .5s}
.rideau.parti{transform:translateY(-102%);opacity:0;pointer-events:none}
.rideau-in{text-align:center;color:var(--creme)}
.rideau-mot{font-size:clamp(2.4rem,7vw,4.6rem);display:block;opacity:0;animation:rid .8s var(--e) .12s forwards}
.rideau-filet{display:block;height:1px;width:0;background:var(--or);margin:.9rem auto 0;animation:filet .8s var(--e) .45s forwards}
@keyframes rid{to{opacity:1;transform:translateY(0)}}
@keyframes filet{to{width:190px}}

/* ------------------------------- en-tête ------------------------------- */
.tete{position:fixed;top:0;left:0;right:0;z-index:120;transition:background .35s ease,box-shadow .35s ease,padding .35s ease;padding:.55rem 0}
.tete.colle{background:rgba(247,241,230,.93);backdrop-filter:blur(14px);box-shadow:0 1px 0 rgba(42,35,24,.10),0 12px 34px -22px rgba(42,35,24,.5)}
.tete-in{max-width:var(--max);margin:0 auto;padding:0 clamp(16px,3.4vw,30px);display:flex;align-items:center;gap:1.1rem}
.marque{display:flex;align-items:center;gap:.6rem;text-decoration:none;flex:0 0 auto}
.marque-logo{width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:var(--blanc);box-shadow:0 4px 16px -8px rgba(42,35,24,.6)}
.marque-logo img{width:44px;height:44px}
.marque-txt{display:flex;flex-direction:column;line-height:1.1}
.marque-txt b{font-family:"Fraunces",serif;font-weight:560;font-size:1.05rem;letter-spacing:-.01em}
.marque-txt small{font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--terre-txt)}
.nav{display:flex;gap:1.35rem;margin-left:auto;font-size:.88rem;letter-spacing:.01em}
.nav a{text-decoration:none;position:relative;padding:.25rem 0;color:var(--encre-2);transition:color .25s ease}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:var(--vert);transform:scaleX(0);transform-origin:right;transition:transform .35s var(--e)}
.nav a:hover{color:var(--vert)}
.nav a:hover::after{transform:scaleX(1);transform-origin:left}
.tete-act{display:flex;gap:.55rem;align-items:center;margin-left:.6rem}
.barre-lect{position:absolute;left:0;right:0;bottom:0;height:2px;transform:scaleX(var(--lecture,0));transform-origin:left;background:linear-gradient(90deg,var(--vert-c),var(--vert),var(--or))}
.burger{display:none;margin-left:auto;width:44px;height:44px;border:0;background:none;padding:10px;cursor:pointer;flex-direction:column;justify-content:space-between}
.burger span{display:block;height:2px;background:var(--encre);border-radius:2px;transition:transform .35s var(--e),opacity .2s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(10px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-10px) rotate(-45deg)}
.menu-mob{position:fixed;inset:0;z-index:110;background:var(--creme);padding:6.2rem clamp(20px,6vw,40px) 2rem;display:flex;flex-direction:column;gap:.5rem;overflow:auto}
.menu-mob nav{display:flex;flex-direction:column}
.menu-mob nav a{font-family:"Fraunces",serif;font-size:1.6rem;padding:.55rem 0;text-decoration:none;border-bottom:1px solid rgba(42,35,24,.10)}
.menu-mob .btn{margin-top:.7rem}

/* ------------------------------- boutons ------------------------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.72rem 1.35rem;border-radius:999px;
  font-family:"Outfit",sans-serif;font-size:.92rem;font-weight:500;letter-spacing:.005em;text-decoration:none;border:1.5px solid transparent;
  cursor:pointer;transition:transform .3s var(--e),box-shadow .3s var(--e),background .25s,color .25s;white-space:nowrap}
.btn:hover{transform:translateY(-2px)}
.btn-p{background:var(--vert);color:var(--creme-2);box-shadow:0 10px 26px -14px rgba(59,107,87,.95)}
.btn-p:hover{background:var(--vert-f);box-shadow:0 16px 34px -14px rgba(59,107,87,.95)}
.btn-s{background:var(--blanc);color:var(--encre);border-color:rgba(42,35,24,.16)}
.btn-s:hover{border-color:var(--vert);color:var(--vert)}
.btn-fant{background:none;color:var(--encre-2);border-color:rgba(42,35,24,.18)}
.btn-fant:hover{color:var(--vert);border-color:var(--vert)}
.btn-clair{background:var(--creme);color:var(--vert-f);box-shadow:0 10px 24px -16px rgba(0,0,0,.9)}
.btn-clair:hover{background:#fff}
.btn-fant-clair{background:none;color:var(--sauge);border-color:rgba(203,220,201,.45)}
.btn-fant-clair:hover{color:#fff;border-color:var(--sauge)}
.btn-gros{padding:.95rem 1.9rem;font-size:1rem}
.btn-bloc{width:100%}
.lien-fl{display:inline-flex;align-items:center;gap:.5rem;font-weight:500;color:var(--vert-txt);text-decoration:none;border-bottom:1.5px solid rgba(59,107,87,.28);padding-bottom:2px;transition:gap .3s var(--e),border-color .3s}
.lien-fl::after{content:"→";transition:transform .3s var(--e)}
.lien-fl:hover{gap:.75rem;border-color:var(--vert)}
.lien-fl:hover::after{transform:translateX(3px)}

/* -------------------------------- hero -------------------------------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;padding:6.6rem 0 3.2rem;overflow:hidden;
  background:radial-gradient(120% 90% at 78% 8%,#FBF6EC 0%,var(--creme) 42%,var(--sable) 100%)}
.hero-fond{position:absolute;inset:0;pointer-events:none}
.grain{position:absolute;inset:0;opacity:.5;
  background-image:radial-gradient(rgba(110,72,48,.10) 1px,transparent 1px);background-size:4px 4px}
.halo{position:absolute;border-radius:50%;filter:blur(58px);opacity:.5}
.h1{width:46vw;height:46vw;left:-14vw;top:-10vw;background:radial-gradient(circle,rgba(203,220,201,.85),transparent 68%)}
.h2{width:38vw;height:38vw;right:-10vw;top:6vw;background:radial-gradient(circle,rgba(233,196,174,.75),transparent 68%)}
.h3{width:34vw;height:34vw;left:34vw;bottom:-14vw;background:radial-gradient(circle,rgba(201,162,74,.42),transparent 70%)}
.courbe{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:34vh;min-height:190px}
.courbe path{fill:var(--creme-2)}
.hero-in{position:relative;z-index:2;max-width:var(--max);margin:0 auto;padding:0 clamp(16px,3.4vw,30px);
  display:grid;grid-template-columns:1.06fr .94fr;gap:clamp(1.6rem,4vw,3.4rem);align-items:center;width:100%}

/* Intro du logo : un seul passage de cinq secondes, sans écran d'attente. */
.logo-anime{position:relative;width:clamp(236px,26vw,348px);aspect-ratio:1;margin:0 0 .8rem;display:grid;place-items:center}
.logo-intro{overflow:hidden;border-radius:46%;background:#08110E;border:1px solid rgba(201,162,74,.28);
  box-shadow:0 28px 70px -36px rgba(18,36,29,.72),0 0 0 7px rgba(255,253,249,.34)}
.logo-intro-repli,.logo-intro-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.logo-intro-repli{z-index:1}
.logo-intro-video{z-index:2;opacity:0;background:#08110E;transition:opacity .22s ease}
.logo-intro-video.est-prete{opacity:1}
.aura{position:absolute;inset:-16%;border-radius:50%;z-index:1;
  background:radial-gradient(circle,rgba(201,162,74,.42) 0%,rgba(233,196,174,.32) 38%,transparent 68%);
  animation:pulse 7s ease-in-out infinite}
.orbe{position:absolute;border-radius:50%;border:1px solid rgba(59,107,87,.24);z-index:2}
.o1{inset:2%;animation:tourne 26s linear infinite}
.o2{inset:-9%;border-style:dashed;border-color:rgba(155,106,72,.24);animation:tourne 40s linear infinite reverse}
.o3{inset:-20%;border-color:rgba(201,162,74,.24);animation:tourne 60s linear infinite}
.etincelles{position:absolute;inset:-20%;z-index:2}
.etincelles i{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--or);opacity:.75;
  top:50%;left:50%;margin:-2.5px;animation:gravite 12s linear infinite}
.etincelles i:nth-child(1){animation-duration:11s;animation-delay:0s}
.etincelles i:nth-child(2){animation-duration:14s;animation-delay:-2s;background:var(--vert-c)}
.etincelles i:nth-child(3){animation-duration:17s;animation-delay:-5s;background:var(--chair)}
.etincelles i:nth-child(4){animation-duration:13s;animation-delay:-7s}
.etincelles i:nth-child(5){animation-duration:19s;animation-delay:-9s;background:var(--vert-c)}
.etincelles i:nth-child(6){animation-duration:15s;animation-delay:-11s;background:var(--chair)}
@keyframes respire{0%,100%{transform:scale(1)}50%{transform:scale(1.045)}}
@keyframes pulse{0%,100%{transform:scale(.94);opacity:.62}50%{transform:scale(1.1);opacity:1}}
@keyframes tourne{to{transform:rotate(360deg)}}
@keyframes gravite{
  0%{transform:rotate(0deg) translateX(72px) rotate(0deg) scale(.6);opacity:0}
  12%{opacity:.85}
  88%{opacity:.85}
  100%{transform:rotate(360deg) translateX(72px) rotate(-360deg) scale(1);opacity:0}
}

.sur{display:flex;align-items:center;gap:.7rem;font-size:.73rem;letter-spacing:.19em;text-transform:uppercase;color:var(--terre-txt);font-weight:500;margin-bottom:.8rem}
.sur i{flex:0 0 34px;height:1px;background:var(--terre-c);display:block}
.titre-hero{font-size:clamp(2.6rem,7.4vw,5rem);margin-bottom:.35rem}
.titre-hero .script{display:block;font-size:1.18em;line-height:.98;color:var(--vert);margin-top:-.06em}
.qualite{font-size:clamp(1.15rem,2.5vw,1.6rem);color:var(--terre-f);margin:.15rem 0 1rem;line-height:1.25}
.chapo{color:var(--encre-2);max-width:54ch;font-size:1.03rem}
.chapo b{font-weight:600;color:var(--encre)}
.hero-ctas{display:flex;gap:.7rem;flex-wrap:wrap;margin:1.3rem 0 1.5rem}
.hero-faits{list-style:none;margin:0;padding:1.1rem 0 0;display:flex;gap:clamp(1.1rem,3vw,2.4rem);border-top:1px solid rgba(155,106,72,.24);flex-wrap:wrap}
.hero-faits li{display:flex;flex-direction:column}
.hero-faits b{font-family:"Fraunces",serif;font-size:clamp(1.5rem,3vw,2.1rem);font-weight:560;color:var(--vert);line-height:1}
.hero-faits span{font-size:.78rem;color:var(--encre-2);letter-spacing:.02em}
.hero-fleche{position:absolute;left:50%;bottom:1.3rem;z-index:3;width:26px;height:44px;margin-left:-13px;border:1.5px solid rgba(155,106,72,.4);border-radius:14px;display:grid;justify-items:center;padding-top:8px}
.hero-fleche span{width:3px;height:8px;border-radius:2px;background:var(--terre);animation:desc 1.8s ease-in-out infinite}
@keyframes desc{0%,100%{transform:translateY(0);opacity:1}60%{transform:translateY(15px);opacity:0}}

/* séquence scroll */
.hero-seq{position:relative}
.seq-cadre{position:relative;aspect-ratio:3/4;border-radius:210px 210px 26px 26px;overflow:hidden;
  box-shadow:0 40px 80px -46px rgba(42,35,24,.85),0 0 0 1px rgba(255,255,255,.55) inset;transform:rotate(1.6deg)}
.seq-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 46%;opacity:0;transform:scale(1.06);
  transition:opacity .55s ease,transform 1.6s var(--e)}
.seq-img.active{opacity:1;transform:scale(1)}
.seq-grain{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(110,72,48,.06),transparent 34%,rgba(42,35,24,.20))}
.seq-jauge{position:absolute;right:-14px;top:14%;bottom:14%;width:3px;border-radius:3px;background:rgba(155,106,72,.2)}
.seq-jauge span{display:block;width:100%;height:0;border-radius:3px;background:linear-gradient(180deg,var(--vert-c),var(--vert))}
.seq-leg{position:absolute;left:0;right:0;bottom:0;z-index:2;margin:0;padding:2.4rem 1.4rem .9rem;
  font-size:1.5rem;color:var(--creme);text-align:center;pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(24,20,13,.82));
  border-radius:0 0 26px 26px;text-shadow:0 2px 12px rgba(0,0,0,.6)}

/* ------------------------------ banderole ------------------------------ */
.banderole{background:var(--vert-f);color:var(--sauge);padding:.85rem 0;overflow:hidden;border-block:1px solid rgba(201,162,74,.32)}
.banderole-piste{display:flex;align-items:center;gap:1.6rem;width:max-content;animation:defile 46s linear infinite;white-space:nowrap}
.banderole-piste span{font-family:"Fraunces",serif;font-size:clamp(.95rem,1.7vw,1.3rem);letter-spacing:.01em}
.banderole-piste i{color:var(--or-clair);font-style:normal;font-size:.8rem}
@keyframes defile{to{transform:translateX(-50%)}}

/* ------------------------------ sections ------------------------------ */
.sec{position:relative;padding:clamp(4rem,8.5vw,7.2rem) 0;overflow:hidden}
.sec-creme{background:var(--creme-2)}
.sec-sable{background:linear-gradient(180deg,var(--sable) 0%,#E7D8C0 100%)}
.sec-vert{background:var(--vert-f);color:var(--creme)}
.sec-vert .chapo,.sec-vert p{color:rgba(247,241,230,.9)}
.env{position:relative;z-index:2;max-width:var(--max);margin:0 auto;padding:0 clamp(16px,3.4vw,30px)}
.tache{position:absolute;border-radius:50%;filter:blur(70px);pointer-events:none;z-index:1;opacity:.55}
.t1{width:30vw;height:30vw;right:-8vw;top:4vw;background:radial-gradient(circle,rgba(233,196,174,.8),transparent 70%)}
.t2{width:32vw;height:32vw;left:-10vw;bottom:-6vw;background:radial-gradient(circle,rgba(203,220,201,.85),transparent 70%)}
.t3{width:26vw;height:26vw;right:-6vw;bottom:2vw;background:radial-gradient(circle,rgba(201,162,74,.4),transparent 70%)}
.t4{width:34vw;height:34vw;left:-12vw;top:-8vw;background:radial-gradient(circle,rgba(127,161,137,.42),transparent 70%)}

.entete{max-width:60ch;margin-bottom:clamp(2.2rem,4.5vw,3.4rem)}
.entete-c{margin-inline:auto;text-align:center}
.oeil{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--terre-txt);font-weight:500;margin-bottom:.7rem;display:flex;align-items:center;gap:.6rem}
.entete-c .oeil{justify-content:center}
.oeil::before{content:"";width:26px;height:1px;background:currentColor;display:block}
.oeil.clair{color:var(--or-clair)}
h2{font-size:clamp(2rem,4.6vw,3.35rem)}
h2 .script{display:block;font-size:1.24em;line-height:1;color:var(--vert);margin-top:-.04em}
.sec-vert h2 .script{color:var(--sauge)}
.petite{font-size:.84rem;color:var(--encre-2);line-height:1.5}
.petite.clair{color:rgba(247,241,230,.84)}

/* -------------------------------- soins -------------------------------- */
.entete-duo{display:grid;grid-template-columns:1.35fr .65fr;gap:clamp(1.4rem,3.4vw,3rem);align-items:center;
  margin-bottom:clamp(2.2rem,4.5vw,3.4rem)}
.entete-duo .entete{margin-bottom:0}
.signe{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;
  background:var(--blanc);border:1px solid rgba(155,106,72,.16);border-radius:var(--r);padding:1.3rem 1.2rem 1.5rem;
  box-shadow:0 26px 60px -46px rgba(42,35,24,.8);transform:rotate(1.6deg)}
.signe img{width:96px;height:96px;border-radius:50%;object-fit:cover;margin:-3.2rem 0 .8rem;border:5px solid var(--blanc);
  box-shadow:0 14px 30px -20px rgba(42,35,24,.9)}
.signe blockquote{margin:0}
.signe .script{font-size:clamp(1.35rem,2.6vw,1.75rem);color:var(--vert);line-height:1.15;margin:0 0 .5rem}
.signe cite{font-style:normal;font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;color:var(--terre-txt)}
@media (max-width:900px){.entete-duo{grid-template-columns:1fr}.signe{max-width:340px;margin:1.6rem auto 0}}

.soins-grille{display:flex;flex-direction:column;gap:clamp(2rem,4.4vw,3.6rem)}
.soin{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(1.4rem,3.4vw,3rem);align-items:center}
.soin.obl-d{grid-template-columns:1.08fr .92fr}
.soin.obl-d .soin-img{order:2}
.soin-img{position:relative;border-radius:var(--r);overflow:hidden;box-shadow:0 30px 62px -40px rgba(42,35,24,.9);
  transform:rotate(-1.5deg);transition:transform .6s var(--e)}
.soin.obl-d .soin-img{transform:rotate(1.5deg)}
.soin-img::after{content:"";position:absolute;inset:0;border:1px solid rgba(255,255,255,.5);border-radius:var(--r);pointer-events:none}
.soin-img img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .9s var(--e)}
.soin:hover .soin-img{transform:rotate(0deg)}
.soin:hover .soin-img img{transform:scale(1.05)}
.soin-num{font-family:"Fraunces",serif;font-size:3.4rem;line-height:1;color:transparent;-webkit-text-stroke:1px rgba(155,106,72,.42);margin:0 0 .1rem}
.soin h3{font-size:clamp(1.6rem,3vw,2.25rem);margin-bottom:.55rem}
.soin-p{color:var(--encre-2)}
.puces{list-style:none;padding:0;margin:0 0 1.2rem;display:grid;gap:.4rem}
.puces li{position:relative;padding-left:1.5rem;font-size:.94rem;color:var(--encre-2)}
.puces li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:8px;border-radius:50%;background:var(--vert-c);box-shadow:0 0 0 3px rgba(127,161,137,.2)}
.puces-2{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}

.cibles{margin-top:clamp(2.6rem,5vw,4rem);display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(1.4rem,3.4vw,2.8rem);align-items:center;
  background:var(--blanc);border:1px solid rgba(155,106,72,.16);border-radius:var(--r);padding:clamp(1.4rem,3vw,2.2rem);box-shadow:0 26px 60px -46px rgba(42,35,24,.8)}
.cibles-txt h3{font-size:clamp(1.7rem,3.2vw,2.3rem);color:var(--terre-f);margin-bottom:.4rem}
.cibles-txt p{color:var(--encre-2);margin:0;font-size:.96rem}
.cibles-liste{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:.9rem}
.cibles-liste li{text-align:center}
.cibles-liste img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:50%;margin-bottom:.55rem;
  box-shadow:0 16px 34px -22px rgba(42,35,24,.9);transition:transform .5s var(--e)}
.cibles-liste li:hover img{transform:translateY(-5px) scale(1.03)}
.cibles-liste span{font-size:.86rem;font-weight:500;color:var(--encre)}

/* -------------------------------- tarifs -------------------------------- */
.tarifs{display:grid;grid-template-columns:repeat(auto-fit,minmax(192px,1fr));gap:.9rem}
.tarif{background:rgba(247,241,230,.07);border:1px solid rgba(203,220,201,.24);border-radius:var(--r);padding:1.4rem 1.15rem;
  display:flex;flex-direction:column;gap:.35rem;transition:transform .45s var(--e),background .35s,border-color .35s}
.tarif:hover{transform:translateY(-7px);background:rgba(247,241,230,.13);border-color:rgba(201,162,74,.55)}
.tarif-fort{background:rgba(201,162,74,.14);border-color:rgba(201,162,74,.55)}
.tarif-h{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--or-clair)!important;font-weight:500;margin:0}
.tarif-prix{font-family:"Fraunces",serif;line-height:.9;margin:.25rem 0 .1rem;color:var(--creme)!important}
.tarif-prix b{font-size:clamp(2.7rem,3.2vw,3.4rem);font-weight:560}
.tarif-prix span{font-size:1.4rem;margin-left:.12rem}
.tarif-d{font-weight:500;margin:0;color:var(--sauge)!important}
.tarif-x{font-size:.88rem;margin:.3rem 0 1rem;flex:1}
.tarif .btn{align-self:flex-start}
.tarifs-note{text-align:center;margin:1.8rem auto 0;max-width:62ch;font-size:.86rem}

/* --------------------------------- duo --------------------------------- */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.8rem,4.5vw,4rem);align-items:center}
.duo-inv .duo-txt{order:2}
.duo-txt h2{margin-bottom:.7rem}
.reperes{list-style:none;padding:0;margin:1.4rem 0;display:grid;gap:.8rem}
.reperes li{display:flex;flex-direction:column;padding-left:1.1rem;border-left:2px solid var(--vert-c)}
.reperes b{font-weight:600}
.reperes span{font-size:.87rem;color:var(--encre-2)}

.lieu-pile,.marie-pile{position:relative;min-height:clamp(340px,46vw,520px)}
.pile{margin:0;border-radius:var(--r);overflow:hidden;position:absolute;box-shadow:0 34px 70px -44px rgba(42,35,24,.95);
  border:5px solid var(--blanc);transition:transform .6s var(--e)}
.pile img{width:100%;height:100%;object-fit:cover}
.lieu-pile .p-1{width:76%;left:0;top:0;aspect-ratio:4/3;transform:rotate(-2.4deg);z-index:2}
.lieu-pile .p-2{width:52%;right:0;top:26%;aspect-ratio:4/3;transform:rotate(3deg);z-index:3}
.lieu-pile .p-3{width:40%;left:10%;bottom:0;aspect-ratio:1;transform:rotate(-4deg);z-index:4;border-radius:50%}
.lieu-pile:hover .p-1{transform:rotate(-1deg) translateY(-6px)}
.lieu-pile:hover .p-2{transform:rotate(1.4deg) translateY(-6px)}
.lieu-pile:hover .p-3{transform:rotate(-2deg) translateY(-6px)}
.marie-pile .p-1{width:71%;right:0;top:4%;aspect-ratio:4/3;transform:rotate(2deg);z-index:2}
.marie-pile .p-2{width:44%;left:6%;bottom:0;aspect-ratio:1;transform:rotate(-3.4deg);z-index:4;border-radius:50%}
.marie-pile .p-3{width:31%;left:0;top:0;aspect-ratio:1;transform:rotate(-5deg);z-index:3;border-radius:50%}
.marie-pile:hover .p-3{transform:rotate(1.6deg) translateY(-6px)}
.marie-pile:hover .p-1{transform:rotate(.6deg) translateY(-6px)}
.marie-pile:hover .p-2{transform:rotate(-1.4deg) translateY(-6px)}

.dom-grille{display:grid;gap:1rem}
.dom-grille figure{margin:0;border-radius:var(--r);overflow:hidden;box-shadow:0 26px 56px -42px rgba(42,35,24,.9)}
.dom-grille figure:first-child{transform:rotate(-1.4deg)}
.dom-grille figure:last-child{transform:rotate(1.4deg)}
.dom-grille img{width:100%;aspect-ratio:4/3;object-fit:cover}
.cadre-arc{margin:0;border-radius:190px 190px var(--r) var(--r);overflow:hidden;box-shadow:0 34px 70px -44px rgba(42,35,24,.95);transform:rotate(-1.4deg)}
.cadre-arc img{width:100%;aspect-ratio:3/4;object-fit:cover}

.parcours{list-style:none;padding:0;margin:1.5rem 0 0;display:grid;gap:1rem;position:relative}
.parcours::before{content:"";position:absolute;left:5px;top:8px;bottom:8px;width:1.5px;background:linear-gradient(180deg,var(--vert-c),rgba(155,106,72,.3))}
.parcours li{position:relative;padding-left:1.7rem;display:flex;flex-direction:column}
.pt{position:absolute;left:0;top:.42em;width:12px;height:12px;border-radius:50%;background:var(--vert);box-shadow:0 0 0 4px rgba(59,107,87,.16)}
.parcours b{font-weight:600;line-height:1.3}
.parcours small{font-size:.83rem;color:var(--encre-2)}

/* ------------------------------- bandeau ------------------------------- */
.bandeau{position:relative;min-height:clamp(300px,42vw,460px);display:grid;place-items:center;overflow:hidden}
.bandeau-img{position:absolute;inset:0}
.bandeau-img img{width:100%;height:100%;object-fit:cover}
.bandeau-voile{position:absolute;inset:0;background:linear-gradient(180deg,rgba(38,71,58,.58),rgba(42,35,24,.72))}
.bandeau-mot{position:relative;z-index:2;color:var(--creme);font-size:clamp(1.9rem,5.2vw,3.6rem);text-align:center;padding:0 1.2rem;
  text-shadow:0 2px 24px rgba(0,0,0,.55)}

/* ------------------------- section à fond photo ------------------------- */
.sec-fond{color:var(--creme);background-color:var(--vert-f)}
.sec-fond-img{position:absolute;inset:0;z-index:0}
.sec-fond-img img{width:100%;height:100%;object-fit:cover}
.sec-fond::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(38,71,58,.92),rgba(42,35,24,.94))}
.sec-fond .chapo,.sec-fond p{color:rgba(247,241,230,.92)}
.sec-fond h2 .script{color:var(--sauge)}
.elements{list-style:none;padding:0;margin:0 auto;max-width:900px;display:grid;grid-template-columns:repeat(5,1fr);gap:.9rem;text-align:center}
.elements li{display:flex;flex-direction:column;align-items:center;gap:.35rem;padding:1.1rem .5rem;border-radius:var(--r-s);
  background:rgba(247,241,230,.06);border:1px solid rgba(203,220,201,.2);transition:transform .45s var(--e),background .35s}
.elements li:hover{transform:translateY(-6px);background:rgba(247,241,230,.12)}
.el-rond{width:38px;height:38px;border-radius:50%;border:1.5px solid var(--or-clair);position:relative;display:grid;place-items:center}
.el-rond svg{width:22px;height:22px;overflow:visible;animation:respire 5s ease-in-out infinite}
.el-t{fill:none;stroke:var(--or-clair);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;opacity:.92}
.el-f{fill:var(--or-clair);stroke:none;opacity:.8}
.elements li:nth-child(2) .el-rond svg{animation-delay:-1s}
.elements li:nth-child(3) .el-rond svg{animation-delay:-2s}
.elements li:nth-child(4) .el-rond svg{animation-delay:-3s}
.elements li:nth-child(5) .el-rond svg{animation-delay:-4s}
.elements b{font-family:"Fraunces",serif;font-size:1.12rem;font-weight:560}
.elements small{font-size:.76rem;color:rgba(247,241,230,.86);line-height:1.35}
.ayur-fin{text-align:center;font-size:clamp(1.5rem,3.4vw,2.3rem);color:var(--sauge)!important;margin:2.2rem 0 0}

/* ------------------------------- galerie ------------------------------- */
.galerie{margin-top:clamp(1.4rem,3vw,2.4rem);display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:.55rem;
  padding:0 clamp(10px,2vw,22px)}
.g-i{margin:0;overflow:hidden;border-radius:var(--r-s);cursor:zoom-in;position:relative;background:var(--sable)}
.g-i img{width:100%;aspect-ratio:1;object-fit:cover;transition:transform .8s var(--e),filter .5s}
.g-i::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(42,35,24,.45));opacity:0;transition:opacity .4s}
.g-i:hover img{transform:scale(1.09)}
.g-i:hover::after{opacity:1}
.g-i:nth-child(4n+1){border-radius:var(--r-s) var(--r-s) 46px var(--r-s)}
.g-i:nth-child(6n+3){border-radius:46px var(--r-s) var(--r-s) var(--r-s)}

/* ------------------------------- demande ------------------------------- */
.demande{display:grid;grid-template-columns:1.42fr .58fr;gap:clamp(1.4rem,3.2vw,2.6rem);align-items:start}
.dem-col{min-width:0}
.pas{list-style:none;margin:0 0 1.6rem;padding:0;display:flex;gap:.4rem;flex-wrap:wrap}
.pas li{display:flex;align-items:center;gap:.4rem;font-size:.76rem;color:rgba(247,241,230,.78);transition:color .3s}
.pas li b{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:.72rem;font-weight:600;
  border:1px solid rgba(203,220,201,.32);transition:background .3s,color .3s,border-color .3s}
.pas li+li::before{content:"";width:14px;height:1px;background:rgba(203,220,201,.28);display:block;margin-right:.1rem}
.pas li.on{color:var(--creme)}
.pas li.on b{background:var(--or);color:var(--vert-f);border-color:var(--or)}
.pas li.fait b{background:var(--vert-c);color:var(--vert-f);border-color:var(--vert-c)}

.etape{border:0;margin:0;padding:0;display:none}
.etape.on{display:block;animation:monte .5s var(--e)}
@keyframes monte{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.etape legend{font-family:"Fraunces",serif;font-size:clamp(1.35rem,2.8vw,1.9rem);color:var(--creme);margin-bottom:1.1rem;display:flex;align-items:baseline;gap:.6rem;padding:0}
.etape legend i{font-style:normal;font-family:"Outfit",sans-serif;font-size:.72rem;letter-spacing:.12em;color:var(--or-clair);
  border:1px solid rgba(201,162,74,.5);border-radius:999px;padding:.15rem .55rem}
.choix{display:grid;gap:.6rem}
.choix-4{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.choix-2{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.choix-3{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}
.ch{position:relative;display:block;cursor:pointer}
.ch input{position:absolute;opacity:0;width:0;height:0}
.ch-in{display:flex;flex-direction:column;gap:.15rem;padding:.95rem 1.1rem;border-radius:var(--r-s);
  background:rgba(247,241,230,.06);border:1.5px solid rgba(203,220,201,.22);transition:all .3s var(--e)}
.ch-in b{font-weight:600;color:var(--creme);font-size:.98rem}
.ch-in small{font-size:.79rem;color:rgba(247,241,230,.82)}
.ch:hover .ch-in{background:rgba(247,241,230,.1);border-color:rgba(203,220,201,.42);transform:translateY(-2px)}
.ch input:checked+.ch-in{background:rgba(201,162,74,.18);border-color:var(--or);box-shadow:0 0 0 1px var(--or)}
.ch input:focus-visible+.ch-in{outline:3px solid var(--sauge);outline-offset:2px}
.ch-min .ch-in{align-items:center;padding:.75rem .8rem}
.moments{margin-top:1rem}
.note-duree{font-size:.86rem;color:var(--sauge)!important;margin-top:.7rem}

.champs{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.champ{display:flex;flex-direction:column;gap:.3rem}
.champ-large{grid-column:1/-1}
.champ span{font-size:.8rem;color:rgba(247,241,230,.86);letter-spacing:.01em}
.champ input,.champ textarea{width:100%;padding:.72rem .9rem;border-radius:var(--r-s);border:1.5px solid rgba(203,220,201,.24);
  background:rgba(247,241,230,.07);color:var(--creme);font:inherit;font-size:.95rem;transition:border-color .3s,background .3s}
.champ input::placeholder,.champ textarea::placeholder{color:rgba(247,241,230,.36)}
.champ input:focus,.champ textarea:focus{outline:none;border-color:var(--or);background:rgba(247,241,230,.12)}
.champ-dom{margin-top:.8rem;max-width:340px}
.case{display:flex;gap:.6rem;align-items:flex-start;margin:1rem 0 .3rem;font-size:.85rem;color:rgba(247,241,230,.88);cursor:pointer}
.case input{margin-top:.25rem;accent-color:var(--or);width:17px;height:17px;flex:0 0 auto}
.pot-de-miel{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.nav-etape{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1.4rem}
.err{color:#F4C1A8;font-size:.85rem;margin:.7rem 0 0}
.dem-repli{margin-top:1.8rem;font-size:.88rem;color:rgba(247,241,230,.82)!important;border-top:1px solid rgba(203,220,201,.16);padding-top:1.1rem}
.dem-repli a{color:var(--sauge)}

/* calendrier */
.cal{background:rgba(247,241,230,.06);border:1px solid rgba(203,220,201,.2);border-radius:var(--r);padding:1rem;max-width:420px}
.cal-tete{display:flex;align-items:center;justify-content:space-between;margin-bottom:.7rem}
.cal-mois{font-family:"Fraunces",serif;font-size:1.1rem;color:var(--creme)!important;margin:0;text-transform:capitalize}
.cal-fl{width:34px;height:34px;border-radius:50%;border:1px solid rgba(203,220,201,.3);background:none;color:var(--sauge);
  font-size:1.2rem;line-height:1;cursor:pointer;transition:background .25s,border-color .25s}
.cal-fl:hover:not(:disabled){background:rgba(247,241,230,.12);border-color:var(--or)}
.cal-fl:disabled{opacity:.3;cursor:not-allowed}
.cal-jours,.cal-grille{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.cal-jours span{text-align:center;font-size:.7rem;letter-spacing:.06em;color:rgba(247,241,230,.8);padding-bottom:.3rem}
.cal-j{aspect-ratio:1;border:0;border-radius:10px;background:rgba(247,241,230,.05);color:var(--creme);font:inherit;font-size:.86rem;
  cursor:pointer;transition:background .22s,transform .22s var(--e),color .22s}
.cal-j:hover:not(:disabled){background:rgba(201,162,74,.3);transform:scale(1.08)}
.cal-j:disabled{opacity:.22;cursor:not-allowed;background:none}
.cal-j.pris{background:var(--or);color:var(--vert-f);font-weight:600;transform:scale(1.06)}
.cal-j.vide{background:none;cursor:default}
.cal-aide{font-size:.78rem;color:rgba(247,241,230,.8)!important;margin:.7rem 0 0}

/* récapitulatif */
.recap{position:sticky;top:96px;background:rgba(247,241,230,.08);border:1px solid rgba(201,162,74,.35);border-radius:var(--r);padding:1.3rem}
.recap-h{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--or-clair)!important;font-weight:500;margin:0 0 .9rem}
.recap dl{margin:0;display:grid;gap:.55rem}
.recap dl>div{display:flex;justify-content:space-between;gap:.7rem;font-size:.88rem;border-bottom:1px dashed rgba(203,220,201,.2);padding-bottom:.45rem}
.recap dt{color:rgba(247,241,230,.8)}
.recap dd{margin:0;text-align:right;font-weight:500;color:var(--creme)}
.recap-total{display:flex;justify-content:space-between;align-items:baseline;margin:1rem 0 .5rem}
.recap-total span{font-size:.8rem;color:rgba(247,241,230,.8)!important}
.recap-total b{font-family:"Fraunces",serif;font-size:1.9rem;color:var(--or-clair)}
.recap-note{font-size:.78rem;color:rgba(247,241,230,.8)!important;margin:0}

/* ------------------------------ instagram ------------------------------ */
.ig-tete{display:flex;align-items:flex-end;justify-content:space-between;gap:1.2rem;flex-wrap:wrap;margin-bottom:1.6rem}
.ig-mur{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.5rem}
.ig-mur a{display:block;overflow:hidden;border-radius:var(--r-s)}
.ig-mur img{width:100%;aspect-ratio:1;object-fit:cover;transition:transform .7s var(--e),filter .4s}
.ig-mur a:hover img{transform:scale(1.08)}

/* -------------------------------- pied -------------------------------- */
.pied{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(145deg,#1D342B 0%,var(--encre) 48%,#241D14 100%);color:rgba(247,241,230,.86);padding:clamp(3.4rem,7vw,5.4rem) 0 2rem}
.pied::before{content:"";position:absolute;z-index:-1;width:min(620px,72vw);aspect-ratio:1;left:-18%;top:-48%;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(127,161,137,.25),rgba(201,162,74,.07) 44%,transparent 70%)}
.pied::after{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;opacity:.25;background-image:radial-gradient(rgba(247,241,230,.18) .8px,transparent .8px);background-size:5px 5px}
.pied-h{display:grid;grid-template-columns:1.45fr 1fr 1fr 1fr;gap:clamp(1.4rem,3vw,2.8rem);align-items:start;padding-bottom:2.4rem;border-bottom:1px solid rgba(247,241,230,.16)}
.pied-marque{width:min(100%,310px);padding:1.15rem 1.2rem 1.25rem;border:1px solid rgba(232,206,142,.22);border-radius:28px;background:linear-gradient(145deg,rgba(255,253,249,.07),rgba(255,253,249,.025));box-shadow:0 28px 70px -48px rgba(0,0,0,.95)}
.pied-marque img{margin-bottom:0}
.medaillon{position:relative;width:clamp(148px,13vw,176px);height:clamp(148px,13vw,176px);border-radius:50%;overflow:hidden;margin-bottom:.9rem;
  background:radial-gradient(circle,#F7F1E6 0 54%,#0B0A07 55% 100%);box-shadow:0 0 0 1px rgba(201,162,74,.5),0 0 0 7px rgba(201,162,74,.06),0 26px 54px -30px rgba(0,0,0,.95)}
.med-v{position:absolute;z-index:2;inset:0;width:100%;height:100%;object-fit:cover;display:block;opacity:0;background:#08110E;transition:opacity .3s ease}
.med-v.est-prete{opacity:1}
.med-i{position:absolute;z-index:1;inset:7%;width:86%;height:86%;object-fit:contain;display:block}
@media (prefers-reduced-motion:reduce){
  .medaillon{background:var(--creme);box-shadow:0 0 0 1px rgba(201,162,74,.35)}
  .med-v{display:none}
  .med-i{display:block;position:absolute;inset:7%;width:86%;height:86%;margin:0}
}
.pied-marque .script{font-size:1.9rem;color:var(--creme);margin:0 0 .3rem}
.pied-q{font-size:.84rem;line-height:1.45;color:rgba(247,241,230,.8)}
.pied-bloc h3{font-family:"Outfit",sans-serif;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--or-clair);margin-bottom:.8rem;font-weight:500}
.pied-bloc p{margin:0 0 .5rem;font-size:.9rem;line-height:1.5}
.pied-bloc a{text-decoration:none;border-bottom:1px solid rgba(247,241,230,.22);transition:border-color .25s,color .25s}
.pied-bloc a:hover{color:var(--creme);border-color:var(--or)}
.pied-b{padding-top:1.4rem;font-size:.78rem;color:rgba(247,241,230,.76)}
.pied-b p{margin:0 0 .35rem}
.pied-avert{max-width:70ch;margin-top:.7rem!important;font-style:italic}
/* Signature FLY LAB — ajoutée le 27/08/2026 à la demande de Paul.
   Le bleu de la marque doit rester lisible sur le brun du pied (#2A2318) :
   #6FB8EA mesure 7,19:1, alors que le bleu encre habituel (#0270BA) tombe
   à 2,98:1 et serait illisible ici. */
.pied-signature{margin-top:.9rem!important}
.pied-signature a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(247,241,230,.22);
  transition:border-color .25s,color .25s}
.pied-signature a span{color:#6FB8EA}
.pied-signature a:hover{color:var(--creme);border-color:#6FB8EA}
.pied-signature a:focus-visible{outline:2px solid #6FB8EA;outline-offset:3px;border-radius:2px}

/* ---------------------------- barre mobile ---------------------------- */
.barre-mob{position:fixed;left:0;right:0;bottom:0;z-index:100;display:none;gap:.5rem;padding:.55rem .8rem calc(.55rem + env(safe-area-inset-bottom));
  background:rgba(247,241,230,.95);backdrop-filter:blur(12px);border-top:1px solid rgba(42,35,24,.12)}
.barre-mob .btn{flex:1}

/* ----------------------------- visionneuse ----------------------------- */
.boite{position:fixed;inset:0;z-index:250;background:rgba(30,25,17,.94);display:grid;place-items:center;padding:clamp(12px,4vw,44px)}
.boite-fig{margin:0;max-width:min(1100px,92vw);max-height:86vh;display:flex;flex-direction:column;gap:.7rem;align-items:center}
.boite-fig img{max-width:100%;max-height:78vh;width:auto;height:auto;border-radius:var(--r-s);box-shadow:0 40px 90px -40px #000}
.boite-fig figcaption{color:var(--sauge);font-size:.9rem;text-align:center}
.boite-x{position:absolute;top:14px;right:16px;width:46px;height:46px;border-radius:50%;border:1px solid rgba(203,220,201,.3);
  background:rgba(0,0,0,.35);color:var(--creme);font-size:1.7rem;line-height:1;cursor:pointer}
.boite-f{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;border:1px solid rgba(203,220,201,.3);
  background:rgba(0,0,0,.35);color:var(--creme);font-size:2rem;line-height:1;cursor:pointer}
.boite-p{left:12px}.boite-s{right:12px}
.boite-x:hover,.boite-f:hover{background:rgba(201,162,74,.35);border-color:var(--or)}

/* ------------------------------ animations ------------------------------ */
.js .rev{opacity:0;transform:translateY(26px)}
.js .mots .m{display:inline-block;opacity:0;transform:translateY(.5em) rotate(2deg)}

/* ------------------------------ responsive ------------------------------ */
@media (max-width:1080px){
  .nav{display:none}
  .tete-tel{display:none}
  .burger{display:flex}
  .tete-act{display:none}
  .hero-in{grid-template-columns:1fr;gap:2.2rem}
  .hero-seq{max-width:440px;margin:0 auto;width:100%}
  .seq-jauge{right:-10px}
  .demande{grid-template-columns:1fr}
  .recap{position:static}
  .pied-h{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  .logo-anime{margin-left:1.1rem}
  .etincelles{display:none}
  .o3{inset:-13%}
  .sur{flex-wrap:wrap;gap:.45rem}
  .sur i{display:none}
  .soin,.soin.obl-d{grid-template-columns:1fr}
  .soin.obl-d .soin-img{order:0}
  .duo,.duo-inv{grid-template-columns:1fr}
  .duo-inv .duo-txt{order:0}
  .cibles{grid-template-columns:1fr}
  .elements{grid-template-columns:repeat(2,1fr)}
  .elements li:last-child{grid-column:1/-1}
  .champs{grid-template-columns:1fr}
  .barre-mob{display:flex}
  body{padding-bottom:5.4rem}
  .pied-h{grid-template-columns:1fr}
  .lieu-pile,.marie-pile{min-height:0;display:grid;gap:.8rem}
  .pile{position:static;transform:none!important;width:100%!important;border-radius:var(--r)!important}
  .lieu-pile .p-3,.marie-pile .p-2,.marie-pile .p-3{max-width:230px;justify-self:center;border-radius:50%!important}
  .galerie{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
  .seq-cadre{border-radius:150px 150px 20px 20px}
  .boite-f{width:44px;height:44px}
}
@media (max-width:420px){
  .galerie{grid-template-columns:repeat(2,1fr)}
  .hero-faits{gap:1rem}
  .cibles-liste{grid-template-columns:repeat(3,1fr);gap:.5rem}
  .cibles-liste span{font-size:.74rem}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .banderole-piste{animation:none}
  .js .rev,.js .mots .m{opacity:1;transform:none}
}
@media print{
  .tete,.barre-mob,.menu-mob,.boite,.rideau,.hero-fleche,.banderole{display:none!important}
  body{background:#fff}
}

/* densité : on resserre la fin de page */
#instagram{padding-bottom:clamp(3rem,5vw,4rem)}
#domicile{padding-block:clamp(3.4rem,7vw,6rem)}

/* ===================== V5 — soins ciblés, déplacement, avis ===================== */

/* la zone du soin ciblé, repliée sous le choix du soin */
.sous-choix{margin-top:.85rem;padding:.9rem 1rem;border-radius:var(--r-s);
  background:rgba(247,241,230,.05);border:1px solid rgba(203,220,201,.2);
  animation:ouvre-doux .42s var(--e) both}
.sous-choix-h{margin:0 0 .55rem;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--or-clair)!important;font-weight:500}

/* le calcul du déplacement, sous la commune */
.km-info{margin-top:.7rem;max-width:420px;padding:.85rem 1rem;border-radius:var(--r-s);
  background:rgba(201,162,74,.11);border:1px solid rgba(201,162,74,.4);
  animation:ouvre-doux .42s var(--e) both}
.km-l{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin:0}
.km-l span{font-size:.86rem;color:var(--sauge)!important}
.km-l b{font-family:"Fraunces",serif;font-size:1.32rem;color:var(--creme)!important;white-space:nowrap}
.km-d{margin:.4rem 0 0;font-size:.78rem;color:rgba(247,241,230,.72)!important;line-height:1.45}

/* la ligne déplacement du récapitulatif */
.r-dep dd{color:var(--or-clair)!important}

@keyframes ouvre-doux{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .sous-choix,.km-info{animation:none}
}

@media (prefers-reduced-motion:reduce){.el-rond svg{animation:none}}

/* le bandeau d'avis — le CSS est prêt, le bloc HTML s'active dès que la fiche Google existe */
.avis-bande{display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap;
  padding:2.2rem clamp(1.4rem,4vw,2.6rem);border-radius:var(--r);
  background:linear-gradient(135deg,rgba(59,107,87,.09),rgba(201,162,74,.13));
  border:1px solid rgba(155,106,72,.22)}
.avis-txt{flex:1 1 320px}
.avis-txt .chapo{margin-bottom:0}


/* le logo animé du hero : même place que le SVG, fond transparent */
.logo-video{width:100%;height:auto;object-fit:contain;background:transparent;animation:none}

/* ============ LE BANDEAU-SCÈNE : la vidéo entière au centre, le décor autour ============ */
.bandeau-scene{position:relative;min-height:auto;padding:clamp(3rem,7vw,5.6rem) 0 clamp(3.2rem,7vw,5.6rem);
  display:grid;place-items:center;overflow:hidden;isolation:isolate;
  background:radial-gradient(120% 100% at 50% 0%,#2F5949 0%,#26473A 46%,#1D3A2F 100%)}

/* le décor : des masses de couleur qui dérivent, jamais de clignotement */
.bd-decor{position:absolute;inset:0;z-index:0;pointer-events:none}
.bd-forme{position:absolute;border-radius:50%;filter:blur(46px);opacity:.5}
.bd-forme.f1{width:30vw;height:30vw;left:-7vw;top:-6vw;background:radial-gradient(circle,rgba(201,162,74,.50),transparent 68%);animation:derive1 26s ease-in-out infinite}
.bd-forme.f2{width:24vw;height:24vw;right:-5vw;top:8%;background:radial-gradient(circle,rgba(227,179,145,.42),transparent 68%);animation:derive2 31s ease-in-out infinite}
.bd-forme.f3{width:27vw;height:27vw;left:2vw;bottom:-9vw;background:radial-gradient(circle,rgba(180,205,178,.34),transparent 68%);animation:derive3 36s ease-in-out infinite}
.bd-forme.f4{width:19vw;height:19vw;right:6vw;bottom:-4vw;background:radial-gradient(circle,rgba(201,162,74,.34),transparent 68%);animation:derive2 29s ease-in-out infinite reverse}
.bd-forme.f5{width:14vw;height:14vw;left:24%;top:-5vw;background:radial-gradient(circle,rgba(155,106,72,.34),transparent 68%);animation:derive1 33s ease-in-out infinite reverse}

/* deux filets d'or, comme sur la carte */
.bd-trait{position:absolute;height:1px;left:0;right:0;background:linear-gradient(90deg,transparent,rgba(201,162,74,.34),transparent)}
.bd-trait.t1{top:clamp(1.6rem,4vw,3rem);animation:filetPousse 9s ease-in-out infinite}
.bd-trait.t2{bottom:clamp(1.6rem,4vw,3rem);animation:filetPousse 9s ease-in-out infinite 1.4s}

/* une poussière lumineuse très discrète */
.bd-poussiere{position:absolute;inset:0;opacity:.5;
  background-image:radial-gradient(rgba(232,206,142,.5) 1px,transparent 1px);
  background-size:52px 52px;animation:poussiere 40s linear infinite}

@keyframes derive1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(3.4vw,2.6vw) scale(1.13)}}
@keyframes derive2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-2.8vw,3.2vw) scale(1.09)}}
@keyframes derive3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(2.2vw,-2.4vw) scale(1.16)}}
@keyframes filetPousse{0%,100%{opacity:.34;transform:scaleX(.9)}50%{opacity:.92;transform:scaleX(1)}}
@keyframes poussiere{to{background-position:52px 104px}}

/* la vidéo : entière, jamais rognée */
.bd-centre{position:relative;z-index:2;width:min(1120px,92vw);display:flex;flex-direction:column;
  align-items:center;gap:clamp(1.3rem,3vw,2.1rem)}
.bd-cadre{margin:0;width:100%;border-radius:clamp(16px,2.2vw,26px);overflow:hidden;
  background:#12241D;border:1px solid rgba(232,206,142,.30);
  box-shadow:0 40px 90px -38px rgba(0,0,0,.85),0 0 0 7px rgba(247,241,230,.05)}
.bandeau-video,.bandeau-photo{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;display:block;background:#12241D}
.bandeau-scene .bandeau-mot{position:relative;z-index:2;margin:0;text-align:center;
  color:var(--creme);font-size:clamp(1.5rem,3.4vw,2.7rem);text-shadow:0 2px 26px rgba(12,24,19,.7)}

@media (max-width:640px){ .bd-forme{filter:blur(32px)} }
@media (prefers-reduced-motion:reduce){
  .bd-forme,.bd-trait,.bd-poussiere{animation:none}
}

/* ================= LES CRÉNEAUX HORAIRES ================= */
.heures{margin-top:1rem;animation:ouvre-doux .42s var(--e) both}
.heures-h{margin:0 0 .6rem;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--or-clair)!important;font-weight:500}
.heures-liste{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:.5rem}
.creneau{appearance:none;border:1.5px solid rgba(203,220,201,.28);background:rgba(247,241,230,.06);
  color:var(--creme);border-radius:var(--r-s);padding:.7rem .4rem;font:inherit;font-size:.96rem;
  font-weight:600;cursor:pointer;transition:all .22s var(--e)}
.creneau:hover:not(:disabled){border-color:var(--or);background:rgba(201,162,74,.16);transform:translateY(-2px)}
.creneau.on{background:var(--or);border-color:var(--or);color:#2A2318}
.creneau:disabled{opacity:.3;cursor:not-allowed;text-decoration:line-through}
.heures-note{margin:.7rem 0 0;font-size:.78rem;color:rgba(247,241,230,.66)!important;line-height:1.5}
.heures-vide{grid-column:1/-1;margin:0;padding:.9rem 0;font-size:.9rem;color:var(--sauge)!important}
/* un jour sans place ne se clique pas */
.cal-grille .cal-j:disabled,.cal-grille button[disabled]{opacity:.26;cursor:not-allowed}

/* ===================== V6 — visuel, réservation et performance ===================== */

section[id]{scroll-margin-top:76px}

/* Le hero devient une composition éditoriale fixe : aucune boucle de carrousel. */
.hero-collage{position:relative;width:100%;min-height:clamp(470px,52vw,650px);isolation:isolate}
.hero-photo{position:absolute;margin:0;overflow:hidden;background:var(--sable);border:5px solid var(--blanc);
  box-shadow:0 34px 76px -42px rgba(42,35,24,.9)}
.hero-photo img{width:100%;height:100%;object-fit:cover}
.hero-photo-main{inset:1% 8% 4% 5%;border-radius:220px 220px 28px 28px;transform:rotate(1.2deg)}
.hero-photo-main img{object-position:50% 38%}
.hero-photo-rond{width:34%;aspect-ratio:1;right:0;bottom:0;border-radius:50%;z-index:3;transform:rotate(3deg)}
.hero-photo-carre{width:27%;aspect-ratio:1;left:0;top:3%;border-radius:24px 24px 58px 24px;z-index:3;transform:rotate(-4deg)}
.hero-collage-leg{position:absolute;z-index:4;right:7%;top:7%;margin:0;padding:.45rem .9rem;border-radius:999px;
  background:rgba(247,241,230,.9);color:var(--vert-f);font-size:clamp(1.1rem,2.2vw,1.55rem);box-shadow:0 12px 28px -20px rgba(42,35,24,.8)}

/* Réservation : une vraie scène horizontale plein écran, pas un rectangle vertical posé au milieu. */
.rdv-scene{position:relative;isolation:isolate;overflow:hidden;min-height:100svh;padding:clamp(5.4rem,8vw,7rem) clamp(1rem,3vw,3rem) clamp(2.2rem,4vw,3.5rem);
  color:var(--creme);background-color:#172F26;background-image:radial-gradient(90% 90% at 8% 14%,#3C6B58 0%,var(--vert-f) 46%,#172F26 100%)}
.rdv-halo{position:absolute;z-index:-1;width:48vw;height:48vw;left:-18vw;bottom:-20vw;border-radius:50%;
  background:radial-gradient(circle,rgba(201,162,74,.3),transparent 68%);filter:blur(26px)}
.rdv-layout{width:min(1500px,100%);min-height:calc(100svh - 8rem);margin:0 auto;display:grid;
  grid-template-columns:minmax(270px,.7fr) minmax(640px,1.55fr);gap:clamp(1.4rem,3vw,3.4rem);align-items:center}
.rdv-intro{max-width:430px;padding-block:1rem}
.rdv-intro .oeil{margin-bottom:.2rem;color:#FFF1C9}
.rdv-intro h2{font-size:clamp(2.25rem,4.2vw,4rem);margin-bottom:1rem}
.rdv-intro h2 .script{color:var(--sauge)}
.rdv-intro>p{color:rgba(247,241,230,.96);max-width:42ch}
.rdv-logo{width:clamp(112px,12vw,172px);height:auto;margin:.2rem 0 .5rem;animation:respire 8s ease-in-out infinite;animation-play-state:paused}
.rdv-prix{list-style:none;margin:1.5rem 0;padding:0;display:grid;gap:.55rem}
.rdv-prix li{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.72rem .9rem;border-radius:12px;
  background:rgba(247,241,230,.07);border:1px solid rgba(203,220,201,.2)}
.rdv-prix b{font-size:.86rem;font-weight:500;color:var(--creme)}
.rdv-prix span{font-family:"Fraunces",serif;font-size:1.2rem;color:var(--or-clair);white-space:nowrap}
.rdv-note{font-size:.78rem;line-height:1.5!important;margin-bottom:0!important}
.calendly-bloc{min-width:0;overflow:hidden;border-radius:24px;background:var(--creme-2);border:1px solid rgba(232,206,142,.44);
  box-shadow:0 40px 90px -44px rgba(0,0,0,.92)}
.calendly-entete{height:46px;padding:0 1.15rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;
  color:var(--vert-f);background:linear-gradient(90deg,#F5ECDD,#FBF7EF);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid rgba(59,107,87,.13)}
.calendly-cadre{display:block;width:100%;height:clamp(680px,calc(100svh - 132px),820px);border:0;background:var(--creme-2)}

/* Le portrait de Marie : vertical + rond + carré, avec trois scènes distinctes. */
.marie-collage{position:relative;width:100%;min-height:clamp(500px,50vw,650px);isolation:isolate}
.marie-photo{position:absolute;margin:0;overflow:hidden;border:5px solid var(--blanc);background:var(--sable);
  box-shadow:0 32px 70px -40px rgba(42,35,24,.9);transition:transform .35s var(--e)}
.marie-photo img{width:100%;height:100%;object-fit:cover}
.marie-photo-main{width:72%;height:92%;left:2%;top:0;border-radius:190px 190px 24px 24px;transform:rotate(-1.5deg)}
.marie-photo-main img{object-position:50% 30%}
.marie-photo-rond{width:38%;aspect-ratio:1;right:0;bottom:0;border-radius:50%;z-index:3;transform:rotate(3deg)}
.marie-photo-carre{width:31%;aspect-ratio:1;right:2%;top:3%;border-radius:20px 20px 52px 20px;z-index:2;transform:rotate(2deg)}
@media (hover:hover){.marie-collage:hover .marie-photo-main{transform:rotate(-.5deg) translateY(-5px)}.marie-collage:hover .marie-photo-rond{transform:rotate(1deg) translateY(-5px)}.marie-collage:hover .marie-photo-carre{transform:rotate(0) translateY(-5px)}}

/* Instagram prend la largeur et le poids visuel d'une vraie destination. */
.instagram-scene{position:relative;padding:clamp(4rem,8vw,7rem) clamp(1rem,4vw,3rem);overflow:hidden;color:var(--creme);
  background:linear-gradient(135deg,#172F26 0%,var(--vert-f) 48%,#3D5F50 100%)}
.instagram-scene::before{content:"";position:absolute;inset:auto -10vw -30vw auto;width:58vw;height:58vw;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(201,162,74,.26),transparent 66%)}
.ig-layout{position:relative;z-index:1;width:min(1380px,100%);margin:0 auto;display:grid;grid-template-columns:minmax(280px,.72fr) minmax(540px,1.28fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.ig-signature{max-width:440px}
.ig-signature h2{font-size:clamp(2.4rem,5vw,4.5rem);margin:-1rem 0 .9rem}
.ig-signature h2 .script{color:var(--or-clair)}
.ig-signature>p:not(.oeil){color:rgba(247,241,230,.84);max-width:38ch}
.ig-logo-lien{display:grid;place-items:center;width:clamp(190px,23vw,310px);aspect-ratio:1;margin:-.8rem 0 0;text-decoration:none}
.ig-logo{width:100%;height:auto;animation:respire 8s ease-in-out infinite;animation-play-state:paused;filter:drop-shadow(0 18px 30px rgba(0,0,0,.18))}
.ig-mur{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(90px,10vw,145px);gap:.7rem}
.ig-mur a{display:block;overflow:hidden;border-radius:18px;border:1px solid rgba(247,241,230,.14);background:#1A332A}
.ig-mur img{width:100%;height:100%;object-fit:cover;transition:transform .45s var(--e)}
.ig-mur a:nth-child(1){grid-column:span 2;grid-row:span 2;border-radius:90px 18px 18px 18px}
.ig-mur a:nth-child(2){grid-row:span 2}
.ig-mur a:nth-child(4){grid-column:span 2}
.ig-mur a:nth-child(6){grid-column:span 2;grid-row:span 2;border-radius:18px 18px 90px 18px}
@media (hover:hover){.ig-mur a:hover img{transform:scale(1.045)}}

/* Mouvement budgété : transform/opacité, une boucle par écran, coupée hors champ. */
.logo-anime .logo-img,.etincelles i,.rdv-logo,.ig-logo,.bd-forme,.bd-trait,.bd-poussiere,.el-rond svg,.hero-fleche span{animation-play-state:paused!important}
.logo-anime.motion-active .logo-img,.logo-anime.motion-active .etincelles i,.rdv-scene.motion-active .rdv-logo,
.instagram-scene.motion-active .ig-logo,.bandeau-scene.motion-active .bd-forme,.bandeau-scene.motion-active .bd-trait,
.bandeau-scene.motion-active .bd-poussiere,.sec-fond.motion-active .el-rond svg,.hero.motion-active .hero-fleche span{animation-play-state:running!important}
html[data-anim="1"] [data-revele]{opacity:0;transform:translateY(24px);transition:opacity .58s ease,transform .58s var(--e);transition-delay:calc(var(--i,0)*55ms)}
html[data-anim="1"] [data-revele].est-visible{opacity:1;transform:none}

.banderole-stable .banderole-piste{animation:none!important;width:100%;max-width:1240px;margin:0 auto;padding:0 16px;box-sizing:border-box;flex-wrap:wrap;justify-content:center;white-space:normal;row-gap:6px}
a.medaillon-lien{display:inline-grid;place-items:center;border-radius:50%;overflow:hidden;transition:transform .3s var(--e),box-shadow .3s ease}
a.medaillon-lien .med-i{display:block}
@media (hover:hover){a.medaillon-lien:hover{transform:translateY(-3px) scale(1.025);box-shadow:0 0 0 1px rgba(232,206,142,.72),0 30px 60px -28px rgba(0,0,0,.95)}}

@media (max-width:980px){
  .rdv-layout,.ig-layout{grid-template-columns:1fr}
  .rdv-intro,.ig-signature{max-width:680px;margin-inline:auto;text-align:center}
  .rdv-intro .oeil,.ig-signature .oeil{justify-content:center}
  .rdv-intro>p,.ig-signature>p:not(.oeil){margin-inline:auto}
  .rdv-logo,.ig-logo-lien{margin-inline:auto}
  .rdv-prix{max-width:620px;margin-inline:auto}
  .calendly-cadre{height:820px}
  .ig-mur{width:min(760px,100%);margin-inline:auto;grid-auto-rows:clamp(90px,18vw,145px)}
}
@media (max-width:760px){
  .hero-collage{min-height:510px;max-width:480px;margin-inline:auto}
  .hero-photo-main{inset:2% 7% 7% 4%}
  .marie-collage{min-height:520px;max-width:480px;margin-inline:auto}
  .rdv-scene{padding-inline:0;padding-bottom:0}
  .rdv-intro{padding-inline:1.1rem}
  .calendly-bloc{border-radius:22px 22px 0 0;border-inline:0}
  .calendly-cadre{height:1020px}
  .calendly-entete{padding-inline:.8rem;font-size:.64rem}
  .instagram-scene{padding-inline:1rem}
}
@media (max-width:480px){
  .hero-collage{min-height:430px}
  .hero-photo-rond{width:36%}.hero-photo-carre{width:29%}
  .marie-collage{min-height:450px}
  .marie-photo-main{width:75%}.marie-photo-rond{width:40%}.marie-photo-carre{width:33%}
  .ig-mur{grid-template-columns:repeat(2,1fr);grid-auto-rows:150px}
  .ig-mur a:nth-child(n){grid-column:span 1;grid-row:span 1;border-radius:16px}
  .ig-mur a:first-child,.ig-mur a:nth-child(6){grid-column:span 2;grid-row:span 2}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .logo-anime .logo-img,.rdv-logo,.ig-logo,.bd-forme,.bd-trait,.bd-poussiere,.el-rond svg,.hero-fleche span{animation:none!important}
  .logo-intro-video{display:none}
  html[data-anim="1"] [data-revele]{opacity:1;transform:none;transition:none}
}