@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:400 500;font-display:swap;src:url(fonts/hanken-grotesk.woff2) format('woff2')}
picture{display:contents}
/* Hôtel Sérac (nom fictif). Feuille unique, écrite pour ce site. Unités : 1rem = 1/80 de la largeur (16 px à 1280). */
:root{
  --ink:#0d1f24; --night:#08141a; --spruce:#12302f; --glacier:#bdd2db; --mist:#e6edef; --cream:#f4f0e7; --paper:#f8f5ee;
  --larch:#c28a52; --snow:#fbfbf9;
  --fb:'Hanken Grotesk',system-ui,sans-serif; --fh:var(--fb); --fs:var(--fb);
  --out:cubic-bezier(.22,1,.36,1); --inout:cubic-bezier(.75,0,.25,1);
  --fg:#f4f0e7;
}
*,*::before,*::after{box-sizing:border-box}
html{font-size:min(calc(100vw/80),calc(100vh/50));-webkit-text-size-adjust:100%;scrollbar-width:none}
html::-webkit-scrollbar{display:none}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{margin:0;background:var(--mist);color:var(--ink);font:400 .875rem/1.6 var(--fb);letter-spacing:.005em;-webkit-font-smoothing:antialiased;overflow-x:clip}
h1,h2,h3,h4,p,ul,ol,figure,dl,dd{margin:0;padding:0}
ul,ol{list-style:none}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;letter-spacing:inherit}
:focus-visible{outline:2px solid var(--larch);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:1rem;top:-4rem;z-index:300;background:var(--cream);color:var(--ink);padding:.6rem 1rem}
.skip:focus{top:1rem}

/* ---------- typographie ---------- */
.f-h{font-family:var(--fh);font-weight:400;text-transform:uppercase;line-height:1;letter-spacing:.005em}
.f-s{font-family:var(--fs);font-weight:400;text-transform:none;line-height:1;letter-spacing:0}
.f-k{font-size:.85rem;font-weight:500;letter-spacing:.02em;line-height:1.5}
.t-xl{font-size:11rem}.t-l{font-size:7.4rem}.t-m{font-size:4.6rem}.t-s{font-size:3rem}
.lead{font-size:1.0625rem;line-height:1.7;max-width:34rem}
.split-w{display:inline-block;white-space:pre}
.ln{display:block;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
.ln>span{display:block;will-change:transform}
.ch{display:inline-block}
[data-r]{visibility:hidden}
.nojs [data-r]{visibility:visible}

/* ---------- liens à lettres qui tournent (CSS seul, retard par lettre) ---------- */
.hl{position:relative;display:inline-block;overflow:hidden;vertical-align:top;line-height:1.15}
.hl__a,.hl__b{display:block;white-space:pre}
.hl__b{position:absolute;left:0;top:0}
.hl .c{display:inline-block;transition:transform .6s var(--out),opacity .5s var(--out);transition-delay:calc(var(--i)*18ms)}
.hl__b .c{transform:translateY(110%);opacity:0}
.hl:hover .hl__a .c,.hl:focus-visible .hl__a .c,.hl.is-on .hl__a .c{transform:translateY(-110%);opacity:0}
.hl:hover .hl__b .c,.hl:focus-visible .hl__b .c,.hl.is-on .hl__b .c{transform:none;opacity:1}
.ul{position:relative}
.ul::after{content:"";position:absolute;left:0;right:0;bottom:-.1em;height:1px;background:currentColor;transform-origin:right;transition:transform .6s var(--out)}
.ul:hover::after{transform:scaleX(0)}

/* ---------- puces rondes magnétiques ---------- */
.cb{position:relative;display:grid;place-items:center;width:11rem;height:11rem;border-radius:50%;text-align:center;color:inherit}
.cb svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;transform:rotate(-90deg)}
.cb circle{fill:none;stroke:currentColor;stroke-width:1;opacity:.35}
.cb .arc{opacity:1;stroke-dasharray:14 650;transition:stroke-dasharray .9s var(--inout)}
.cb:hover .arc,.cb:focus-visible .arc{stroke-dasharray:326 650}
.cb span{position:relative;max-width:6rem;display:block}
.mg{will-change:transform}

/* ---------- chargement ---------- */
.entry{position:fixed;inset:0;z-index:200;background:var(--spruce);color:var(--cream);overflow:hidden;display:grid;place-items:center;pointer-events:none}
.entry__topo{position:absolute;inset:-5%;width:110%;height:110%;opacity:.07}
.entry__txt{position:relative;text-align:center;display:grid;gap:.5rem;justify-items:center}
.entry__txt .f-k{opacity:.75}
.entry__txt .e-h{font-size:7.2rem;margin-top:1.4rem}
.entry__txt .e-s{font-size:4.6rem;margin-top:-1.6rem;color:var(--larch)}
.entry__mark{width:3.2rem;height:auto;margin-bottom:1.2rem}
.entry__bar{position:absolute;right:3rem;top:0;bottom:0;width:1px;background:rgba(244,240,231,.18);overflow:hidden}
.entry__bar i{position:absolute;inset:0;background:var(--cream);transform:translateY(-100%)}
.entry__n{position:absolute;right:3.6rem;bottom:3rem;font-size:.75rem}
.entry.is-gone{display:none}

/* ---------- chrome fixe ---------- */
.chrome{position:fixed;inset:0;z-index:90;pointer-events:none;color:var(--fg);transition:color .5s ease}
.chrome.on-light{--fg:var(--ink)}
.chrome.on-dark{--fg:var(--cream);text-shadow:0 0 22px rgba(8,20,26,.35)}
.chrome a,.chrome button{pointer-events:auto}
.logo{position:absolute;left:2.4rem;top:2.2rem;width:5.6rem;height:5.6rem;display:block}
.logo__ring{position:absolute;inset:0;width:100%;height:100%;will-change:transform}
.logo__ring text{font:500 8.4px var(--fb);letter-spacing:.02em;fill:currentColor}
.logo__mark{position:absolute;left:50%;top:50%;width:1.9rem;transform:translate(-50%,-50%);color:currentColor}
.nav{position:absolute;right:2.8rem;top:2.2rem;display:grid;justify-items:end;gap:.9rem;text-align:right}
.nav__main{font:400 1.33rem/1 var(--fh);text-transform:uppercase}
.nav__main .hl{line-height:1.05}
.nav__main .hl__a,.nav__main .hl__b{white-space:pre-line;text-align:right}
.nav__main .hl__b{left:auto;right:0}
.nav__sub{display:grid;justify-items:end;gap:.25rem}
.nav__sub>*{font-size:.85rem;letter-spacing:.02em;font-weight:500}
.sbar{position:absolute;left:2.6rem;top:19vh;bottom:11vh;width:2rem;display:grid;grid-template-rows:auto 1fr auto;justify-items:center;gap:.8rem;pointer-events:none}
.sbar__n{font-size:.625rem;letter-spacing:.1em;font-variant-numeric:tabular-nums}
.sbar__t{position:relative;width:1px;background:currentColor;opacity:1;height:100%}
.sbar__t::before{content:"";position:absolute;inset:0;background:var(--bg-track,transparent)}
.sbar__t i{position:absolute;left:0;top:0;width:1px;height:100%;background:currentColor;transform-origin:top;transform:scaleY(var(--p,0))}
.sbar__t::after{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;background:currentColor;opacity:.25}
.sbar__thumb{position:absolute;left:-.45rem;top:calc(var(--p,0)*100%);width:.9rem;height:.9rem;margin-top:-.45rem;border:1px solid currentColor;border-radius:50%;background:transparent;pointer-events:auto;cursor:grab;transition:transform .3s var(--out)}
.sbar__thumb:hover{transform:scale(1.5)}
.sbar__l{writing-mode:vertical-rl;transform:rotate(180deg);font-size:.85rem;letter-spacing:.02em}
.sbar__a{width:.7rem;height:.9rem}
.sbar__s{display:grid;gap:.7rem;justify-items:center;transition:opacity .4s}

/* ---------- ouverture : le héros collant ---------- */
.hero-area{position:relative;height:520vh;background:var(--night)}
.hero{position:sticky;top:0;height:100vh;overflow:hidden;color:var(--cream)}
.hero__bg{position:absolute;left:0;top:0;width:100%;height:114vh;transform-origin:50% 75%;will-change:transform;backface-visibility:hidden}
.hero__in{position:absolute;inset:0;transform-origin:50% 40%;will-change:transform}
.hero__bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero__bg .is-dusk{opacity:0}
.hero__sky{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,20,26,.55),rgba(8,20,26,0) 38%)}
.hero__txt{position:absolute;inset:0;will-change:transform;pointer-events:none}
.hero__txt .hero__tabs,.hero__txt button{pointer-events:auto}
.hero h1{position:absolute;left:0;right:0;top:2.4rem;text-align:center;font-weight:400}
.hero .h-a{display:block;font-size:5.46rem}
.hero .h-b{display:block;font-size:15.6rem;line-height:.8;margin-top:3.6rem;letter-spacing:-.01em}
.hero .h-c{position:absolute;left:50%;bottom:-5rem;margin-left:-14rem;font-size:3.30rem;transform:none;color:var(--snow);white-space:nowrap}
.hero__side{position:absolute;top:56%;font:400 1.72rem/1 var(--fh);text-transform:uppercase}
.hero__side.l{left:9%}.hero__side.r{right:10%}
.hero__tabs{position:absolute;left:50%;top:64%;transform:translateX(-50%);display:flex;align-items:center;gap:1.2rem}
.hero__tabs button{opacity:.7;transition:opacity .4s}
.hero__tabs button.is-on,.hero__tabs button:hover{opacity:1}
.hero__div{position:relative;width:7rem;height:1px;background:rgba(244,240,231,.4)}
.hero__div i{position:absolute;top:-1px;left:0;width:50%;height:3px;background:var(--cream);transition:transform .7s var(--inout)}
.hero__div.is-dusk i{transform:translateX(100%)}
.pin{position:absolute;z-index:3;width:2.1rem;height:2.1rem;margin:-1.05rem 0 0 -1.05rem;border-radius:50%;border:1.5px solid rgba(251,251,249,.95);background:rgba(13,31,36,.32);display:grid;place-items:center;pointer-events:auto;cursor:pointer}
.pin::before{content:"";width:.34rem;height:.34rem;border-radius:50%;background:#fff;transition:transform .4s var(--out)}
.pin:hover::before{transform:scale(1.8)}
.pin__p{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(251,251,249,.8);animation:pulse 3.2s var(--out) infinite;animation-play-state:var(--play,running)}
.pin__p+.pin__p{animation-delay:1.1s}
@keyframes pulse{0%{transform:scale(1);opacity:.9}100%{transform:scale(2.4);opacity:0}}
.tip{position:fixed;left:0;top:0;z-index:95;width:17rem;padding:1.1rem 1.2rem 1.2rem;background:var(--cream);color:var(--ink);pointer-events:none;opacity:0;transform:translate3d(0,0,0);transition:opacity .35s ease;will-change:transform}
.tip.is-on{opacity:1}
.tip h4{font:400 1.33rem/1 var(--fh);text-transform:uppercase;margin-bottom:.5rem}
.tip p{font-size:.78rem;line-height:1.5;opacity:.8}
.tip i{display:block;margin-top:.7rem;font-style:normal}
.hero__cta{position:absolute;left:50%;bottom:3.6rem;margin-left:-5.5rem;opacity:0;visibility:hidden}
.hero__cta .cb{color:var(--cream);background:rgba(13,31,36,.38)}
.hero__cta .cb circle{opacity:.9}
.hero::after{content:"";position:absolute;left:0;right:0;top:0;height:22vh;background:linear-gradient(rgba(8,20,26,.5),transparent);pointer-events:none}

/* ---------- anneau + trois raisons ---------- */
.rin{position:relative;height:120vh;background:var(--glacier);overflow:hidden;display:grid;place-items:center}
.rin__ring{width:64rem;height:64rem;will-change:transform}
.rin__ring text{font:400 8.6px var(--fh);text-transform:uppercase;fill:var(--ink)}
.rin__c{position:absolute;left:0;right:0;top:50%;margin-top:-3.4rem;text-align:center;color:var(--ink)}
.rin__c .f-s{font-size:6rem;display:block}
.rs{position:relative;background:var(--glacier);color:var(--ink);min-height:100vh;padding:7rem 7rem 7rem 12rem;display:grid;grid-template-columns:1fr 32rem;gap:6rem;align-items:center}
.rs__l{position:relative;display:grid;grid-template-rows:auto auto auto;align-content:center}
.rs__k{display:flex;gap:1rem;align-items:baseline;margin-bottom:2rem}
.rs__k b{font-weight:500;font-variant-numeric:tabular-nums}
.rs__stack{display:grid}
.rs__slide{grid-area:1/1;visibility:hidden}
.rs__slide.is-cur{visibility:visible}
.rs__slide h3{font-size:3.12rem;margin-bottom:1.4rem}
.rs__slide p{max-width:26rem;font-size:.98rem;line-height:1.7}
.rs__bars{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;margin-top:3.2rem}
.rs__bars button{text-align:left;padding-top:.8rem;position:relative;opacity:.55;transition:opacity .4s}
.rs__bars button.is-on,.rs__bars button.is-done{opacity:1}
.rs__bars button::before,.rs__bars button i{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:rgba(13,31,36,.18)}
.rs__bars button i{background:var(--ink);transform-origin:left;transform:scaleX(0)}
.rs__bars button.is-done i{transform:scaleX(1)}
.rs__bars button.is-on i{animation:fill var(--dur,6s) linear forwards;animation-play-state:var(--play,running)}
@keyframes fill{to{transform:scaleX(1)}}
.rs__bars span{display:block}
.rs__r{position:relative;height:44rem}
.rs__frame{position:absolute;inset:0;overflow:hidden}
.rs__img{position:absolute;inset:0;clip-path:inset(0 0 100% 0);will-change:clip-path}
.rs__img.is-cur{clip-path:inset(0)}
.rs__img img{width:100%;height:100%;object-fit:cover;will-change:transform}
.rs__nx{position:absolute;right:1.2rem;bottom:1rem;color:#fff;text-shadow:0 0 14px rgba(0,0,0,.4);z-index:2}

/* ---------- citation ---------- */
.qt{position:relative;height:125vh;overflow:hidden;color:var(--cream);display:grid;place-items:center;text-align:center;background:var(--night)}
.qt__bg{position:absolute;left:0;right:0;top:-15%;height:130%}
.qt__bg img{width:100%;height:100%;object-fit:cover}
.qt__bg::after{content:"";position:absolute;inset:0;background:rgba(8,20,26,.38)}
.qt__in{position:relative;max-width:62rem}
.qt .f-h{font-size:6.2rem;line-height:.95}
.qt .f-s{display:block;font-size:4.2rem;color:var(--larch);margin-top:.4rem}

/* ---------- lieu : piste horizontale ---------- */
.loc-area{position:relative;background:var(--glacier);color:var(--ink)}
.loc-pin{position:sticky;top:0;height:100vh;overflow:hidden}
.loc-track{position:absolute;left:0;top:0;height:100%;display:flex;will-change:transform}
.l-intro{position:relative;flex:none;width:100vw;height:100%;padding:0 0 0 14rem}
.l-intro h2{position:absolute;left:14rem;top:0;bottom:0;display:flex;flex-direction:column;justify-content:center;gap:0}
.l-intro h2 span{display:block;font-size:9.75rem;line-height:.84;white-space:nowrap;will-change:transform}
.l-intro h2 span:nth-child(2){font-family:var(--fs);text-transform:none;font-size:3.20rem;color:var(--larch);margin:-.4rem 0 -.4rem 7rem}
.l-info{position:relative;flex:none;width:96rem;height:100%;display:grid;grid-template-columns:38rem 24rem;align-content:center;gap:5rem;padding-left:10rem}
.l-info .lead{margin:2rem 0}
.l-info__ph{position:relative;height:33rem;align-self:center;overflow:hidden}
.l-info__ph img,.l-sm img{width:100%;height:100%;object-fit:cover}
.l-info__s{position:absolute;right:-2rem;bottom:5rem;width:15rem;height:11rem;overflow:hidden;border:.5rem solid var(--glacier)}
.l-path{position:relative;flex:none;width:176rem;height:100%}
.l-path__ln{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible}
.l-path__ln path{fill:none;stroke:var(--ink);stroke-width:1.4;stroke-linecap:round;vector-effect:non-scaling-stroke}
.stop{position:absolute;width:0;height:0}
.stop__t{position:absolute;left:0;width:22rem;background:var(--glacier);padding:.5rem 1rem .7rem .4rem;margin-left:-.4rem}
.stop.dn .stop__t{top:1.4rem}
.stop.up .stop__t{bottom:1.4rem}
.stop h3{font-size:2.03rem;margin-bottom:.5rem}
.stop p{font-size:.84rem;max-width:20rem;opacity:.85}
.stop b{display:block;font-weight:500}
.stop::before{content:"";position:absolute;left:-.45rem;top:-.45rem;width:.9rem;height:.9rem;border:1px solid var(--ink);border-radius:50%;background:var(--glacier);transform:scale(var(--dot,1))}
.stop .f-k{margin-bottom:.8rem;display:block}
.l-sm{position:absolute;overflow:hidden}
.l-end{position:relative;flex:none;width:44rem;height:100%;display:grid;align-content:center;padding-left:8rem}

.loc{position:relative;height:130vh;overflow:hidden;background:var(--night);color:var(--cream)}
.loc__bg{position:absolute;left:0;right:0;top:0;height:100%;transform-origin:50% 100%;will-change:transform}
.loc__bg img{width:100%;height:100%;object-fit:cover}
.loc__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,20,26,.2),rgba(8,20,26,.5))}
.loc__in{position:absolute;left:14rem;right:6rem;bottom:8rem;display:grid;grid-template-columns:1fr 24rem;align-items:end;gap:6rem}
.loc .t-m{font-size:6.4rem}
.loc ul{display:grid;gap:1.1rem;border-top:1px solid rgba(244,240,231,.4);padding-top:1.4rem}
.loc li{display:flex;justify-content:space-between;gap:1rem}

/* ---------- la maison : plan ---------- */
.plan{position:relative;background:var(--mist);padding:9rem 6rem 9rem 12rem;overflow:hidden}
.plan__head{display:grid;grid-template-columns:1fr 30rem;gap:6rem;align-items:end;margin-bottom:4rem}
.plan__map{position:relative;height:42rem;overflow:hidden;background:var(--ink)}
.plan__map img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.clouds{position:absolute;left:0;top:0;width:200%;height:100%;display:flex;pointer-events:none;animation:drift 70s linear infinite;animation-play-state:var(--play,running);will-change:transform}
.clouds i{flex:none;width:50%;height:100%;background:radial-gradient(40% 14% at 20% 30%,rgba(255,255,255,.55),transparent 70%),radial-gradient(30% 10% at 55% 55%,rgba(255,255,255,.45),transparent 70%),radial-gradient(34% 12% at 85% 22%,rgba(255,255,255,.5),transparent 70%),radial-gradient(26% 9% at 38% 82%,rgba(255,255,255,.35),transparent 70%)}
.clouds.b{animation-duration:110s;animation-direction:reverse;top:12%;opacity:.7}
@keyframes drift{to{transform:translateX(-50%)}}
.mk{position:absolute;width:2.1rem;height:2.1rem;margin:-1.05rem 0 0 -1.05rem;border-radius:50%;border:1px solid #fff;color:#fff;display:grid;place-items:center;font-size:.7rem;z-index:3;transition:background .4s,color .4s,transform .4s var(--out)}
.mk:hover,.mk.is-on{background:var(--cream);color:var(--ink);transform:scale(1.15)}
.mk::after{content:"";position:absolute;inset:-.35rem;border-radius:50%;border:1px solid rgba(255,255,255,.55);animation:pulse 3.4s var(--out) infinite;animation-play-state:var(--play,running)}
.plan__card{position:absolute;left:2rem;bottom:2rem;width:22rem;padding:1.4rem 1.5rem;background:var(--cream);z-index:4;min-height:11rem}
.plan__card h4{font:400 1.56rem/1 var(--fh);text-transform:uppercase;margin-bottom:.6rem}
.plan__card p{font-size:.84rem;opacity:.85}
.plan__card .f-k{display:block;margin-bottom:.6rem;opacity:.7}

/* ---------- chambres ---------- */
.rooms{position:relative;background:var(--cream);padding:9rem 6rem 9rem 12rem}
.rooms__top{display:flex;justify-content:space-between;align-items:end;margin-bottom:4rem}
.rooms__grid{display:grid;grid-template-columns:36rem 1fr;gap:5rem;align-items:center}
.rooms__imgs{position:relative;height:34rem;overflow:hidden;background:var(--ink)}
.rm__img{position:absolute;inset:0;clip-path:inset(0 0 100% 0)}
.rm__img.is-cur{clip-path:inset(0)}
.rm__img img{width:100%;height:100%;object-fit:cover}
.rooms__tx{position:relative}
.rm__stack{display:grid}
.rm{grid-area:1/1;visibility:hidden}
.rm.is-cur{visibility:visible}
.rm h3{font-size:2.96rem;margin-bottom:1.1rem}
.rm p{max-width:28rem;font-size:.98rem;line-height:1.7;margin-bottom:1.6rem}
.rm dl{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:.4rem 1.8rem}
.rm dt{font-size:.85rem;letter-spacing:.02em;opacity:.55}
.rm dd{font:400 1.17rem/1.1 var(--fh)}
.rooms__nav{display:flex;align-items:center;gap:1.4rem;margin-top:2.2rem}
.arw{width:3.2rem;height:3.2rem;border-radius:50%;border:1px solid currentColor;display:grid;place-items:center;transition:background .4s,color .4s}
.arw:hover{background:var(--ink);color:var(--cream)}
.arw svg{width:1rem;height:1rem}
.rooms__list{display:flex;gap:2.4rem;margin-top:2.6rem;flex-wrap:wrap}
.rooms__list button{position:relative;padding-bottom:.4rem;opacity:.5;transition:opacity .4s}
.rooms__list button.is-on,.rooms__list button:hover{opacity:1}
.rooms__list button::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .6s var(--out)}
.rooms__list button.is-on::after{transform:scaleX(1)}
.rinfo{background:var(--cream);padding:0 6rem 10rem 12rem}
.rinfo__in{display:grid;grid-template-columns:18rem 1fr;gap:5rem;border-top:1px solid rgba(13,31,36,.2);padding-top:4rem}
.rinfo ul{display:grid;grid-template-columns:repeat(3,1fr);gap:2.4rem 2.4rem}
.rinfo li b{display:block;font:400 1.25rem/1.1 var(--fh);text-transform:uppercase;margin-bottom:.4rem}
.rinfo li span{font-size:.82rem;opacity:.8;display:block;max-width:15rem}
.btn{display:inline-flex;align-items:center;gap:1rem;padding:1.05rem 1.9rem;border:1px solid var(--larch);background:var(--larch);color:var(--ink);font-size:.85rem;letter-spacing:.02em;font-weight:500;position:relative;overflow:hidden;transition:color .5s var(--out)}
.btn::before{content:"";position:absolute;inset:0;background:var(--ink);transform:translateY(101%);transition:transform .6s var(--out)}
.btn span{position:relative;z-index:1}
.btn:hover::before{transform:none}
.btn:hover{color:var(--cream)}
.btn.on-ink:hover{color:var(--cream)}
.btn.on-ink::before{background:var(--ink)}
.btn.on-cream::before{background:var(--cream)}
.btn.on-cream:hover{color:var(--ink)}

/* ---------- intérieur ---------- */
.int{position:relative;background:var(--ink);color:var(--cream);padding:10rem 6rem 8rem 12rem;overflow:hidden}
.int__h{max-width:46rem;margin-bottom:6rem}
.int__cols{display:grid;grid-template-columns:1fr 1fr 1fr;gap:3.4rem;align-items:start}
.int__c{display:grid;gap:3.4rem}
.int__c:nth-child(2){margin-top:12rem}
.int__f{position:relative;overflow:hidden}
.int__f img{width:100%;height:118%;object-fit:cover;will-change:transform}
.int__f.a{height:30rem}.int__f.b{height:22rem}.int__f.c{height:26rem}.int__f.d{height:34rem}
.int__t{font-size:.9rem;max-width:20rem;opacity:.85}
.int__t b{display:block;font:400 1.56rem/1 var(--fh);text-transform:uppercase;margin-bottom:.5rem}
.gal{position:relative;margin-top:9rem;display:grid;grid-template-columns:1fr 18rem;gap:3rem;align-items:end}
.gal__f{position:relative;height:36rem;overflow:hidden}
.gal__f .gs{position:absolute;inset:0;clip-path:inset(0 0 0 100%)}
.gal__f .gs.is-cur{clip-path:inset(0)}
.gal__f img{width:100%;height:100%;object-fit:cover}
.gal__c{display:grid;gap:1.2rem}

/* ---------- équipements ---------- */
.am-area{position:relative;height:400vh;background:var(--night)}
.am{position:sticky;top:0;height:100vh;overflow:hidden;color:var(--cream);will-change:opacity}
.am__bg{position:absolute;inset:0;transform-origin:50% 50%;will-change:transform}
.am__bg .ab{position:absolute;inset:0;opacity:0;transition:opacity .9s ease}
.am__bg .ab.is-cur{opacity:1}
.am__bg img{width:100%;height:100%;object-fit:cover}
.am__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,20,26,.78),rgba(8,20,26,.1) 65%)}
.am__in{position:absolute;left:14rem;top:0;bottom:0;width:44rem;display:flex;flex-direction:column;justify-content:center}
.am__tabs{position:relative;display:grid;gap:.2rem;margin:2.2rem 0 2.4rem}
.am__hi{position:absolute;left:-1.4rem;top:0;width:2px;height:3rem;background:var(--larch);transition:transform .8s var(--inout);will-change:transform}
.am__tabs button{display:block;text-align:left;font:400 2.42rem/1.15 var(--fh);text-transform:uppercase;opacity:.4;transition:opacity .5s,transform .6s var(--out);height:3.6rem}
.am__tabs button:hover{opacity:.75}
.am__tabs button.is-on{opacity:1;transform:translateX(.8rem)}
.am__txt{position:relative;min-height:6.2rem;max-width:26rem}
.am__txt p{position:absolute;left:0;top:0;opacity:0;transform:translateY(.8rem);transition:opacity .6s,transform .8s var(--out);font-size:.95rem}
.am__txt p.is-cur{opacity:1;transform:none}
.am__n{position:absolute;right:5rem;bottom:4rem;font-size:.75rem}

/* ---------- architecture : deux photos qui se rejoignent ---------- */
.ar-area{position:relative;height:420vh;background:var(--ink)}
.ar{position:sticky;top:0;height:100vh;overflow:hidden;background:var(--ink);color:var(--cream)}
.ar__stage{position:absolute;inset:0;transform-origin:50% 50%;will-change:transform}
.ar__ph{position:absolute;inset:0;will-change:clip-path}
.ar__ph img{width:100%;height:100%;object-fit:cover}
.ar__tx{position:absolute;left:14rem;bottom:7rem;max-width:44rem}
.ar__tx h2{font-size:5.77rem;margin-bottom:1.4rem;text-shadow:0 0 40px rgba(8,20,26,.35)}
.ar__tx p{max-width:27rem;font-size:1rem;text-shadow:0 0 18px rgba(8,20,26,.7)}
.ar__shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,20,26,.82),rgba(8,20,26,.25) 55%,transparent);opacity:0}
.ar__lbl{position:absolute;top:50%;transform:translateY(-50%);font-size:.6rem;color:var(--cream);opacity:.8}

/* ---------- infos pratiques : accordéon ---------- */
.oth{background:var(--cream);padding:10rem 6rem 10rem 12rem;display:grid;grid-template-columns:30rem 1fr;gap:8rem}
.acc{border-top:1px solid rgba(13,31,36,.25)}
.acc__i{border-bottom:1px solid rgba(13,31,36,.25);cursor:pointer}
.acc__h{display:flex;justify-content:space-between;align-items:center;padding:1.6rem 0;width:100%;text-align:left;font:400 1.95rem/1 var(--fh);text-transform:uppercase}
.acc__h svg{width:1.4rem;height:1.4rem;transition:transform .7s var(--inout);flex:none}
.acc__i.is-on .acc__h svg{transform:rotate(45deg)}
.acc__b{display:grid;grid-template-rows:0fr;transition:grid-template-rows .9s var(--out)}
.acc__i.is-on .acc__b{grid-template-rows:1fr}
.acc__b>div{overflow:hidden}
.acc__b p{max-width:36rem;padding:0 0 1.8rem;font-size:.95rem;line-height:1.7;opacity:0;transform:translateY(.8rem);transition:opacity .6s .15s,transform .8s .15s var(--out)}
.acc__i.is-on .acc__b p{opacity:.9;transform:none}

/* ---------- appel + pied ---------- */
.cta{position:relative;height:110vh;overflow:hidden;color:var(--cream);display:grid;place-items:center;text-align:center;background:var(--night)}
.cta__bg{position:absolute;left:0;right:0;top:-12%;height:124%}
.cta__bg img{width:100%;height:100%;object-fit:cover}
.cta__bg::after{content:"";position:absolute;inset:0;background:rgba(8,20,26,.36)}
.cta__in{position:relative;display:grid;justify-items:center;gap:2.6rem}
.cta .f-h{font-size:10.5rem}
.cta .f-s{font-size:4rem;display:block;margin-top:-2rem;margin-left:10rem;color:var(--larch)}
.ft-area{position:relative;height:150vh;background:var(--night)}
.ft{position:sticky;top:0;height:100vh;overflow:hidden;color:var(--cream)}
.ft__clip{position:absolute;inset:0;will-change:clip-path;background:var(--night)}
.ft__clip img{width:100%;height:100%;object-fit:cover}
.ft__clip::after{content:"";position:absolute;inset:0;background:rgba(8,20,26,.55)}
.ft__in{position:absolute;inset:0;display:grid;grid-template-rows:1fr auto;padding:0 0 2.2rem;will-change:transform,opacity}
.ft__mid{display:grid;place-items:center;align-content:center;gap:1.8rem;text-align:center;padding-top:3rem}
.ft__mid .f-h{font-size:4.6rem;max-width:38rem;line-height:.95}
.ft__cols{display:flex;justify-content:center;gap:5rem;font-size:.8rem;text-align:left}
.ft__cols div{display:grid;gap:.35rem;align-content:start}
.ft__cols b{font-weight:500;letter-spacing:.02em;font-size:.85rem;opacity:.7}
.ft__w{text-align:center;line-height:.86;white-space:nowrap;padding-top:.1em;margin-bottom:1.2rem}
.ft__w span{display:inline-block;font-size:19rem;color:var(--cream);opacity:.92}
.ft__bot{position:absolute;left:0;right:0;bottom:1.4rem;display:flex;justify-content:space-between;padding:0 3rem;font-size:.65rem;opacity:.65}
.ft__bot>*{display:inline-block}

/* ---------- biscuits ---------- */
.ck{position:fixed;right:2rem;bottom:2rem;z-index:150;width:20.5rem;background:var(--cream);color:var(--ink);padding:3.4rem 1.7rem 1.6rem;box-shadow:0 1.6rem 4rem rgba(8,20,26,.28);visibility:hidden;will-change:transform}
.ck__frame{position:absolute;inset:.5rem;border:1px solid rgba(13,31,36,.28);pointer-events:none;clip-path:polygon(.9rem 0,calc(100% - .9rem) 0,100% .9rem,100% calc(100% - .9rem),calc(100% - .9rem) 100%,.9rem 100%,0 calc(100% - .9rem),0 .9rem)}
.ck__frame::before{content:"";position:absolute;inset:.35rem;border:1px solid rgba(13,31,36,.14);clip-path:inherit}
.ck .ck__t{position:absolute;left:0;right:0;top:1.1rem;font-size:1.8rem;line-height:1;text-transform:none;letter-spacing:0;font-weight:400;margin:0;text-align:center;color:var(--ink);transform:none;transform-origin:left bottom;white-space:nowrap;pointer-events:none}
.ck__t .ch{display:inline-block}
.ck p{font-size:.85rem;line-height:1.55;text-align:center;letter-spacing:.02em;font-weight:500;margin:1.7rem 0 1.2rem}
.ck__opt{display:grid;grid-template-rows:0fr;transition:grid-template-rows .7s var(--out)}
.ck__opt.is-on{grid-template-rows:1fr}
.ck__opt>div{overflow:hidden}
.ck__opt ul{display:grid;gap:.7rem;padding:.2rem 0 1rem;font-size:.72rem}
.ck__opt li{display:flex;justify-content:space-between;align-items:center;gap:1rem}
.sw{position:relative;flex:none;width:2.2rem;height:1.2rem;border:1px solid var(--ink);border-radius:1rem}
.sw::before{content:"";position:absolute;left:.18rem;top:.18rem;width:.72rem;height:.72rem;border-radius:50%;background:var(--ink);transition:transform .5s var(--out)}
.sw[aria-checked="true"]{background:var(--ink)}
.sw[aria-checked="true"]::before{background:var(--cream);transform:translateX(1rem)}
.sw[disabled]{opacity:.5;cursor:default}
.ck__a{display:flex;justify-content:center;align-items:baseline;gap:.9rem;font:400 1.33rem/1 var(--fh);text-transform:uppercase}
.ck__a i{font-style:normal;opacity:.4}
.ck__m{display:block;margin:1rem auto 0;font-size:.85rem;letter-spacing:.02em;opacity:.65;font-weight:500}
.ck__m:hover{opacity:1}

/* ---------- demande de séjour : fenêtre ---------- */
.md{position:fixed;inset:0;z-index:180;display:none;perspective:1400px}
.md__o{position:absolute;inset:0;background:rgba(8,20,26,.72)}
.md__c{position:absolute;left:50%;top:50%;width:62rem;height:42rem;margin:-21rem 0 0 -31rem;background:var(--cream);color:var(--ink);display:grid;grid-template-columns:22rem 1fr;overflow:hidden;will-change:transform}
.md__side{position:relative;color:var(--cream);overflow:hidden;padding:2.4rem 2rem;display:flex;flex-direction:column;justify-content:flex-end;background:var(--spruce)}
.md__side img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55}
.md__side>*{position:relative}
.md__side .f-s{font-size:4.8rem;margin-bottom:.6rem}
.md__side p{font-size:.82rem;opacity:.9}
.md__f{position:relative;padding:2.6rem 2.8rem 2rem;overflow:auto}
.md__x{position:absolute;right:1.2rem;top:1.2rem;width:2.6rem;height:2.6rem;border-radius:50%;border:1px solid rgba(13,31,36,.3);display:grid;place-items:center;transition:background .4s,color .4s}
.md__x:hover{background:var(--ink);color:var(--cream)}
.md__x svg{width:.9rem;height:.9rem;transform:rotate(45deg)}
.md__f h2{font-size:2.18rem;margin-bottom:1.4rem}
.fld{position:relative;margin-bottom:1rem}
.fld input,.fld textarea{width:100%;background:transparent;border:0;border-bottom:1px solid rgba(13,31,36,.35);padding:1.3rem 0 .45rem;font:inherit;color:inherit;border-radius:0;outline:0;transition:border-color .4s}
.fld textarea{resize:none;height:3.6rem}
.fld label{position:absolute;left:0;top:1.2rem;font-size:.875rem;opacity:.6;pointer-events:none;transition:transform .5s var(--out),opacity .5s;transform-origin:left top}
.fld input:focus,.fld textarea:focus{border-color:var(--ink)}
.fld.is-f label{transform:translateY(-1rem) scale(.72);opacity:.7}
.fld.is-bad input{border-color:#a4432e}
.fld.is-bad label{color:#a4432e;opacity:1}
.fld input[type=date]{color:transparent}
.fld.is-f input[type=date]{color:inherit}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem}
.chips{display:flex;flex-wrap:wrap;gap:.5rem;margin:.3rem 0 1.1rem}
.chips button{padding:.55rem .9rem;border:1px solid rgba(13,31,36,.3);font-size:.85rem;letter-spacing:.02em;font-weight:500;transition:background .4s,color .4s,border-color .4s}
.chips button:hover{border-color:var(--ink)}
.chips button[aria-pressed="true"]{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.step{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}
.step b{font:400 1.40rem/1 var(--fh);min-width:2rem;text-align:center}
.step button{width:2rem;height:2rem;border:1px solid rgba(13,31,36,.35);border-radius:50%}
.step button:hover{background:var(--ink);color:var(--cream)}
.md__ok{position:absolute;inset:0;background:var(--cream);display:none;place-content:center;text-align:center;gap:1rem;padding:3rem}
.md__ok.is-on{display:grid}
.md__ok .f-s{font-size:5.4rem}
.md__ok p{max-width:24rem;margin:0 auto}

/* ---------- menu (fenêtre de navigation, petits écrans) ---------- */
.mn{position:fixed;inset:0;z-index:170;background:var(--spruce);color:var(--cream);display:none;place-content:center;gap:1rem;text-align:center}
.mn a{font:400 3.12rem/1.05 var(--fh);text-transform:uppercase;display:block}
.mn-btn{display:none}

/* ---------- transition de page ---------- */
.curtain{position:fixed;inset:0;z-index:250;background:var(--spruce);pointer-events:none;clip-path:inset(100% 0 0 0)}

/* ---------- page concept ---------- */
.cp-hero{position:relative;min-height:100vh;background:var(--night);color:var(--cream);overflow:hidden;display:grid;place-items:center;text-align:center}
.cp-hero__bg{position:absolute;left:0;right:0;top:-8%;height:116%}
.cp-hero__bg img{width:100%;height:100%;object-fit:cover}
.cp-hero__bg::after{content:"";position:absolute;inset:0;background:rgba(8,20,26,.5)}
.cp-hero h1{position:relative;font-size:9.36rem;line-height:.84}
.cp-hero .f-s{position:relative;display:block;font-size:4.4rem;color:var(--larch);margin-top:-1.4rem}
.cp{position:relative;background:var(--mist);overflow:hidden}
.cp__sec{position:relative;min-height:100vh;display:grid;align-content:center;padding:10rem 20rem}
.cp__sec .f-k{margin-bottom:2.2rem;opacity:.7}
.cp__sec h2{font-size:3.74rem;margin-bottom:2.4rem;max-width:46rem}
.cp__sec p{font-size:1rem;max-width:28rem;line-height:1.75}
.cp__sec.pr{padding:10rem 34rem 10rem 12rem}
.cp__sec.pl{padding:10rem 12rem 10rem 34rem}
.cp__sec.alt{background:var(--glacier)}
.cp__sec.dark{background:var(--spruce);color:var(--cream)}
.cp__ph{position:absolute;overflow:hidden}
.cp__ph img{width:100%;height:100%;object-fit:cover}
.cp__ph.r{right:6rem;top:50%;width:24rem;height:32rem;margin-top:-16rem}
.cp__ph.l{left:6rem;top:50%;width:24rem;height:32rem;margin-top:-16rem}
.cp__list{display:grid;gap:0;margin-top:2rem;max-width:34rem}
.cp__list li{display:flex;justify-content:space-between;gap:2rem;padding:1.1rem 0;border-top:1px solid rgba(13,31,36,.22);font-size:.95rem}
.cp__list li b{font:400 1.48rem/1 var(--fh);text-transform:uppercase}
.cp__list li span{max-width:15rem;opacity:.8;text-align:right}
.cp__end{position:relative;min-height:70vh;display:grid;place-items:center;text-align:center;background:var(--cream);padding:8rem 0}
.cp__end .f-h{font-size:7rem;margin-bottom:2.2rem}

/* ---------- petits écrans (< 992 px) : même histoire, mise en colonne ---------- */
@media (max-width:991px){
  html{font-size:calc(100vw/24)}
  body{font-size:.9rem}
  .t-xl{font-size:6rem}.t-l{font-size:4.2rem}.t-m{font-size:3.2rem}.t-s{font-size:2.4rem}
  .lead{font-size:1rem}
  /* barre fixe */
  .logo{left:1rem;top:1rem;width:3.8rem;height:3.8rem}.logo__mark{width:1.2rem}
  .nav{display:none}.sbar{display:none}
  .mn-btn{display:block;position:absolute;right:1rem;top:1.4rem;pointer-events:auto;font:500 .85rem/1 var(--fb);letter-spacing:.02em;padding:.8rem 1rem;border:1px solid currentColor;border-radius:2rem}
  .mn{display:none;z-index:170}
  .mn a,.mn button{font:400 2.34rem/1.15 var(--fh);text-transform:uppercase;display:block;margin:0 auto}
  .mn__x{position:absolute;right:1rem;top:1.4rem;font:500 .85rem/1 var(--fb)!important;letter-spacing:.02em;padding:.8rem 1rem;border:1px solid currentColor;border-radius:2rem}
  /* héros */
  .entry__txt .e-h{font-size:4.2rem}.entry__txt .e-s{font-size:3rem;margin-top:-.8rem}.entry__bar{right:1.2rem}.entry__n{right:1.8rem;bottom:1.6rem}
  .hero-area{height:380vh}
  .hero__bg{height:114vh}.hero__bg img{object-position:66% 50%}
  .hero h1{top:5.8rem}.hero .h-a{font-size:2.65rem}.hero .h-b{font-size:7.49rem;margin-top:1.9rem}.hero .h-c{font-size:2.03rem;bottom:-2rem;margin-left:-7rem}.hero__tabs button{white-space:nowrap}
  .hero__side{top:58%;font-size:1.2rem}.hero__side.l{left:6%}.hero__side.r{right:6%}
  .hero__tabs{top:67%;gap:.8rem}
  .pin{width:2.2rem;height:2.2rem}
  .cb{width:8.2rem;height:8.2rem}.hero__cta{margin-left:-4.1rem;bottom:2.6rem}
  .tip{width:calc(100% - 2rem);left:1rem!important;top:auto!important;bottom:1rem;transform:none!important;pointer-events:auto}
  /* trois raisons */
  .rin{height:90vh}.rin__ring{width:42rem;height:42rem}.rin__c .f-s{font-size:3.8rem!important}
  .rs{grid-template-columns:1fr;gap:2.4rem;padding:4rem 1.2rem 5rem;min-height:0}
  .rs__slide h3{font-size:2.34rem}.rs__r{height:26rem}
  .rs__bars{margin-top:2rem}
  .qt{height:100vh}.qt .f-h{font-size:2.9rem}.qt .f-s{font-size:3rem}.qt__in{padding:0 1.2rem}
  /* le lieu : une colonne au lieu de la piste horizontale */
  .loc-area{height:auto!important}.loc-pin{position:static;height:auto;overflow:visible}
  .loc-track{position:static;height:auto;flex-direction:column;transform:none!important}
  main{overflow-x:clip}
  .l-intro{width:auto;height:auto;min-height:30rem;padding:5rem 1.2rem 8rem;overflow:hidden}
  .l-intro h2{position:static;display:block}
  .l-intro h2 span{font-size:3.43rem;transform:none!important}
  .l-intro h2 span:nth-child(2){font-size:2.10rem;margin:-.2rem 0 -.4rem 2rem}
  .l-info{width:auto;height:auto;display:block;padding:2rem 1.2rem}
  .l-info__ph{height:20rem;margin-top:2rem}.l-info__s{display:none}
  .l-path{width:auto;height:auto;padding:1rem 1.2rem 2rem 2.2rem;margin-left:1.2rem;border-left:1px solid var(--ink)}
  .l-path__ln{display:none}
  .l-sm{position:relative;left:auto!important;top:auto!important;width:100%!important;height:13rem!important;margin:1.4rem 0}
  .stop{position:relative;width:auto;height:auto;left:auto!important;top:auto!important;margin:2.2rem 0}
  .stop::before{left:-2.65rem;top:.3rem}
  .l-end{width:auto;height:auto;padding:1rem 1.2rem 4rem}.l-end .f-s{font-size:3rem!important}
  .loc{height:100vh}.loc__in{left:1.2rem;right:1.2rem;bottom:2rem;grid-template-columns:1fr;gap:1.4rem}.loc .t-m{font-size:3.2rem}
  /* plan, chambres, intérieurs */
  .plan{padding:4rem 1.2rem}.plan__head{grid-template-columns:1fr;gap:1.4rem;margin-bottom:2rem}.plan__map{height:30rem}.plan__card{left:.7rem;right:.7rem;bottom:.7rem;width:auto;min-height:0;padding:1rem 1.1rem}
  .rooms{padding:4rem 1.2rem}.rooms__top{display:block;margin-bottom:2rem}.rooms__top .lead{margin-top:1rem}.rooms__grid{grid-template-columns:1fr;gap:2rem}.rooms__imgs{height:22rem}.rm h3{font-size:2.50rem}
  .rinfo{padding:0 1.2rem 5rem}.rinfo__in{grid-template-columns:1fr;gap:2.4rem}.rinfo ul{grid-template-columns:1fr 1fr;gap:1.6rem}
  .int{padding:5rem 1.2rem}.int__h{margin-bottom:3rem}.int__cols{grid-template-columns:1fr;gap:2rem}.int__c{gap:2rem}.int__c:nth-child(2){margin-top:0}
  .int__f.a,.int__f.b,.int__f.c,.int__f.d{height:20rem}
  .gal{grid-template-columns:1fr;margin-top:4rem;gap:1.4rem}.gal__f{height:22rem}
  /* équipements, architecture */
  .am__in{left:1.2rem;right:1.2rem;width:auto;justify-content:flex-end;padding-bottom:4.6rem}
  .am__in>.f-k,.am__in>h2{display:none}
  .am__tabs{margin:0 0 1.2rem}.am__tabs button{font-size:2.3rem;height:2.7rem}.am__hi{height:2.7rem}.am__txt{min-height:7rem}
  .am__n{right:1.2rem;bottom:1.6rem}
  .ar-area{height:170vh}.ar__ph[data-ar-r]{display:none}.ar__shade{opacity:1}
  .ar__tx{left:1.2rem;right:1.2rem;bottom:8rem}.ar__tx h2{font-size:2.81rem}
  .oth{grid-template-columns:1fr;padding:5rem 1.2rem;gap:2.4rem}.acc__h{font-size:1.9rem}
  .cta{height:100vh}.cta .f-h{font-size:5rem}.cta .f-s{font-size:2.8rem;margin:-1.2rem 0 0 2rem}
  .ft-area{height:130vh}
  .ft__mid .f-h{font-size:2.6rem;padding:0 1.2rem}.ft__cols{flex-wrap:wrap;gap:1.4rem 2rem;justify-content:flex-start;padding:0 1.4rem}
  .ft__bot{flex-direction:column;gap:.3rem;padding:0 1.4rem;bottom:.8rem}
  /* biscuits, fenêtre */
  .ck{left:1rem;right:1rem;bottom:1rem;width:auto;padding-top:3rem}.ck .ck__t{font-size:2rem;top:.9rem}
  .md__c{width:calc(100% - 1.2rem);height:calc(100% - 1.2rem);left:.6rem;top:.6rem;margin:0;grid-template-columns:1fr}
  .md__side{display:none}.md__f{padding:1.8rem 1.4rem}.row2{grid-template-columns:1fr;gap:0}
  /* concept */
  .cp-hero h1{font-size:3.10rem}.cp-hero .f-s{font-size:1.60rem}
  .cp__sec{padding:5rem 1.2rem 24rem!important;min-height:0}.cp__sec h2{font-size:2.81rem}
  .cp__ph.r,.cp__ph.l{left:1.2rem;right:auto;top:auto;bottom:3rem;margin:0;width:16rem;height:19rem}
  .cp__end .f-h{font-size:4.6rem}
}
@media (prefers-reduced-motion:reduce){
  .clouds,.pin__p,.mk::after{animation:none!important}
}

/* ---------- retour de Thony (2026-10-25) : zoom qui mène au chalet, raisons concrètes, fin de piste, lacs, repères illustrés, appel en vidéo ---------- */
.hero__card{position:absolute;right:7%;top:42%;width:21rem;padding:1.5rem 1.6rem;background:var(--cream);color:var(--ink);opacity:0;visibility:hidden;z-index:4;display:grid;gap:.7rem;text-decoration:none}
.hero__card .f-h{font-size:2.2rem;line-height:.98}
.hero__card .f-k svg{width:.9rem;height:.9rem;vertical-align:-.1rem;margin-left:.4rem}
.rs__f{list-style:none;margin:2rem 0 0;padding:0;display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:1.4rem 2.2rem}
.rs__f b{display:block;font:400 1.56rem/1 var(--fh);text-transform:uppercase}
.rs__f span{display:block;font-size:.72rem;opacity:.75;max-width:8rem;margin-top:.3rem;line-height:1.35}
.rs__ins{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .9s ease .4s}
.rs__ins.is-cur{opacity:1}
.rs__ins figure{position:absolute;margin:0;overflow:hidden;border:.5rem solid var(--glacier);box-shadow:0 1.2rem 3rem rgba(8,20,26,.22);animation:float 9s ease-in-out infinite;animation-play-state:var(--play,running)}
.rs__ins img{width:100%;height:100%;object-fit:cover}
.rs__ins .i1{left:-6.5rem;bottom:3rem;width:13rem;height:10rem}
.rs__ins .i2{right:-3rem;top:1.2rem;width:11rem;height:13rem;animation-delay:-4s}
@keyframes float{50%{transform:translate3d(0,-.7rem,0)}}
.l-end{width:78rem;grid-template-columns:30rem 1fr;gap:4rem;align-items:center;padding:0 10rem 0 4rem}
.l-end__ph{margin:0;height:32rem;overflow:hidden}
.l-end__ph img{width:100%;height:100%;object-fit:cover}
.l-end__t{display:grid;gap:1.4rem;justify-items:start}
.l-end__t .f-s{font-size:1.80rem;color:var(--larch)}
.l-end__t p:not(.f-s):not(.f-k){max-width:22rem;font-size:.95rem;line-height:1.7}
.loc__lakes{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:1rem}
.lake{display:grid;grid-template-columns:9rem 1fr;gap:1.2rem;align-items:center;text-decoration:none;color:var(--cream);background:rgba(8,20,26,.55);padding:.8rem;transition:background .5s}
.lake:hover{background:rgba(8,20,26,.8)}
.lake__i{display:block;height:7rem;overflow:hidden}
.lake__i img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--out)}
.lake:hover .lake__i img{transform:scale(1.08)}
.lake__t b{display:block;font-size:1.33rem;line-height:1;margin-bottom:.4rem}
.lake__t span{font-size:.74rem;opacity:.85;line-height:1.4;display:block}
.loc__in{grid-template-columns:1fr 24rem}
.plan__card{display:grid;grid-template-columns:9rem 1fr;gap:1.2rem;width:30rem;padding:1rem 1.4rem 1rem 1rem}
.plan__ph{height:100%;min-height:9rem;overflow:hidden}
.plan__ph img{width:100%;height:100%;object-fit:cover}
.plan__tx{align-self:center}
.rooms .t-m{font-size:4.2rem}
.cta__bg video{width:100%;height:100%;object-fit:cover}
.cta__in .f-k{opacity:.85}
.cta__q{display:flex;gap:1rem;align-items:end;flex-wrap:wrap;justify-content:center}
.cta__q label{display:grid;gap:.4rem;text-align:left}
.cta__q input{background:rgba(244,240,231,.12);border:1px solid rgba(244,240,231,.5);color:var(--cream);padding:.9rem 1rem;font:inherit;color-scheme:dark;min-width:11rem}
.ft__big{display:grid;grid-template-columns:repeat(2,auto);gap:.1rem 4rem;justify-items:start}
.ft__big .f-h{font-size:2.8rem;line-height:1.08;text-decoration:none;color:var(--cream)}
@media (max-width:991px){
  .hero__card{left:5%;right:5%;top:auto;bottom:7rem;width:auto}
  .rs__f{grid-template-columns:repeat(3,1fr);gap:1rem}
  .rs__ins .i1{left:-.8rem;bottom:-1.6rem;width:8rem;height:6rem}.rs__ins .i2{right:-.6rem;top:-1.2rem;width:7rem;height:8.4rem}
  .l-end{width:auto;display:block;padding:1rem 1.2rem 4rem}.l-end__ph{height:18rem;margin-bottom:2rem}.l-end__t .f-s{font-size:1.50rem}
  .loc__lakes{grid-template-columns:1fr}.lake{grid-template-columns:7rem 1fr}.lake__i{height:5rem}
  .plan__card{grid-template-columns:5.5rem 1fr;width:auto;right:1rem;left:1rem;bottom:1rem}.plan__ph{min-height:6rem}
  .ft__big .f-h{font-size:2.4rem}
  .cta__q{flex-direction:column;align-items:stretch}
}
@media (prefers-reduced-motion:reduce){.rs__ins figure{animation:none}}

/* Téléphone : le contrôle et son résultat à l'écran ensemble (2026-11-08) */
@media (max-width:767px){
  /* Chambres : la photo reste collée en haut ; les noms et les flèches juste dessous, la description après */
  .rooms__grid{display:flex;flex-direction:column;gap:1.2rem;align-items:stretch}
  .rooms__imgs{position:sticky;top:0;z-index:6;height:30svh;flex:none}
  .rooms__tx{display:flex;flex-direction:column}
  .rooms__list{order:1;margin-top:0}
  .rooms__nav{order:2;margin-top:1.4rem}
  .rm__stack{order:3;margin-top:1.6rem}
}