/* Naturopathe · « Herbier » : végétal, planches botaniques.
   Papier, olive, mousse, terre ; Newsreader (italiques) et Figtree.
   Des images présentées comme des planches numérotées, un brin qui se dessine. */
:root{
  --papier:#F5F0E4; --papier-f:#EAE2CF; --olive:#48532F; --olive-f:#343C22; --mousse:#7F8D4F;
  --terre:#A95E37; --encre:#23261C; --gris:#5E6152; --filet:#D3C9B2;
  --titre:"Newsreader",Georgia,serif; --texte:"Figtree",system-ui,sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--papier);color:var(--encre);font:400 1.0625rem/1.7 var(--texte);overflow-x:hidden}
body.fige{overflow:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
a,button,summary,label{cursor:pointer}
input,textarea{cursor:text}
:focus-visible{outline:2px solid var(--terre);outline-offset:3px}
em{font-style:italic;color:var(--terre)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.demo{margin:0;padding:.45rem 1rem;background:var(--olive-f);color:var(--papier-f);font-size:.75rem;text-align:center}
#jauge{position:fixed;top:0;left:0;right:0;height:3px;background:var(--mousse);transform-origin:0 50%;transform:scaleX(0);z-index:60}

.enveloppe{width:min(1220px,100% - 2.5rem);margin-inline:auto}
.etroit{width:min(860px,100% - 2.5rem)}
.sect{padding-block:clamp(4.5rem,9vw,8rem)}
.sect--papier{background:var(--papier-f)}
.sect--olive{background:var(--olive);color:var(--papier)}

.etiquette{font:italic 400 1.05rem var(--titre);color:var(--mousse);margin:0 0 1rem;display:flex;align-items:center;gap:.8rem}
.etiquette::after{content:"";height:1px;width:3rem;background:currentColor;opacity:.6}
.sect--olive .etiquette{color:#C9D19F}
.titre-xl{font:300 clamp(2.7rem,6.4vw,5.6rem)/1.02 var(--titre);margin:0 0 1.6rem;letter-spacing:-.02em}
.titre{font:300 clamp(2.1rem,4.4vw,3.6rem)/1.08 var(--titre);margin:0 0 1.2rem;letter-spacing:-.015em;text-wrap:balance}
.titre--grand{font-size:clamp(2.4rem,5.4vw,4.6rem);max-width:15em}
.sect--olive .titre em{color:#E3B48F}
.chapo{font-size:clamp(1.05rem,1.4vw,1.18rem);color:var(--gris);max-width:33em;margin:0 0 2rem}
.intro{color:var(--gris);max-width:40em;margin:0}
.note{font-size:.92rem;color:var(--gris);margin-top:1.6rem}
.tete{margin-bottom:clamp(2.5rem,5vw,4rem)}
.tete--ligne{display:grid;gap:1.5rem;align-items:end}
@media (min-width:900px){.tete--ligne{grid-template-columns:1fr auto}}

/* Boutons */
.btn{display:inline-flex;align-items:center;gap:.7rem;padding:1rem 1.7rem;background:var(--olive);color:var(--papier);text-decoration:none;font:600 .95rem var(--texte);border:0;border-radius:2px;position:relative;overflow:hidden;isolation:isolate;transition:color .4s}
.btn::before{content:"";position:absolute;inset:0;background:var(--terre);transform:translateY(101%);transition:transform .5s var(--ease);z-index:-1}
.btn:hover::before{transform:none}
.btn .fl{transition:transform .4s var(--ease)}
.btn:hover .fl{transform:translateX(5px)}
.btn--petit{padding:.65rem 1.1rem;font-size:.85rem}
.lien{font:italic 400 1.15rem var(--titre);text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;padding-bottom:2px;transition:background-size .5s var(--ease)}
.lien:hover{background-size:0 1px;background-position:100% 100%}
.actions{display:flex;flex-wrap:wrap;gap:1.4rem;align-items:center}

/* En-tête */
.entete{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:1.5rem;padding:1rem clamp(1.25rem,4vw,3rem);background:var(--papier);border-bottom:1px solid transparent;transition:border-color .4s,padding .4s}
.entete.serre{border-color:var(--filet);padding-block:.6rem}
.marque{display:flex;align-items:center;gap:.6rem;text-decoration:none;font:400 1.5rem var(--titre);margin-right:auto}
.marque__brin{width:30px;height:30px;fill:none;stroke:var(--mousse);stroke-width:1.6;stroke-linecap:round}
.menu{display:none;list-style:none;margin:0;padding:0;gap:1.8rem}
.menu a{text-decoration:none;font-size:.92rem;transition:color .3s}
.menu a:hover{color:var(--terre)}
.entete .btn--petit{display:none}
.burger{width:44px;height:44px;border:0;background:none;display:grid;place-content:center;gap:6px;padding:0}
.burger i{display:block;width:24px;height:1.5px;background:var(--encre);transition:transform .35s,opacity .35s}
.burger[aria-expanded="true"] i:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.burger[aria-expanded="true"] i:nth-child(2){opacity:0}
.burger[aria-expanded="true"] i:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
.tiroir{position:fixed;inset:0;z-index:45;background:var(--olive);color:var(--papier);display:flex;flex-direction:column;justify-content:center;gap:.8rem;padding:2rem;transform:translateY(-100%);transition:transform .6s var(--ease);visibility:hidden}
.tiroir.ouvert{transform:none;visibility:visible}
.tiroir a{font:300 2.2rem var(--titre);text-decoration:none}
.tiroir.ouvert ~ * .burger i,.burger[aria-expanded="true"] i{background:var(--encre)}
@media (min-width:1180px){.menu{display:flex}.entete .btn--petit{display:inline-flex}.burger,.tiroir{display:none}}

/* Premier écran */
.une{display:grid;gap:3rem;padding-block:clamp(2.5rem,6vw,5rem) clamp(4rem,8vw,6rem);align-items:center}
@media (min-width:960px){.une{grid-template-columns:1fr 1.05fr;gap:4.5rem}}

/* Planches : image cadrée d’un filet, légende numérotée */
.planche{margin:0;position:relative}
.planche__img{overflow:hidden;border:1px solid var(--filet);padding:10px;background:#FBF8F1}
.planche__img img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease)}
.planche:hover .planche__img img{transform:scale(1.04)}
.planche figcaption{display:flex;gap:.8rem;align-items:baseline;font:italic 400 .98rem var(--titre);color:var(--gris);padding-top:.7rem;border-bottom:1px solid var(--filet);padding-bottom:.6rem}
.planche figcaption span{font:600 .72rem var(--texte);letter-spacing:.14em;text-transform:uppercase;color:var(--mousse);font-style:normal}
.planche--une .planche__img{aspect-ratio:5/4}
.planche--une img{height:110%;margin-top:-5%}
.brin{position:absolute;width:clamp(70px,9vw,120px);right:-2%;top:-12%;fill:none;stroke:var(--mousse);stroke-width:1.3;stroke-linecap:round;overflow:visible}
.brin path{stroke-dasharray:1;stroke-dashoffset:0}
.anim .brin path{stroke-dashoffset:1;animation:dessine 2.4s var(--ease) .6s forwards}
.anim .brin .brin__f{animation-delay:1.3s}
@keyframes dessine{to{stroke-dashoffset:0}}

/* Ruban de légumes */
.ruban{overflow:hidden;border-block:1px solid var(--filet);padding-block:.9rem}
.ruban__piste{display:flex;width:max-content;margin:0;animation:ruban 50s linear infinite}
.ruban span{font:italic 300 clamp(1.4rem,2.4vw,2rem) var(--titre);padding-inline:1.4rem;display:flex;align-items:center;gap:2.8rem;white-space:nowrap}
.ruban span::after{content:"";width:8px;height:14px;border-radius:0 100% 0 100%;background:var(--mousse);opacity:.7}
@keyframes ruban{to{transform:translateX(-50%)}}

/* Piliers */
.piliers{list-style:none;margin:0;padding:0;display:grid;gap:0}
@media (min-width:860px){.piliers{grid-template-columns:repeat(3,1fr)}}
.piliers li{padding:2rem 0;border-top:1px solid var(--filet)}
@media (min-width:860px){.piliers li{padding:2rem 2rem 2rem 0;border-top:0;border-left:1px solid var(--filet);padding-left:2rem}.piliers li:first-child{border-left:0;padding-left:0}}
.piliers__n{font:italic 300 3.2rem/1 var(--titre);color:var(--terre)}
.piliers h3{font:400 1.8rem var(--titre);margin:.6rem 0 .5rem}
.piliers p{margin:0;color:var(--gris)}

/* La question du médecin */
.question{background:var(--encre);color:var(--papier);padding-block:clamp(4.5rem,10vw,8rem)}
.question__grille{display:grid;gap:1.5rem;align-items:end}
@media (min-width:900px){.question__grille{grid-template-columns:1.3fr .7fr;column-gap:4rem}.question__texte{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:3rem}}
.question__q{font:300 clamp(2rem,4.2vw,3.4rem)/1.1 var(--titre);margin:0}
.question__r{font:italic 300 clamp(6rem,18vw,15rem)/.8 var(--titre);color:#E3B48F;margin:0;text-align:right}
.question__texte p{margin:0 0 1rem;color:#D8D2C0}

/* Saisons */
.saisons__onglets{display:flex;flex-wrap:wrap;gap:.4rem}
.saisons__onglets button{border:1px solid var(--filet);background:transparent;padding:.6rem 1.1rem;font:400 1.1rem var(--titre);color:var(--encre);border-radius:999px;transition:background .35s,color .35s,border-color .35s}
.saisons__onglets button:hover{border-color:var(--olive)}
.saisons__onglets button[aria-selected="true"]{background:var(--olive);color:var(--papier);border-color:var(--olive)}
.saison{display:grid;gap:2.5rem;align-items:center;animation:feuille .8s var(--ease)}
@media (min-width:900px){.saison{grid-template-columns:.85fr 1fr;gap:5rem}}
@keyframes feuille{from{opacity:0;transform:translateX(18px)}}
.saison .planche__img{aspect-ratio:4/5}
.saison h3{font:300 clamp(3rem,7vw,6rem)/1 var(--titre);margin:0 0 1.2rem;color:var(--olive)}
.saison__liste{font:italic 400 1.45rem/1.4 var(--titre);margin:0 0 1.2rem}
.saison__texte p:last-child{color:var(--gris)}

/* Premier rendez-vous */
.rdv-type{display:grid;gap:3.5rem;align-items:start}
@media (min-width:960px){.rdv-type{grid-template-columns:1fr 1fr;gap:5rem}}
.etapes{list-style:none;margin:2rem 0 0;padding:0;counter-reset:e}
.etapes li{counter-increment:e;position:relative;padding:1.4rem 0 1.4rem 4rem;border-top:1px solid var(--filet)}
.etapes li::before{content:counter(e);position:absolute;left:0;top:1.1rem;font:italic 300 2.6rem/1 var(--titre);color:var(--terre)}
.etapes h3{font:400 1.5rem var(--titre);margin:0 0 .4rem}
.etapes p{margin:0 0 .5rem;color:var(--gris)}
.etapes__duree{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--mousse)}
.rdv-type__images{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;align-items:start}
.rdv-type__images .planche:first-child{grid-column:1/-1}
.planche--decalee{margin-top:2rem}
.rdv-type__images .planche--decalee{grid-column:2;margin-top:-1rem}
.rdv-type__images .planche--decalee .planche__img{aspect-ratio:4/5}

/* Bandeau */
.bandeau{position:relative;height:clamp(340px,60vw,640px);overflow:hidden;display:grid;place-items:end start}
.bandeau img{position:absolute;inset:-10% 0;width:100%;height:120%;object-fit:cover}
.bandeau::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(35,38,28,.65),transparent 55%)}
.bandeau__texte{position:relative;z-index:1;color:var(--papier);font:300 clamp(1.8rem,4vw,3.2rem)/1.1 var(--titre);margin:0;padding:clamp(1.5rem,5vw,4rem)}
.bandeau__texte em{color:#E9C6A6}

.duo{display:grid;gap:2rem}
@media (min-width:760px){.duo{grid-template-columns:1fr 1fr;gap:3rem}}
.duo .planche__img{aspect-ratio:4/5}
@media (min-width:760px){.duo .planche--decalee{margin-top:6rem}}

/* Tarifs */
.tarifs{width:100%;border-collapse:collapse}
.tarifs th,.tarifs td{text-align:left;padding:1.1rem .5rem;border-bottom:1px solid var(--filet);vertical-align:top}
.tarifs thead th{font:600 .75rem var(--texte);letter-spacing:.12em;text-transform:uppercase;color:var(--mousse)}
.tarifs tbody th{font:400 1.2rem/1.35 var(--titre)}
.tarifs td{white-space:nowrap;color:var(--terre)}
@media (max-width:560px){.tarifs thead{display:none}.tarifs tr{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--filet);padding:.8rem 0}.tarifs th,.tarifs td{border:0;padding:.2rem 0}.tarifs tbody th{grid-column:1/-1}}

/* À propos */
.apropos__col{display:grid;gap:1rem;max-width:44em;margin-left:auto;margin-top:2rem}
@media (min-width:900px){.apropos__col{grid-template-columns:1fr 1fr;column-gap:3rem}.apropos__col .signature{grid-column:1/-1}}
.apropos__col p{margin:0;color:#E4E2CF}
.signature{font:italic 300 2.2rem var(--titre)!important;color:#E3B48F!important}

/* FAQ */
.faq details{border-top:1px solid var(--filet)}
.faq details:last-child{border-bottom:1px solid var(--filet)}
.faq summary{list-style:none;display:grid;grid-template-columns:3rem 1fr auto;gap:.5rem;align-items:baseline;padding:1.3rem 0;font:400 1.35rem/1.3 var(--titre)}
.faq summary::-webkit-details-marker{display:none}
.faq summary span{font:600 .75rem var(--texte);color:var(--mousse);letter-spacing:.1em}
.faq summary::after{content:"+";font:300 1.8rem/1 var(--titre);color:var(--terre);transition:transform .4s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details div{padding:0 0 1.4rem 3.5rem;color:var(--gris)}
.faq details p{margin:0}
.faq details[open] div{animation:feuille .6s var(--ease)}

/* Contact */
.contact{display:grid;gap:3rem}
@media (min-width:900px){.contact{grid-template-columns:.9fr 1.1fr;gap:5rem}}
.coord{margin:2rem 0 0}
.coord div{display:grid;grid-template-columns:7rem 1fr;gap:1rem;padding:.9rem 0;border-top:1px solid var(--filet)}
.coord dt{font:italic 400 1.05rem var(--titre);color:var(--mousse)}
.coord dd{margin:0}
.form{display:grid;gap:1.2rem;background:#FBF8F1;border:1px solid var(--filet);padding:clamp(1.5rem,4vw,2.5rem)}
.form__duo{display:grid;gap:1.2rem}
@media (min-width:600px){.form__duo{grid-template-columns:1fr 1fr}}
.form label{display:grid;gap:.35rem;font-size:.9rem}
.form input,.form textarea{font:inherit;color:var(--encre);background:transparent;border:0;border-bottom:1px solid var(--filet);padding:.6rem 0;width:100%;border-radius:0;transition:border-color .3s}
.form input:focus,.form textarea:focus{outline:none;border-color:var(--olive)}
.form__rgpd{font-size:.82rem;color:var(--gris);margin:0}
.form .btn{justify-self:start}
.form-msg{margin:0;background:var(--papier-f);padding:1rem 1.2rem;font-size:.92rem}

/* Pied */
.pied{background:var(--olive-f);color:var(--papier-f);padding-block:4rem 2rem;font-size:.9rem}
.pied__haut{display:grid;gap:.6rem;padding-bottom:2rem;border-bottom:1px solid rgba(234,226,207,.18)}
.pied__haut p{margin:0}
.pied__marque{font:300 2.6rem var(--titre);color:var(--papier)}
.pied__avert{color:#C8C4AE;max-width:40em;margin-top:.8rem!important}
.mentions{margin-top:1.2rem}
.mentions summary{font-weight:600;padding:.5rem 0}
.mentions div{display:grid;gap:.4rem;color:#C8C4AE;padding-bottom:1rem}
.mentions p{margin:0}
.pied__bas{font-size:.8rem;color:#A8A48E;margin:1rem 0 0}

/* Révélations */
.anim [data-r]{opacity:0;transform:translateY(24px);transition:opacity .9s var(--ease),transform 1s var(--ease);transition-delay:calc(var(--i,0) * 100ms)}
.anim [data-r].vu{opacity:1;transform:none}
.anim .planche[data-r] .planche__img{clip-path:inset(0 0 100% 0);transition:clip-path 1.3s var(--ease) .15s}
.anim .planche[data-r].vu .planche__img{clip-path:inset(0 0 0 0)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* Contenus enrichis (étude du 22/09/2026) : sujets, exemple de parcours */
.sujets{list-style:none;margin:0;padding:0;display:grid;gap:0;border-top:1px solid var(--filet)}
@media (min-width:640px){.sujets{grid-template-columns:1fr 1fr;column-gap:3rem}}
@media (min-width:980px){.sujets{grid-template-columns:repeat(3,1fr)}}
.sujets li{padding:1.5rem 0;border-bottom:1px solid var(--filet)}
.sujets h3{font:400 1.45rem/1.2 var(--titre);margin:0 0 .35rem}
.sujets p{margin:0;color:var(--gris);font-size:.97rem}
.apropos__col .apropos__exemple{font-size:.9rem;color:#C9D19F;border-left:1px solid rgba(201,209,159,.5);padding-left:1rem}
.menu a{white-space:nowrap}