/* Sublimessence by Delf — charte tirée de « couleurs SE.pdf »
   Rose = esthétique · Sauge = nutrition · jamais de bandeau bordeaux */
:root{
  --fond:#F4EFEA; --creme:#FBF8F5; --sable:#E6D3C3; --poudre:#E9CFCB;
  --rose:#C4878A; --rose-fonce:#96585F;
  --sauge-clair:#DDE3DA; --sauge:#A8B8A5; --sauge-moy:#7F927C; --sauge-fonce:#5F6F63;
  --titre:#5A463D; --texte:#4A3D37; --texte-doux:#6E574C; --trait:rgba(139,107,92,.28);
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:"Gowun Dodum","Segoe UI",system-ui,sans-serif;
  --r-arche:999px 999px 0 0;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fond);color:var(--texte);font-family:var(--sans);font-size:1.0625rem;line-height:1.75}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:500;color:var(--titre);line-height:1.12;margin:0}
h1{font-size:clamp(2.9rem,6.2vw,5.3rem);letter-spacing:-.01em}
h2{font-size:clamp(2.2rem,4vw,3.3rem)}
h3{font-size:1.75rem}
h1 em,h2 em{color:var(--rose-fonce);font-style:italic;font-weight:400}
p{margin:0 0 1.1em}
p:last-child{margin-bottom:0}
.wrap{width:min(1180px,100% - 48px);margin-inline:auto}
.wrap--etroit{width:min(780px,100% - 48px);margin-inline:auto}
.section{padding:clamp(72px,9vw,120px) 0}
.section--creme{background:var(--creme)}
.section--poudre{background:var(--poudre)}
.section__tete{max-width:680px;margin-bottom:clamp(40px,5vw,64px)}
.section__tete--centre{margin-inline:auto;text-align:center}
.section__tete p{margin-top:18px;color:var(--texte-doux)}
.kicker{font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--rose-fonce);margin:0 0 18px}
.lead{font-size:1.16rem;color:var(--texte-doux)}
.lotus{display:block;width:58px;height:40px;background:var(--rose);-webkit-mask:url(../img/lotus.png) center/contain no-repeat;mask:url(../img/lotus.png) center/contain no-repeat}
.section__tete--centre .lotus{margin:0 auto 20px}
.saut{white-space:nowrap}

/* Liens d'évitement */
.evitement{position:absolute;left:-9999px;top:0;background:var(--sauge-fonce);color:#fff;padding:12px 18px;z-index:100}
.evitement:focus{left:12px;top:12px}
:focus-visible{outline:2px solid var(--sauge-fonce);outline-offset:3px}

/* Boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:12px 28px;border-radius:999px;border:1px solid var(--sauge-fonce);background:var(--sauge-fonce);color:#fff;font-size:.98rem;text-decoration:none;text-align:center;transition:background .25s,color .25s,border-color .25s}
.btn:hover{background:var(--rose-fonce);border-color:var(--rose-fonce)}
.btn--ligne{background:transparent;color:var(--sauge-fonce)}
.btn--ligne:hover{background:var(--sauge-fonce);border-color:var(--sauge-fonce);color:#fff}
.btn--clair{background:var(--fond);border-color:var(--fond);color:var(--titre)}
.btn--clair:hover{background:var(--poudre);border-color:var(--poudre);color:var(--titre)}
.btn--contour-clair{background:transparent;border-color:rgba(255,255,255,.75);color:#fff}
.btn--contour-clair:hover{background:#fff;border-color:#fff;color:var(--titre)}
.btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}
.lien{color:var(--rose-fonce);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.lien:hover{color:var(--sauge-fonce)}

/* En-tête */
.entete{position:sticky;top:0;z-index:50;background:rgba(244,239,234,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--trait)}
.entete__in{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:84px}
.marque img{width:150px}
.nav{display:flex;align-items:center;gap:clamp(16px,2.2vw,30px)}
.nav a{font-size:.95rem;text-decoration:none;padding:6px 0;border-bottom:1px solid transparent;white-space:nowrap}
.nav a:hover,.nav a[aria-current="page"]{color:var(--rose-fonce);border-bottom-color:var(--rose)}
.entete .btn{min-height:44px;padding:8px 22px;font-size:.92rem;white-space:nowrap}
.burger{display:none;width:46px;height:46px;background:none;border:1px solid var(--trait);border-radius:50%;cursor:pointer;padding:0;align-items:center;justify-content:center;flex-direction:column;gap:5px}
.burger span{display:block;width:18px;height:1px;background:var(--titre);transition:transform .25s,opacity .25s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.menu-mobile{display:none;border-top:1px solid var(--trait);padding:12px 24px 24px}
.menu-mobile a:not(.btn){display:block;padding:12px 0;text-decoration:none;border-bottom:1px solid var(--trait)}
.menu-mobile .btn{width:100%;margin-top:18px}
.menu-mobile.ouvert{display:block}

/* Accueil */
.hero{padding:clamp(40px,6vw,76px) 0 clamp(64px,8vw,104px)}
.hero__grille{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(36px,6vw,88px);align-items:center}
.hero__art{position:relative;margin:0;max-width:490px;justify-self:end;width:100%}
.arche{border-radius:var(--r-arche);overflow:hidden;background:var(--sable)}
.arche img{width:100%;height:100%;object-fit:cover}
.hero__art .arche{aspect-ratio:4/5.25;outline:1px solid var(--rose);outline-offset:10px}
.hero__sceau{position:absolute;left:-46px;bottom:34px;width:136px;height:136px;padding:7px;background:var(--sauge-fonce);border-radius:50%}

.promesses{background:var(--creme);border-block:1px solid var(--trait)}
.promesses__grille{display:grid;grid-template-columns:repeat(4,1fr)}
.promesse{padding:38px 28px;border-left:1px solid var(--trait)}
.promesse:first-child{border-left:0;padding-left:0}
.promesse:last-child{padding-right:0}
.promesse h3{font-size:1.45rem;margin-bottom:10px}
.promesse p{font-size:.95rem;color:var(--texte-doux)}

.cartes{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(22px,3vw,40px)}
.carte{text-decoration:none;display:flex;flex-direction:column}
.carte .arche{aspect-ratio:4/5;margin-bottom:24px}
.carte .arche img{transition:transform .6s ease}
.carte:hover .arche img{transform:scale(1.04)}
.carte h3{margin-bottom:10px}
.carte p{color:var(--texte-doux);font-size:1rem}
.carte__lien{color:var(--rose-fonce);margin-top:auto;padding-top:8px;font-size:.95rem}

.nutri-bande{margin-top:clamp(40px,5vw,64px);background:var(--sauge-fonce);color:#fff;border-radius:28px;display:grid;grid-template-columns:1.4fr .8fr;align-items:center;overflow:hidden}
.nutri-bande__txt{padding:clamp(34px,5vw,62px)}
.nutri-bande h3{color:#fff;font-size:clamp(2rem,3.4vw,2.8rem);margin-bottom:14px}
.nutri-bande .kicker{color:var(--sauge-clair)}
.nutri-bande p{color:#F1F3EF}
.nutri-bande__img{background:var(--sauge-clair);height:100%;min-height:240px;display:flex;align-items:center;justify-content:center;padding:32px}
.nutri-bande__img img{mix-blend-mode:multiply;max-width:300px;width:100%}

.etapes{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,3vw,36px);counter-reset:etape}
.etape{border-top:1px solid var(--rose);padding-top:18px}
.etape__num{font-family:var(--serif);font-style:italic;font-size:2.4rem;color:var(--rose-fonce);line-height:1;display:block;margin-bottom:14px}
.etape h3{font-size:1.5rem;margin-bottom:8px}
.etape p{font-size:.97rem;color:var(--texte-doux)}

.duo{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(36px,7vw,100px);align-items:center}
.duo--inverse{grid-template-columns:1.15fr .85fr}
.duo__art .arche{aspect-ratio:4/5}
.citation{font-family:var(--serif);font-style:italic;font-size:clamp(1.55rem,2.5vw,2.05rem);line-height:1.3;color:var(--titre);margin:26px 0 8px}
.citation-auteur{color:var(--texte-doux);font-size:.94rem}

.communes{display:flex;flex-wrap:wrap;gap:10px;list-style:none;padding:0;margin:24px 0 0}
.communes li{padding:6px 16px;border:1px solid var(--trait);border-radius:999px;font-size:.92rem}

.cta{background:var(--sauge-fonce);color:#fff;text-align:center;padding:clamp(70px,9vw,110px) 0}
.cta img{width:128px;margin:0 auto 24px}
.cta h2{color:#fff}
.cta p{max-width:520px;margin:16px auto 0;color:#F1F3EF}
.cta .btns{justify-content:center}

/* Pages de soin */
.tete-page{padding:clamp(40px,6vw,76px) 0 clamp(60px,7vw,92px)}
.tete-page__grille{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(36px,6vw,84px);align-items:center}
.tete-page h1{font-size:clamp(2.7rem,5vw,4.3rem)}
.tete-page__art{max-width:420px;justify-self:end;width:100%}
.tete-page__art .arche{aspect-ratio:4/5;outline:1px solid var(--rose);outline-offset:10px}

.benefices{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(30px,4vw,48px) clamp(28px,4vw,56px)}
.benefice h3{font-size:1.5rem;margin-bottom:8px}
.benefice__num{display:block;font-family:var(--serif);font-style:italic;color:var(--rose-fonce);font-size:1.25rem;margin-bottom:6px}
.benefice p{color:var(--texte-doux);font-size:.98rem}

.encadre{background:var(--poudre);border-radius:22px;padding:30px 34px}
.encadre__titre{font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--rose-fonce);margin-bottom:10px}
.encadre p{color:var(--texte)}
.encadre--sauge{background:var(--sauge-clair)}
.encadre--sauge .encadre__titre{color:var(--sauge-fonce)}

.techniques{display:grid;gap:0}
.technique{display:grid;grid-template-columns:.75fr 1.5fr;gap:clamp(20px,5vw,72px);padding:clamp(32px,4vw,48px) 0;border-top:1px solid var(--trait)}
.technique:last-child{border-bottom:1px solid var(--trait)}
.technique .kicker{margin-bottom:8px}
.technique p{color:var(--texte-doux)}

.liste{list-style:none;margin:0;padding:0}
.liste li{position:relative;padding:12px 0 12px 30px;border-bottom:1px solid var(--trait)}
.liste li::before{content:"";position:absolute;left:0;top:23px;width:14px;height:1px;background:var(--rose-fonce)}

.bienfaits{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(20px,3vw,32px)}
.bienfait{background:var(--creme);border-radius:22px;padding:30px 32px}
.bienfait h3{font-size:1.55rem;margin-bottom:10px;color:var(--sauge-fonce)}
.bienfait ul{margin:0;padding-left:18px;color:var(--texte-doux)}

.page-nutrition h1 em,.page-nutrition h2 em,.page-nutrition .etape__num{color:var(--sauge-fonce)}
.page-nutrition .kicker{color:var(--sauge-fonce)}
.page-nutrition .etape{border-top-color:var(--sauge-moy)}
.page-nutrition .tete-page__art .arche{background:var(--sauge-clair);outline-color:var(--sauge-moy);display:flex;align-items:center;justify-content:center;padding:44px}
.page-nutrition .tete-page__art .arche img{height:auto;mix-blend-mode:multiply;object-fit:contain}

.faq{border-top:1px solid var(--trait)}
.faq details{border-bottom:1px solid var(--trait)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:20px;cursor:pointer;list-style:none;padding:20px 0;font-family:var(--serif);font-size:1.42rem;color:var(--titre)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--sans);font-size:1.4rem;color:var(--rose-fonce);flex:none}
.faq details[open] summary::after{content:"–"}
.faq details p{padding-bottom:22px;color:var(--texte-doux)}

.autres{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}

/* Contact */
.contact__grille{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,64px);align-items:start}
.planity{background:var(--sauge-fonce);color:#fff;border-radius:26px;padding:clamp(32px,4vw,52px)}
.planity h2{color:#fff;font-size:clamp(2rem,3vw,2.6rem);margin-bottom:14px}
.planity p{color:#F1F3EF}
.coordonnees{display:grid;gap:0;margin:0}
.coordonnees div{padding:20px 0;border-bottom:1px solid var(--trait)}
.coordonnees div:first-child{padding-top:0}
.coordonnees dt{font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--rose-fonce);margin-bottom:4px}
.coordonnees dd{margin:0}
.coordonnees a{text-underline-offset:4px;text-decoration-thickness:1px}
.coordonnees .fin{display:block;color:var(--texte-doux);font-size:.95rem;margin-top:2px}

/* Mentions */
.legal h2{font-size:1.75rem;margin:40px 0 10px}
.legal h2:first-child{margin-top:0}
.legal p{color:var(--texte-doux)}
.legal strong{color:var(--texte)}
.a-completer{background:#fbe9e6;border:1px dashed var(--rose-fonce);color:var(--rose-fonce);padding:1px 8px;border-radius:6px;font-size:.93em}

/* Pied de page */
.pied{background:#47544A;color:#F2F0EA;padding:60px 0 26px;font-size:.96rem}
.pied__grille{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px}
.pied img{width:190px;margin-bottom:18px}
.pied__titre{font-family:var(--serif);font-size:1.3rem;color:#fff;margin:0 0 12px}
.pied a{text-decoration:none}
.pied a:hover{text-decoration:underline;text-underline-offset:4px}
.pied ul{list-style:none;margin:0;padding:0}
.pied li{margin-bottom:7px}
.pied__bas{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;border-top:1px solid rgba(255,255,255,.22);margin-top:44px;padding-top:20px;font-size:.87rem;color:#E0D2C9}

/* Adaptation */
@media (max-width:1100px){
  .nav{display:none}
  .burger{display:inline-flex}
  .entete__droite{display:flex;align-items:center;gap:12px}
}
@media (max-width:900px){
  .hero__grille,.tete-page__grille,.duo,.duo--inverse,.contact__grille,.nutri-bande{grid-template-columns:1fr}
  .hero__art,.tete-page__art{justify-self:center;margin-inline:auto}
  .hero__art{max-width:400px}
  .tete-page__art{max-width:340px}
  .hero__sceau{left:-14px;width:112px;height:112px}
  .promesses__grille{grid-template-columns:repeat(2,1fr)}
  .promesse,.promesse:first-child,.promesse:last-child{padding:26px 20px;border-left:0}
  .promesse:nth-child(even){border-left:1px solid var(--trait)}
  .promesse:nth-child(n+3){border-top:1px solid var(--trait)}
  .cartes{grid-template-columns:1fr 1fr}
  .cartes .carte:nth-child(3){grid-column:1/-1;max-width:calc(50% - 12px);justify-self:center}
  .etapes{grid-template-columns:1fr 1fr}
  .benefices{grid-template-columns:1fr 1fr}
  .duo__art{max-width:400px;margin-inline:auto;width:100%}
  .duo--inverse .duo__art{order:-1}
  .pied__grille{grid-template-columns:1fr 1fr}
  .pied__grille>div:first-child{grid-column:1/-1}
  .technique{grid-template-columns:1fr}
}
@media (max-width:620px){
  body{font-size:1rem}
  .entete__in{min-height:72px}
  .marque img{width:124px}
  .entete .entete__rdv{display:none}
  .btns .btn{width:100%}
  .cartes,.etapes,.benefices,.bienfaits{grid-template-columns:1fr}
  .cartes .carte:nth-child(3){max-width:none}
  .promesses__grille{grid-template-columns:1fr}
  .promesse,.promesse:first-child,.promesse:last-child{padding-inline:0}
  .promesse:nth-child(even){border-left:0}
  .promesse:nth-child(n+2){border-top:1px solid var(--trait)}
  .pied__grille{grid-template-columns:1fr}
  .hero__sceau{left:-6px;bottom:22px;width:96px;height:96px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important}
}
