/* Meenaa's Millionaire Club — palette taken from the logo: deep navy + gold, with an ivory surface drawn from the gold. */
:root{
  --navy-950:#050a17; --navy-900:#070d1c; --navy-800:#0b1530; --navy-700:#13223f;
  --gold:#d4af37; --gold-l:#f1d489; --gold-d:#a8841f;
  --ivory:#f7f1e3; --ivory-2:#efe5cf; --ivory-3:#e6d8b8;
  --txt:#ece6d6; --muted:#a3a8b8; --ink:#0b1530; --ink-muted:#4d5673;
  --line-d:rgba(212,175,55,.24); --line-l:rgba(11,21,48,.14);
  --gold-grad:linear-gradient(135deg,#f5d97a 0%,#d4af37 45%,#a8841f 100%);
  --serif:'Playfair Display','Playfair Fallback',Georgia,serif;
  --sans:'Inter','Inter Fallback',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --mono:'DM Mono','DM Mono Fallback',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --script:'Caveat','Caveat Fallback',cursive;
  --display:'Cinzel','Playfair Display',serif;
  --ease:cubic-bezier(.19,1,.22,1);
  --ease-io:cubic-bezier(.65,0,.35,1);
  --hdr:84px;
  --gut:clamp(1rem,4vw,3rem);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{margin:0;background:var(--navy-900);color:var(--txt);font:16px/1.65 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:clip}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;line-height:1.08;margin:0 0 .5em;letter-spacing:-.01em}
h1{font-size:clamp(2.8rem,8vw,6.6rem)}
h2{font-size:clamp(2.1rem,4.6vw,3.9rem)}
h3{font-size:clamp(1.25rem,1.8vw,1.55rem)}
h1 em,h2 em,h3 em{font-style:italic;color:var(--gold)}
p{margin:0 0 1em}
ul,ol{margin:0;padding:0}
button{font:inherit}
.wrap{width:min(1240px,100% - 2*var(--gut));margin-inline:auto}
.wrap-wide{width:calc(100% - 2*var(--gut));margin-inline:auto}
.skip{position:absolute;left:-999px;top:0;background:var(--gold);color:#000;padding:.6rem 1rem;z-index:200}
.skip:focus{left:0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* type accents — mono for labels (Drake), handwritten script for the odd note (Estelle) */
.kicker{font-family:var(--mono);font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin:0 0 1.2rem;display:inline-flex;align-items:center;gap:.8rem}
.kicker::before{content:"";width:28px;height:1px;background:currentColor}
.kicker.center{justify-content:center}
.script{font-family:var(--script);font-weight:500;color:var(--gold);line-height:1;letter-spacing:0}
.note-hand{font-family:var(--script);font-size:clamp(1.5rem,2.4vw,2.1rem);line-height:1.1;color:var(--gold-d);transform:rotate(-4deg);display:inline-block}
.sc{font-variant:small-caps;letter-spacing:.14em;font-feature-settings:"smcp"}
.lead{font-size:clamp(1.05rem,1.4vw,1.22rem);max-width:620px;color:var(--muted)}
.muted{color:var(--muted)} .small{font-size:.86rem}
.center{text-align:center}

/* themes */
.t-light{background:var(--ivory);color:var(--ink)}
.t-light .lead,.t-light .muted{color:var(--ink-muted)}
.t-light h1 em,.t-light h2 em,.t-light h3 em{color:var(--gold-d)}
.t-light .kicker{color:var(--gold-d)}
.t-cream{background:var(--ivory-2);color:var(--ink)}
.t-cream .lead,.t-cream .muted{color:var(--ink-muted)}
.t-cream .kicker{color:var(--gold-d)}
.t-cream h2 em{color:var(--gold-d)}
.t-dark{background:var(--navy-900);color:var(--txt)}
.t-deep{background:var(--navy-800);color:var(--txt)}
.sec{padding:clamp(4.5rem,11vw,9rem) 0;position:relative}
.sec-sm{padding:clamp(3rem,7vw,5.5rem) 0}
.sec-head{max-width:780px;margin-bottom:clamp(2.5rem,5vw,4rem)}
.sec-head.center{margin-inline:auto;text-align:center}
.sec-head .lead{margin-inline:inherit}
.sec-head.center .lead{margin-inline:auto}
.row-head{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap;margin-bottom:clamp(2.5rem,5vw,4rem)}
.row-head h2{margin:0}

/* ───────── Buttons — one framed block: label | hairline | arrow. Hover: colour rises from the bottom (same motion as the footer socials) and the arrow slides through ───────── */
.btn{--bg:var(--gold);--fg:var(--navy-900);--bd:var(--gold);--hbg:var(--ivory);--hfg:var(--navy-900);--hbd:var(--ivory);
  display:inline-flex;align-items:stretch;position:relative;isolation:isolate;overflow:hidden;
  background:var(--bg);color:var(--fg);border:1px solid var(--bd);border-radius:2px;padding:0;cursor:pointer;
  font-family:var(--mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;line-height:1;white-space:nowrap;
  transition:color .55s var(--ease),border-color .55s var(--ease)}
.btn::before{content:"";position:absolute;inset:0;background:var(--hbg);transform:scaleY(0);transform-origin:left top;transition:transform .55s var(--ease);z-index:-1}
.btn:hover,.btn:focus-visible{color:var(--hfg);border-color:var(--hbd)}
.btn:hover::before,.btn:focus-visible::before{transform:scaleY(1);transform-origin:left bottom}
.btn__label{display:flex;align-items:center;padding:1.15em 1.45em 1.15em 1.6em}
.btn__icon{position:relative;width:3.2em;display:grid;place-items:center;overflow:hidden}
.btn__icon::before{content:"";position:absolute;left:0;top:26%;bottom:26%;width:1px;background:currentColor;opacity:.35}
.btn__icon svg{width:14px;height:14px;grid-area:1/1;transition:transform .6s var(--ease)}
.btn__icon svg+svg{transform:translateX(-240%)}
.btn:hover .btn__icon svg,.btn:focus-visible .btn__icon svg{transform:translateX(240%)}
.btn:hover .btn__icon svg+svg,.btn:focus-visible .btn__icon svg+svg{transform:translateX(0)}
.btn--ghost{--bg:transparent;--fg:var(--ivory);--bd:rgba(241,212,137,.55);--hbg:var(--gold);--hfg:var(--navy-900);--hbd:var(--gold)}
.btn--ink{--bg:var(--navy-800);--fg:var(--ivory);--bd:var(--navy-800);--hbg:var(--gold);--hfg:var(--navy-900);--hbd:var(--gold)}
.btn--ink-ghost{--bg:transparent;--fg:var(--ink);--bd:rgba(11,21,48,.35);--hbg:var(--navy-800);--hfg:var(--ivory);--hbd:var(--navy-800)}
.btn--wa{--bg:#1f8f4e;--fg:#fff;--bd:#1f8f4e;--hbg:#146b39;--hfg:#fff;--hbd:#146b39}
.btn--sm{font-size:.68rem}
.btn--sm .btn__label{padding:.95em 1.1em .95em 1.2em}
.btn--sm .btn__icon{width:2.8em}
.btns{display:flex;flex-wrap:wrap;gap:.9rem;align-items:center}
/* text link with underline draw */
.tlink{font-family:var(--mono);font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;display:inline-flex;gap:.6rem;align-items:center;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;padding-bottom:.35em;transition:background-size .7s var(--ease)}
.tlink:hover{background-size:0 1px;background-position:100% 100%}

/* ───────── Header (Estelle Manor / The Ned): centred crest, split links, transparent over the hero, solid on scroll, hides on scroll-down ───────── */
.hdr{position:fixed;inset:0 0 auto;z-index:80;color:var(--ivory);transition:transform .7s var(--ease),background-color .5s,color .5s,box-shadow .5s}
.hdr::after{content:"";position:absolute;inset:auto 0 0;height:1px;background:rgba(241,212,137,.28);transform:scaleX(.0);transition:transform .9s var(--ease)}
.hdr.is-solid{background:rgba(7,13,28,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.hdr.is-solid::after,.hdr.is-top::after{transform:scaleX(1)}
.hdr.is-top::after{background:rgba(241,212,137,.18)}
.hdr.is-hidden{transform:translateY(-100%)}
.hdr__bar{height:var(--hdr);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1.5rem;width:calc(100% - 2*var(--gut));margin-inline:auto}
.hdr__nav{display:flex;align-items:center;gap:clamp(1.2rem,2.4vw,2.4rem)}
.hdr__nav--r{justify-content:flex-end}
.hdr__nav a:not(.btn){font-family:var(--mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;position:relative;padding:.4rem 0}
.hdr__nav a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:right;transition:transform .6s var(--ease)}
.hdr__nav a:not(.btn):hover::after,.hdr__nav a[aria-current]::after{transform:scaleX(1);transform-origin:left}
.hdr__nav a[aria-current]{color:var(--gold-l)}
.brand{display:flex;align-items:center;gap:.7rem;color:var(--ivory)}
.brand img{height:44px;width:auto;border-radius:50%;transition:height .5s var(--ease)}
.hdr.is-solid .brand img{height:38px}
.brand span{display:flex;flex-direction:column;line-height:1.02}
.brand b{font-family:var(--serif);font-weight:600;font-size:1.3rem;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.brand small{font-family:var(--display);font-size:.56rem;letter-spacing:.32em;text-transform:uppercase}
.menu-btn{display:none;justify-self:end;align-items:center;gap:.7rem;background:none;border:0;color:inherit;font-family:var(--mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;padding:.6rem 0}
.menu-btn i{display:grid;gap:5px}
.menu-btn i::before,.menu-btn i::after{content:"";width:24px;height:1px;background:currentColor;transition:transform .5s var(--ease)}
.menu-open .menu-btn i::before{transform:translateY(3px) rotate(45deg)}
.menu-open .menu-btn i::after{transform:translateY(-3px) rotate(-45deg)}
/* overlay menu (mobile / tablet) */
.menu{position:fixed;inset:0;z-index:70;background:var(--navy-950);color:var(--ivory);display:grid;grid-template-rows:1fr auto;padding:calc(var(--hdr) + 2rem) var(--gut) 2rem;clip-path:inset(0 0 100% 0);transition:clip-path .9s var(--ease);visibility:hidden}
.menu-open .menu{clip-path:inset(0);visibility:visible}
.menu ol{list-style:none;counter-reset:m;align-self:center}
.menu li{counter-increment:m;overflow:hidden;border-bottom:1px solid var(--line-d)}
.menu li a{display:flex;align-items:baseline;gap:1rem;font-family:var(--serif);font-size:clamp(2rem,8vw,3.4rem);padding:.35rem 0;transform:translateY(105%);transition:transform .9s var(--ease)}
.menu li a::before{content:"0" counter(m);font-family:var(--mono);font-size:.72rem;color:var(--gold);letter-spacing:.1em}
.menu li a[aria-current]{color:var(--gold-l);font-style:italic}
.menu-open .menu li a{transform:none}
.menu-open .menu li:nth-child(2) a{transition-delay:.05s}.menu-open .menu li:nth-child(3) a{transition-delay:.1s}.menu-open .menu li:nth-child(4) a{transition-delay:.15s}.menu-open .menu li:nth-child(5) a{transition-delay:.2s}.menu-open .menu li:nth-child(6) a{transition-delay:.25s}.menu-open .menu li:nth-child(7) a{transition-delay:.3s}
.menu__foot{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.menu__foot a{color:var(--gold-l)}
html.menu-open{overflow:hidden}
.menu-open .hdr{background:transparent;backdrop-filter:none}

/* ───────── Hero (home) ───────── */
.hero{position:relative;min-height:100vh;min-height:100svh;display:grid;align-items:end;color:var(--ivory);overflow:hidden;isolation:isolate}
.hero__media{position:absolute;inset:0;z-index:-2;overflow:hidden}
.hero__media img{width:100%;height:118%;object-fit:cover;object-position:50% 40%}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(5,10,23,.55) 0%,rgba(5,10,23,.15) 35%,rgba(5,10,23,.35) 60%,rgba(5,10,23,.92) 100%)}
.hero__inner{padding:calc(var(--hdr) + 3rem) 0 clamp(6rem,10vw,7.5rem)}
.hero h1{max-width:12ch;margin-bottom:.35em;font-weight:500}
.hero h1 sup{font-size:.22em;vertical-align:super;font-family:var(--sans);color:var(--gold-l);margin-left:.1em;font-style:normal}
.hero__note{position:absolute;right:max(var(--gut),8vw);top:34%;font-size:clamp(1.7rem,3vw,2.6rem);color:var(--gold-l);transform:rotate(-6deg)}
.hero__row{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap}
.hero__row .lead{color:rgba(236,230,214,.82);margin:0}
.hero__scroll{position:absolute;left:50%;bottom:1.4rem;transform:translateX(-50%);font-family:var(--mono);font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;display:grid;justify-items:center;gap:.6rem;color:rgba(236,230,214,.7)}
.hero__scroll i{width:1px;height:42px;background:linear-gradient(var(--gold),transparent);transform-origin:top;animation:drip 2.4s var(--ease-io) infinite}
@keyframes drip{0%{transform:scaleY(0)}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* page hero (inner pages) — image moves, content stays */
.phero{position:relative;min-height:min(84vh,760px);min-height:min(84svh,760px);display:grid;align-items:end;color:var(--ivory);overflow:hidden;isolation:isolate}
.phero .hero__media img{height:125%}
.phero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(5,10,23,.6),rgba(5,10,23,.2) 40%,rgba(5,10,23,.9))}
.phero__inner{padding:calc(var(--hdr) + 4rem) 0 clamp(2.5rem,6vw,4.5rem)}
.phero h1{font-size:clamp(2.6rem,7vw,5.6rem);max-width:15ch}
.phero .lead{color:rgba(236,230,214,.82)}
.crumbs{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(236,230,214,.65);margin-bottom:1.4rem}
.crumbs a:hover{color:var(--gold-l)}

/* ───────── Split-word headings (subtle mask rise) ───────── */
.w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.w>span{display:inline-block}

/* ───────── Statement (Estelle pic 1) ───────── */
.statement{font-family:var(--serif);font-size:clamp(1.6rem,3.3vw,2.75rem);line-height:1.42;text-align:center;max-width:26ch;margin:0 auto;letter-spacing:-.005em}
.statement .sc{font-size:.84em}
.statement em{font-style:italic}
.statement .word{transition:none}

/* ───────── Image-filled text (The Quorum) ───────── */
.imgtext{background-size:var(--bs,140%);background-position:50% var(--py,50%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;transition:background-size 1.4s var(--ease)}
.imgtext:hover,a:hover .imgtext{--bs:185%}
@supports not ((-webkit-background-clip:text) or (background-clip:text)){.imgtext{color:var(--gold);-webkit-text-fill-color:var(--gold)}}
.bigword{font-family:var(--serif);font-weight:600;font-size:clamp(4rem,15vw,14rem);line-height:.9;letter-spacing:-.03em;margin:0}
.bigword em{font-weight:500}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-l);margin-top:clamp(3rem,7vw,5.5rem)}
.stats>div{padding:1.8rem 1rem 0;border-right:1px solid var(--line-l);text-align:center}
.stats>div:last-child{border-right:0}
.stats b{display:block;font-family:var(--serif);font-weight:500;font-size:clamp(2.6rem,5.5vw,4.6rem);line-height:1;letter-spacing:-.02em}
.stats span{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-muted)}
.t-dark .stats{border-color:var(--line-d)}.t-dark .stats>div{border-color:var(--line-d)}.t-dark .stats span{color:var(--muted)}

/* ───────── Sticky backdrop (Estelle): image holds still, cards scroll over it ───────── */
.stick{position:relative;color:var(--ink)}
.stick__media{position:sticky;top:0;height:100vh;height:100lvh;overflow:hidden;z-index:0}
.stick__media img{width:100%;height:100%;object-fit:cover}
.stick__media::after{content:"";position:absolute;inset:0;background:rgba(5,10,23,.18)}
.stick__content{position:relative;z-index:1;margin-top:-100vh;margin-top:-100lvh;padding:62vh 0 38vh;display:grid;gap:62vh}
.stick__card{background:var(--ivory);width:min(560px,100%);padding:clamp(2rem,4vw,3.4rem);text-align:center;box-shadow:0 30px 80px -30px rgba(5,10,23,.55)}
.stick__card.r{justify-self:end}
.stick__card.c{justify-self:center}
.stick__card h2{font-size:clamp(1.8rem,3vw,2.5rem)}
.stick__card p{color:var(--ink-muted)}
.stick__card .btns{justify-content:center;margin-top:1.6rem}
.stick__card .ticks{text-align:left;margin:1.2rem 0 0}
.stick__caption{position:absolute;left:var(--gut);bottom:1.4rem;z-index:1;font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(247,241,227,.8)}

/* ───────── Pillars ───────── */
.pillars{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(1.2rem,2.4vw,2rem)}
.pillar{grid-column:span 4;position:relative}
.pillar:nth-child(1),.pillar:nth-child(2){grid-column:span 6}
.pillar:nth-child(7){grid-column:4 / span 6}
.pillar__img{overflow:hidden;aspect-ratio:4/3;margin-bottom:1.2rem;position:relative;border-radius:2px}
.pillar__img img{width:100%;height:120%;object-fit:cover;transition:transform 1.4s var(--ease)}
.pillar:hover .pillar__img img{transform:scale(1.05)}
.pillar__n{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;color:var(--gold);display:block;margin-bottom:.6rem}
.pillar h3{margin:0 0 .4rem;font-size:clamp(1.5rem,2.2vw,2rem)}
.pillar p{color:var(--muted);margin:0;max-width:46ch}
.t-light .pillar p{color:var(--ink-muted)}
.pillar__tag{position:absolute;left:1rem;top:1rem;font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;background:rgba(5,10,23,.55);backdrop-filter:blur(6px);color:var(--ivory);padding:.45rem .7rem;border-radius:2px}

/* ───────── Parallax collage (Estelle membership) — text holds, images drift ───────── */
.collage{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem);align-items:start}
.collage__text{position:sticky;top:calc(var(--hdr) + 3rem)}
.collage__text h2{font-size:clamp(2rem,3.6vw,3rem)}
.collage__text p{color:var(--ink-muted);max-width:38ch}
.collage__text .btns{margin-top:1.8rem}
.collage__art{position:relative;min-height:clamp(560px,62vw,900px)}
.collage__art figure{position:absolute;margin:0;overflow:hidden;box-shadow:0 30px 60px -30px rgba(5,10,23,.45)}
.collage__art img{width:100%;height:100%;object-fit:cover}
.collage__art .c1{right:0;top:0;width:62%;aspect-ratio:3/4}
.collage__art .c2{left:0;top:38%;width:56%;aspect-ratio:4/3;z-index:2}
.collage__art .c3{right:8%;top:70%;width:34%;aspect-ratio:1/1;z-index:1}
.collage__art .c-note{position:absolute;right:2%;top:57%;z-index:3;color:var(--gold-d);max-width:11ch;text-align:right}
.collage__art .c-card{position:absolute;left:6%;top:6%;width:40%;z-index:3;background:var(--ivory);border:1px solid var(--line-l);padding:1.4rem 1.2rem;font-family:var(--mono);font-size:.74rem;line-height:1.7;color:var(--ink-muted);box-shadow:0 20px 50px -25px rgba(5,10,23,.4)}
.c-card b{display:block;font-weight:400;color:var(--ink);margin-bottom:.6rem;text-align:right}
.c-card i{display:block;font-style:normal;margin-top:1rem;text-align:center;letter-spacing:.2em}

/* ───────── Tier tiles (Drake tile hover) ───────── */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-d)}
.tile{position:relative;padding:2rem 1.6rem 2.2rem;border-right:1px solid var(--line-d);isolation:isolate;transition:color .6s var(--ease)}
.tile:last-child{border-right:0}
.tile::before{content:"";position:absolute;inset:0;background:var(--ivory);z-index:-1;clip-path:inset(100% 0 0 0);transition:clip-path .8s var(--ease)}
.tile:hover{color:var(--ink)}
.tile:hover::before{clip-path:inset(0 0 0 0)}
.tile .kicker{margin-bottom:2.2rem}
.tile b{display:block;font-family:var(--serif);font-weight:500;font-size:clamp(2rem,3vw,2.8rem);line-height:1;margin-bottom:.8rem}
.tile p{margin:0;color:var(--muted);font-size:.95rem;transition:color .6s}
.tile:hover p{color:var(--ink-muted)}
.tile:hover .kicker{color:var(--gold-d)}

/* ───────── Cities accordion (White Desert) + custom cursor ───────── */
.flick{display:flex;gap:.6rem;height:clamp(460px,78vh,760px)}
.flick__item{position:relative;flex:1 1 0;min-width:0;overflow:hidden;border-radius:2px;color:var(--ivory);transition:flex 1.1s var(--ease);outline-offset:-3px}
.flick__item.is-active{flex:5.2 1 0}
.flick__item img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(10px) brightness(.5) saturate(.75);transform:scale(1.2);transition:filter 1s var(--ease),transform 1.4s var(--ease)}
.flick__item.is-active img{filter:none;transform:scale(1)}
.flick__item::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,10,23,.55),transparent 30%,transparent 55%,rgba(5,10,23,.85));opacity:0;transition:opacity .8s}
.flick__item.is-active::after{opacity:1}
.flick__body{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(1.2rem,2.4vw,2rem);width:max(100%,340px)}
.flick__title{font-family:var(--serif);font-style:italic;font-size:clamp(1.8rem,3vw,2.8rem);line-height:1;margin:0}
.flick__title small{display:block;font-family:var(--mono);font-style:normal;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-l);margin-top:.7rem}
.flick__foot{max-width:34ch}
.flick__foot b{display:block;font-family:var(--mono);font-weight:400;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-l);margin-bottom:.5rem}
.flick__foot p{margin:0;font-size:.95rem;color:rgba(236,230,214,.85)}
.flick__body>*{opacity:0;transform:translateY(12px);transition:opacity .5s,transform .8s var(--ease)}
.flick__item.is-active .flick__body>*{opacity:1;transform:none;transition-delay:.35s}
.flick__label{position:absolute;left:50%;bottom:1.4rem;z-index:1;writing-mode:vertical-rl;transform:translateX(-50%) rotate(180deg);font-family:var(--mono);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ivory);transition:opacity .5s}
.flick__item.is-active .flick__label{opacity:0}
.flick__num{position:absolute;left:50%;top:1.2rem;transform:translateX(-50%);z-index:1;font-family:var(--mono);font-size:.66rem;color:var(--gold-l);transition:opacity .5s}
.flick__item.is-active .flick__num{opacity:0}
@media (hover:hover) and (pointer:fine){[data-cursor],[data-cursor] a{cursor:none}}
.cursor{position:fixed;left:0;top:0;z-index:95;pointer-events:none;opacity:0;transition:opacity .35s}
.cursor.is-on{opacity:1}
.cursor__x,.cursor__y{position:absolute;background:var(--gold)}
.cursor__x{width:26px;height:1px;left:-13px;top:0}
.cursor__y{width:1px;height:26px;left:0;top:-13px}
.cursor__dot{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--gold);left:-2.5px;top:-2.5px;transform:scale(0);transition:transform .4s var(--ease)}
.cursor.is-link .cursor__dot{transform:scale(1)}
.cursor.is-link .cursor__x,.cursor.is-link .cursor__y{transform:rotate(45deg) scale(.8);transition:transform .5s var(--ease)}
.cursor__x,.cursor__y{transition:transform .5s var(--ease)}
.cursor__label{position:absolute;left:20px;top:-26px;font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ivory);background:rgba(5,10,23,.55);backdrop-filter:blur(6px);padding:.4rem .6rem;white-space:nowrap;border-radius:2px}

/* ───────── Signature tiers — a static engraved card: double hairline frame, 3×4 grid, numerals ───────── */
.tiers{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid rgba(11,21,48,.22);outline:1px solid rgba(168,132,31,.35);outline-offset:7px;margin:7px;background:var(--ivory)}
.tier{display:grid;grid-template-columns:2.8rem 1fr;gap:.9rem;align-items:start;padding:1.6rem 1.6rem 1.7rem;border-right:1px solid var(--line-l);border-bottom:1px solid var(--line-l);position:relative;isolation:isolate}
.tier:nth-child(3n){border-right:0}
.tier:nth-last-child(-n+3){border-bottom:0}
.tier::before{content:"";position:absolute;inset:0;background:var(--ivory-2);transform:scaleY(0);transform-origin:left top;transition:transform .55s var(--ease);z-index:-1}
.tier:hover::before{transform:scaleY(1);transform-origin:left bottom}
.tier__n{font-family:var(--serif);font-style:italic;font-size:1.05rem;color:var(--gold-d);padding-top:.35rem;border-top:1px solid var(--gold);width:2rem}
.tier small{display:block;font-family:var(--mono);font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-muted);margin-bottom:.15rem}
.tier b{display:block;font-family:var(--serif);font-weight:500;font-size:clamp(1.5rem,2.2vw,1.9rem);line-height:1.15;margin-bottom:.35rem}
.tier span:last-child{font-size:.92rem;color:var(--ink-muted)}
.tier--end{background:var(--navy-800);color:var(--ivory)}
.tier--end::before{background:var(--gold)}
.tier--end small,.tier--end span:last-child{color:rgba(247,241,227,.7);transition:color .5s}
.tier--end b{font-style:italic;color:var(--gold-l);transition:color .5s}
.tier--end:hover b,.tier--end:hover small,.tier--end:hover span:last-child{color:var(--navy-900)}
.tier--end .tier__n{color:var(--gold-l);border-color:var(--gold-l);font-style:normal}
.tier--end:hover .tier__n{color:var(--navy-900);border-color:var(--navy-900)}
@media (max-width:900px){
  .tiers{grid-template-columns:repeat(2,1fr)}
  .tier:nth-child(3n){border-right:1px solid var(--line-l)}
  .tier:nth-child(2n){border-right:0}
  .tier:nth-last-child(-n+3){border-bottom:1px solid var(--line-l)}
  .tier:nth-last-child(-n+2){border-bottom:0}
}
@media (max-width:560px){
  .tiers{grid-template-columns:1fr;outline-offset:5px;margin:5px}
  .tier,.tier:nth-child(n){border-right:0;border-bottom:1px solid var(--line-l);padding:1.2rem 1.1rem 1.3rem}
  .tier:last-child{border-bottom:0}
}

/* ───────── Numbered list rows ───────── */
.rows{border-top:1px solid var(--line-d)}
.t-light .rows,.t-cream .rows{border-color:var(--line-l)}
.rowi{display:grid;grid-template-columns:5rem minmax(0,1fr) minmax(0,1.3fr);gap:1.5rem;padding:1.8rem 0;border-bottom:1px solid var(--line-d);align-items:baseline}
.t-light .rowi,.t-cream .rowi{border-color:var(--line-l)}
.rowi>span{font-family:var(--mono);font-size:.72rem;color:var(--gold);letter-spacing:.12em}
.t-light .rowi>span,.t-cream .rowi>span{color:var(--gold-d)}
.rowi h3{margin:0;font-size:clamp(1.4rem,2.2vw,1.9rem)}
.rowi p{margin:0;color:var(--muted)}
.t-light .rowi p,.t-cream .rowi p{color:var(--ink-muted)}

/* ticks */
.ticks{list-style:none}
.ticks li{position:relative;padding:.45rem 0 .45rem 1.7rem;border-bottom:1px solid var(--line-l)}
.t-dark .ticks li,.t-deep .ticks li{border-color:var(--line-d)}
.ticks li::before{content:"✦";position:absolute;left:0;top:.62rem;color:var(--gold);font-size:.75rem}
.ticks.cols{columns:2;column-gap:2.5rem}
.ticks.cols li{break-inside:avoid}

/* split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,6rem);align-items:center}
.split.top{align-items:start}
.frame{overflow:hidden;border-radius:2px;position:relative}
.frame img{width:100%;height:118%;object-fit:cover}
.frame.r43{aspect-ratio:4/3}.frame.r34{aspect-ratio:3/4}

/* CTA */
.cta{text-align:center;padding:clamp(5rem,12vw,10rem) 0;overflow:hidden}
.cta .bigword{margin-bottom:.15em}
.cta .lead{margin:0 auto 2.2rem}
.cta .btns{justify-content:center}

/* ───────── Membership table ───────── */
.chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2rem}
.chip{background:transparent;border:1px solid var(--line-l);color:var(--ink);padding:.7rem 1.1rem;border-radius:999px;cursor:pointer;font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;transition:background-color .4s,color .4s,border-color .4s}
.chip:hover{border-color:var(--navy-800)}
.chip.on{background:var(--navy-800);color:var(--ivory);border-color:var(--navy-800)}
.tbl-wrap{overflow-x:auto;border-top:1px solid var(--ink)}
.fees,.mini{width:100%;border-collapse:collapse}
.fees th,.mini th{text-align:left;font-family:var(--mono);font-weight:400;letter-spacing:.14em;font-size:.68rem;text-transform:uppercase;padding:1rem;color:var(--ink-muted);border-bottom:1px solid var(--line-l)}
.fees td,.mini td{padding:1.15rem 1rem;border-bottom:1px solid var(--line-l);vertical-align:baseline}
.fees tbody tr{transition:background-color .4s}
.fees tbody tr:hover{background:var(--ivory-2)}
.fees .sl{color:var(--gold-d);width:3.5rem;font-family:var(--mono);font-size:.78rem}
.fees .nm{font-family:var(--serif);font-size:1.12rem}
.fees .amt{white-space:nowrap;font-family:var(--serif);font-size:1.2rem}
.fees .rm{color:var(--ink-muted);font-size:.92rem}
.fees tr[hidden]{display:none}
.mini{margin-top:1.4rem}
.mini td{padding:.9rem 1rem}
.mini .tot td{font-weight:600}
.t-dark .mini th,.t-dark .mini td{border-color:var(--line-d);color:var(--txt)}
.t-dark .mini th{color:var(--muted)}
.note{color:var(--ink-muted);font-size:.86rem;margin-top:1.4rem;max-width:80ch}

/* facilities lists */
.fac-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line-l);border-left:1px solid var(--line-l)}
.fac{padding:2rem 1.8rem;border-right:1px solid var(--line-l);border-bottom:1px solid var(--line-l)}
.fac h3{font-size:1.45rem}
.fac ul{list-style:none;color:var(--ink-muted);font-size:.95rem}
.fac li{padding:.22rem 0 .22rem 1.1rem;position:relative}
.fac li::before{content:"";position:absolute;left:0;top:.9em;width:5px;height:1px;background:var(--gold-d)}
.fac p{color:var(--ink-muted);margin:0}
.ev-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-d);border-left:1px solid var(--line-d)}
.ev{padding:1.5rem 1.3rem 1.8rem;border-right:1px solid var(--line-d);border-bottom:1px solid var(--line-d);transition:background-color .5s}
.ev:hover{background:var(--navy-700)}
.ev b{display:block;font-family:var(--mono);font-weight:400;color:var(--gold);letter-spacing:.2em;text-transform:uppercase;font-size:.72rem;margin-bottom:1.4rem}
.ev span{font-family:var(--serif);font-size:1.2rem;line-height:1.25}

/* branches */
.branch-list{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(1.5rem,3vw,2.5rem)}
.branch{scroll-margin-top:calc(var(--hdr) + 1rem)}
.branch .frame{aspect-ratio:16/10;margin-bottom:1.2rem}
.branch h3{font-size:clamp(1.6rem,2.6vw,2.2rem);margin-bottom:.3rem}
.branch h3 small{font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-d);margin-left:.6rem;vertical-align:middle}
.branch .role{font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-muted);margin-bottom:.4rem}
.branch p:last-child{color:var(--ink-muted);margin:0}
.map-fig{margin:0}
.map-fig img{border-radius:2px}

/* about */
.values{display:flex;flex-wrap:wrap;justify-content:center;gap:.2em .6em;font-family:var(--serif);font-size:clamp(2.2rem,6vw,5rem);line-height:1.1;text-align:center}
.values span{cursor:default;transition:color .5s}
.values span:not(:last-child)::after{content:"·";color:var(--gold);margin-left:.6em;-webkit-text-fill-color:var(--gold)}
.values .imgtext{--bs:260%;-webkit-text-fill-color:var(--ink);transition:-webkit-text-fill-color .6s var(--ease),background-size 1.4s var(--ease)}
.values .imgtext:hover{--bs:340%;-webkit-text-fill-color:transparent}
.road{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line-d)}
.road div{padding:1.6rem 1.2rem 0 0}
.road b{display:block;font-family:var(--mono);font-weight:400;color:var(--gold);letter-spacing:.14em;text-transform:uppercase;font-size:.72rem;margin-bottom:1rem}
.road p{margin:0;font-family:var(--serif);font-size:1.12rem;line-height:1.35}
.quote{font-family:var(--serif);font-style:italic;font-size:clamp(1.5rem,2.6vw,2.2rem);line-height:1.35;margin:0 0 1rem}

/* contact */
.ccard{padding:1.2rem 0;border-bottom:1px solid var(--line-l)}
.ccard span{display:block;font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;font-size:.68rem;color:var(--ink-muted);margin-bottom:.3rem}
.ccard a{font-family:var(--serif);font-size:clamp(1.2rem,2vw,1.6rem);word-break:break-word;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .7s var(--ease)}
.ccard a:hover{background-size:100% 1px}
.form{background:var(--ivory);border:1px solid var(--line-l);padding:clamp(1.6rem,3.5vw,2.8rem);scroll-margin-top:calc(var(--hdr) + 1rem)}
.form h2{font-size:clamp(1.8rem,3vw,2.4rem)}
.form label{display:block;font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted);margin-bottom:1.3rem}
.form input,.form select,.form textarea{display:block;width:100%;margin-top:.4rem;padding:.7rem 0;background:transparent;border:0;border-bottom:1px solid var(--line-l);color:var(--ink);font:1.05rem/1.4 var(--sans);letter-spacing:0;text-transform:none;border-radius:0;transition:border-color .4s}
.form select{appearance:none;background:linear-gradient(45deg,transparent 50%,var(--ink) 50%) calc(100% - 10px) 55%/5px 5px no-repeat,linear-gradient(-45deg,transparent 50%,var(--ink) 50%) calc(100% - 5px) 55%/5px 5px no-repeat}
.form input:focus,.form select:focus,.form textarea:focus{outline:0;border-bottom-color:var(--gold-d)}
.form input.bad{border-bottom-color:#b3263a}
.form .btn{margin-top:.6rem}

/* ───────── Footer (The Drake): newsletter + socials grid with fill wipe ───────── */
.foot{background:var(--navy-950);color:var(--txt);padding:clamp(4rem,9vw,7rem) 0 1.6rem;position:relative;overflow:hidden}
.foot__top{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(2rem,6vw,6rem);padding-bottom:clamp(3rem,6vw,5rem);border-bottom:1px solid rgba(236,230,214,.12)}
.foot__big{font-family:var(--serif);font-size:clamp(2.2rem,4.6vw,4rem);line-height:1.05;margin:0}
.foot__big em{font-style:italic;color:var(--gold)}
.foot__big .script{font-size:.7em;display:inline-block;transform:rotate(-4deg);margin-left:.2em}
.foot__label{font-family:var(--mono);font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ivory);margin:0 0 1rem}
.news{display:flex;border:1px solid rgba(236,230,214,.28);margin-bottom:1.6rem}
.news input{flex:1;min-width:0;background:transparent;border:0;color:var(--ivory);padding:1.15rem 1rem;font-family:var(--mono);font-size:.8rem;letter-spacing:.12em;text-transform:uppercase}
.news input::placeholder{color:rgba(236,230,214,.5)}
.news input:focus{outline:0}
.news:focus-within{border-color:var(--gold)}
.news button{background:none;border:0;border-left:1px solid rgba(236,230,214,.28);color:var(--ivory);width:3.6rem;cursor:pointer;display:grid;place-items:center;position:relative;overflow:hidden;isolation:isolate;transition:color .5s}
.news button::before{content:"";position:absolute;inset:0;background:var(--gold);transform:scaleX(0);transform-origin:right;transition:transform .6s var(--ease);z-index:-1}
.news button:hover{color:var(--navy-900)}
.news button:hover::before{transform:scaleX(1);transform-origin:left}
.news button svg{width:16px;height:16px}
.socials{display:flex;flex-wrap:wrap}
.socials a{position:relative;width:3.6rem;height:3.6rem;display:grid;place-items:center;border:1px solid rgba(236,230,214,.28);margin:0 -1px -1px 0;color:var(--ivory);isolation:isolate;overflow:hidden;transition:color .55s var(--ease)}
.socials a::before{content:"";position:absolute;inset:0;background:var(--gold);transform:scaleY(0);transform-origin:left top;transition:transform .55s var(--ease);z-index:-1}
.socials a:hover,.socials a:focus-visible{color:var(--navy-900)}
.socials a:hover::before,.socials a:focus-visible::before{transform:scaleY(1);transform-origin:left bottom}
.socials svg{width:18px;height:18px;transition:transform .55s var(--ease)}
.socials a:hover svg{transform:scale(1.1)}
.foot__cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.4fr;gap:2rem;padding:clamp(2.5rem,5vw,4rem) 0}
.foot__brand{display:flex;align-items:center;gap:.9rem;margin-bottom:1rem}
.foot__brand img{width:60px;height:auto;border-radius:50%}
.foot__brand b{display:block;font-family:var(--serif);font-weight:600;font-size:1.4rem;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.foot__brand small{font-family:var(--display);letter-spacing:.28em;text-transform:uppercase;font-size:.6rem}
.foot .foot__h{font-family:var(--mono);font-weight:400;letter-spacing:.16em;text-transform:uppercase;font-size:.7rem;color:var(--gold);margin-bottom:1.2rem}
.foot ul{list-style:none}
.foot li{padding:.22rem 0}
.foot li a{color:rgba(236,230,214,.85);font-size:.95rem;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .6s var(--ease),color .4s}
.foot li a:hover{color:var(--gold-l);background-size:100% 1px}
.contact-list span{display:block;font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:.5rem}
.contact-list a{word-break:break-all}
.fine{border-top:1px solid rgba(236,230,214,.12);padding-top:1.4rem;color:var(--muted);font-size:.78rem;display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.fine p{margin:.2rem 0;max-width:80ch}
.foot__mark{font-family:var(--serif);font-weight:600;font-size:clamp(3.2rem,13vw,13rem);line-height:.8;letter-spacing:-.03em;text-align:center;margin:clamp(2rem,5vw,4rem) 0 0;white-space:nowrap;user-select:none}

/* reveal (fallback, used for blocks) */
.reveal{opacity:0;transform:translateY(26px);transition:opacity 1s var(--ease),transform 1.2s var(--ease)}
.reveal.in{opacity:1;transform:none}
.no-js .reveal{opacity:1;transform:none}

/* reduced motion: nothing moves, but blocks still fade in gently */
@media (prefers-reduced-motion:reduce){
  .reveal{transform:none;transition:opacity .9s ease}
  .hero__scroll i{animation:none}
}

/* ───────── Responsive ───────── */
@media (max-width:1100px){
  .hdr__nav{display:none}
  .hdr__bar{grid-template-columns:1fr auto}
  .menu-btn{display:inline-flex}
  .pillar,.pillar:nth-child(1),.pillar:nth-child(2),.pillar:nth-child(7){grid-column:span 6}
  .pillar:nth-child(7){grid-column:3 / span 8}
  .tiles{grid-template-columns:repeat(2,1fr)}
  .tile:nth-child(2){border-right:0}
  .tile:nth-child(-n+2){border-bottom:1px solid var(--line-d)}
  .ev-grid{grid-template-columns:repeat(3,1fr)}
  .foot__cols{grid-template-columns:1fr 1fr}
  .road{grid-template-columns:repeat(3,1fr);row-gap:1.5rem}
  .fac-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:820px){
  .split,.collage,.foot__top,.branch-list{grid-template-columns:1fr}
  .collage__text{position:static}
  .collage__art{min-height:120vw}
  .stats{grid-template-columns:repeat(2,1fr)}
  .stats>div:nth-child(2){border-right:0}
  .stats>div:nth-child(-n+2){border-bottom:1px solid var(--line-l);padding-bottom:1.6rem}
  .rowi{grid-template-columns:3rem 1fr;row-gap:.4rem}
  .rowi p{grid-column:2}
  .hero__note{top:auto;bottom:40%;right:var(--gut)}
  .stick__content{gap:50vh;padding:55vh 0 30vh}
  .stick__card,.stick__card.r{justify-self:center}
  /* accordion becomes a swipe row, every card open */
  .flick{height:auto;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.6rem;gap:.8rem}
  .flick__item,.flick__item.is-active{flex:0 0 80%;height:clamp(420px,110vw,560px);scroll-snap-align:start}
  .flick__item img{filter:none;transform:none}
  .flick__item::after{opacity:1}
  .flick__body>*{opacity:1;transform:none}
  .flick__label,.flick__num{display:none}
  .flick__body{width:100%}
}
@media (max-width:600px){
  .pillar,.pillar:nth-child(n){grid-column:1 / -1}
  .tiles,.ev-grid,.fac-grid{grid-template-columns:1fr}
  .tile{border-right:0;border-bottom:1px solid var(--line-d)}
  .ev-grid{grid-template-columns:1fr 1fr}
  .foot__cols{grid-template-columns:1fr}
  .ticks.cols{columns:1}
  .road{grid-template-columns:1fr 1fr}
  .fees .nm,.fees .rm{min-width:170px}
  .hero h1{font-size:clamp(2.6rem,12vw,4rem)}
  .brand small{display:none}
}
.imgtext--inline{--bs:340%;font-size:1.12em;font-weight:600;padding:0 .04em}
.imgtext--inline:hover{--bs:420%}
.tlink svg{width:14px;height:14px;flex:none}
@media (max-width:820px){
  .hero__note{top:calc(var(--hdr) + 2rem);bottom:auto;right:var(--gut);font-size:1.6rem}
  .flick__item::after{background:linear-gradient(180deg,rgba(5,10,23,.6),transparent 28%,transparent 42%,rgba(5,10,23,.94) 78%)}
}
@media (hover:none){.only-fine{display:none}}
@media (hover:hover) and (pointer:fine){.only-touch{display:none}}
picture{display:contents}
/* lite mode (low-end phones / data saver): keep the look, drop the expensive paint effects */
.lite .hdr.is-solid,.lite .pillar__tag,.lite .cursor__label{backdrop-filter:none;-webkit-backdrop-filter:none}
.lite .hdr.is-solid{background:var(--navy-900)}
.lite .flick__item img{filter:brightness(.55);transform:none}
.lite .flick__item.is-active img{filter:none}
.lite .hero__media img,.lite .phero .hero__media img{height:100%}
.lite .frame img,.lite .pillar__img img{height:100%}
/* collage note sits in the open space under the wide photo */
.collage__art .c-note{right:auto;left:4%;top:86%;text-align:left;max-width:14ch}
/* small phones */
@media (max-width:600px){
  .hero__note{position:static;display:inline-block;margin:0 0 1rem;font-size:1.5rem;transform:rotate(-3deg)}
  /* fee table becomes stacked rows: no sideways scrolling */
  .fees thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .fees,.fees tbody{display:block}
  .fees tr{display:grid;grid-template-columns:2.2rem 1fr auto;column-gap:.6rem;row-gap:.2rem;padding:1rem 0;border-bottom:1px solid var(--line-l)}
  .fees td{padding:0;border:0}
  .fees .sl{grid-row:1 / span 2;width:auto}
  .fees .nm{min-width:0;font-size:1.02rem}
  .fees .amt{font-size:1.02rem}
  .fees .rm{grid-column:2 / -1;min-width:0;font-size:.86rem}
  .fees tr[hidden]{display:none}
}
@media (max-width:400px){
  .btn{white-space:normal;max-width:100%;text-align:left}
  .btn__label{padding:1em 1.1em}
  .stick__card{padding:1.8rem 1.2rem}
}

/* word-by-word heading rise (JS adds .split, then .in when on screen) */
.is-split .w>span{transform:translateY(110%);transition:transform 1.1s var(--ease);transition-delay:calc(var(--i,0) * 45ms)}
.is-split.in .w>span{transform:none}
/* hero copy fades up on load — pure CSS so it never waits on scripts */
@keyframes rise{from{opacity:0;transform:translateY(18px)}}
.hero__fade{animation:rise 1.2s var(--ease) .35s both}
.hero .hero__row .lead{animation-delay:.5s}
.hero .hero__row .btns{animation-delay:.65s}
@keyframes settle{from{scale:1.1}}
@keyframes fadein{from{opacity:0}}
.hero__media img{animation:settle 2.4s var(--ease) backwards}
.lite .hero__media img{animation:none}
@media (prefers-reduced-motion:reduce){.hero__fade{animation-name:fadein}.hero__media img{animation:none}}
/* image-filled text before its picture has loaded */
.imgtext[data-bg]{color:var(--gold-deep);-webkit-text-fill-color:var(--gold-deep)}
.t-dark .imgtext[data-bg],.foot .imgtext[data-bg]{color:var(--gold);-webkit-text-fill-color:var(--gold)}
.values .imgtext[data-bg]{-webkit-text-fill-color:var(--ink)}
/* accessible golds on light surfaces (WCAG AA): darker ink for small labels, deeper gold for large italic accents */
:root{--gold-ink:#7a5c0e;--gold-deep:#8f6f14}
.t-light .kicker,.t-cream .kicker,.stick__card .kicker,.form .kicker,.fees .sl,.tier__n,.branch h3 small,.t-light .rowi>span,.t-cream .rowi>span{color:var(--gold-ink)}
.t-light h1 em,.t-light h2 em,.t-light h3 em,.t-cream h2 em,.stick__card h2 em,.form h2 em,.tier b em,.note-hand,.t-light .note-hand,.t-cream .note-hand{color:var(--gold-deep)}

/* ═════════ Added 2026-10: touch motion, T&C marks, notices, inspiration, dolphins, gallery, terms, visit ═════════ */
/* touch: the core values light up one by one (JS), phones get the city cards sliding in */
.values .imgtext.is-lit{--bs:340%;-webkit-text-fill-color:transparent}
@media (max-width:820px){
  .flick .flick__item{opacity:0;transform:translateX(48px);transition:opacity .9s var(--ease),transform 1.1s var(--ease)}
  .flick.in .flick__item{opacity:1;transform:none}
  .flick.in .flick__item:nth-child(2){transition-delay:.08s}.flick.in .flick__item:nth-child(3){transition-delay:.16s}
  .no-js .flick .flick__item{opacity:1;transform:none}
}
@media (prefers-reduced-motion:reduce){.flick .flick__item{transform:none!important}}

/* "T&C apply" marks: one asterisk, one footnote, one link — never on every line */
sup.tc{font-size:.42em;vertical-align:super;margin-left:.08em;color:var(--gold);font-family:var(--sans);font-weight:400}
.tc-note{font-size:.82rem;color:var(--muted);margin:1.4rem 0 0;max-width:80ch}
.t-light .tc-note,.t-cream .tc-note{color:var(--ink-muted)}
.tc-note a,.tc-link,.note a,.consent a,.fine a{text-decoration:underline;text-underline-offset:.2em;text-decoration-thickness:1px}
.tc-link{white-space:nowrap}
.consent{margin:.2rem 0 1rem}
.fine__links{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;align-items:center}
.fine__links a{color:rgba(236,230,214,.85)}
.fine__links a:hover{color:var(--gold-l)}
.cta__note{display:block;margin:0 auto 1.2rem}

/* notice board under the home hero (Delhi Gymkhana) */
.notices{padding:clamp(1.6rem,3vw,2.2rem) 0;border-bottom:1px solid var(--line-d)}
.notices__in{display:grid;grid-template-columns:auto repeat(3,minmax(0,1fr));gap:clamp(1rem,2.5vw,2.4rem);align-items:stretch}
.notices__h{font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin:0;padding-right:clamp(1rem,2vw,2rem);border-right:1px solid var(--line-d);align-self:center;line-height:1.5}
.notice{display:grid;grid-template-columns:1fr auto;gap:.3rem 1rem;align-items:end;padding:.2rem 0}
.notice span{grid-column:1 / -1;font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-l)}
.notice b{font-weight:400;font-family:var(--serif);font-size:1.08rem;line-height:1.3}
.notice svg{width:14px;height:14px;color:var(--gold);transition:transform .6s var(--ease)}
.notice:hover svg{transform:translateX(5px)}
.notice:hover b{color:var(--gold-l)}
@media (max-width:900px){
  .notices__in{grid-template-columns:1fr}
  .notices__h{border-right:0;padding:0;border-bottom:1px solid var(--line-d);padding-bottom:.8rem}
  .notices__h br{display:none}
  .notice{padding:.6rem 0;border-bottom:1px solid var(--line-d)}
  .notice:last-child{border-bottom:0}
}

/* our presence: line-art landmarks with place counts (brochure) */
.pres{display:grid;grid-template-columns:repeat(7,1fr);border-top:1px solid var(--line-d)}
.pres__c{display:grid;justify-items:center;gap:.35rem;padding:1.6rem .6rem 1.2rem;text-align:center;border-right:1px solid var(--line-d);transition:background-color .5s}
.pres__c:last-child{border-right:0}
.pres__c svg{width:clamp(48px,5vw,64px);height:auto;fill:none;stroke:var(--gold);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;margin-bottom:.4rem;transition:transform .8s var(--ease)}
.pres__c:hover svg{transform:translateY(-4px)}
.pres__c b{font-family:var(--serif);font-weight:500;font-size:1.15rem}
.pres__c span{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.pres--light{border-color:var(--line-l)}
.pres--light .pres__c{border-color:var(--line-l)}
.pres--light .pres__c svg{stroke:var(--gold-deep)}
.pres--light .pres__c span{color:var(--ink-muted)}
.pres--light .pres__c:hover{background:var(--ivory)}
.t-dark .pres__c:hover{background:var(--navy-800)}
@media (max-width:1100px){.pres{grid-template-columns:repeat(4,1fr)}.pres__c{border-bottom:1px solid var(--line-d)}.pres__c:nth-child(4){border-right:0}.pres--light .pres__c{border-bottom-color:var(--line-l)}}
@media (max-width:600px){.pres{grid-template-columns:repeat(2,1fr)}.pres__c:nth-child(n){border-right:1px solid var(--line-d)}.pres__c:nth-child(2n){border-right:0}.pres--light .pres__c:nth-child(n){border-right-color:var(--line-l)}.pres--light .pres__c:nth-child(2n){border-right:0}}

/* membership advantages (brochure) */
.adv{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line-l)}
.adv__c{padding:1.8rem 1.3rem 1.6rem 0;border-right:1px solid var(--line-l);padding-left:1.3rem}
.adv__c:first-child{padding-left:0}
.adv__c:last-child{border-right:0}
.adv__c svg{width:34px;height:34px;fill:none;stroke:var(--gold-deep);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;margin-bottom:1.2rem}
.adv__c h3{font-size:1.3rem;margin-bottom:.4rem}
.adv__c p{color:var(--ink-muted);font-size:.93rem;margin:0}
@media (max-width:1100px){.adv{grid-template-columns:repeat(3,1fr)}.adv__c:nth-child(3){border-right:0}.adv__c:nth-child(4){padding-left:0}.adv__c{border-bottom:1px solid var(--line-l)}}
@media (max-width:600px){.adv{grid-template-columns:1fr}.adv__c,.adv__c:nth-child(n){border-right:0;padding-left:0;display:grid;grid-template-columns:44px 1fr;column-gap:1rem}.adv__c svg{grid-row:1 / span 2;margin:0}}

/* our inspiration: Sir M. Visvesvaraya */
.mv{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem);align-items:center}
.mv__fig{margin:0;justify-self:center;width:min(420px,100%)}
.mv__fig figcaption{margin-top:1.6rem;text-align:center;font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-muted)}
.mv h2{margin-bottom:.2em}
.mv__quote{margin:2rem 0 0;padding:1.4rem 0 0 1.6rem;border-left:1px solid var(--gold);font-family:var(--serif);font-style:italic;font-size:clamp(1.15rem,1.7vw,1.4rem);line-height:1.45;color:var(--ink)}
.mv__quote cite{display:block;margin-top:.9rem;font-style:normal;font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-ink)}
@media (max-width:820px){.mv{grid-template-columns:1fr}.mv__fig{width:min(320px,80%)}}

/* dolphins band */
.dol{overflow:hidden}
.dol__in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem);align-items:center}
.dol__text p.muted{max-width:40ch}
.dol__art{position:relative;min-height:clamp(420px,46vw,640px)}
.dol__art figure{position:absolute;margin:0;overflow:hidden;box-shadow:0 30px 70px -30px rgba(0,0,0,.7)}
.dol__art img{width:100%;height:100%;object-fit:cover}
.dol__art .d1{left:0;top:4%;width:74%;aspect-ratio:4/3}
.dol__art .d2{right:0;top:52%;width:50%;aspect-ratio:3/2;z-index:1;outline:1px solid rgba(241,212,137,.45);outline-offset:-10px}
@media (max-width:820px){.dol__in{grid-template-columns:1fr}.dol__art{min-height:110vw}.dol__art .d1{width:88%}.dol__art .d2{width:64%;top:50%}}

.gal__item span{position:absolute;left:0;right:0;bottom:0;padding:2.4rem 1rem .9rem;background:linear-gradient(transparent,rgba(5,10,23,.75));color:var(--ivory);font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase}

/* gallery page (Bombay Gymkhana): albums, masonry grid, lightbox */
.gal{columns:3 280px;column-gap:1rem}
@media (max-width:600px){.gal{columns:2;column-gap:.6rem}.gal__item{margin-bottom:.6rem}.gal__item span{padding:1.6rem .6rem .55rem;font-size:.56rem}}
.gal__item{display:block;position:relative;margin:0 0 1rem;break-inside:avoid;overflow:hidden;border-radius:2px;cursor:zoom-in}
.gal__item[hidden]{display:none}
.gal__item img{width:100%;height:auto;transition:transform 1.4s var(--ease)}
.gal__item:hover img{transform:scale(1.04)}
.gal__item span{opacity:0;transition:opacity .5s}
.gal__item:hover span,.gal__item:focus-visible span{opacity:1}
@media (hover:none){.gal__item span{opacity:1}}
html.lb-open{overflow:hidden}
.lb{position:fixed;inset:0;z-index:150;background:rgba(5,10,23,.95);display:grid;place-items:center;opacity:0;visibility:hidden;transition:opacity .4s,visibility .4s}
.lb.is-open{opacity:1;visibility:visible}
.lb figure{margin:0;display:grid;justify-items:center;gap:1rem;max-width:calc(100vw - 2rem);transform:scale(.97);transition:transform .6s var(--ease)}
.lb.is-open figure{transform:none}
.lb img{max-width:min(1280px,calc(100vw - 2rem));max-height:calc(100vh - 9rem);max-height:calc(100svh - 9rem);width:auto;height:auto;object-fit:contain;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.lb figcaption{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-l);text-align:center}
.lb button{position:absolute;background:rgba(5,10,23,.5);border:1px solid rgba(241,212,137,.4);color:var(--ivory);width:3rem;height:3rem;display:grid;place-items:center;font-size:1.6rem;line-height:1;cursor:pointer;transition:background-color .4s,color .4s}
.lb button:hover{background:var(--gold);color:var(--navy-900)}
.lb__x{top:1rem;right:1rem}
.lb__prev{left:1rem;top:50%;transform:translateY(-50%)}
.lb__next{right:1rem;top:50%;transform:translateY(-50%)}
@media (max-width:600px){.lb__prev,.lb__next{top:auto;bottom:1rem;transform:none}}

/* terms page */
.terms{display:grid;grid-template-columns:minmax(220px,300px) minmax(0,1fr);gap:clamp(2rem,6vw,5rem);align-items:start}
.terms__side{position:sticky;top:calc(var(--hdr) + 1.5rem)}
.draft{display:inline-block;font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;background:var(--gold);color:var(--navy-900);padding:.5rem .7rem;margin:0 0 1rem;line-height:1.5}
.terms__date{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted)}
.toc{border-top:1px solid var(--ink);margin-bottom:1.6rem}
.toc summary{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;padding:.9rem 0;cursor:pointer;list-style:none}
.toc summary::-webkit-details-marker{display:none}
.toc summary::after{content:"+";float:right;color:var(--gold-ink)}
.toc[open] summary::after{content:"–"}
.toc ol{list-style:none;max-height:calc(100vh - var(--hdr) - 18rem);overflow:auto}
.toc a{display:flex;gap:.8rem;padding:.42rem 0;border-bottom:1px solid var(--line-l);font-size:.93rem;color:var(--ink-muted);transition:color .3s}
.toc a span{font-family:var(--mono);font-size:.66rem;color:var(--gold-ink);padding-top:.2rem;min-width:1.4rem}
.toc a:hover{color:var(--ink)}
.terms__body>.lead{margin-bottom:2.5rem}
.clause{padding:2.2rem 0;border-top:1px solid var(--line-l);scroll-margin-top:calc(var(--hdr) + 1rem)}
.clause h2{font-size:clamp(1.6rem,2.6vw,2.2rem);display:flex;gap:1rem;align-items:baseline;margin-bottom:1.2rem}
.clause h2 span{font-family:var(--mono);font-size:.74rem;color:var(--gold-ink);letter-spacing:.12em}
.clause ol{list-style:none}
.clause li{display:grid;grid-template-columns:3rem minmax(0,1fr);gap:.4rem;padding:.55rem 0}
.clause li span{font-family:var(--mono);font-size:.72rem;color:var(--ink-muted);padding-top:.25rem}
.clause li p{margin:0;color:var(--ink);max-width:68ch}
.clause .plain li{grid-template-columns:1fr}
@media (max-width:900px){
  .terms{grid-template-columns:1fr}
  .terms__side{position:static}
  .toc ol{max-height:none}
  .clause li{grid-template-columns:2.4rem minmax(0,1fr)}
}
@media print{
  .hdr,.menu,.foot,.phero,.terms__side .btn,.toc,.skip{display:none!important}
  body{background:#fff;color:#000}
  .sec{padding:0}
  .terms{grid-template-columns:1fr}
  .reveal{opacity:1!important;transform:none!important}
  .clause{break-inside:avoid-page}
}

/* contact: visit + map, branches HQ line */
.addr{font-style:normal;font-family:var(--serif);font-size:clamp(1.3rem,2.2vw,1.75rem);line-height:1.4;margin:1rem 0 1.6rem}
.ccard p{margin:0;color:var(--ink-muted)}
.map{position:relative;aspect-ratio:4/3;overflow:hidden;border:1px solid var(--line-l);background:var(--ivory-2)}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(.35) sepia(.15)}
.hq{margin:.8rem 0 0;font-size:.92rem;color:var(--ink-muted)}
.hq b{display:block;font-family:var(--mono);font-weight:400;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:.2rem}
.contact-list a.addr-l{word-break:normal;overflow-wrap:break-word}

/* ═════════ 2026-10 round 2: hero dolphins, Sir MV, full price list on home ═════════ */
/* hero copy line: brighter gold with a soft shadow so it reads over any photo */
.hero .kicker,.phero .kicker{color:#f7e6ad;text-shadow:0 1px 2px rgba(5,10,23,.95),0 0 18px rgba(5,10,23,.9);font-weight:500}
.hero__inner{position:relative;z-index:1}

/* dolphins leaping out of a moving sea (Lottie) at the foot of the "We rise together" section */
.dol.sec{padding-bottom:0}
.dol .dol__text p.muted{color:var(--ink-muted)}
.sea{position:relative;height:clamp(260px,30vw,460px);margin-top:clamp(1.5rem,4vw,3rem);overflow:hidden;opacity:0;transition:opacity 1s var(--ease)}
.sea.is-on{opacity:1}
.sea__waves{position:absolute;left:0;right:0;bottom:0;height:100%;z-index:2}
.sea__waves svg{width:100%!important;height:100%!important}
.sea__dolphins{position:absolute;left:0;bottom:12%;width:min(620px,40vw);aspect-ratio:3/2;z-index:1;opacity:0;transition:opacity .2s;animation:swim 13s linear infinite}
.sea__dolphins.is-leaping{opacity:1}
.sea.is-paused .sea__dolphins{animation-play-state:paused}
@keyframes swim{from{transform:translateX(100vw)}to{transform:translateX(-100%)}}
@media (prefers-reduced-motion:reduce){.sea__dolphins{animation:none;left:50%;transform:translateX(-50%)}}
.sea__dolphins svg{display:block}
@media (max-width:820px){.sea{height:clamp(230px,64vw,380px)}.sea__dolphins{width:82vw;bottom:13%;animation-duration:8.5s}}
.no-js .sea{display:none}

/* Sir M. Visvesvaraya: gold offset frame (as on the GeeFit / Gully Cricket sites) + quote block */
.mv__fig{width:min(380px,100%);position:relative;isolation:isolate}
.pframe{position:relative;display:block}
.pframe::before{content:"";position:absolute;inset:14px -14px -14px 14px;border:1px solid var(--gold);z-index:-1}
.pframe img{width:100%;aspect-ratio:1;object-fit:cover;box-shadow:0 30px 60px -24px rgba(5,10,23,.55)}
.mv__fig figcaption{margin-top:2.2rem;text-align:left}
.quote-block{border-left:2px solid var(--gold);padding:.3rem 0 .3rem 1.6rem;font-family:var(--serif);font-size:clamp(1.1rem,1.6vw,1.3rem);line-height:1.62;color:var(--ink)}
.quote-block strong{color:var(--gold-deep);font-weight:600}
.quote-block p{margin:0 0 1rem}
.quote-block p+p{font-family:var(--sans);font-size:1rem;color:var(--ink-muted)}
.mv__quote{border-left:0;padding-left:0}
.mvt{list-style:none;border-left:1px solid var(--line-d);margin-left:.4rem}
.mvt li{position:relative;display:grid;grid-template-columns:6.5rem minmax(0,1fr);gap:1rem;padding:1rem 0 1rem 1.8rem}
.mvt li::before{content:"";position:absolute;left:-5px;top:1.45rem;width:9px;height:9px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px var(--navy-900)}
.mvt b{font-family:var(--serif);font-weight:500;font-size:1.5rem;color:var(--gold-l);line-height:1.1}
.mvt p{margin:0;color:var(--txt);max-width:62ch}
.mvb-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-l);border-left:1px solid var(--line-l)}
.mvb{padding:1.6rem 1.4rem;border-right:1px solid var(--line-l);border-bottom:1px solid var(--line-l)}
.mvb h3{font-size:1.25rem;margin-bottom:.5rem}
.mvb p{margin:0;color:var(--ink-muted);font-size:.93rem}
.mvx{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);margin-top:clamp(2.5rem,5vw,4rem)}
.mvbooks{list-style:none}
.mvbooks li{display:flex;gap:1rem;padding:.55rem 0;border-bottom:1px solid var(--line-l);font-family:var(--serif);font-size:1.12rem}
.mvbooks span{font-family:var(--mono);font-size:.72rem;color:var(--gold-ink);padding-top:.3rem}
@media (max-width:1100px){.mvb-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.mvb-grid,.mvx{grid-template-columns:1fr}.mvt li{grid-template-columns:1fr;gap:.2rem}.mv__fig{width:min(300px,82%)}}

/* the six chart benefits above the fee table */
.bene{display:grid;grid-template-columns:repeat(6,1fr);border:1px solid var(--line-l);margin-bottom:2rem;background:var(--ivory)}
.bene>div{display:grid;justify-items:center;gap:.6rem;padding:1.2rem .6rem;text-align:center;border-right:1px solid var(--line-l)}
.bene>div:last-child{border-right:0}
.bene svg{width:30px;height:30px;fill:none;stroke:var(--gold-deep);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.bene span{font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);line-height:1.5}
@media (max-width:820px){.bene{grid-template-columns:repeat(3,1fr)}.bene>div:nth-child(3){border-right:0}.bene>div:nth-child(-n+3){border-bottom:1px solid var(--line-l)}}
@media (max-width:420px){.bene{grid-template-columns:repeat(2,1fr)}.bene>div:nth-child(n){border-right:1px solid var(--line-l);border-bottom:1px solid var(--line-l)}.bene>div:nth-child(2n){border-right:0}.bene>div:nth-last-child(-n+2){border-bottom:0}}
.t-cream .fees tbody tr:hover{background:var(--ivory)}
.t-cream .tbl-wrap{background:transparent}

/* ═════════ Enquiry form: styled dropdowns (native select kept hidden for the value) ═════════ */
.form .lbl{display:block;font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted);margin-bottom:1.3rem}
.fsel{position:relative;margin-top:.4rem;text-transform:none;letter-spacing:0}
.fsel__native{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;bottom:0;left:0}
.fsel__btn{display:flex;align-items:center;gap:.8rem;width:100%;padding:.75rem 0 .7rem;background:none;border:0;border-bottom:1px solid var(--line-l);color:var(--ink);cursor:pointer;text-align:left;transition:border-color .4s}
.fsel__btn:hover,.fsel.open .fsel__btn{border-bottom-color:var(--gold-d)}
.fsel__val{flex:1;min-width:0;font-family:var(--serif);font-size:1.12rem;line-height:1.3;overflow-wrap:break-word}
.fsel__amt{font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;color:var(--gold-ink);white-space:nowrap}
.fsel__btn i{width:9px;height:9px;border-right:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);transform:translateY(-3px) rotate(45deg);transition:transform .45s var(--ease);flex:none;margin-right:4px}
.fsel.open .fsel__btn i{transform:translateY(2px) rotate(-135deg)}
.fsel__pop{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:40;background:var(--ivory);border:1px solid var(--line-l);border-top:2px solid var(--gold);box-shadow:0 30px 70px -25px rgba(5,10,23,.45),0 6px 18px -8px rgba(5,10,23,.2);
  opacity:0;visibility:hidden;transform:translateY(-8px) scale(.985);transform-origin:top center;transition:opacity .3s var(--ease),transform .5s var(--ease),visibility .3s}
.fsel.up .fsel__pop{top:auto;bottom:calc(100% + 8px);transform-origin:bottom center;transform:translateY(8px) scale(.985)}
.fsel.open .fsel__pop{opacity:1;visibility:visible;transform:none;transition:opacity .3s var(--ease),transform .5s var(--ease),visibility 0s}
.fsel__head{display:none}
.fsel__list{list-style:none;max-height:min(380px,60vh);overflow-y:auto;padding:.4rem 0;outline:0;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--gold-d) transparent}
.fsel__grp{position:sticky;top:-.4rem;z-index:1;background:var(--ivory);padding:.85rem 1.1rem .4rem;font-family:var(--mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-ink);display:flex;align-items:center;gap:.7rem}
.fsel__grp::after{content:"";flex:1;height:1px;background:var(--line-l)}
.fsel__opt{display:grid;grid-template-columns:minmax(0,1fr) auto 16px;align-items:baseline;gap:.9rem;padding:.62rem 1.1rem;cursor:pointer;color:var(--ink);transition:background-color .25s}
.fsel__opt span{font-family:var(--serif);font-size:1.02rem;line-height:1.35}
.fsel__opt small{font-family:var(--mono);font-size:.7rem;letter-spacing:.04em;color:var(--ink-muted);white-space:nowrap}
.fsel__opt svg{width:15px;height:15px;color:var(--gold-d);opacity:0;align-self:center;transition:opacity .25s}
.fsel__opt.is-active{background:var(--ivory-2)}
.fsel__opt[aria-selected="true"]{background:var(--navy-800);color:var(--ivory)}
.fsel__opt[aria-selected="true"] small{color:var(--gold-l)}
.fsel__opt[aria-selected="true"] svg{opacity:1;color:var(--gold-l)}
.fsel__opt[aria-selected="true"].is-active{background:var(--navy-700)}
.fsel__scrim{display:none}
/* phones: the list slides up as a bottom sheet */
@media (max-width:600px){
  .fsel__scrim{display:block;position:fixed;inset:0;z-index:140;background:rgba(5,10,23,.55);opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
  .fsel.open .fsel__scrim{opacity:1;visibility:visible}
  .fsel__pop,.fsel.up .fsel__pop{position:fixed;left:0;right:0;top:auto;bottom:0;z-index:150;border:0;border-top:2px solid var(--gold);border-radius:14px 14px 0 0;transform:translateY(100%);transition:transform .55s var(--ease),visibility .55s;opacity:1;padding-bottom:env(safe-area-inset-bottom)}
  .fsel.open .fsel__pop{transform:none}
  .fsel__head{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.1rem .5rem;border-bottom:1px solid var(--line-l)}
  .fsel__head b{font-family:var(--mono);font-weight:400;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-muted)}
  .fsel__x{background:none;border:1px solid var(--line-l);width:2.2rem;height:2.2rem;border-radius:50%;font-size:1.3rem;line-height:1;color:var(--ink);cursor:pointer}
  .fsel__list{max-height:68vh}
  .fsel__opt{padding:.8rem 1.1rem}
}
@media (prefers-reduced-motion:reduce){.fsel__pop{transition:opacity .2s,visibility .2s}}
/* grid/flex children may shrink below their content (long dropdown values never widen the form) */
.split>*,.form,.fsel,.fsel__btn{min-width:0}