/* Urban Resort Day Spa — shared styles.
   Layout: deep-green rooms with gold linework from the logo, one ivory "daylight" room per page,
   left-anchored oversized serif headlines. Single committed dark look. */
:root{
  color-scheme:dark;
  --green-deep:#04150e;
  --green:#061d13;
  --green-raise:#0c2c1e;
  --green-line:#1c4733;
  --gold:#dbb867;
  --gold-bright:#f2dc9c;
  --gold-dim:#8f7a44;
  --ivory:#f4eedc;
  --mist:#a8b8aa;
  --paper:#efe8d3;
  --paper-ink:#0a2418;
  --paper-mute:#55604f;
  --paper-line:#cfc6aa;
  --display:"Marcellus","Cormorant Garamond","Times New Roman",serif;
  --body:"Mulish","Avenir Next","Segoe UI",system-ui,sans-serif;
  --ease:cubic-bezier(.19,1,.22,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--green);color:var(--ivory);font-family:var(--body);font-size:17px;line-height:1.65;font-weight:400;overflow-x:hidden}
img{max-width:100%}
[hidden]{display:none!important}
a{color:inherit}
h1,h2,h3{font-family:var(--display);font-weight:400;margin:0;text-wrap:balance;letter-spacing:.005em}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
.wrap{max-width:1240px;margin-inline:auto;padding-inline:clamp(16px,4.5vw,56px)}
.label{font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;color:var(--gold);font-weight:600}
.lede{color:var(--mist);max-width:60ch;font-size:1.06rem}
.fine{font-size:.82rem;color:var(--mist);max-width:70ch}
.gold{color:var(--gold)}
:focus-visible{outline:2px solid var(--gold-bright);outline-offset:3px}
.tlink{color:var(--gold-bright);text-underline-offset:.25em}

.tbd{display:inline-block;border:1px dashed var(--gold-dim);color:var(--gold);padding:.05em .6em;font-size:.78em;letter-spacing:.04em;border-radius:2px;font-family:var(--body);line-height:1.5}
.paper .tbd{border-color:var(--paper-mute);color:var(--paper-ink)}
.draftbar{background:var(--green-deep);border-bottom:1px solid var(--green-line);font-size:.8rem;color:var(--mist);padding-block:.5rem;text-align:center}

/* page furniture */
.progress{position:fixed;left:0;top:0;height:2px;width:100%;background:var(--gold);transform-origin:0 50%;transform:scaleX(0);z-index:60}
.cursor{position:fixed;left:0;top:0;width:34px;height:34px;margin:-17px 0 0 -17px;border:1px solid var(--gold);border-radius:50%;pointer-events:none;z-index:95;opacity:0;transition:width .3s var(--ease),height .3s var(--ease),margin .3s var(--ease),opacity .3s,background .3s}
.cursor.on{opacity:.9}
.cursor.big{width:64px;height:64px;margin:-32px 0 0 -32px;background:rgba(219,184,103,.12)}
.curtain{position:fixed;inset:0;background:var(--green-deep);z-index:90;display:grid;place-items:center;transform:translateY(101%);pointer-events:none}
.curtain img{display:none}
.js .curtain.enter{animation:lift 1s var(--ease) .15s both}
.curtain.leave{transform:translateY(0);transition:transform .55s var(--ease)}
@keyframes lift{from{transform:translateY(0)}to{transform:translateY(-101%)}}

/* nav */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(6,29,19,.84);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--green-line)}
.nav .wrap{display:flex;align-items:center;gap:1.4rem;padding-block:.6rem}
.brand{display:flex;align-items:center;gap:.75rem;text-decoration:none;margin-right:auto}
.brand img{width:44px;height:44px;border-radius:50%;display:block}
.brand span{font-family:var(--display);letter-spacing:.28em;font-size:.86rem;color:var(--gold);text-transform:uppercase}
.toplink{font-size:.76rem;letter-spacing:.24em;text-transform:uppercase;text-decoration:none;color:var(--gold-bright);padding:.6rem .2rem;border-bottom:1px solid var(--gold-dim)}
.toplink:hover{border-color:var(--gold-bright)}
.burger{display:flex;align-items:center;gap:.9rem;background:none;border:0;color:var(--ivory);cursor:pointer;padding:.6rem 0 .6rem .4rem;font:inherit}
.burger em{font-style:normal;font-size:.76rem;letter-spacing:.24em;text-transform:uppercase}
.burger span{position:relative;width:34px;height:14px;display:block}
.burger i{position:absolute;left:0;right:0;height:1px;background:var(--gold-bright);transition:transform .6s var(--ease),top .6s var(--ease)}
.burger i:nth-child(1){top:2px}.burger i:nth-child(2){top:11px}
.burger[aria-expanded="true"] i:nth-child(1){top:7px;transform:rotate(20deg)}
.burger[aria-expanded="true"] i:nth-child(2){top:7px;transform:rotate(-20deg)}
.drawer{position:fixed;inset:0;z-index:45;background:var(--green-deep);padding:calc(100px + env(safe-area-inset-top,0px)) clamp(16px,6vw,80px) 2.5rem;overflow-y:auto;display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:3rem;align-items:end;clip-path:inset(0 0 100% 0);transition:clip-path .8s var(--ease)}
.drawer.open{clip-path:inset(0)}
.drawer nav{counter-reset:ch;align-self:center}
.drawer a.big{counter-increment:ch;display:flex;align-items:baseline;gap:1.4rem;font-family:var(--display);font-size:clamp(1.9rem,5.4vw,4.2rem);text-decoration:none;line-height:1.22;transform:translateY(60%);opacity:0;transition:transform .9s var(--ease),opacity .9s var(--ease),color .4s,padding .6s var(--ease)}
.drawer a.big::before{content:counter(ch,decimal-leading-zero);font-family:var(--body);font-size:.72rem;letter-spacing:.2em;color:var(--gold);min-width:2.2em}
.drawer.open a.big{transform:none;opacity:1}
.drawer a.big:hover{color:var(--gold-bright);padding-left:1rem}
.drawer a.big[aria-current]{color:var(--gold)}
.dside{display:grid;gap:1.1rem;color:var(--mist);font-size:.95rem;justify-items:start;border-left:1px solid var(--green-line);padding-left:2rem}
@media (max-width:760px){.drawer{grid-template-columns:minmax(0,1fr);align-items:start;gap:2rem}.dside{border-left:0;padding-left:0;border-top:1px solid var(--green-line);padding-top:1.5rem}}
@media (max-width:420px){.brand span{display:none}}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.7rem;position:relative;overflow:hidden;border:1px solid var(--gold);color:var(--gold-bright);background:transparent;padding:.95rem 1.6rem;font:600 .78rem/1 var(--body);letter-spacing:.2em;text-transform:uppercase;text-decoration:none;cursor:pointer;border-radius:0;transition:color .5s var(--ease)}
.btn::before{content:"";position:absolute;inset:0;background:var(--gold);transform:translateY(101%);transition:transform .6s var(--ease)}
.btn:hover{color:var(--green-deep)}
.btn:hover::before{transform:translateY(0)}
.btn>*{position:relative}
.btn.solid{background:var(--gold);color:var(--green-deep)}
.btn.solid::before{background:var(--gold-bright)}
.btn .arr{display:inline-block;transition:transform .5s var(--ease)}
.btn:hover .arr{transform:translateX(6px)}
.btn.sm{padding:.7rem 1rem;font-size:.7rem}
.paper .btn{border-color:var(--paper-ink);color:var(--paper-ink)}
.paper .btn::before{background:var(--paper-ink)}
.paper .btn:hover{color:var(--paper)}
.cta{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2rem}

/* heroes */
.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--green-line)}
.totop{grid-column:1/-1;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.hero canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero .wrap{position:relative;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,4rem);align-items:center;padding-block:clamp(3.5rem,9vw,7.5rem)}
.hero h1{font-size:clamp(2.7rem,8.2vw,7.2rem);line-height:.98;margin-block:1.4rem 1.8rem}
.hero.sub .wrap{grid-template-columns:minmax(0,1fr);padding-block:clamp(3rem,7vw,6rem)}
.hero.sub h1{font-size:clamp(2.5rem,7vw,6rem)}
h1 .ln{display:block;overflow:hidden;padding-bottom:.1em}
h1 .ln>span{display:block}
h1 em,h2 em{font-style:normal;color:var(--gold)}
.seal{position:relative;width:min(100%,400px);aspect-ratio:1;max-width:100%;justify-self:center}
.seal svg{position:absolute;inset:0;width:100%;height:100%;animation:spin 48s linear infinite}
.seal img{position:absolute;inset:15%;width:70%;height:70%;border-radius:50%;box-shadow:0 30px 80px rgba(0,0,0,.55)}
.seal text{font-family:var(--display);font-size:13.5px;letter-spacing:.42em;fill:var(--gold)}
@keyframes spin{to{transform:rotate(360deg)}}
@media (max-width:820px){.hero .wrap{grid-template-columns:minmax(0,1fr)}.seal{width:min(72%,300px);order:-1;justify-self:start}}
.js h1 .ln>span{transform:translateY(105%);animation:rise 1.3s var(--ease) .35s forwards}
.js h1 .ln:nth-child(2)>span{animation-delay:.47s}
.js h1 .ln:nth-child(3)>span{animation-delay:.59s}
.js .hero .fade{opacity:0;animation:fadeup 1.2s var(--ease) .8s forwards}
@keyframes rise{to{transform:none}}
@keyframes fadeup{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.crumb{display:flex;gap:.6rem;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--mist)}
.crumb a{text-decoration:none}.crumb a:hover{color:var(--gold-bright)}

/* marquee */
.marquee{overflow:hidden;border-bottom:1px solid var(--green-line);background:var(--green-deep);padding-block:1.1rem}
.marquee .track{display:flex;width:max-content;animation:slide 40s linear infinite}
.marquee span{font-family:var(--display);font-size:clamp(1.3rem,3vw,2.2rem);white-space:nowrap;padding-inline:1.4rem}
.marquee i{font-style:normal;color:var(--gold);padding-inline:.2rem}
@keyframes slide{to{transform:translateX(-50%)}}

/* rooms */
section{position:relative}
.room{padding-block:clamp(4rem,9vw,7.5rem);overflow:clip;background:var(--green)}
.room.tight{padding-top:0}
.room.deep{background:var(--green-deep);border-block:1px solid var(--green-line)}
.head{display:grid;gap:1.2rem;margin-bottom:clamp(2.2rem,5vw,3.6rem)}
.head h2{font-size:clamp(2.1rem,5.4vw,4.4rem);line-height:1.04}
.head.flat{margin:0}
.ghost{position:absolute;right:-2vw;top:1rem;font-family:var(--display);font-size:clamp(6rem,22vw,20rem);line-height:.8;color:transparent;-webkit-text-stroke:1px var(--green-line);pointer-events:none;user-select:none;white-space:nowrap;will-change:transform}
.js .rv{opacity:.3;transform:translateY(34px);transition:opacity 1.1s var(--ease),transform 1.1s var(--ease)}
.js .rv.in{opacity:1;transform:none}
.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:clamp(2rem,5vw,5rem);align-items:start}
.two>*{min-width:0}
.dia{width:9px;height:9px;background:var(--gold);transform:rotate(45deg);flex:none;display:inline-block}

.paper{background:var(--paper);color:var(--paper-ink)}
.paper .label{color:var(--paper-mute)}
.paper .lede,.paper .fine{color:var(--paper-mute)}
.paper .ghost{-webkit-text-stroke-color:#d9d0b6}
.paper h2 em{color:#7a6426}
.paper .tlink{color:var(--paper-ink)}

/* pillars / cards */
.pillars{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));border-top:1px solid var(--green-line)}
.pillar{padding:2rem 1.6rem 2.2rem 0;border-bottom:1px solid var(--green-line);display:grid;gap:.8rem;min-width:0;align-content:start}
.pillar h3{font-size:1.5rem;color:var(--gold-bright)}
.pillar p{color:var(--mist);font-size:.97rem}
.paper .pillars,.paper .pillar{border-color:var(--paper-line)}
.paper .pillar h3{color:var(--paper-ink)}
.paper .pillar p{color:var(--paper-mute)}
.paper .dia{background:var(--paper-ink)}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:1px;background:var(--green-line);border:1px solid var(--green-line)}
.tiles>*{background:var(--green);padding:1.8rem;display:grid;gap:.6rem;align-content:start;transition:background .5s var(--ease);min-width:0;text-decoration:none}
.deep .tiles>*{background:var(--green-deep)}
.tiles>*:hover{background:var(--green-raise)}
.tiles h3{font-size:1.35rem;color:var(--gold-bright)}
.tiles p{color:var(--mist);font-size:.94rem}
.tiles .go{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-top:.4rem}

/* rows (menus, plans) */
.rows{border-top:1px solid var(--green-line)}
.item{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.5fr) auto;gap:1rem 2rem;align-items:baseline;padding:1.5rem .4rem;border-bottom:1px solid var(--green-line);overflow:hidden}
.js .item.pop{animation:fadeup .8s var(--ease) both}
.item::before{content:"";position:absolute;inset:0;background:var(--green-raise);transform:scaleY(0);transform-origin:50% 100%;transition:transform .6s var(--ease)}
.item:hover::before{transform:scaleY(1)}
.item>*{position:relative;min-width:0}
.item h3{font-size:clamp(1.3rem,2.4vw,1.9rem);transition:transform .6s var(--ease),color .4s}
.item:hover h3{transform:translateX(14px);color:var(--gold-bright)}
.item p{color:var(--mist);font-size:.96rem}
.item .cat{display:block;font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:.3rem}
.item .meta{text-align:right;font-size:.86rem;color:var(--mist);display:grid;gap:.4rem;justify-items:end}
.price{font-family:var(--display);font-weight:400;font-size:1.3rem;color:var(--gold-bright);font-variant-numeric:tabular-nums}
@media (max-width:760px){.item{grid-template-columns:minmax(0,1fr)}.item .meta{justify-items:start;text-align:left;grid-auto-flow:column;justify-content:start;align-items:center;gap:1rem}}
.empty{padding:2rem .4rem;color:var(--mist);border-bottom:1px solid var(--green-line)}

.tabs{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:1.6rem}
.tab{background:none;border:1px solid var(--green-line);color:var(--mist);font:600 .74rem/1 var(--body);letter-spacing:.18em;text-transform:uppercase;padding:.8rem 1.1rem;cursor:pointer;transition:all .4s var(--ease)}
.tab:hover{border-color:var(--gold-dim);color:var(--ivory)}
.tab[aria-selected="true"],.tab[aria-pressed="true"]{background:var(--gold);border-color:var(--gold);color:var(--green-deep)}
.toolbar{display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:end;justify-content:space-between;margin-bottom:1.6rem}
.toolbar .tabs{margin:0}
.search{display:grid;gap:.4rem;min-width:min(100%,260px)}

.perks{display:grid}
.perks li{display:flex;gap:1rem;align-items:baseline;padding-block:1rem;border-bottom:1px solid var(--green-line)}
.perks .dia{width:7px;height:7px}
.paper .perks li{border-color:var(--paper-line)}
.plans li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:1rem}
.plans b{font-family:var(--display);font-weight:400;font-size:1.4rem;display:block}
.plans small{color:var(--mist);font-size:.9rem;display:block}
.plans em{font-style:normal;color:var(--gold-bright);white-space:nowrap;font-variant-numeric:tabular-nums}
.rate{border:1px solid var(--gold-dim);padding:2rem;display:grid;gap:1rem;justify-items:start}
.rate strong{font-family:var(--display);font-weight:400;font-size:clamp(1.8rem,4vw,2.4rem);color:var(--gold-bright);line-height:1.1}
.rate p{color:var(--mist);font-size:.94rem}

/* tables */
.scroll{overflow-x:auto}
.ledger{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.ledger th,.ledger td{text-align:left;padding:1.05rem 1rem 1.05rem 0;border-bottom:1px solid var(--green-line);vertical-align:baseline;font-weight:400}
.ledger thead th{font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);font-weight:600}
.ledger td.num,.ledger th.num{text-align:right;padding-right:0;white-space:nowrap}
.ledger td.num{font-family:var(--display);font-size:1.25rem;color:var(--gold-bright)}
.ledger tbody th{font-family:var(--display);font-size:1.25rem;white-space:nowrap}
.ledger td{color:var(--mist)}
.ledger caption{text-align:left;padding-bottom:1rem}
.kv td:last-child{text-align:right;padding-right:0;color:var(--ivory)}
.kv th{color:var(--ivory)}

/* steps */
.steps{position:relative;padding:0 0 0 2.6rem;counter-reset:s;display:grid}
.steps::before{content:"";position:absolute;left:.72rem;top:.4rem;bottom:.4rem;width:1px;background:var(--green-line)}
.steps .fill{position:absolute;left:.72rem;top:.4rem;bottom:.4rem;width:1px;background:var(--gold);transform-origin:50% 0;transform:scaleY(0)}
.steps li{counter-increment:s;position:relative;padding-block:1.15rem;display:grid;gap:.3rem}
.steps li::before{content:counter(s);position:absolute;left:-2.6rem;top:1.1rem;width:1.5rem;height:1.5rem;display:grid;place-items:center;background:var(--green);border:1px solid var(--gold);border-radius:50%;font-size:.7rem;color:var(--gold)}
.deep .steps li::before{background:var(--green-deep)}
.steps h3{font-size:1.3rem}
.steps p{color:var(--mist);font-size:.95rem}

/* accordions */
details{border-bottom:1px solid var(--green-line)}
details:first-of-type{border-top:1px solid var(--green-line)}
summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:1rem;align-items:baseline;padding-block:1.2rem;font-family:var(--display);font-size:1.22rem}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--gold);font-family:var(--body);font-weight:300;font-size:1.5rem;line-height:1;transition:transform .5s var(--ease);flex:none}
details[open] summary::after{transform:rotate(45deg)}
details .ans{color:var(--mist);padding-bottom:1.4rem;max-width:66ch;display:grid;gap:.7rem}
details .ans li{padding-left:1.2rem;position:relative}
details .ans li::before{content:"";position:absolute;left:0;top:.7em;width:6px;height:6px;background:var(--gold);transform:rotate(45deg)}
.paper details,.paper details:first-of-type{border-color:var(--paper-line)}
.paper details .ans{color:var(--paper-mute)}
.paper summary::after{color:var(--paper-ink)}
.paper details .ans li::before{background:var(--paper-ink)}

/* rename + timeline */
.rename{display:flex;flex-wrap:wrap;align-items:baseline;gap:.4em 1rem;font-family:var(--display);font-size:clamp(2rem,6.4vw,5.2rem);line-height:1.05}
.rename s{color:var(--paper-mute);text-decoration-thickness:2px}
.rename .to{font-size:.5em;color:var(--paper-mute)}
.line{display:grid;border-top:1px solid var(--paper-ink)}
.era{display:grid;grid-template-columns:minmax(0,240px) minmax(0,1fr);gap:1rem 2.5rem;padding-block:1.8rem;border-bottom:1px solid var(--paper-line)}
.era h3{font-size:1.5rem}
.era p{color:var(--paper-mute);max-width:62ch}
@media (max-width:640px){.era{grid-template-columns:minmax(0,1fr)}}
.quote{font-family:var(--display);font-size:clamp(1.8rem,4.6vw,3.6rem);line-height:1.15;max-width:22ch}

/* forms */
form.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem 1.6rem}
.f{display:grid;gap:.45rem;min-width:0;align-content:start}
.f.full{grid-column:1/-1}
.f label,.search label,.flabel{font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.f input,.f select,.f textarea,.search input{width:100%;background:transparent;border:0;border-bottom:1px solid var(--green-line);color:var(--ivory);font:400 1rem var(--body);padding:.7rem 0;border-radius:0;transition:border-color .4s}
.f select option{background:var(--green-deep);color:var(--ivory)}
.f input:focus,.f select:focus,.f textarea:focus,.search input:focus{outline:none;border-bottom-color:var(--gold-bright)}
.f.bad input,.f.bad select,.f.bad textarea{border-bottom-color:#e2906f}
.f .err{font-size:.8rem;color:#f0b199;min-height:0}
.status{grid-column:1/-1;border:1px dashed var(--gold-dim);padding:1rem 1.2rem;color:var(--gold-bright);font-size:.92rem}
.status.ok{border-style:solid}
@media (max-width:640px){form.grid{grid-template-columns:minmax(0,1fr)}}
.stepper{display:flex;gap:.5rem;grid-column:1/-1;margin-bottom:.4rem}
.stepper span{flex:1;height:2px;background:var(--green-line);position:relative;overflow:hidden}
.stepper span::after{content:"";position:absolute;inset:0;background:var(--gold);transform:scaleX(0);transform-origin:0 50%;transition:transform .8s var(--ease)}
.stepper span.on::after{transform:scaleX(1)}
.stage{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem 1.6rem}
.js .stage{animation:fadeup .7s var(--ease) both}
@media (max-width:640px){.stage{grid-template-columns:minmax(0,1fr)}}
.stage h3{grid-column:1/-1;font-size:1.5rem}
.rowbtns{grid-column:1/-1;display:flex;gap:1rem;flex-wrap:wrap}
.range{display:grid;gap:.6rem}
.range input[type=range]{width:100%;accent-color:var(--gold)}
.range output{font-family:var(--display);font-size:1.6rem;color:var(--gold-bright)}

/* contact blocks */
.copyrow{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem;padding-block:1rem;border-bottom:1px solid var(--green-line)}
.copyrow b{font-family:var(--display);font-weight:400;font-size:1.3rem;user-select:all;margin-right:auto;min-width:0;overflow-wrap:anywhere}
.copyrow small{flex-basis:100%;font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.copy{background:none;border:1px solid var(--green-line);color:var(--mist);font:600 .66rem/1 var(--body);letter-spacing:.18em;text-transform:uppercase;padding:.55rem .8rem;cursor:pointer}
.copy:hover{border-color:var(--gold);color:var(--gold-bright)}

footer{border-top:1px solid var(--green-line);padding-block:3.5rem 2.5rem;font-size:.88rem;color:var(--mist);background:var(--green-deep)}
footer .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:2.2rem}
footer h3{font-family:var(--body);font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:.8rem;font-weight:600}
footer p+p,footer li+li{margin-top:.4rem}
footer a{text-decoration:none}footer a:hover{color:var(--gold-bright)}
.fbrand{display:grid;gap:1rem;justify-items:start}
.fbrand img{width:84px;height:84px;border-radius:50%}
.legal{grid-column:1/-1;border-top:1px solid var(--green-line);padding-top:1.5rem;font-size:.78rem}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .rv{opacity:1;transform:none}
  .js h1 .ln>span{transform:none}
  .js .hero .fade{opacity:1}
  .curtain{display:none}
  html{scroll-behavior:auto}
}

/* ================= cinematic chapters ================= */
.scenebg{position:fixed;inset:0;width:100%;height:100%;z-index:-1;display:block}
.scene,.hero{background:radial-gradient(120% 90% at 70% 20%,#12452f 0%,#082317 45%,#04150e 100%)}
.gl .scene,.gl .hero{background:linear-gradient(180deg,rgba(4,21,14,.35),rgba(4,21,14,.15) 40%,rgba(4,21,14,.7))}
.scene{position:relative;overflow:hidden;display:grid;align-items:center;border-block:1px solid var(--green-line)}
.scene .wrap{width:100%}

.opening{min-height:min(92vh,900px);align-items:end}
.opening .wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2rem;align-items:end;padding-block:clamp(5rem,12vh,9rem) clamp(2.5rem,6vh,4.5rem)}
.opening h1{font-size:clamp(3.4rem,13vw,12.5rem);line-height:.9;letter-spacing:-.01em;margin-top:1.2rem}
.opening .aside{display:grid;gap:1.6rem;justify-items:start;max-width:28ch;padding-bottom:1rem}
.opening .aside p{font-family:var(--display);font-size:clamp(1.15rem,1.8vw,1.5rem);line-height:1.35}
.scrollcue{display:inline-flex;align-items:center;gap:.8rem;font-size:.68rem;letter-spacing:.3em;text-transform:uppercase;color:var(--mist)}
.scrollcue::before{content:"";width:1px;height:46px;background:linear-gradient(var(--gold),transparent);animation:cue 2.4s var(--ease) infinite;transform-origin:50% 0}
@keyframes cue{0%{transform:scaleY(0)}60%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
@media (max-width:820px){.opening .wrap{grid-template-columns:minmax(0,1fr)}}

.tex{position:relative;overflow:hidden;background:linear-gradient(135deg,#0f3324,#061d13 60%,#3a3118);isolation:isolate}
.tex::before{content:"";position:absolute;inset:-12%;background-image:var(--tex);background-size:cover;background-position:center;transition:transform 1.6s var(--ease);will-change:transform;z-index:-1}
a.tex:hover::before,.tenet:hover .tex::before{transform:scale(1.08)}
.tex::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(4,21,14,.75));z-index:-1}

.mosaic{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(.6rem,1.4vw,1.2rem);margin-top:clamp(2.5rem,6vw,5rem)}
.mosaic a{display:flex;flex-direction:column;justify-content:flex-end;gap:.3rem;padding:1.3rem;text-decoration:none;min-height:220px;border:1px solid transparent;transition:border-color .6s}
.mosaic a:hover{border-color:var(--gold-dim)}
.mosaic b{font-family:var(--display);font-weight:400;font-size:clamp(1.5rem,2.6vw,2.4rem);line-height:1.1}
.mosaic small{font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-bright)}
.mosaic a:nth-child(1){grid-column:1/6;aspect-ratio:4/5}
.mosaic a:nth-child(2){grid-column:6/10;aspect-ratio:1;align-self:end}
.mosaic a:nth-child(3){grid-column:10/13;aspect-ratio:3/4;margin-top:4rem}
.mosaic a:nth-child(4){grid-column:3/8;aspect-ratio:16/10}
.mosaic a:nth-child(5){grid-column:8/13;aspect-ratio:16/11;margin-top:-3rem}
@media (max-width:760px){.mosaic a:nth-child(n){grid-column:span 6;aspect-ratio:3/4;margin:0;min-height:0}.mosaic a:nth-child(1){grid-column:1/-1;aspect-ratio:4/3}}
.poem{font-family:var(--display);font-size:clamp(2.2rem,6.4vw,5.6rem);line-height:1.02}
.poem span{display:block}.poem span:nth-child(2){padding-left:12%}.poem span:nth-child(3){padding-left:4%}
.introcols{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:2rem 5rem;align-items:end}

.statement{min-height:min(88vh,820px);text-align:center}
.statement .wrap{display:grid;gap:1.6rem;justify-items:center;padding-block:5rem}
.statement h2{font-size:clamp(1.9rem,5.6vw,4.8rem);text-transform:uppercase;letter-spacing:.12em;line-height:1.2;max-width:18ch}
.statement p{font-family:var(--display);font-size:clamp(1.1rem,1.8vw,1.4rem);color:var(--gold-bright)}
.oneword{min-height:min(96vh,880px);text-align:center}
.oneword h2{font-size:clamp(4.5rem,23vw,22rem);line-height:.9;letter-spacing:-.02em;color:var(--ivory)}
.oneword h2 .ch{display:inline-block}
.js .oneword h2 .ch{transform:translateY(60%);opacity:.15;transition:transform 1.4s var(--ease),opacity 1.4s var(--ease)}
.js .oneword.in h2 .ch{transform:none;opacity:1}
.oneword .wrap{display:grid;gap:2rem;justify-items:center;padding-block:4rem}

.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(2rem,6vw,6rem);align-items:center}
.split .imgs{position:relative;padding:0 0 12% 14%}
.split .imgs .tex:first-child{aspect-ratio:4/5}
.split .imgs .tex:last-child{position:absolute;left:0;bottom:0;width:46%;aspect-ratio:1;border:8px solid var(--green);box-sizing:content-box}
.split h2{font-size:clamp(1.9rem,4.4vw,3.6rem);text-transform:uppercase;letter-spacing:.1em;line-height:1.2}
.split .txt{display:grid;gap:1.4rem}
@media (max-width:820px){.split{grid-template-columns:minmax(0,1fr)}}

.worlds{border-top:1px solid var(--green-line);position:relative}
.worlds a{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:1rem 2rem;align-items:baseline;padding:clamp(1.4rem,3vw,2.4rem) 0;border-bottom:1px solid var(--green-line);text-decoration:none;transition:padding .7s var(--ease),color .4s}
.worlds a:hover{padding-left:1.5rem;color:var(--gold-bright)}
.worlds b{font-family:var(--display);font-weight:400;font-size:clamp(2.2rem,6.5vw,5.8rem);line-height:1}
.worlds p{color:var(--mist);font-size:.98rem;max-width:40ch}
.worlds i{font-style:normal;color:var(--gold);font-size:1.6rem;transition:transform .7s var(--ease)}
.worlds a:hover i{transform:translateX(10px)}
@media (max-width:760px){.worlds a{grid-template-columns:minmax(0,1fr) auto}.worlds p{grid-column:1/-1;grid-row:2}}
.peek{position:fixed;left:0;top:0;width:260px;aspect-ratio:4/5;pointer-events:none;z-index:40;opacity:0;transform:translate(-50%,-50%) scale(.8);transition:opacity .5s var(--ease),transform .5s var(--ease),left .12s linear,top .12s linear;margin:0}
.peek.on{opacity:1;transform:translate(-50%,-50%) scale(1)}

.tenets{background:var(--green-deep);border-block:1px solid var(--green-line);position:relative}
.pin{padding-block:clamp(3.5rem,8vw,6rem);display:grid;grid-template-columns:minmax(0,1fr);gap:2.5rem}
.thead{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:1.5rem}
.thead h2{font-size:clamp(2.2rem,5.6vw,4.6rem);line-height:1}
.counter{font-family:var(--display);font-size:1.3rem;color:var(--gold-bright);font-variant-numeric:tabular-nums;display:flex;gap:.8rem;align-items:center}
.counter::before{content:"";order:2;width:48px;height:1px;background:var(--gold-dim)}
.counter span:last-child{order:3;color:var(--mist)}
.ttrack{display:flex;gap:clamp(1rem,2.4vw,2.2rem);overflow-x:auto;padding-inline:max(clamp(16px,4.5vw,56px),calc((100vw - 1240px)/2 + 56px));scroll-snap-type:x mandatory;scrollbar-width:none}
.ttrack::-webkit-scrollbar{display:none}
.tenet{flex:0 0 min(78vw,420px);display:grid;gap:1.1rem;scroll-snap-align:center;align-content:start}
.tenet .tex{aspect-ratio:4/5}
.tenet:nth-child(even) .tex{aspect-ratio:1;margin-top:3rem}
.tenet h3{font-size:1.7rem}
.tenet p{color:var(--mist);font-size:.96rem}
.tenet small{font-size:.68rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold)}
.tenets.pinned .pin{position:sticky;top:0;height:100vh;padding-block:calc(70px + 2vh) 2vh;align-content:center;overflow:hidden}
.tenets.pinned .ttrack{overflow:visible;scroll-snap-type:none;will-change:transform}
.tenets.pinned .tenet .tex{aspect-ratio:auto;height:min(44vh,460px)}
.tenets.pinned .tenet:nth-child(even) .tex{aspect-ratio:auto;height:min(36vh,380px);margin-top:2.5rem}

.mapbox{position:relative;aspect-ratio:5/4;border:1px solid var(--green-line);background:var(--green-deep);overflow:hidden}
.mapbox svg{width:100%;height:100%;display:block}
.pulse{transform-origin:center;transform-box:fill-box;animation:pulse 2.6s ease-out infinite}
@keyframes pulse{from{transform:scale(.4);opacity:.9}to{transform:scale(3.2);opacity:0}}
.places{border-top:1px solid var(--green-line)}
.places li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.3rem 1.2rem;padding-block:1.4rem;border-bottom:1px solid var(--green-line)}
.places small{grid-column:1/-1;font-size:.66rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold)}
.places b{grid-column:1/-1;font-family:var(--display);font-weight:400;font-size:1.6rem}
.places p{grid-column:1/-1;color:var(--mist);font-size:.95rem}

.journey{min-height:min(90vh,820px)}
.journey .wrap{padding-block:5rem;display:grid;gap:2.5rem}
.slides{position:relative;display:grid}
.slide{grid-area:1/1;display:grid;gap:1.4rem;opacity:0;visibility:hidden;transform:translateY(30px);transition:opacity 1.2s var(--ease),transform 1.2s var(--ease),visibility 0s 1.2s}
.slide.on{opacity:1;visibility:visible;transform:none;transition-delay:.2s,.2s,0s}
.slide h2{font-size:clamp(3.4rem,13vw,11rem);line-height:.92}
.slide p{font-family:var(--display);font-size:clamp(1.2rem,2.2vw,1.8rem);max-width:30ch;line-height:1.35}
.sctl{display:flex;align-items:center;gap:1.4rem}
.sbtn{width:52px;height:52px;border-radius:50%;border:1px solid var(--gold-dim);background:none;color:var(--gold-bright);font-size:1.1rem;cursor:pointer;transition:background .4s,color .4s}
.sbtn:hover{background:var(--gold);color:var(--green-deep)}

.closing{min-height:min(96vh,880px);text-align:center}
.closing .wrap{display:grid;gap:2rem;justify-items:center;padding-block:5rem}
.closing h2{font-size:clamp(4.5rem,22vw,20rem);line-height:.9}
.closing p{font-family:var(--display);font-size:clamp(1.1rem,1.8vw,1.4rem);color:var(--gold-bright)}
@media (prefers-reduced-motion:reduce){.js .oneword h2 .ch{transform:none;opacity:1}.drawer{clip-path:none}}

.skip{position:fixed;left:1rem;top:-4rem;z-index:99;background:var(--gold);color:var(--green-deep);padding:.7rem 1rem;font-weight:600;text-decoration:none;transition:top .3s}
.skip:focus{top:1rem}
.founder{display:grid;grid-template-columns:minmax(0,280px) minmax(0,1fr);gap:clamp(2rem,6vw,5rem);align-items:center}
.portrait{aspect-ratio:4/5;border:1px dashed var(--paper-mute);display:grid;place-items:center;color:var(--paper-mute);font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;text-align:center;padding:1rem}
@media (max-width:700px){.founder{grid-template-columns:minmax(0,1fr)}.portrait{max-width:220px}}

.letter{display:grid;gap:1.3rem;max-width:62ch}
.letter>p:not(.label):not(.quote){color:var(--mist);font-size:1.06rem}

/* ================= choreography: 3D rings, portal, wheel, opening window ================= */
.ringsbg{position:fixed;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;opacity:0}
html.lenis,html.lenis body{height:auto}
html.lenis{scroll-behavior:auto}
.opening{display:grid}
.scene .wrap{position:relative;z-index:3}
.act{position:relative}
.pinstage{position:relative}

/* preloader (home) */
.pre{position:fixed;inset:0;z-index:98;background:var(--green-deep);display:grid;place-items:center;animation:lift 1.1s var(--ease) 2.1s forwards}
.pre div{display:grid;justify-items:center;gap:1.4rem}
.pre svg{width:150px;height:150px;transform:rotate(-90deg)}
.pre circle{fill:none;stroke:var(--gold);stroke-width:1;stroke-dasharray:440;stroke-dashoffset:440;animation:draw 1.9s var(--ease) forwards}
.pre circle+circle{stroke-dasharray:377;stroke-dashoffset:377;animation-delay:.2s;stroke:var(--gold-dim)}
.pre img{position:absolute;width:96px;height:96px;border-radius:50%;margin-top:27px;opacity:0;animation:fadeup 1s var(--ease) .5s forwards}
.pre b{font-family:var(--display);font-weight:400;font-size:1rem;letter-spacing:.3em;color:var(--gold);font-variant-numeric:tabular-nums}
@keyframes draw{to{stroke-dashoffset:0}}

/* act 1: hero opens through the ring */
.herotext{position:relative;z-index:3}
.portal{background:var(--green);padding-block:clamp(4rem,9vw,7rem)}
.portal .wrap{display:grid;gap:2rem}
.fx .act1{height:230vh}
.fx .act .pinstage{position:sticky;top:0;height:100vh;overflow:hidden}
.fx .act1 .pinstage{min-height:0}
.fx .portal{position:absolute;inset:0;display:grid;align-items:center;z-index:1;padding:0;clip-path:inset(100% 0 0 0);will-change:clip-path;border-top:1px solid var(--gold-dim)}
.fx .portal .wrap{justify-items:center;text-align:center}
.fx .portal .poem span{padding-left:0}
.fx .portal .lede{max-width:44ch}

/* act 2: the wheel, last tile becomes the next chapter */
.act2{background:var(--green)}
.act2 .pinstage{padding-block:clamp(4rem,9vw,7rem)}
.whead{display:grid;gap:1rem;padding-inline:clamp(16px,4.5vw,56px);max-width:1240px;margin:0 auto 2.5rem}
.whead h2{font-size:clamp(2rem,4.6vw,3.8rem);line-height:1.05;max-width:14ch}
.wheel{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:1rem;padding-inline:clamp(16px,4.5vw,56px);max-width:1240px;margin-inline:auto}
.wheel a{display:flex;flex-direction:column;justify-content:flex-end;gap:.3rem;padding:1.3rem;text-decoration:none;aspect-ratio:4/5}
.wheel b{font-family:var(--display);font-weight:400;font-size:clamp(1.5rem,2.4vw,2.2rem);line-height:1.1}
.wheel small{font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-bright)}
.expander{display:none}
.stmt{display:grid;gap:1.6rem;justify-items:center;text-align:center;padding:clamp(4rem,10vw,8rem) clamp(16px,4.5vw,56px) 0}
.stmt h2{font-size:clamp(1.9rem,5.6vw,4.8rem);text-transform:uppercase;letter-spacing:.12em;line-height:1.2;max-width:18ch}
.stmt p{font-family:var(--display);font-size:clamp(1.1rem,1.8vw,1.4rem);color:var(--gold-bright)}
.fx .act2{height:460vh}
.fx .act2 .pinstage{padding:0}
.fx .whead{position:absolute;left:0;bottom:clamp(1.5rem,6vh,4rem);margin:0;z-index:3;max-width:none}
.fx .wheel{display:block;position:absolute;inset:0;padding:0;max-width:none}
.fx .wheel a{position:absolute;left:50%;top:0;margin:0;will-change:transform,opacity;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.fx .expander{display:block;position:absolute;inset:0;z-index:4;visibility:hidden}
.fx .expander::before{inset:0}
.fx .stmt{position:absolute;inset:0;z-index:5;align-content:center;padding:0 clamp(16px,4.5vw,56px);opacity:0}

/* act 3: a window opens onto the living backdrop */
.act3 .pinstage{min-height:70vh;display:grid;place-items:center;text-align:center;background:radial-gradient(120% 90% at 50% 30%,#12452f,#04150e)}
.act3 .cap{font-family:var(--display);font-size:clamp(1.2rem,2.2vw,1.8rem);color:var(--gold-bright)}
.act3 .oneword{min-height:0}
.hole{display:none}
.fx .act3{height:280vh}
.fx.gl .act3 .pinstage{background:none}
.fx .hole{display:block;position:absolute;box-shadow:0 0 0 200vmax var(--green);border:1px solid var(--gold-dim);z-index:1}
.fx .act3 .cap{position:absolute;left:0;right:0;top:16vh;z-index:2}
.fx .act3 .oneword{position:absolute;inset:0;display:grid;place-items:center;z-index:3}

/* image reveals */
.js .clipin{clip-path:inset(0 0 100% 0);transition:clip-path 1.5s var(--ease)}
.js .clipin.in{clip-path:inset(0)}
@media (prefers-reduced-motion:reduce){.pre{display:none}.js .clipin{clip-path:none}}

.opening .wrap{width:100%}
.fx .whead{left:0;right:0;bottom:clamp(1rem,4vh,3rem);z-index:20;justify-items:center;text-align:center;gap:.6rem;pointer-events:none}
.fx .whead h2{font-size:clamp(1.5rem,3vw,2.6rem);max-width:none}
.fx .expander{z-index:15}
.fx .stmt{z-index:21}
.fx .act1 .pinstage{z-index:3}

.tex.photo::before{filter:saturate(.8) brightness(.82) contrast(1.05)}
.tex.photo::after{background:linear-gradient(180deg,rgba(6,29,19,.18) 0%,rgba(6,29,19,.1) 45%,rgba(4,21,14,.82) 100%)}
.expander.photo::after{background:rgba(4,21,14,.5)}

.portrait.seal{border:0;padding:0;aspect-ratio:1;border-radius:50%;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.35)}
.portrait.seal img{width:100%;height:100%;object-fit:cover;display:block}
.portrait.seal{max-width:260px;width:100%}
.ledger.kv td.num{font-size:1.15rem}
@media (max-width:560px){.ledger.kv th,.ledger.kv td{display:block;text-align:left;padding-right:0}.ledger.kv th{border-bottom:0;padding-bottom:.2rem}.ledger.kv td{padding-top:0}.ledger.kv td.num{text-align:left}.ledger tbody th{white-space:normal}}

.portrait.photo{border:0;padding:0;overflow:hidden;aspect-ratio:4/5;box-shadow:0 30px 70px rgba(0,0,0,.35);outline:1px solid var(--gold-dim);outline-offset:10px}
.portrait.photo img{width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:700px){.portrait.photo{max-width:260px;margin:10px}}
#markets .item .meta{grid-template-columns:auto auto;column-gap:.7rem;align-items:baseline;justify-items:end}
#markets .item .meta span{justify-self:start;text-align:left}
@media (max-width:760px){#markets .item .meta{grid-auto-flow:row;justify-content:start}}
.anchors{margin-top:.6rem;font-size:.86rem!important;color:var(--ivory)!important}
.anchors span{font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-right:.5rem}

.zones{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:2.5rem 4rem}
.zone{min-width:0}
.zone h3{font-size:1.6rem;color:var(--gold-bright);margin-bottom:.6rem}
.zt th,.zt td{padding:.75rem .8rem .75rem 0;font-size:.95rem}
.zt tbody th{font-size:1.1rem}
.zt td.n{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--ivory)}
.zt td.n:last-child{padding-right:0;color:var(--mist)}
.zt .pri{color:var(--green-deep);background:var(--gold);padding:.15rem .5rem;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700}

/* restraint pass */
.ghost,.cursor,.pre,.marquee{display:none!important}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:1px;background:var(--green-line);border:1px solid var(--green-line)}
.facts div{background:var(--green);padding:2rem 1.6rem;display:grid;gap:.5rem;align-content:start}
.facts strong{font-family:var(--display);font-weight:400;font-size:clamp(1.8rem,3.4vw,2.6rem);color:var(--gold-bright);line-height:1.1}
.facts span{color:var(--mist);font-size:.95rem}
