/* =========================================================
   Domaine des Vignères — "La Réserve" luxury edition
   ========================================================= */

:root{
  --bone:#F3EDE2;
  --ivory:#FBF8F1;
  --noir:#141210;
  --ink:#201B15;
  --taupe:#8B7E6B;
  --mute:#6A6052;
  --gold:#AE8B4E;
  --gold-soft:#C9B183;
  --line:rgba(20,18,16,.16);
  --line-lt:rgba(255,255,255,.22);
  --display:"Bodoni Moda",Georgia,serif;
  --serif:"Cormorant Garamond",Georgia,serif;
  --sans:"Jost","Helvetica Neue",Arial,sans-serif;
  --e:cubic-bezier(.19,1,.22,1);
  --slow:1.4s;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);background:var(--bone);color:var(--ink);
  line-height:1.75;-webkit-font-smoothing:antialiased;overflow-x:hidden;
  font-weight:300;letter-spacing:.01em;cursor:none;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-weight:400;line-height:1.06}
.display{font-family:var(--display)}
::selection{background:var(--gold);color:#fff}

@media(hover:none){body{cursor:auto}}

/* soft paper grain */
body::after{
  content:"";position:fixed;inset:0;z-index:9990;pointer-events:none;opacity:.035;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- layout ---------- */
.wrap{width:min(1300px,88vw);margin-inline:auto}
.wrap-n{width:min(1080px,84vw);margin-inline:auto}
section{position:relative}
.pad{padding:clamp(6rem,13vw,13rem) 0}
.tick{font-family:var(--sans);font-size:.66rem;letter-spacing:.5em;text-transform:uppercase;font-weight:400;color:var(--gold);display:inline-flex;align-items:center;gap:1rem}
.tick.lt{color:var(--gold-soft)}
.roman{font-family:var(--display);font-style:italic;font-size:.95rem;color:var(--taupe);letter-spacing:.05em}
.rule{height:1px;background:var(--line);width:100%;transform:scaleX(0);transform-origin:left;transition:transform 1.6s var(--e)}
.rule.in{transform:scaleX(1)}

/* ---------- reveals ---------- */
.r{opacity:0;transform:translateY(42px);transition:opacity 1.3s var(--e),transform 1.3s var(--e)}
.r.in{opacity:1;transform:none}
.stag>*{opacity:0;transform:translateY(34px);transition:opacity 1.1s var(--e),transform 1.1s var(--e)}
.stag.in>*{opacity:1;transform:none}
/* clip image reveal */
.clip{overflow:hidden}
.clip img{clip-path:inset(0 0 100% 0);transform:scale(1.18);transition:clip-path 1.7s var(--e),transform 2.2s var(--e)}
.clip.in img{clip-path:inset(0 0 0 0);transform:scale(1)}
/* masked line text */
.mask{overflow:hidden;display:block}
.mask>span{display:block;transform:translateY(115%);transition:transform 1.3s var(--e)}
.mask.in>span{transform:none}

/* ---------- custom cursor ---------- */
.cur,.cur-d{position:fixed;top:0;left:0;z-index:9999;pointer-events:none;border-radius:50%;mix-blend-mode:difference}
.cur{width:38px;height:38px;border:1px solid rgba(255,255,255,.7);transform:translate(-50%,-50%);transition:width .4s var(--e),height .4s var(--e),background .4s}
.cur-d{width:5px;height:5px;background:#fff;transform:translate(-50%,-50%)}
.cur.grow{width:74px;height:74px;background:rgba(255,255,255,.12)}

/* ---------- preloader ---------- */
.pre{position:fixed;inset:0;z-index:10000;background:var(--noir);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.6rem;transition:opacity 1s var(--e),visibility 1s}
.pre.done{opacity:0;visibility:hidden}
.pre .pre-logo{width:clamp(240px,40vw,420px);opacity:0;animation:logoReveal 1.9s var(--e) .25s forwards}
.pre .pre-logo img{width:100%;height:auto;display:block}
.pre .pline{width:0;height:1px;background:var(--gold-soft);animation:preLine 1.5s var(--e) 1s forwards}
.pre .pt{font-family:var(--sans);font-size:.62rem;letter-spacing:.5em;text-transform:uppercase;color:var(--taupe);opacity:0;animation:preIn 1.2s var(--e) 1.25s forwards}
@keyframes preIn{to{opacity:1}}
@keyframes preLine{to{width:200px}}
@keyframes logoReveal{
  0%{opacity:0;clip-path:inset(0 100% 0 0);transform:translateY(10px) scale(.985)}
  55%{opacity:1}
  100%{opacity:1;clip-path:inset(0 0 0 0);transform:translateY(0) scale(1)}
}

/* =========================================================
   NAV
   ========================================================= */
.nav{position:fixed;top:0;left:0;width:100%;z-index:900;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  padding:1.9rem clamp(1.4rem,4vw,3.2rem);transition:padding .6s var(--e),background .6s var(--e),box-shadow .6s var(--e)}
.nav.scr{background:rgba(243,237,226,.9);backdrop-filter:blur(16px);padding:1.1rem clamp(1.4rem,4vw,3.2rem);box-shadow:0 1px 0 var(--line)}
.nav a,.nav span,.nav .lang button{color:#fff;transition:color .6s}
.nav.scr a,.nav.scr span,.nav.scr .lang button{color:var(--ink)}
.n-left{display:flex;gap:2.4rem}
.n-left a,.n-right a{font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;position:relative}
.n-left a::after,.n-right a.u::after{content:"";position:absolute;left:0;bottom:-4px;height:1px;width:0;background:currentColor;transition:width .5s var(--e)}
.n-left a:hover::after,.n-right a.u:hover::after{width:100%}
.n-logo{position:relative;display:flex;align-items:center;justify-content:center;line-height:0}
.n-logo img{height:clamp(30px,3.4vw,40px);width:auto;transition:opacity .6s var(--e),height .6s var(--e)}
.n-logo .ld{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);opacity:0}
.nav.scr .n-logo img{height:clamp(27px,3vw,34px)}
.nav.scr .n-logo .lw{opacity:0}
.nav.scr .n-logo .ld{opacity:1}
.n-right{justify-self:end;display:flex;align-items:center;gap:2rem}
.n-cta{border:1px solid currentColor;padding:.72rem 1.5rem;border-radius:0;font-size:.66rem!important;letter-spacing:.28em!important;transition:background .5s var(--e),color .5s var(--e)}
.nav .n-cta:hover{background:#fff;color:var(--ink)}
.nav.scr .n-cta:hover{background:var(--ink);color:var(--bone)}
.n-burg{display:none;flex-direction:column;gap:6px;cursor:none}
.n-burg span{width:26px;height:1px;background:currentColor;transition:.4s}

/* =========================================================
   HERO
   ========================================================= */
.hero{height:100svh;min-height:680px;position:relative;overflow:hidden;display:flex;align-items:flex-end}
.hero-bg{position:absolute;inset:0;z-index:0}
.hero-bg img{width:100%;height:100%;object-fit:cover;transform:scale(1.12);animation:heroZoom 6s var(--e) forwards;filter:brightness(.82) contrast(1.03) saturate(.98)}
@keyframes heroZoom{to{transform:scale(1)}}
.hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,8,6,.5),rgba(10,8,6,.05) 30%,rgba(10,8,6,.1) 55%,rgba(10,8,6,.72))}
.hero-frame{position:absolute;inset:clamp(1.2rem,3vw,2.2rem);border:1px solid var(--line-lt);z-index:2;pointer-events:none}
.hero-in{position:relative;z-index:3;width:min(1300px,88vw);margin:0 auto clamp(3rem,8vw,6rem);color:#fff}
.hero .tick{margin-bottom:2rem;color:var(--gold-soft)}
.hero .tick::before{content:"";width:46px;height:1px;background:var(--gold-soft)}
.hero h1{font-family:var(--display);font-weight:400;font-size:clamp(3rem,9vw,8.4rem);letter-spacing:.01em;line-height:.98}
.hero h1 em{font-family:var(--serif);font-style:italic;font-weight:400}
.hero-meta{display:flex;flex-wrap:wrap;gap:2.6rem;align-items:flex-start;margin-top:2.6rem;border-top:1px solid var(--line-lt);padding-top:1.8rem}
.hero-meta p{font-family:var(--serif);font-size:1.25rem;font-style:italic;color:rgba(255,255,255,.9);max-width:30rem;line-height:1.5}
.hero-meta .stars{margin-left:auto;text-align:right;flex-shrink:0}
.hero-meta .stars b{font-family:var(--display);font-size:2.6rem;display:block;font-weight:400;line-height:1}
.hero-meta .stars span{font-size:.58rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-soft);display:block;margin-top:.5rem}

/* language toggle */
.lang{display:flex;align-items:center;gap:.5rem}
.lang button{background:none;border:none;cursor:none;font-family:var(--sans);font-size:.72rem;letter-spacing:.16em;color:inherit;opacity:.5;transition:opacity .4s var(--e);padding:0;line-height:1}
.lang button.on{opacity:1}
.lang button:hover{opacity:.85}
.lang span{opacity:.4;font-size:.6rem}
.hero-scroll{position:absolute;left:50%;bottom:1.6rem;transform:translateX(-50%);z-index:3;color:#fff;font-size:.58rem;letter-spacing:.4em;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:.8rem}
.hero-scroll i{width:1px;height:50px;background:linear-gradient(#fff,transparent);animation:cue 2.4s var(--e) infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* =========================================================
   INTRO / MANIFESTO
   ========================================================= */
.manifesto{background:var(--bone)}
.manifesto .top{display:flex;justify-content:space-between;align-items:baseline;gap:2rem;margin-bottom:clamp(3rem,7vw,6rem)}
.manifesto .lead{font-family:var(--display);font-weight:400;font-size:clamp(1.8rem,3.6vw,3.1rem);line-height:1.28;letter-spacing:.005em;max-width:20ch}
.manifesto .lead em{font-family:var(--serif);font-style:italic;color:var(--gold)}
.manifesto .cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,6rem);margin-top:clamp(3rem,6vw,5rem)}
.manifesto .cols p{color:var(--mute);font-size:1.02rem;margin-bottom:1.2rem;max-width:34rem}
.manifesto .sign{font-family:var(--serif);font-style:italic;font-size:1.6rem;color:var(--ink);margin-top:1rem}
.manifesto .sign small{display:block;font-family:var(--sans);font-style:normal;font-size:.66rem;letter-spacing:.3em;text-transform:uppercase;color:var(--taupe);margin-top:.6rem}

/* =========================================================
   FULL-BLEED BAND
   ========================================================= */
.band{height:92vh;min-height:600px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;text-align:center}
.band .bg{position:absolute;inset:-10% 0;z-index:0}
.band .bg img{width:100%;height:100%;object-fit:cover;filter:brightness(.7)}
.band-in{position:relative;z-index:2;color:#fff;width:min(920px,88vw)}
.band-in .tick{color:var(--gold-soft);justify-content:center;margin-bottom:2rem}
.band-in h2{font-family:var(--display);font-weight:400;font-size:clamp(2rem,5vw,4rem);line-height:1.15}
.band-in h2 em{font-family:var(--serif);font-style:italic}

/* =========================================================
   ACCOMMODATIONS (alternating spreads)
   ========================================================= */
.stay{background:var(--ivory)}
.stay .shead{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;margin-bottom:clamp(3rem,6vw,5rem)}
.stay .shead h2{font-family:var(--display);font-size:clamp(2.2rem,5vw,4rem);font-weight:400}
.stay .shead p{color:var(--mute);max-width:26rem;font-size:.98rem}
.spread{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,6vw,6rem);align-items:center;padding:clamp(2.5rem,6vw,6rem) 0;border-top:1px solid var(--line)}
.spread:nth-child(even){grid-template-columns:.85fr 1.15fr}
.spread:nth-child(even) .sp-txt{order:-1}
.spread .sp-img{aspect-ratio:4/3;overflow:hidden}
.spread .sp-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.8s var(--e)}
.spread:hover .sp-img>img{transform:scale(1.06)}
/* suite slideshow */
.sp-slides{position:relative}
.sp-slides img{position:absolute;inset:0;opacity:0;transition:opacity 1.3s var(--e),transform 1.8s var(--e)}
.sp-slides img.on{opacity:1}
.sp-dots{position:absolute;bottom:1.1rem;left:50%;transform:translateX(-50%);display:flex;gap:.55rem;z-index:3}
.sp-dots i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.45);cursor:none;transition:background .5s var(--e),width .5s var(--e),border-radius .5s}
.sp-dots i.on{background:#fff;width:22px;border-radius:4px}
.sp-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:44px;height:44px;border:none;border-radius:50%;background:rgba(20,18,16,.3);color:#fff;font-family:var(--display);font-size:1.6rem;line-height:1;padding-bottom:.15em;display:flex;align-items:center;justify-content:center;cursor:none;opacity:0;transition:opacity .5s var(--e),background .4s var(--e)}
.sp-slides:hover .sp-nav{opacity:1}
.sp-nav:hover{background:rgba(20,18,16,.62)}
.sp-prev{left:1rem}.sp-next{right:1rem}
.sp-count{position:absolute;bottom:1.1rem;right:1.2rem;z-index:4;font-size:.7rem;letter-spacing:.16em;color:#fff;background:rgba(20,18,16,.32);padding:.4rem .7rem;backdrop-filter:blur(4px)}
.sp-count .sp-sep{margin:0 .4em;opacity:.55}
.sp-txt .no{font-family:var(--display);font-style:italic;font-size:1rem;color:var(--gold)}
.sp-txt h3{font-family:var(--display);font-weight:400;font-size:clamp(1.9rem,3.4vw,2.9rem);margin:1rem 0 1.2rem}
.sp-txt p{color:var(--mute);max-width:34rem;margin-bottom:1.6rem}
.sp-feats{display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;list-style:none;border-top:1px solid var(--line);padding-top:1.4rem}
.sp-feats li{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--taupe)}
.sp-feats li::before{content:"—  ";color:var(--gold)}

/* ---------- link ---------- */
.lk{display:inline-flex;align-items:center;gap:.9rem;font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;color:var(--ink);padding-bottom:.5rem;border-bottom:1px solid var(--line);transition:gap .4s var(--e),border-color .4s}
.lk:hover{gap:1.5rem;border-color:var(--gold)}
.lk span{color:var(--gold);font-size:1.1rem;line-height:0}

/* =========================================================
   ART DE VIVRE (three refined columns)
   ========================================================= */
.vivre{background:var(--bone)}
.vivre .vhead{text-align:center;margin-bottom:clamp(3rem,6vw,5rem)}
.vivre .vhead .tick{justify-content:center;margin-bottom:1.6rem}
.vivre .vhead h2{font-family:var(--display);font-size:clamp(2.2rem,5vw,4rem);font-weight:400}
.vgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.5rem,3vw,2.6rem)}
.vcard .clip{aspect-ratio:3/4;margin-bottom:1.6rem}
.vcard .clip img{width:100%;height:100%;object-fit:cover}
.vcard .roman{display:block;margin-bottom:.7rem}
.vcard h3{font-family:var(--display);font-weight:400;font-size:1.7rem;margin-bottom:.7rem}
.vcard p{color:var(--mute);font-size:.94rem}

/* =========================================================
   SERVICES
   ========================================================= */
.svc{background:var(--ivory)}
.svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:clamp(2.5rem,5vw,4rem)}
.svc-i{background:var(--ivory);padding:2.4rem 1.8rem 2.6rem;transition:background .6s var(--e)}
.svc-i:hover{background:var(--bone)}
.svc-i .roman{display:block;font-family:var(--display);font-style:italic;color:var(--gold);margin-bottom:1.1rem}
.svc-i h4{font-family:var(--display);font-weight:400;font-size:1.4rem;margin-bottom:.6rem;line-height:1.15}
.svc-i p{color:var(--mute);font-size:.9rem}

/* =========================================================
   EXPERIENCES (hover list)
   ========================================================= */
.exp{background:var(--noir);color:var(--bone);overflow:hidden}
.exp .ehead{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;margin-bottom:3rem}
.exp .ehead .tick{color:var(--gold-soft)}
.exp .ehead h2{font-family:var(--display);font-size:clamp(2.2rem,5vw,4rem);font-weight:400;color:var(--bone)}
.exp .ehead p{color:var(--taupe);max-width:24rem;font-size:.95rem}
.elist{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(.7rem,1.2vw,1.3rem)}
.erow{display:block;position:relative;overflow:hidden;border:none;padding:0;border-radius:4px;aspect-ratio:3/4}
.erow .ethumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transition:transform 1.2s var(--e)}
.erow::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(10,10,10,.88) 0%,rgba(10,10,10,.3) 50%,rgba(10,10,10,0) 100%)}
.erow .ei{position:absolute;left:1.05rem;right:1.05rem;bottom:1.05rem;z-index:2;display:flex;flex-direction:column;align-items:flex-start;gap:.3rem}
.erow .ei .en{font-family:var(--display);font-style:italic;font-size:.82rem;color:var(--gold-soft)}
.erow .ei h3{font-family:var(--display);font-weight:400;font-size:clamp(1.15rem,1.5vw,1.55rem);line-height:1.12;color:var(--bone);transition:color .5s}
.erow .ed{position:absolute;top:1rem;left:1.05rem;right:1.05rem;z-index:2;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(251,248,241,.85)}
.erow:hover .ethumb{transform:scale(1.06)}
@media(max-width:1024px){.elist{grid-template-columns:repeat(3,1fr)}}
@media(max-width:680px){.elist{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.elist{grid-template-columns:1fr}.erow{aspect-ratio:16/10}}
.enote{display:flex;flex-wrap:wrap;gap:2.5rem 4rem;margin-top:3rem}
.enote .k{font-family:var(--display);font-size:1.5rem;color:var(--bone)}
.enote .v{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--taupe);margin-top:.3rem}

/* =========================================================
   NATURE
   ========================================================= */
.nature{background:var(--bone)}
.nature .nhead{text-align:center;margin-bottom:clamp(3rem,6vw,4.5rem)}
.nature .nhead .tick{justify-content:center;margin-bottom:1.6rem}
.nature .nhead h2{font-family:var(--display);font-size:clamp(2.2rem,5vw,4rem);font-weight:400}
.nature .nhead h2 em{font-family:var(--serif);font-style:italic;color:var(--gold)}
.ncols{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.nfig{aspect-ratio:4/5}
.nfig img{width:100%;height:100%;object-fit:cover}
.ntext p{color:var(--mute);font-size:1.02rem;margin-bottom:1.2rem;max-width:34rem}
.ngrid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:clamp(2.6rem,5vw,4rem)}
.nspecies{background:var(--ivory);padding:2.2rem 1.7rem 2.4rem;transition:background .6s var(--e)}
.nspecies:hover{background:var(--bone)}
.nspecies .roman{display:block;font-family:var(--display);font-style:italic;color:var(--gold);margin-bottom:1rem}
.nspecies h3{font-family:var(--display);font-weight:400;font-size:1.35rem;line-height:1.14;margin-bottom:.25rem}
.nspecies .lat{display:block;font-family:var(--serif);font-style:italic;color:var(--taupe);font-size:.95rem;margin-bottom:.85rem}
.nspecies p{color:var(--mute);font-size:.88rem}
@media(max-width:900px){.ncols{grid-template-columns:1fr;gap:2rem}.ngrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.ngrid{grid-template-columns:1fr}}

/* =========================================================
   TESTIMONIAL
   ========================================================= */
.testi{background:var(--bone);text-align:center}
.testi .tick{justify-content:center;margin-bottom:2.4rem}
.testi .score{font-family:var(--display);font-size:clamp(4rem,10vw,8rem);font-weight:400;line-height:1;color:var(--ink)}
.testi .score sup{font-size:.3em;color:var(--gold);vertical-align:super;font-style:italic;font-family:var(--serif)}
.testi .sl{font-size:.66rem;letter-spacing:.4em;text-transform:uppercase;color:var(--taupe);margin:1rem 0 3rem}
.testi blockquote{font-family:var(--serif);font-style:italic;font-size:clamp(1.6rem,3.6vw,2.7rem);line-height:1.4;max-width:22ch;margin:0 auto;color:var(--ink)}
.testi .cite{font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-top:2.4rem}
.testi .dots{display:flex;gap:.6rem;justify-content:center;margin-top:2.4rem}
.testi .dots i{width:6px;height:6px;border-radius:50%;background:var(--line);transition:background .4s}
.testi .dots i.on{background:var(--gold)}

/* =========================================================
   RESERVATION
   ========================================================= */
.resv{position:relative;overflow:hidden;color:#fff;text-align:center}
.resv .bg{position:absolute;inset:0;z-index:0}
.resv .bg img{width:100%;height:100%;object-fit:cover;filter:brightness(.55)}
.resv-in{position:relative;z-index:2;width:min(960px,90vw);margin-inline:auto}
.resv .tick{color:var(--gold-soft);justify-content:center;margin-bottom:2rem}
.resv h2{font-family:var(--display);font-weight:400;font-size:clamp(2.4rem,6vw,5rem);line-height:1.08;margin-bottom:1.4rem}
.resv h2 em{font-family:var(--serif);font-style:italic}
.resv p{color:rgba(255,255,255,.82);max-width:34rem;margin:0 auto 3rem}
.resbar{display:flex;flex-wrap:wrap;align-items:stretch;background:rgba(251,248,241,.08);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.28);max-width:820px;margin:0 auto}
.resbar .f{flex:1;min-width:160px;padding:1.3rem 1.6rem;text-align:left;border-right:1px solid rgba(255,255,255,.22)}
.resbar .f label{display:block;font-size:.58rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:.5rem}
.resbar .f .val{font-family:var(--serif);font-size:1.15rem;color:#fff}
.resbar .go{background:var(--gold);color:#fff;border:none;padding:0 2.4rem;font-family:var(--sans);font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;cursor:none;transition:background .5s var(--e)}
.resbar .go:hover{background:#fff;color:var(--ink)}

/* =========================================================
   FOOTER
   ========================================================= */
.ft{background:var(--noir);color:var(--taupe);padding:clamp(4rem,8vw,7rem) 0 2.5rem}
.ft-top{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr 1fr;gap:2.5rem;padding-bottom:3.5rem;border-bottom:1px solid rgba(255,255,255,.13)}
.ft-brand img{width:clamp(170px,18vw,220px);height:auto;display:block;opacity:.95}
.ft-brand small{display:block;font-family:var(--sans);font-size:.56rem;letter-spacing:.4em;margin-top:1rem;font-weight:400;color:var(--taupe);text-transform:uppercase}
.ft p{font-size:.92rem;margin-top:1.4rem;max-width:24rem;font-family:var(--serif);font-style:italic;font-size:1.05rem;color:rgba(251,248,241,.6)}
.ft h4{color:var(--bone);font-size:.62rem;letter-spacing:.3em;text-transform:uppercase;margin-bottom:1.4rem;font-weight:400}
.ft a{display:block;padding:.32rem 0;font-size:.92rem;transition:color .4s}
.ft a:hover{color:var(--gold-soft)}
.ft-bot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;padding-top:2rem;font-size:.72rem;letter-spacing:.08em}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media(max-width:1000px){
  .vgrid{grid-template-columns:1fr;gap:3rem;max-width:460px;margin-inline:auto}
  .ft-top{grid-template-columns:1fr 1fr}
}
@media(max-width:820px){
  body{cursor:auto}.cur,.cur-d{display:none}
  .nav{grid-template-columns:auto 1fr auto}
  .n-left{position:fixed;inset:0;background:var(--noir);flex-direction:column;justify-content:center;align-items:center;gap:2.2rem;transform:translateY(-100%);transition:transform .7s var(--e);z-index:5}
  .n-left.open{transform:none}
  .n-left a{color:#fff!important;font-size:1rem}
  .nav.scr .n-left a{color:#fff!important}
  .n-right .rl{display:none}
  .n-burg{display:flex}
  .manifesto .top{flex-direction:column;gap:1.5rem}
  .manifesto .cols{grid-template-columns:1fr}
  .spread,.spread:nth-child(even){grid-template-columns:1fr;gap:1.8rem}
  .spread .sp-txt,.spread:nth-child(even) .sp-txt{order:2}
  .stay .shead,.exp .ehead{flex-direction:column;align-items:flex-start;gap:1rem}
  .sp-nav{opacity:1;width:40px;height:40px;background:rgba(20,18,16,.42);cursor:auto}
  .resbar .f{border-right:none;border-bottom:1px solid rgba(255,255,255,.22)}
  .resbar .go{width:100%;padding:1.2rem}
  .ft-top{grid-template-columns:1fr;gap:2rem}
  /* Hero bottom — stack meta, drop colliding scroll cue */
  .hero-meta{flex-direction:column;gap:1.1rem;margin-top:1.6rem;padding-top:1.4rem}
  .hero-meta p{font-size:1.05rem}
  .hero-meta .stars{margin-left:0;text-align:left}
  .hero-meta .stars b{font-size:2rem}
  .hero-meta .stars span{letter-spacing:.14em;font-size:.56rem}
  .hero-scroll{display:none}
  /* Band — reveal more of the pool */
  .band{height:auto;min-height:78vh}
  .band .bg img{object-position:center 82%}
  /* Services — two tidy columns */
  .svc-grid{grid-template-columns:repeat(2,1fr)}
  .svc-i{padding:1.9rem 1.3rem 2.1rem}
  .svc-i h4{font-size:1.2rem}
}
@media(max-width:520px){
  .svc-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition-duration:.001s!important}
  .r,.stag>*,.mask>span{opacity:1;transform:none}
  .clip img{clip-path:none;transform:none}
  .pre .pre-logo,.pre .pt{opacity:1;clip-path:none;transform:none}
  .pre .pline{width:200px}
}