/* Layout: une page = un écran. Au centre, le fruit 3D (l'objet héros) devant un mot géant ; à gauche le titre ; à droite les infos qui défilent seules. Chaque page a sa teinte de fond accordée au fruit ; tout le reste (encre forêt, abricot) ne change pas. */
:root{
  --tint:#F4E1D2; --accent:#B8582E; --forest:#1E3328; --forest2:#163027; --apricot:#D9825A;
  --ink:#1E3328; --muted:#4F6157; --line:rgba(30,51,40,.18); --on-dark:#F3EFE6; --on-dark-muted:rgba(243,239,230,.74);
  --f-sans:"Inter Tight","Segoe UI",system-ui,sans-serif; --f-serif:"Instrument Serif",Georgia,serif;
  --ease:cubic-bezier(.23,1,.32,1); --ease-io:cubic-bezier(.77,0,.175,1);
  color-scheme:light;
}
*{box-sizing:border-box}
html{background-color:#F4E1D2;transition:background-color 1s var(--ease-io)}
body{color:var(--ink);font-family:var(--f-sans);font-size:17px;line-height:1.6;overflow-x:hidden;background:radial-gradient(55% 60% at 50% 48%,rgba(255,255,255,.55),rgba(255,255,255,0) 70%) fixed}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:inherit}
h1,h2,h3{margin:0;font-weight:400;text-wrap:balance}
p{margin:0}
a{color:inherit}
em{font-style:italic;font-family:var(--f-serif);color:var(--accent)}
:focus-visible{outline:2px solid var(--forest);outline-offset:3px;border-radius:6px}

/* le mot géant, derrière le fruit */
#word{position:fixed;inset:0;z-index:0;display:grid;place-items:center;pointer-events:none;overflow:hidden}
#word .w{font-family:var(--f-serif);font-size:min(21vw,44vh);line-height:1;color:rgba(30,51,40,.085);white-space:nowrap;letter-spacing:-.02em;will-change:transform}
#word .ch{display:inline-block;transform:translateY(60%);opacity:0;transition:transform 1s var(--ease),opacity .7s ease;transition-delay:calc(var(--i) * 40ms)}
#word.on .ch{transform:none;opacity:1}
#word.off .ch{transform:translateY(-40%);opacity:0;transition-duration:.45s,.35s;transition-delay:calc(var(--i) * 18ms)}
#fruit{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
main,header,footer{position:relative;z-index:1}
@media (max-width:900px){#word{place-items:start center;padding-top:calc(env(safe-area-inset-top,0px) + 17svh)}#word .w{font-size:24vw}}
header{transition:background-color .4s,box-shadow .4s}
header.solid{background:rgba(255,255,255,.6);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line)}

/* en-tête */
header{position:fixed;top:0;left:0;right:0;z-index:40;padding-top:env(safe-area-inset-top,0px)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;height:78px;padding-inline:max(28px,env(safe-area-inset-left,0px)) max(28px,env(safe-area-inset-right,0px))}
.logo{text-decoration:none;font-family:var(--f-serif);font-size:1.55rem;line-height:1;white-space:nowrap}
.logo span{color:var(--accent)}
.links{display:flex;gap:6px;padding:5px;border-radius:999px;background:rgba(255,255,255,.45);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.links a{text-decoration:none;font-size:.93rem;color:var(--muted);padding:8px 14px;border-radius:999px;transition:color .3s,background-color .4s}
.links a:hover{color:var(--ink)}
.links a[aria-current="page"]{color:var(--on-dark);background:var(--forest)}
.menu-btn{all:unset;display:none;cursor:pointer;width:44px;height:44px;border-radius:50%;place-items:center;background:var(--forest)}
.menu-btn span{display:block;width:18px;height:1.5px;background:var(--on-dark);box-shadow:0 6px 0 var(--on-dark),0 -6px 0 var(--on-dark)}
@media (max-width:1060px){.links{display:none}.menu-btn{display:grid}}
@media (max-width:520px){.nav .btn{display:none}}
.mmenu{position:fixed;inset:0;z-index:45;background:var(--forest);color:var(--on-dark);display:grid;align-content:center;padding:100px max(24px,env(safe-area-inset-left,0px)) 40px}
.mmenu a.l{font-family:var(--f-serif);font-size:clamp(2.2rem,10vw,3.2rem);line-height:1.15;text-decoration:none;padding:6px 0;border-bottom:1px solid rgba(243,239,230,.15);display:flex;justify-content:space-between;align-items:baseline}
.mmenu a.l small{font-family:var(--f-sans);font-size:.85rem;color:var(--on-dark-muted)}
.mmenu a.l[aria-current="page"]{color:var(--accent)}
.mmenu .close{all:unset;cursor:pointer;position:absolute;top:calc(env(safe-area-inset-top,0px) + 16px);right:max(20px,env(safe-area-inset-right,0px));width:44px;height:44px;display:grid;place-items:center;font-size:1.6rem}

.btn{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font:500 .98rem var(--f-sans);padding:14px 24px;border-radius:999px;background:var(--forest);color:var(--on-dark);position:relative;overflow:hidden;isolation:isolate;transition:transform 160ms var(--ease)}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--accent);transform:translateY(101%);transition:transform .45s var(--ease-io)}
.btn:active{transform:scale(.97)}
.btn.light{background:var(--accent);color:var(--forest)}
.btn.light::before{background:var(--on-dark)}
.btn.ghost{background:rgba(255,255,255,.5);color:var(--ink);backdrop-filter:blur(8px)}
.btn.ghost::before{background:var(--forest)}
.btn.sm{padding:10px 18px;font-size:.92rem}
@media (hover:hover) and (pointer:fine){.btn:hover::before{transform:none}.btn.ghost:hover{color:var(--on-dark)}}

/* la scène : une page = un écran */
.scene{position:relative;min-height:100svh;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:clamp(24px,3vw,48px);align-items:center;padding:120px max(28px,env(safe-area-inset-right,0px)) 48px max(28px,env(safe-area-inset-left,0px))}
.left{grid-column:1;align-self:center;display:grid;gap:24px;justify-items:start;max-width:620px}
.fanchor{grid-column:1;grid-row:1;aspect-ratio:1;width:min(210px,15vw);align-self:end;justify-self:end;margin-bottom:70px}
.scene > .left{grid-row:1}
.lead{font-size:clamp(1.05rem,1.3vw,1.2rem);line-height:1.6;color:var(--muted);max-width:46ch}
.method{display:flex;flex-wrap:wrap;gap:8px}
.method span{font-size:.88rem;padding:7px 14px;border-radius:999px;background:rgba(255,255,255,.55);box-shadow:inset 0 0 0 1px var(--line)}
.right{grid-column:2;grid-row:1;align-self:center;justify-self:stretch;width:100%;max-width:680px}
.kick{font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.kick b{font-weight:500;color:var(--accent);margin-right:10px}
h1{font-family:var(--f-sans);font-weight:500;font-size:clamp(2.8rem,5.2vw,5.4rem);line-height:1;letter-spacing:-.04em}
h1 em{letter-spacing:-.01em;font-size:1.08em}
h1 .mask{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
h1 .w{display:inline-block;transform:translateY(115%) rotate(5deg);transform-origin:0 100%;transition:transform 1s var(--ease);transition-delay:calc(.35s + var(--i) * 65ms)}
.on h1 .w{transform:none}
.rv{opacity:0;transform:translateY(14px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.on .rv{opacity:1;transform:none}
.on .rv.d1{transition-delay:.25s}.on .rv.d2{transition-delay:.8s}.on .rv.d3{transition-delay:.95s}
.next-pill{position:absolute;right:max(28px,env(safe-area-inset-right,0px));bottom:44px;display:inline-flex;align-items:center;gap:12px;text-decoration:none;font-size:.92rem;color:var(--muted)}
.next-pill b{font-weight:500;color:var(--ink)}
.next-pill i{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-style:normal;background:var(--forest);color:var(--on-dark);transition:transform .5s var(--ease)}
@media (hover:hover) and (pointer:fine){.next-pill:hover i{transform:translateX(5px)}}


/* accueil : la photo et la présentation dès l'arrivée */
.scene.home{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
.photo-col{grid-column:2;position:relative;justify-self:center;width:min(100%,400px)}
.scene.home .portrait{max-width:none;max-height:68svh;aspect-ratio:4/5;margin-inline:auto}
.on .portrait{clip-path:inset(0 0 0 0 round 220px 220px 24px 24px)}
.on .portrait img{transform:scale(1)}
.scene.home .fanchor{position:absolute;left:-46%;bottom:-2%;width:46%}

/* les infos qui se présentent seules */
.meter{display:flex;align-items:center;gap:12px;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.meter .count{font-variant-numeric:tabular-nums;color:var(--ink);min-width:3.6em}
.meter .bars{display:flex;gap:5px;flex:1;max-width:140px}
.meter .bars i{flex:1;height:2px;background:var(--line);position:relative;overflow:hidden}
.meter .bars i::after{content:"";position:absolute;inset:0;background:var(--accent);transform:scaleX(var(--f,0));transform-origin:left;transition:transform .4s}
.stage{position:relative;min-height:190px;margin-top:22px}
.st{position:absolute;left:0;right:0;top:0;display:grid;gap:12px;justify-items:start}
.st .n{font-family:var(--f-serif);font-size:1.15rem;color:var(--accent)}
.st h2{font-family:var(--f-serif);font-size:clamp(2.1rem,3vw,3rem);line-height:1}
.st p{color:var(--muted);max-width:36ch;font-size:1.05rem}
.st .price{font-family:var(--f-serif);font-size:clamp(3.4rem,5.4vw,4.8rem);line-height:.85;color:var(--ink)}
.st .price small{font-family:var(--f-sans);font-size:.88rem;color:var(--muted);margin-left:8px}
.st .mail{display:inline-flex;flex-wrap:wrap;gap:8px;align-items:center}
.st .mail span{font-weight:500;color:var(--ink);user-select:all;word-break:break-all}
.copy{all:unset;cursor:pointer;font-size:.82rem;padding:6px 13px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--ink)}
.copy:focus-visible{outline:2px solid var(--forest);outline-offset:2px}
.st > *{opacity:0;transform:translateY(22px);filter:blur(6px);transition:opacity .5s var(--ease),transform .7s var(--ease),filter .5s ease}
.st.past > *{transform:translateY(-22px)}
.st.active{z-index:1}
.st.active > *{opacity:1;transform:none;filter:none}
.st.active > :nth-child(2){transition-delay:.07s}.st.active > :nth-child(3){transition-delay:.14s}.st.active > :nth-child(4){transition-delay:.21s}
.list{list-style:none;margin:8px 0 0;padding:0;display:grid;border-top:1px solid var(--line)}
.list li{border-bottom:1px solid var(--line)}
.list button{all:unset;box-sizing:border-box;cursor:pointer;width:100%;display:grid;grid-template-columns:2em 1fr;gap:8px;align-items:baseline;padding:11px 0;position:relative;color:var(--muted);font-size:.96rem;transition:color .3s}
.list button b{font-weight:500;font-size:.76rem;font-variant-numeric:tabular-nums}
.list button::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left}
.list button[aria-current="true"]{color:var(--ink)}
.list button[aria-current="true"] b{color:var(--accent)}
.list button[aria-current="true"]::after{animation:fill var(--dur,5s) linear forwards}
.list.paused button[aria-current="true"]::after{animation-play-state:paused}
.list button:focus-visible{outline:2px solid var(--forest);outline-offset:2px}
@keyframes fill{to{transform:scaleX(1)}}
@media (hover:hover) and (pointer:fine){.list button:hover{color:var(--ink)}}

@media (max-width:900px){
  .scene,.scene.home{grid-template-columns:1fr;align-items:start;gap:26px;padding-top:calc(env(safe-area-inset-top,0px) + 96px);padding-bottom:110px}
  .fanchor{grid-column:1;grid-row:auto;order:-1;width:min(200px,48vw);justify-self:center;align-self:start;margin:0}
  .scene > .left,.right{grid-row:auto}
  .photo-col{grid-column:1;order:-1;width:min(250px,62vw)}
  .scene.home .fanchor{width:40%;left:-30%;bottom:-6%}
  .left,.right{grid-column:1;justify-self:start;max-width:none}
  .next-pill{left:max(20px,env(safe-area-inset-left,0px));right:auto;bottom:36px}
}

/* présentation (accueil) */
.about{background:var(--forest);color:var(--on-dark);padding:clamp(80px,11vw,140px) max(28px,env(safe-area-inset-right,0px)) clamp(80px,11vw,140px) max(28px,env(safe-area-inset-left,0px));position:relative;z-index:2}
.about .grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(30px,6vw,90px);align-items:center}
.about .grid > *{min-width:0}
.portrait{position:relative;aspect-ratio:4/5;width:100%;max-width:440px;border-radius:220px 220px 24px 24px;overflow:hidden;background:#2C4A3A;clip-path:inset(100% 0 0 0 round 220px 220px 24px 24px);transition:clip-path 1.4s var(--ease-io)}
.about.in .portrait{clip-path:inset(0 0 0 0 round 220px 220px 24px 24px)}
.portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;display:block;transform:scale(1.14);transition:transform 2s var(--ease)}
.about.in .portrait img{transform:scale(1)}
.about .k{font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.about h2{font-family:var(--f-serif);font-size:clamp(3rem,6.4vw,5.6rem);line-height:.95;margin-block:18px 26px}
.about h2 em{color:var(--accent)}
.about p{color:var(--on-dark-muted);font-size:1.12rem;max-width:46ch}
.about p + p{margin-top:14px}
.about .cta{margin-top:32px}
.about .up{opacity:0;transform:translateY(20px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.about.in .up{opacity:1;transform:none}
.about.in .up:nth-child(2){transition-delay:.1s}.about.in .up:nth-child(3){transition-delay:.2s}.about.in .up:nth-child(4){transition-delay:.3s}.about.in .up:nth-child(5){transition-delay:.4s}
@media (max-width:860px){.about .grid{grid-template-columns:1fr}.portrait{max-width:330px}}
footer{background:var(--forest2);color:var(--on-dark-muted);padding:22px max(28px,env(safe-area-inset-right,0px)) 22px max(28px,env(safe-area-inset-left,0px));font-size:.86rem;z-index:2;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

/* sortie de page */
.view.leaving .scene > *{opacity:0;transform:translateY(-14px);transition:opacity .35s ease,transform .45s var(--ease)}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01s!important;animation:none!important}}

/* infos : tout est visible, révélé ligne après ligne (même animation sur toutes les pages) */
.meter .count,.meter .bars{display:none}
.meter{font-size:.82rem;color:var(--accent);margin-bottom:6px}
.stage{display:grid;grid-template-columns:repeat(var(--cols,1),minmax(0,1fr));gap:0 34px;margin:0}
.st{position:relative!important;left:auto;right:auto;top:auto;z-index:auto;display:grid;gap:6px;align-content:start;padding:18px 0 20px;cursor:default}
.st::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--ink);opacity:.22;transform:scaleX(0);transform-origin:left;transition:transform 1s var(--ease-io);transition-delay:calc(.45s + var(--k) * 120ms)}
.on .st::before{transform:scaleX(1)}
.st .n{font-family:var(--f-sans);font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.st h2{font-family:var(--f-serif);font-size:clamp(1.7rem,2.3vw,2.3rem);line-height:1.02;transition:color .3s}
.st p{color:var(--muted);font-size:1.02rem;line-height:1.5;max-width:40ch}
.st .price{font-family:var(--f-serif);font-size:clamp(2.8rem,4vw,3.6rem);line-height:.9;color:var(--ink)}
.st > *{opacity:0;transform:translateY(16px);filter:blur(5px);transition:opacity .7s var(--ease),transform .8s var(--ease),filter .7s ease;transition-delay:calc(.6s + var(--k) * 120ms)}
.st > :nth-child(2){transition-delay:calc(.68s + var(--k) * 120ms)}
.st > :nth-child(3){transition-delay:calc(.76s + var(--k) * 120ms)}
.on .st > *{opacity:1;transform:none;filter:none}
@media (hover:hover) and (pointer:fine){.st:hover h2{color:var(--accent)}}
@media (max-width:900px){.stage{grid-template-columns:1fr}}
/* photo fondue dans la page */
.scene.home .portrait,.scene.home.on .portrait{clip-path:none;border-radius:0;background:none;-webkit-mask-image:radial-gradient(closest-side at 50% 44%,#000 58%,transparent 100%);mask-image:radial-gradient(closest-side at 50% 44%,#000 58%,transparent 100%);opacity:0;transform:scale(1.04);transition:opacity 1.4s var(--ease),transform 1.8s var(--ease)}
.scene.home.on .portrait{opacity:1;transform:none}
.scene.home .portrait img{filter:saturate(.9) sepia(.14) contrast(1.03);transform:none}
.scene.home .portrait::after{content:"";position:absolute;inset:0;background:#F4E1D2;mix-blend-mode:multiply;opacity:.45}


/* une phrase = une couleur, une police */
em{font-style:normal;font-family:inherit;color:inherit;font-size:inherit;letter-spacing:inherit}
h1 em{font-size:inherit;letter-spacing:inherit}
.st h2{font-family:var(--f-sans);font-weight:500;letter-spacing:-.025em;font-size:clamp(1.45rem,1.9vw,1.9rem);line-height:1.1}
.st .price{font-family:var(--f-sans);font-weight:500;letter-spacing:-.04em}
.kick b,.st .n,.meter{color:var(--accent);transition:color .8s ease}
/* carte de présentation */
.scene.home .card{margin:0;padding-bottom:16px!important;background:var(--forest);color:var(--on-dark);border-radius:32px;padding:16px 16px 22px;box-shadow:0 30px 60px -30px rgba(30,51,40,.45);opacity:0;transform:translateY(24px);transition:opacity 1s var(--ease) .3s,transform 1.1s var(--ease) .3s}
.scene.home.on .card{opacity:1;transform:none}
.scene.home .portrait,.scene.home.on .portrait{-webkit-mask-image:none;mask-image:none;opacity:1;transform:none;max-height:58svh;width:100%;border-radius:200px 200px 18px 18px;background:#2C4A3A;clip-path:inset(100% 0 0 0 round 200px 200px 18px 18px);transition:clip-path 1.4s var(--ease-io) .5s}
.scene.home.on .portrait{clip-path:inset(0 0 0 0 round 200px 200px 18px 18px)}
.scene.home .portrait img{filter:none;transform:scale(1.12);transition:transform 2s var(--ease) .5s}
.scene.home.on .portrait img{transform:scale(1)}
.scene.home .portrait::after{display:none}
.card figcaption{display:grid;gap:2px;padding:16px 6px 0}
.card figcaption b{font-weight:500;font-size:1.1rem}
.card figcaption span{font-size:.9rem;color:var(--on-dark-muted)}
.st .price small{letter-spacing:0;font-size:.9rem;font-weight:400}

/* fruit : grand, il déborde du coin bas-gauche (sauf accueil) */
.scene:not(.home) .fanchor{position:absolute;left:-6vw;bottom:-9vh;width:min(30vw,48vh);margin:0;grid-column:auto;grid-row:auto}
.scene:not(.home) .left{align-self:start;margin-top:5vh}
/* le mot de Hugo */
.note{display:flex;gap:14px;align-items:center;max-width:420px;margin-top:6px}

.note p{font-size:.98rem;line-height:1.45;color:var(--ink)}
.note p b{display:block;font-weight:500;font-size:.82rem;color:var(--accent);margin-top:4px}
/* révélation commune */
.it{opacity:0;transform:translateY(16px);filter:blur(5px);transition:opacity .7s var(--ease),transform .8s var(--ease),filter .7s ease;transition-delay:calc(.55s + var(--k) * 100ms)}
.on .it{opacity:1;transform:none;filter:none}
.sec-label{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin:0 0 14px}
/* consultations : deux choix + frise */
.formats{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:34px}
.fmt{background:rgba(255,255,255,.62);border-radius:22px;padding:22px;display:grid;gap:8px;align-content:start;box-shadow:0 18px 40px -28px rgba(30,51,40,.35)}
.fmt svg{width:30px;height:30px;fill:none;stroke:var(--accent);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;margin-bottom:6px}
.fmt h3{font-family:var(--f-sans);font-weight:500;font-size:1.5rem;letter-spacing:-.02em}
.fmt p{color:var(--muted)}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;position:relative}
.steps::before{content:"";position:absolute;left:18px;right:18px;top:17px;height:1.5px;background:var(--ink);opacity:.25;transform:scaleX(0);transform-origin:left;transition:transform 1.4s var(--ease-io) .9s}
.on .steps::before{transform:scaleX(1)}
.steps li{position:relative;display:grid;gap:10px;align-content:start}
.steps b{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--forest);color:var(--on-dark);font-weight:500;font-size:.95rem;box-shadow:0 0 0 5px var(--tint-solid,rgba(255,255,255,.0))}
.steps span{font-size:.98rem;line-height:1.35}
/* infos : prix + formulaire */
.prices{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.pcard{background:rgba(255,255,255,.62);border-radius:22px;padding:22px;display:grid;gap:6px;box-shadow:0 18px 40px -28px rgba(30,51,40,.35)}
.pcard .lbl{font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.pcard .amount{font-weight:500;font-size:clamp(2.8rem,4.2vw,3.8rem);letter-spacing:-.04em;line-height:1}
.pcard .red{font-size:.92rem;color:var(--muted)}
.fine{color:var(--muted);font-size:.95rem;margin:16px 0 26px;max-width:58ch}
.contact{display:grid;gap:12px}
.contact .sec-label{margin-bottom:2px}
.contact label{display:grid;gap:6px;font-size:.9rem;color:var(--muted)}
.contact input,.contact textarea{font:inherit;font-size:1rem;color:var(--ink);background:rgba(255,255,255,.7);border:1px solid var(--line);border-radius:14px;padding:12px 14px;resize:vertical;transition:border-color .3s,background-color .3s}
.contact input:focus,.contact textarea:focus{outline:none;border-color:var(--ink);background:#fff}
.send{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.contact .btn{border:0;cursor:pointer}
.status{font-size:.92rem;color:var(--ink)}
@media (max-width:900px){
  .scene:not(.home) .fanchor{position:static;width:min(200px,48vw);order:-1;justify-self:center}
  .scene:not(.home) .left{margin-top:0}
  .formats,.prices{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
  .steps::before{display:none}
}
/* carte photo crème */
.scene.home .card{background:#FBF8F3;color:var(--ink);box-shadow:0 30px 60px -32px rgba(30,51,40,.4)}
.scene.home .portrait{background:#E9E2D8}
.card figcaption span{color:var(--muted)}
@media (min-width:901px){[data-view="infos"] .scene .fanchor{bottom:0}}

/* signature */
.sign{display:flex;align-items:baseline;gap:12px;font-size:.85rem;color:var(--muted);margin-top:4px}
.sign span{font-family:"Mrs Saint Delafield",cursive;font-size:3.2rem;line-height:.6;color:var(--accent);transform:translateY(6px)}
/* mon approche : liste numérotée */
.principles{list-style:none;margin:0;padding:0;display:grid}
.principles li{display:grid;grid-template-columns:3.2rem 1fr;gap:16px;padding:18px 0;border-top:1px solid var(--line);align-items:baseline}
.principles li:last-child{border-bottom:1px solid var(--line)}
.principles b{font-weight:500;font-size:1rem;color:var(--accent);font-variant-numeric:tabular-nums}
.principles h3{font-family:var(--f-sans);font-weight:500;font-size:clamp(1.45rem,2vw,1.9rem);letter-spacing:-.025em;line-height:1.1;margin-bottom:6px}
.principles p{color:var(--muted);font-size:1.02rem}
/* tarifs : interrupteur */
.tariff{position:relative;display:inline-grid;grid-template-columns:1fr 1fr;padding:5px;border-radius:999px;background:rgba(255,255,255,.55);box-shadow:inset 0 0 0 1px var(--line);margin-bottom:16px}
.tariff button{all:unset;position:relative;z-index:1;cursor:pointer;text-align:center;padding:9px 18px;font-size:.92rem;border-radius:999px;color:var(--muted);transition:color .35s}
.tariff button[aria-pressed="true"]{color:var(--on-dark)}
.tariff button:focus-visible{outline:2px solid var(--forest);outline-offset:2px}
.tariff i{position:absolute;top:5px;bottom:5px;left:5px;width:calc(50% - 5px);border-radius:999px;background:var(--forest);transition:transform .45s var(--ease)}
.tariff.r i{transform:translateX(100%)}
.amount span{display:inline-block;transition:transform .35s var(--ease),opacity .25s}
.amount span.flip{transform:translateY(-35%);opacity:0}
/* carte photo : pêche chaud */
.scene.home .card{background:#EBC9B0;box-shadow:0 30px 60px -32px rgba(120,60,30,.35)}
.scene.home .portrait{background:#D9B39A}
.card figcaption span{color:#6A4A38}

/* carte de la zone de déplacement */
.formats{grid-template-columns:1.35fr 1fr}
.zone{width:100%;height:auto;margin-top:6px;overflow:visible}
.zone .ring{fill:var(--accent);fill-opacity:.07;stroke:var(--accent);stroke-width:1.5;stroke-dasharray:5 6}
.zone .ring{stroke-dashoffset:0}
.zone .town circle{fill:var(--ink);opacity:.55}
.zone .town text{font:500 10.5px var(--f-sans);fill:var(--muted)}
.zone .town{opacity:0;transition:opacity .6s ease;transition-delay:calc(1.2s + var(--k) * 60ms)}
.on .zone .town{opacity:1}
.zone .ringg{transform-origin:200px 130px;transform:scale(.2);opacity:0;transition:transform 1.4s var(--ease),opacity .8s ease;transition-delay:.9s}
.on .zone .ringg{transform:none;opacity:1}
.zone .pin circle.dot{fill:var(--accent)}
.zone .pin circle.pulse{fill:none;stroke:var(--accent);stroke-width:1.5;transform-origin:200px 130px;animation:pulse 2.4s ease-out infinite}
.zone .pin text{font:600 12px var(--f-sans);fill:var(--ink)}
.zone .km{font:500 10px var(--f-sans);fill:var(--accent);letter-spacing:.08em}
@keyframes pulse{from{transform:scale(.6);opacity:.9}to{transform:scale(3.2);opacity:0}}
@media (max-width:900px){.formats{grid-template-columns:1fr}}
.fmt svg.zone{width:100%;height:auto;margin:4px 0 0;stroke:none;fill:none;stroke-width:0}

.story{font-size:1.05rem;line-height:1.55;color:var(--muted);max-width:40ch;padding-left:16px;border-left:2px solid var(--accent)}
.aside{margin-top:18px;font-size:.95rem;color:var(--muted);max-width:60ch;padding:14px 16px;border-radius:14px;background:rgba(255,255,255,.45)}

/* photo : sans encadré, arche nette + trait décalé dans la couleur d'accent */
.scene.home .card{background:none!important;padding:0!important;box-shadow:none!important;border-radius:0;position:relative}
.scene.home .card::before{content:"";position:absolute;inset:0;transform:translate(16px,16px);border:1.5px solid var(--accent);border-radius:200px 200px 18px 18px;opacity:0;transition:opacity 1s ease 1.2s,transform 1.2s var(--ease) 1.2s}
.scene.home.on .card::before{opacity:.7}
.scene.home .portrait{box-shadow:0 30px 60px -30px rgba(30,51,40,.45);position:relative;z-index:1}

/* pages légales */
.legal{max-width:760px;margin:0 auto;padding:140px max(24px,env(safe-area-inset-right,0px)) 90px max(24px,env(safe-area-inset-left,0px))}
.legal h1{font-size:clamp(2.4rem,5vw,3.6rem);margin:10px 0 18px}
.legal h2{font-family:var(--f-sans);font-weight:500;font-size:1.15rem;margin:30px 0 8px}
.legal p{color:var(--muted);max-width:65ch}
.legal .todo{display:inline-block;margin-bottom:6px;padding:8px 14px;border-radius:12px;background:#FFF4D6;color:#6B5310;font-size:.92rem}
.legal .back{margin-top:40px}
.legal-on #word,.legal-on #fruit{opacity:0;transition:opacity .4s}
footer .flinks{display:flex;gap:18px}
footer a{color:inherit;text-decoration:none}footer a:hover{color:var(--on-dark)}
/* formulaire : consentement */
.consent{display:flex!important;grid-template-columns:none;gap:10px!important;align-items:flex-start;font-size:.86rem!important;line-height:1.45}
.consent input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--forest);flex:none}
.consent a{color:var(--ink)}
/* finitions */
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--forest);color:var(--on-dark);padding:10px 16px;border-radius:999px;text-decoration:none;transition:top .2s}
.skip:focus{top:12px}
::selection{background:var(--accent);color:#fff}
.btn:focus-visible,.links a:focus-visible{outline:2px solid var(--forest);outline-offset:3px}
.portrait,.scene.home.on .portrait{background:color-mix(in srgb,var(--accent) 14%,#FBF6F1)!important}.portrait .ph{position:absolute;inset:0}

/* typo : titres plus affirmés, paragraphes confortables */
h1{font-weight:600!important;letter-spacing:-.045em}
.lead{max-width:34rem;margin:18px 0 26px;font-size:clamp(1.05rem,1.25vw,1.2rem);line-height:1.55;color:var(--muted)}
.lead strong{display:block;font-weight:500;color:var(--ink,#1E3328);font-size:1.12em;margin-bottom:8px;letter-spacing:-.01em}
.principles li{grid-template-columns:5.2rem 1fr!important;align-items:start!important}
.principles b{font-size:clamp(2.6rem,3.6vw,3.6rem)!important;font-weight:600!important;line-height:.85;letter-spacing:-.05em;opacity:.9}
.principles p{max-width:60ch}
.principles h3{font-weight:600!important}
.panel-note{margin:18px 4px 0;max-width:58ch;color:var(--muted);font-size:1rem;line-height:1.55}
.steps span{line-height:1.4}
.fmt p{max-width:60ch}
/* À propos */
.scene.moi{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
.scene.moi .left{max-width:40rem}
.moi .who{margin:14px 0 18px;font-weight:600;letter-spacing:-.01em;color:var(--accent)}
.about-text{display:grid;gap:12px;max-width:60ch}
.about-text p{margin:0;font-size:clamp(1rem,1.1vw,1.1rem);line-height:1.6;color:var(--muted)}
.about-text em{font-style:italic;color:var(--ink,#1E3328)}
.name-col{grid-column:2;align-self:center;justify-self:center;display:grid;justify-items:start;line-height:.85}
.big-name{font-family:var(--f-sans);font-weight:600;font-size:clamp(5rem,13vw,13rem);letter-spacing:-.06em;color:var(--ink,#1E3328)}
.rot{position:relative;display:block;height:1.45em;padding-top:.15em;box-sizing:border-box;overflow:hidden;font-family:var(--f-serif,serif);font-style:italic;font-size:clamp(2.2rem,4.6vw,4.6rem);color:var(--accent);margin-top:.1em;min-width:6.5em}
.rot span{position:absolute;left:.06em;top:.18em;opacity:0;transform:translateY(100%);animation:rotw 7.5s var(--ease,cubic-bezier(.2,.7,.2,1)) infinite}
.rot span:nth-child(2){animation-delay:2.5s}.rot span:nth-child(3){animation-delay:5s}
@keyframes rotw{0%{opacity:0;transform:translateY(100%)}6%,30%{opacity:1;transform:none}36%,100%{opacity:0;transform:translateY(-100%)}}
@media (prefers-reduced-motion:reduce){.rot span{animation:none}.rot span:first-child{opacity:1;transform:none}}
@media (max-width:900px){.scene.moi{grid-template-columns:1fr}.name-col{grid-column:1;order:0;justify-self:start;margin:28px 0 40px}.big-name{font-size:clamp(4rem,22vw,6rem)}.rot{font-size:clamp(1.8rem,9vw,2.6rem)}}
@media (min-width:901px){[data-view="consultations"] .fmt svg.zone{max-height:180px!important}[data-view="consultations"] .steps span{font-size:.9rem}[data-view="consultations"] .scene{padding-bottom:84px;padding-top:104px}[data-view="consultations"] .fmt p{font-size:.98rem}}

/* fusion accueil + présentation */
#word .w{color:rgba(30,51,40,.06)!important}
.scene.moi{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)!important;grid-template-rows:auto auto;align-content:center;padding-top:clamp(70px,9vh,110px);row-gap:clamp(24px,4vh,44px)}
.scene.moi .left{grid-column:1;grid-row:1;max-width:40rem}
.scene.moi .name-col{grid-column:2;grid-row:1}
.moi-end{grid-column:1/-1;grid-row:2;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 32px;padding-top:clamp(18px,3vh,30px);border-top:1px solid var(--line)}
.motto{margin:0;font-family:var(--f-serif);font-style:italic;font-size:clamp(1.8rem,3.2vw,3rem);line-height:1.1;color:var(--ink);letter-spacing:-.01em}
.big-title{font-family:var(--f-sans);font-weight:600;font-size:clamp(2.3rem,4.2vw,4.3rem);line-height:1;letter-spacing:-.045em;margin:12px 0 26px;color:var(--ink)}
.big-title em{font-style:normal}
.about-text .intro{color:var(--ink);font-weight:500}
.echo{font-family:var(--f-serif);font-style:italic;font-size:clamp(2.4rem,5vw,5rem);line-height:1;color:var(--accent);margin-top:.12em;padding-left:.06em}
.rot.sm{font-size:clamp(1rem,1.3vw,1.25rem);color:var(--muted);opacity:.75;margin-top:.9em;min-width:9em}
.scene.moi.in .it{opacity:1;transform:none;filter:none}
.statement{margin:28px 0 0;max-width:20ch;font-family:var(--f-serif);font-style:italic;font-size:clamp(1.6rem,2.3vw,2.3rem);line-height:1.15;color:var(--ink)}
.contact{background:rgba(255,255,255,.45);border-radius:24px;padding:20px 22px;box-shadow:inset 0 0 0 1px var(--line)}
@media (max-width:900px){.scene.moi{grid-template-columns:1fr!important;padding-top:56px}.scene.moi .left,.scene.moi .name-col,.moi-end{grid-column:1;grid-row:auto}.scene.moi .name-col{margin:8px 0 0}.moi-end{flex-direction:column;align-items:flex-start;margin-bottom:24px}.statement{max-width:none}}

/* accueil : portrait + présentation */
.scene.home{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}
.scene.home .photo-col{width:min(100%,560px)!important;justify-self:end;margin-right:clamp(0px,3vw,48px);display:block}
.scene.home .card{width:min(370px,64%);margin:0}
.scene.home .portrait,.scene.home.on .portrait{max-height:62svh;background:color-mix(in srgb,var(--accent) 14%,#FBF6F1)!important}
.scene.home .portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.scene.home .fanchor{left:-17%!important;bottom:-4%!important;top:auto;width:27%!important}
.hello{position:absolute;right:-2%;bottom:-6%;width:min(300px,54%);z-index:2;background:rgba(251,248,243,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:24px;padding:22px 24px;box-shadow:0 24px 50px -28px rgba(30,51,40,.35),inset 0 0 0 1px var(--line)}
.hello h2{font-family:var(--f-sans);font-weight:600;font-size:1.3rem;letter-spacing:-.025em;line-height:1.15;color:var(--ink);margin:0 0 10px}
.hello p{margin:0;font-size:.9rem;line-height:1.55;color:var(--muted)}
.hello .sig{margin-top:12px;font-family:var(--f-serif);font-style:italic;font-size:1.12rem;color:var(--accent)}
@media (max-width:900px){
 .scene.home{grid-template-columns:1fr!important}
 .scene.home .photo-col{order:0!important;grid-column:1!important;width:100%!important;justify-self:stretch;margin:28px 0 72px;display:grid;justify-items:center}
 .scene.home .card{width:min(300px,72vw)}
 .hello{position:relative;right:auto;bottom:auto;width:100%;max-width:440px;margin-top:-48px}
 .scene.home .fanchor{left:-2%!important;top:4%;width:30%!important}
}
@media (min-width:901px) and (max-height:760px){.hello p{font-size:.86rem}.scene.home .portrait,.scene.home.on .portrait{max-height:56svh}}

/* accueil : portrait et présentation côte à côte, sans chevauchement */
@media (min-width:901px){.scene.home{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr)!important}}
.scene.home .photo-col{width:100%!important;max-width:720px;justify-self:end;margin-right:0;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(30px,3.2vw,52px);align-items:center}
.scene.home .card{width:100%;margin:0}
.scene.home .portrait,.scene.home.on .portrait{max-height:60svh}
.scene.home .fanchor{left:-7%!important;top:-17%!important;bottom:auto!important;width:16%!important}
.bio{display:grid;gap:12px;max-width:34ch}
.bio h2{margin:0 0 6px;padding-bottom:14px;border-bottom:1px solid var(--line);font-family:var(--f-sans);font-weight:600;font-size:clamp(1.25rem,1.6vw,1.6rem);letter-spacing:-.03em;line-height:1.1;color:var(--ink)}
.bio h2 span{display:block;margin-top:4px;font-family:var(--f-serif);font-style:italic;font-weight:400;font-size:1.12em;letter-spacing:0;color:var(--accent)}
.bio p{margin:0;font-size:clamp(.86rem,.95vw,.95rem);line-height:1.6;color:var(--muted)}
@media (min-width:901px) and (max-height:760px){.bio{gap:9px}.bio p{font-size:.84rem;line-height:1.5}.scene.home .portrait,.scene.home.on .portrait{max-height:54svh}}
@media (max-width:900px){
 .scene.home .photo-col{grid-template-columns:1fr;justify-items:center;gap:32px;margin:28px 0 72px}
 .scene.home .card{width:min(300px,72vw)}
 .scene.home .fanchor{left:0!important;top:4%!important;bottom:auto!important;width:24%!important}
 .bio{max-width:520px;justify-self:stretch}
}

/* accueil : présentation plus aérée */
.bio{gap:16px!important;max-width:36ch!important}
.bio h2{margin-bottom:10px!important;padding-bottom:18px!important}
.bio p{font-size:clamp(.9rem,1vw,.98rem)!important;line-height:1.75!important}
@media (min-width:901px) and (max-height:760px){.bio{gap:12px!important}.bio p{font-size:.86rem!important;line-height:1.62!important}}
/* pages 2 à 5 : fruit au même endroit, entièrement visible */
@media (min-width:901px){.scene:not(.home) .fanchor{position:fixed!important;left:clamp(90px,8vw,140px)!important;bottom:clamp(72px,9vh,92px)!important;width:min(17vw,25vh)!important;top:auto!important;grid-column:auto!important;grid-row:auto!important;margin:0!important}}

/* présentation justifiée */
.bio p{text-align:justify;-webkit-hyphens:auto;hyphens:auto;hyphenate-limit-chars:7 3 3}
/* pied de page collé en bas de l'écran, sans blanc */

/* accueil : photo à la même hauteur que la présentation */
@media (min-width:901px){
.scene.home .photo-col{align-items:stretch!important}
.scene.home .card{display:flex;height:100%}
.scene.home .portrait,.scene.home.on .portrait{aspect-ratio:auto!important;height:100%!important;max-height:none!important;width:100%}
}

.bio h2 span{font-family:var(--f-sans)!important;font-style:normal!important;font-weight:500!important;font-size:.82em!important;letter-spacing:-.02em!important;margin-top:6px!important}
@media (min-width:901px){.scene.home .card{height:84%!important;width:84%!important;align-self:end!important;justify-self:center!important}}
.scene.home .card::before{display:none!important}
.scene.home .portrait img{object-position:50% 10%!important}