@font-face {
  font-family: 'Cormorant';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/cormorant-italic.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Cormorant';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/cormorant-italic.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Cormorant';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/cormorant-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Cormorant';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/cormorant-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Mulish';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/fonts/mulish-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Mulish';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/mulish-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Mulish';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/mulish-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Concept : un cocon. Crème et rose poudré, formes en arche, lotus au trait, rien d'anguleux. */
:root{
  --creme:#FBF6EE; --beige:#F2E8DA; --sable:#E6D8C5;
  --poudre:#F1DAD4; --poudre-clair:#F8E9E4; --rose:#D9AFA8; --rose-fonce:#96595A;
  --encre:#4B3B36; --encre-douce:#75625B; --blanc:#FFFDF9; --note:#A2507A;
  --titre:"Cormorant","Times New Roman",serif; --texte:"Mulish","Helvetica Neue",Arial,sans-serif;
  --g:clamp(20px,5vw,72px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--creme);color:var(--encre);font:400 18px/1.75 var(--texte);padding-bottom:72px}
h1,h2,h3{font-family:var(--titre);font-weight:400;line-height:1.1;text-wrap:balance;margin:0}
h2{font-size:clamp(2.3rem,5vw,3.6rem)}
h2 em,h1 em{font-style:italic;color:var(--rose-fonce)}
h3{font-size:2rem}
p{margin:0;max-width:60ch}
a{color:inherit}
:focus-visible{outline:2px solid var(--rose-fonce);outline-offset:3px}
.in{max-width:1160px;margin:auto;padding-inline:var(--g)}
.bloc{padding-block:clamp(70px,10vw,124px)}
.centre{text-align:center;display:grid;justify-items:center;gap:16px}
.pile{display:grid;gap:18px;align-content:start}
.sur{font-size:.84rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--rose-fonce)}

.btn{display:inline-block;padding:15px 30px;border-radius:999px;background:var(--rose-fonce);color:var(--blanc);text-decoration:none;font:600 1rem var(--texte);border:1.5px solid var(--rose-fonce);cursor:pointer;transition:background .3s,color .3s}
.btn:hover{background:var(--encre);border-color:var(--encre)}
.btn.vide{background:transparent;color:var(--rose-fonce)}
.btn.vide:hover{background:var(--poudre);color:var(--encre);border-color:var(--rose-fonce)}
.actions{display:flex;gap:12px;flex-wrap:wrap}

.note{display:inline-block;font:600 .72rem/1.35 var(--texte);color:var(--note);border:1px dashed var(--note);border-radius:6px;padding:3px 8px;background:var(--blanc)}
body.sans-notes .note{display:none}
#bascule{position:fixed;z-index:30;right:14px;top:14px;font:600 .76rem var(--texte);background:var(--blanc);color:var(--note);border:1px solid var(--note);border-radius:999px;padding:7px 13px;cursor:pointer}

nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:24px;flex-wrap:wrap}
.logo{font:italic 500 1.65rem var(--titre);text-decoration:none}
.liens{display:flex;gap:30px;flex-wrap:wrap;padding-right:150px}
.liens a{text-decoration:none;font-size:.97rem}
.liens a:hover{color:var(--rose-fonce)}

.hero{background:linear-gradient(180deg,var(--poudre-clair),var(--creme))}
.hero-g{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:40px 70px;align-items:center;padding-block:clamp(26px,5vw,60px) clamp(50px,8vw,90px)}
.hero h1{font-size:clamp(3rem,6.6vw,5.5rem);line-height:1.03}
.hero h1 em{display:block}
.lead{font-size:1.2rem;line-height:1.65;color:var(--encre-douce);max-width:40ch}
.preuves{display:flex;gap:8px 26px;flex-wrap:wrap;font-size:.95rem;color:var(--encre-douce)}
.etoile{color:var(--rose-fonce)}
.arche{aspect-ratio:4/5;border-radius:999px 999px 14px 14px;background:linear-gradient(170deg,var(--poudre),var(--beige) 75%);display:grid;place-items:center;padding:32px;position:relative;max-width:100%;text-align:center}
.arche::after{content:"";position:absolute;inset:12px;border:1px solid var(--blanc);border-radius:inherit;pointer-events:none}
.lotus{width:min(76%,290px);height:auto;overflow:visible}
.lotus path{fill:var(--rose);fill-opacity:.2;stroke:var(--rose-fonce);stroke-width:1}
.arche .note{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);width:max-content;max-width:80%;z-index:1}
.respire{transform-origin:150px 190px;animation:respire 7s ease-in-out infinite}
@keyframes respire{50%{transform:scale(1.045)}}
@media (prefers-reduced-motion:reduce){.respire{animation:none}html{scroll-behavior:auto}}

.soins{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:54px}
.soin{background:var(--blanc);border-radius:26px;padding:34px;display:grid;gap:14px;align-content:start}
.soin-tete{display:flex;justify-content:space-between;align-items:baseline;gap:14px;flex-wrap:wrap}
.sk{color:var(--encre-douce);font-size:.92rem}
.prix{font:500 1.7rem var(--titre);white-space:nowrap}
.duree{display:grid;gap:7px}
.duree b{font:italic 500 1.3rem var(--titre);color:var(--rose-fonce)}
.piste{height:7px;border-radius:7px;background:var(--beige);overflow:hidden}
.piste i{display:block;height:100%;border-radius:7px;background:linear-gradient(90deg,var(--poudre),var(--rose))}
.suite{font-weight:600;font-size:.96rem;color:var(--rose-fonce);text-underline-offset:4px}
.repere{margin-top:26px;color:var(--encre-douce);text-align:center;font-size:.98rem;justify-self:center}

.deroule{background:var(--poudre-clair)}
.etapes{list-style:none;margin:54px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px;counter-reset:e}
.etapes li{counter-increment:e;display:grid;gap:10px;justify-items:center;text-align:center;align-content:start}
.etapes li::before{content:counter(e);font:italic 400 2.2rem/76px var(--titre);width:76px;height:76px;border-radius:50%;background:var(--blanc);color:var(--rose-fonce);text-align:center}

blockquote{margin:0;font:italic 400 clamp(2.8rem,7vw,5rem)/1.08 var(--titre)}
cite{font:400 .98rem var(--texte);color:var(--encre-douce)}
.themes{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.themes li{background:var(--poudre-clair);padding:9px 20px;border-radius:999px;font-size:.98rem}

.guide{background:var(--beige)}
.choix{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:12px}
.choix button{font:400 1rem var(--texte);padding:12px 22px;border-radius:999px;background:var(--creme);color:var(--encre);border:1px solid var(--sable);cursor:pointer}
.choix button[aria-pressed=true]{background:var(--rose-fonce);border-color:var(--rose-fonce);color:var(--blanc)}
#reponse{font:italic 400 1.75rem/1.3 var(--titre);min-height:2.6em;max-width:30ch}

.cadeau-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,400px);gap:44px 80px;align-items:center}
.carte{background:linear-gradient(135deg,var(--poudre),var(--beige));padding:32px;border-radius:20px;aspect-ratio:1.6;display:flex;flex-direction:column;justify-content:space-between;transform:rotate(-2.5deg);box-shadow:0 22px 44px -26px var(--rose-fonce)}
.carte strong{font:italic 400 2.1rem/1.1 var(--titre)}
.carte span{font-size:.88rem}

.fab-z{background:var(--poudre-clair)}
.fab{display:grid;grid-template-columns:minmax(0,400px) minmax(0,1fr);gap:44px 80px;align-items:center}
.fab .arche{background:linear-gradient(170deg,var(--beige),var(--poudre))}

.venir-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px 72px}
dl{margin:26px 0 0;display:grid;gap:18px}
dt{font-size:.82rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--rose-fonce)}
dd{margin:2px 0 0}
form{display:grid;gap:16px;background:var(--blanc);padding:clamp(24px,4vw,42px);border-radius:26px}
label{display:grid;gap:5px;font-size:.96rem;font-weight:600}
input,select{font:400 1.02rem var(--texte);padding:13px 15px;border:1px solid var(--sable);border-radius:12px;background:var(--creme);color:var(--encre);width:100%}
#retour{font-size:.95rem;color:var(--encre-douce)}
#retour.erreur{padding:12px 16px;border:1px solid #C4615A;border-left-width:5px;border-radius:10px;background:#FCEBE8;color:#8A2B2B;font-weight:600}
#retour.erreur a{color:inherit;text-decoration:underline;white-space:nowrap}

.faq{max-width:780px;margin:auto}
details{border-top:1px solid var(--sable);padding-block:18px}
summary{font:500 1.5rem var(--titre);cursor:pointer}
details p{margin-top:8px}

footer{background:var(--beige);padding-block:42px;font-size:.94rem}
.pied{display:flex;justify-content:space-between;gap:20px 50px;flex-wrap:wrap}
.pied a{margin-right:18px}
.mobile{display:none;position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--creme);padding:10px 14px;gap:9px;border-top:1px solid var(--sable)}
.mobile .btn{flex:1;text-align:center;padding:11px}

.fil{font-size:.93rem;color:var(--encre-douce)}
.faits{display:flex;gap:12px 46px;flex-wrap:wrap}
.faits div{display:grid}
.faits span{font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;color:var(--rose-fonce);font-weight:600}
.faits strong{font:500 2.2rem/1.2 var(--titre)}
.colonnes{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:48px 80px}
.colonnes ul{padding-left:20px;margin:0;display:grid;gap:8px}
aside{background:var(--poudre-clair);border-radius:26px;padding:34px}

@media (max-width:860px){
  body{font-size:17px}
  .hero-g,.cadeau-g,.fab,.venir-g,.colonnes,.etapes,.soins{grid-template-columns:minmax(0,1fr)}
  .hero .arche{max-width:320px;justify-self:center;width:100%}
  .fab .arche{max-width:320px}
  .liens{display:none}
  .mobile{display:flex}
  .logo{padding-right:130px}
  .soin{padding:26px}
}

/* Ajouts site réel */
.liens{padding-right:0}
.liens a[aria-current]{color:var(--rose-fonce);font-weight:600}
.soin h3 a{text-decoration:none}
.soin h3 a:hover{color:var(--rose-fonce)}
.prose{max-width:760px;margin:auto;display:grid;gap:16px}
.prose h2{font-size:2rem;margin-top:18px}
.bande{background:var(--poudre-clair)}
.arche img,.photo-cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit}
@media (max-width:860px){.liens{display:flex;gap:6px 18px;width:100%;font-size:.92rem}.logo{padding-right:0}}

.soin img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:18px;background:var(--blanc)}
.faits{margin-block:2px}

.avis-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:26px;width:100%;text-align:left}
.avis-c{background:var(--poudre-clair);border-radius:22px;padding:26px;display:flex;flex-direction:column;gap:10px}
.avis-c p{flex:1}
.avis-n{font-weight:600;font-size:.92rem}
.avis-m{font-size:.9rem;color:var(--encre-douce);margin-top:8px}
@media (max-width:860px){.avis-g{grid-template-columns:minmax(0,1fr)}}

.repere-suite{font:italic 400 clamp(1.7rem,3.4vw,2.3rem)/1.2 var(--titre);color:var(--rose-fonce);text-align:center;margin:8px auto 0}

.carte-plan{display:block;width:100%;height:300px;border:0;border-radius:22px;margin-top:28px;background:var(--beige);filter:saturate(.55) sepia(.15)}

.bande .arche{max-width:400px;justify-self:end;width:100%}
@media (max-width:860px){.bande .arche{justify-self:center;max-width:320px}}

.fab .arche::after{display:none}

.formulaire-soin{max-width:640px;margin:auto}

.rdv{background:linear-gradient(135deg,var(--poudre-clair),var(--beige))}
.rdv-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,470px);gap:44px 80px;align-items:center}
.rdv-fab{display:flex;align-items:center;gap:18px;margin-top:10px}
.rdv-fab img{width:104px;height:104px;border-radius:50%;object-fit:cover;object-position:50% 25%;flex:none;border:4px solid var(--blanc)}
.rdv-fab strong{font:italic 500 1.5rem var(--titre)}
@media (max-width:860px){.rdv-g{grid-template-columns:minmax(0,1fr)}}

body{padding-bottom:0}
@media (max-width:860px){body{padding-bottom:64px}}

/* Carte cadeau */
.carte{position:relative;overflow:hidden;aspect-ratio:auto;min-height:280px;padding:30px 32px;gap:14px;border-radius:22px;color:var(--encre);background:radial-gradient(circle at 85% 12%,var(--blanc),transparent 42%),linear-gradient(140deg,var(--poudre) 0%,var(--poudre-clair) 52%,var(--sable) 100%);transform:rotate(-2.5deg);box-shadow:0 30px 50px -28px var(--rose-fonce),0 6px 16px -10px var(--rose-fonce);transition:transform .5s ease}
.carte:hover{transform:rotate(0deg) scale(1.02)}
.carte::before{content:"";position:absolute;inset:11px;border:1px solid var(--blanc);border-radius:14px;pointer-events:none}
.carte>*{position:relative}
.carte-filigrane{position:absolute;left:-46px;bottom:-34px;width:280px;height:auto;overflow:visible}
.carte-filigrane path{fill:var(--blanc);fill-opacity:.32;stroke:var(--rose);stroke-opacity:.45;stroke-width:1}
.carte-haut{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.carte .carte-sur{font-size:.76rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--rose-fonce);padding-top:6px}
.carte-sceau{width:88px;height:88px;flex:none}
.carte-sceau circle{fill:none;stroke:var(--rose-fonce);stroke-width:1}
.carte-sceau circle:first-of-type{fill:var(--blanc);fill-opacity:.55}
.carte-sceau text{font:600 8.6px var(--texte);fill:var(--rose-fonce)}
.carte-sceau path{fill:var(--rose);fill-opacity:.35;stroke:var(--rose-fonce);stroke-width:4}
.carte-sceau defs path{fill:none;stroke:none}
.carte-milieu{display:grid;gap:2px;margin-top:auto}
.carte-milieu em{font:italic 400 1.15rem var(--titre);color:var(--rose-fonce)}
.carte .carte-milieu strong{font:500 clamp(1.9rem,4vw,2.5rem)/1.05 var(--titre)}
.carte .carte-bas{font-size:.8rem;color:var(--encre-douce)}
@media (prefers-reduced-motion:reduce){.carte{transition:none}}
@media (max-width:860px){.carte{min-height:250px;padding:26px 26px}.carte-sceau{width:72px;height:72px}}

/* Carte cadeau : format d'une vraie carte, quelle que soit la largeur */
.cadeau-g:has(.carte){grid-template-columns:minmax(0,1fr) minmax(0,500px)}
.carte{aspect-ratio:1.6;min-height:0;width:100%;padding:28px 32px}
.carte .carte-milieu strong{font-size:clamp(1.55rem,2.9vw,2.3rem);line-height:1.1;white-space:nowrap}
.carte-sceau{width:82px;height:82px}
@media (max-width:860px){
  .cadeau-g:has(.carte){grid-template-columns:minmax(0,1fr)}
  .carte{padding:22px 24px;gap:8px}
  .carte::before{inset:9px}
  .carte-sceau{width:60px;height:60px}
  .carte-milieu em{font-size:1rem}
  .carte .carte-bas{font-size:.72rem}
  .carte-filigrane{width:210px}
}
