/* ==========================================================================
   Landmark Quest Inc. — page-level styles
   ========================================================================== */

/* ===================================================== HOME: hero ===== */
.hero{
  --p:0;--hero-fg:var(--ink);--hero-em:var(--accent);--hero-bg:var(--paper);
  position:relative;height:calc(100svh - var(--hh) + 160svh);
}
.hero__pin{position:sticky;top:var(--hh);height:calc(100svh - var(--hh));overflow:hidden;background:var(--bg)}
.hero__media{
  position:absolute;inset:0;
  clip-path:polygon(
    calc(46% - 46% * var(--p)) calc(10% - 10% * var(--p)),
    calc(92% + 8% * var(--p)) calc(7% - 7% * var(--p)),
    calc(96% + 4% * var(--p)) calc(70% + 30% * var(--p)),
    calc(66% - 66% * var(--p)) calc(95% + 5% * var(--p)),
    calc(44% - 44% * var(--p)) calc(64% - 14% * var(--p)));
  background:var(--night);
}
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:50% 38%;transform:scale(calc(1.1 - .1 * var(--p)));transform-origin:62% 40%;will-change:transform}
.hero__media::after{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:var(--p);
  background:linear-gradient(90deg,rgba(9,16,19,.8) 0%,rgba(9,16,19,.42) 48%,rgba(9,16,19,.06) 100%),linear-gradient(0deg,rgba(9,16,19,.55),transparent 42%);
}
.js .hero:not(.is-in) .hero__media{opacity:0}
.js .hero.is-in .hero__media{opacity:1;transition:opacity 1.3s .85s var(--ease)}
.hero__lot{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:calc(1 - var(--p) * 1.3)}
.hero__lot polygon{fill:none;stroke:var(--accent);stroke-width:1.4;stroke-linejoin:round}
.hero__lot circle{fill:var(--paper);stroke:var(--accent);stroke-width:1.3}
.hero__dims{position:absolute;inset:0;pointer-events:none;opacity:calc(1 - var(--p) * 3.2)}
.hero__dims span{position:absolute;left:0;top:0;transform-origin:0 50%;white-space:nowrap;font-size:.64rem;letter-spacing:.16em;color:var(--accent);padding:0 .4rem;background:var(--paper)}
.hero__copy{position:absolute;left:var(--margin);bottom:clamp(28px,7svh,76px);width:min(37vw,590px);color:var(--hero-fg);z-index:2}
.hero__copy h1{font-size:clamp(2.7rem,5.5vw,5.9rem);margin:1.1rem 0 1.5rem}
.hero__copy em{color:var(--hero-em)}
.hero__copy .lead{color:inherit;max-width:34ch}
.hero__copy .btn{--fill:var(--hero-fg);color:inherit;border-color:currentColor;margin-top:1.9rem}
.hero__copy .btn:hover,.hero__copy .btn:focus-visible{color:var(--hero-bg)}
.hero__kicker{margin:0;color:inherit;opacity:.85}
.hero__cue{position:absolute;right:var(--margin);bottom:28px;margin:0;color:var(--hero-fg);opacity:calc(1 - var(--p) * 4);z-index:2}
.js .hero:not(.is-in) .hero__copy>*{opacity:0;transform:translateY(22px)}
.js .hero.is-in .hero__copy>*{opacity:1;transform:none;transition:opacity 1s var(--ease),transform 1s var(--ease)}
.js .hero.is-in .hero__copy>*:nth-child(2){transition-delay:.12s}
.js .hero.is-in .hero__copy>*:nth-child(3){transition-delay:.24s}
.js .hero.is-in .hero__copy>*:nth-child(4){transition-delay:.36s}

/* static hero: reduced motion, small screens, or no script */
.hero.is-static,.no-js .hero{--p:1;--hero-fg:var(--bone);--hero-em:var(--lamp);--hero-bg:var(--night);height:calc(100svh - var(--hh))}
.hero.is-static .hero__pin,.no-js .hero__pin{position:relative;top:0}
.hero.is-static .hero__media img,.no-js .hero__media img{transform:none}
@media (max-width:760px){
  .hero{--p:1;--hero-fg:var(--bone);--hero-em:var(--lamp);--hero-bg:var(--night);height:auto}
  .hero__pin{position:relative;top:0;height:min(calc(100svh - var(--hh)),820px)}
  .hero__media img{transform:none;object-position:62% 40%}
  .hero__copy{left:var(--margin);right:var(--margin);width:auto;bottom:34px}
  .hero__copy h1{font-size:clamp(2.6rem,12vw,3.8rem)}
  .hero__kicker{font-size:.62rem;letter-spacing:.1em}
  .hero__cue{display:none}
}

/* ================================================== HOME: statement ===== */
.statement__text{
  margin-top:clamp(36px,5vw,76px);max-width:22em;color:var(--fg);
  font:340 clamp(2.1rem,5vw,5rem)/1.1 var(--font-display);letter-spacing:-.022em;font-variation-settings:"SOFT" 30;
}
.statement__text .w{display:inline-block;white-space:pre;text-align:center;font-variation-settings:"wght" var(--wg,340),"SOFT" 30}
.statement__text .w--em{font-style:italic;color:var(--acc)}
.statement__text .sp{display:inline-block;width:.26em}

/* ===================================================== HOME: hold ===== */
.hold__top{row-gap:3rem;align-items:start}
.hold__head{grid-column:1/6;display:flex;flex-direction:column;gap:1.6rem;align-items:flex-start}
.hold__head .dim{width:100%;margin-bottom:clamp(14px,2vw,34px)}
.hold__head h2{max-width:11ch}
.hold__list{grid-column:7/13}
.hold__row{
  position:relative;display:grid;grid-template-columns:2.4rem 60px 1fr;gap:1.3rem;align-items:start;
  padding:clamp(26px,3.2vw,44px) 0;border-top:1px solid var(--rule);
}
.hold__row:last-child{border-bottom:1px solid var(--rule)}
.hold__row::before{content:"";position:absolute;left:0;top:-1px;height:1px;width:100%;background:var(--acc);transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease)}
.hold__row:hover::before{transform:scaleX(1)}
.hold__n{color:var(--muted);padding-top:.5rem}
.hold__icon svg{width:56px;height:56px;color:var(--acc)}
.hold__row h3{margin-bottom:.6rem}
.hold__row p{color:var(--muted);max-width:42ch}
.hold__plates{margin-top:clamp(70px,9vw,150px);align-items:start;row-gap:3.5rem}
.hold__p1{grid-column:2/6}
.hold__p2{grid-column:7/13;margin-top:clamp(60px,13vw,220px)}
@media (max-width:900px){
  .hold__head,.hold__list{grid-column:1/-1}
  .hold__p1,.hold__p2{grid-column:1/-1;margin-top:0}
}

/* ====================================================== HOME: how ===== */
.how__head{margin-top:clamp(28px,4vw,56px);row-gap:1.5rem;align-items:end}
.how__head h2{grid-column:1/8}
.how__head .lead{grid-column:9/13;color:var(--muted)}
.how__steps{margin-top:clamp(56px,8vw,110px);row-gap:3rem}
.how__step{position:relative;grid-column:span 3;padding-top:1.7rem}
.how__line{position:absolute;left:0;right:0;top:0;height:1px;background:var(--rule-strong)}
.how__line::after{content:"";position:absolute;left:0;top:-3px;width:7px;height:7px;border-radius:50%;background:var(--acc)}
.how__n{color:var(--acc)}
.how__step h3{margin:.9rem 0 .7rem;font-size:clamp(1.9rem,2.8vw,2.8rem)}
.how__step p{color:var(--muted);max-width:26ch}
.how__cta{margin-top:clamp(44px,6vw,84px)}
@media (max-width:900px){
  .how__step{grid-column:span 6}
  .how__head h2,.how__head .lead{grid-column:1/-1}
}
@media (max-width:520px){.how__step{grid-column:1/-1}}

/* ==================================================== HOME: notes ===== */
.notesrow{padding-top:0}
.notesrow__head{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap;margin-top:clamp(28px,4vw,56px)}
.notesrow__head h2{max-width:14ch}
.notesrow__grid{margin-top:clamp(40px,5vw,76px);row-gap:3.5rem}
.notecard{grid-column:span 4;display:flex;flex-direction:column;gap:.85rem}
.notecard .plate{margin-bottom:.9rem}
.notecard h3{transition:color .4s}
.notecard p{color:var(--muted);max-width:36ch}
.notecard:hover h3{color:var(--acc)}
.notecard__go{display:inline-flex;align-items:center;gap:.7rem;margin-top:.3rem;color:var(--acc)}
.notecard__go svg{width:18px;height:10px;transition:transform .5s var(--ease)}
.notecard:hover .notecard__go svg{transform:translateX(5px)}
@media (max-width:900px){.notecard{grid-column:1/-1}}
@media (min-width:901px) and (max-width:1100px){.notecard{grid-column:span 6}}

/* ================================================== HOME: closing ===== */
.closing{position:relative;min-height:max(122svh,980px);overflow:hidden;padding-top:clamp(100px,12vw,180px)}
.closing::before{content:"";position:absolute;left:0;right:0;bottom:0;height:70%;background:radial-gradient(60% 70% at 50% 100%,rgba(243,201,139,.17),transparent 72%);pointer-events:none}
.closing__in{position:relative;z-index:2}
.closing h2{font-size:clamp(4.4rem,15vw,15rem);line-height:.86;margin:1.3rem 0 1.8rem;letter-spacing:-.04em}
.closing .lead{color:var(--muted)}
.closing__mail{display:inline-block;margin-top:1.6rem;font:340 clamp(1.5rem,3.6vw,3.4rem)/1.1 var(--font-display);letter-spacing:-.015em}
.closing__sky{position:absolute;left:0;right:0;bottom:0;height:min(54svh,540px);z-index:1;pointer-events:none}
.sky{width:100%;height:100%}
.sky__far{fill:var(--night-2)}
.sky__near{fill:var(--night-3)}
.sky__tank{fill:var(--night-3);stroke:var(--night-3);stroke-width:2}
.sky__ground{fill:#09131a}
.sky .win{fill:var(--lamp);opacity:0;transition:opacity 1.1s ease calc(var(--i,0) * 50ms)}
.sky .win.is-lit,.no-js .sky .win{opacity:.92}

/* ============================================================ shared ===== */
.phead{padding:clamp(52px,7vw,112px) 0 var(--sec)}
.phead__grid{margin-top:clamp(30px,4.4vw,64px);row-gap:2rem;align-items:end}
.phead h1{grid-column:1/9}
.phead .lead{grid-column:9/13;padding-bottom:.7rem}
.phead--tall h1{grid-column:1/10}
@media (max-width:900px){.phead h1,.phead .lead{grid-column:1/-1}}

.band{position:relative;overflow:hidden;height:min(82svh,780px);background:var(--night)}
.band img{position:absolute;left:0;top:-9%;width:100%;height:118%;object-fit:cover;will-change:transform}
.band__cap{position:absolute;left:var(--margin);bottom:26px;color:var(--bone);font:400 .68rem/1.4 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;z-index:2;text-shadow:0 1px 12px rgba(0,0,0,.6)}
.band::after{content:"";position:absolute;inset:auto 0 0 0;height:30%;background:linear-gradient(0deg,rgba(9,16,19,.5),transparent);pointer-events:none}

.split{align-items:center;row-gap:3rem}
.split__text{grid-column:1/7}
.split__media{grid-column:8/13}
.split--flip .split__text{grid-column:7/13;grid-row:1}
.split--flip .split__media{grid-column:1/6;grid-row:1}
.split h2{margin:clamp(24px,3vw,44px) 0 1.4rem}
.split p+p{margin-top:1.1em}
.split p{max-width:50ch}
@media (max-width:900px){.split__text,.split__media,.split--flip .split__text,.split--flip .split__media{grid-column:1/-1;grid-row:auto}}

.rowlist{border-top:1px solid var(--rule)}
.rowlist__row{position:relative;display:grid;grid-template-columns:5rem minmax(0,1.1fr) minmax(0,1fr);gap:clamp(16px,3vw,48px);padding:clamp(28px,4vw,56px) 0;border-bottom:1px solid var(--rule);align-items:start}
.rowlist__row::before{content:"";position:absolute;left:0;top:-1px;height:1px;width:100%;background:var(--acc);transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease)}
.rowlist__row:hover::before{transform:scaleX(1)}
.rowlist__n{color:var(--acc);padding-top:.7rem}
.rowlist__row h3{font-size:clamp(1.8rem,3vw,3rem);line-height:1.04}
.rowlist__row p{color:var(--muted);max-width:44ch}
@media (max-width:900px){.rowlist__row{grid-template-columns:3rem 1fr}.rowlist__row p{grid-column:2}}

.notice{margin-top:clamp(40px,5vw,72px);padding:1.4rem 1.6rem;border:1px solid var(--rule-strong);max-width:62ch;font:400 .74rem/1.7 var(--font-mono);letter-spacing:.06em;color:var(--muted)}
.notice strong{color:var(--fg);font-weight:500}

/* =========================================================== company ===== */
.facts{margin-top:2rem}
.facts>div{display:grid;grid-template-columns:9.5rem 1fr;gap:1rem;align-items:baseline;padding:1.05rem 0;border-top:1px solid var(--rule)}
.facts>div:last-child{border-bottom:1px solid var(--rule)}
.facts dt{font:500 .7rem/1.4 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.facts dd{margin:0;font:340 1.4rem/1.2 var(--font-display);letter-spacing:-.01em}
.aboutintro{align-items:start;row-gap:3rem}
.aboutintro__plate{grid-column:1/6}
.aboutintro__text{grid-column:7/13;padding-top:clamp(0px,3vw,48px)}
.aboutintro__text p{max-width:48ch;margin-top:1.2em}
.aboutintro__text .lead{margin-top:0}
@media (max-width:900px){.aboutintro__plate,.aboutintro__text{grid-column:1/-1}}

/* ========================================================== holdings ===== */
.quals{align-items:start;row-gap:4rem;margin-top:clamp(36px,5vw,72px)}
.qual{grid-column:span 4}
.qual:nth-child(2){margin-top:clamp(40px,8vw,130px)}
.qual:nth-child(3){margin-top:clamp(0px,3vw,56px)}
.qual h3{margin:1.5rem 0 .6rem}
.qual p{color:var(--muted);max-width:36ch}
@media (max-width:900px){.qual{grid-column:1/-1}.qual:nth-child(n){margin-top:0}}

.lots__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gutter);margin-top:clamp(36px,5vw,72px)}
.lot{position:relative;display:flex;flex-direction:column;gap:.9rem;padding:1.3rem 1.3rem 1.6rem;border:1px solid var(--rule);background:var(--bg-2);transition:border-color .4s,transform .8s var(--ease)}
.lot:hover{border-color:var(--acc);transform:translateY(-4px)}
.lot__svg{width:100%;height:auto;color:var(--ink)}
.lot__fp{fill:var(--accent-soft);stroke:currentColor;transition:fill .6s var(--ease)}
.lot:hover .lot__fp{fill:var(--accent)}
.lot__line{stroke:var(--accent);stroke-width:1.7;fill:none}
.lot h3{font-size:1.5rem}
.lot p{color:var(--muted);font-size:.96rem;line-height:1.5}
@media (max-width:1000px){.lots__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.lots__grid{grid-template-columns:1fr}}

.pledges{margin-top:2rem;display:grid;gap:0}
.pledges li{display:grid;grid-template-columns:3rem 1fr;gap:1rem;padding:1rem 0;border-top:1px solid var(--rule)}
.pledges li:last-child{border-bottom:1px solid var(--rule)}
.pledges .mono{color:var(--acc);padding-top:.35rem}
.pledges strong{font:340 1.35rem/1.2 var(--font-display);display:block;margin-bottom:.15rem}
.pledges span.t{color:var(--muted)}

/* ========================================================== approach ===== */
.walk{position:relative;height:calc(100svh + var(--n,4) * 92svh)}
.walk__sticky{position:sticky;top:var(--hh);height:calc(100svh - var(--hh));overflow:hidden;display:flex;flex-direction:column;background:var(--bg)}
.walk__head{flex:none;display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;padding:clamp(14px,2.6vh,30px) var(--margin) 0}
.walk__head h2{font-size:clamp(1.6rem,2.8vw,2.7rem);max-width:20ch}
.walk__stage{position:relative;flex:1;min-height:0;margin-top:clamp(6px,1.4vh,18px)}
.walk__far{position:absolute;left:0;bottom:12.4%;height:28%;width:max-content;color:var(--paper-3);opacity:.6;will-change:transform}
.walk__far-svg{height:100%;width:auto;max-width:none;display:block}
.walk__track{position:absolute;left:0;top:0;bottom:7%;width:max-content;display:flex;align-items:flex-end;will-change:transform}
.walk__near{flex:none;height:54%}
.walk__near-svg{height:100%;width:auto;max-width:none;display:block;color:var(--ink)}
.walk__near-svg .wall{fill:var(--bg-2)}
.walk__track>.station{position:absolute}
.station{
  left:calc(var(--x) * 1%);top:2%;width:clamp(250px,21vw,330px);padding-top:1.2rem;border-top:1px solid var(--rule-strong);
  opacity:.28;transition:opacity .7s var(--ease);
}
.station::before{content:"";position:absolute;left:-1px;top:-4px;width:7px;height:7px;border-radius:50%;background:var(--acc)}
.station.is-active{opacity:1}
.station .mono{color:var(--acc)}
.station h3{font-size:clamp(2rem,3.2vw,3.2rem);margin:.5rem 0 .6rem}
.station p{color:var(--muted);font-size:.98rem;line-height:1.55}
.walk__prog{flex:none;display:flex;align-items:center;gap:1.2rem;padding:10px var(--margin) 40px}
.walk__bar{position:relative;flex:1;height:1px;background:var(--rule-strong)}
.walk__bar i{position:absolute;left:0;top:-4px;width:9px;height:9px;border-radius:50%;background:var(--acc);margin-left:-4px;transition:left .1s linear}
.walk__ticks{position:absolute;inset:0;display:flex;justify-content:space-between}
.walk__ticks span{position:absolute;top:-6px;width:1px;height:13px;background:var(--rule-strong)}
.walk__ticks b{position:absolute;top:12px;font:500 .62rem var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);transform:translateX(-50%);white-space:nowrap}
.walk__ticks b.is-active{color:var(--fg)}
.walk.is-static,.walk.is-static .walk__sticky{height:auto}
.walk.is-static .walk__sticky{position:static;display:block}
.walk.is-static .walk__far,.walk.is-static .walk__near,.walk.is-static .walk__prog{display:none}
.walk.is-static .walk__stage{margin-top:2rem}
.walk.is-static .walk__track{position:static;width:auto;display:grid;gap:2.4rem;padding:0 var(--margin) 3rem;transform:none!important}
.walk.is-static .walk__head .label{display:none}
.walk.is-static .station{position:static;width:auto;opacity:1}
@media (max-width:899px){
  .walk,.walk .walk__sticky{height:auto}
  .walk .walk__sticky{position:static;display:block}
  .walk .walk__far,.walk .walk__near,.walk .walk__prog{display:none}
  .walk .walk__stage{margin-top:2rem}
  .walk .walk__track{position:static;width:auto;display:grid;gap:2.4rem;padding:0 var(--margin) 3rem;transform:none!important}
  .walk .walk__head .label{display:none}
  .walk .station{position:static;width:auto;opacity:1}
  .walk__head{padding-top:0}
}

.dont__grid{align-items:start;row-gap:3rem;margin-top:clamp(36px,5vw,72px)}
.dont__list{grid-column:1/8}
.dont__plate{grid-column:9/13}
.dont__list li{position:relative;display:grid;grid-template-columns:4.5rem 1fr;gap:1rem;padding:clamp(18px,2.4vw,30px) 0;border-top:1px solid var(--rule);align-items:baseline}
.dont__list li:last-child{border-bottom:1px solid var(--rule)}
.dont__list .mono{color:var(--acc)}
.dont__list .t{position:relative;display:inline;font:340 clamp(1.7rem,3.2vw,3.1rem)/1.1 var(--font-display);letter-spacing:-.02em}
.dont__list .t span{position:relative;display:inline-block}
.dont__list .t span::after{content:"";position:absolute;left:-2%;right:-2%;top:56%;height:2px;background:var(--acc);transform:scaleX(0);transform-origin:left;transition:transform 1.1s var(--ease) .35s}
.dont__list li.is-in .t span::after{transform:scaleX(1)}
@media (max-width:900px){.dont__list,.dont__plate{grid-column:1/-1}}

.xray__head{margin-top:clamp(28px,4vw,56px);row-gap:1.4rem;align-items:end}
.xray__head h2{grid-column:1/8}
.xray__head .lead{grid-column:9/13;color:var(--muted)}
.xray__grid{margin-top:clamp(40px,5vw,80px);row-gap:3rem;align-items:center}
.xray__fig{grid-column:1/7}
.xray__stage{position:relative;width:100%;max-width:640px;aspect-ratio:1;margin-inline:auto}
.xray__svg{position:absolute;inset:0;width:100%;height:100%;color:var(--ink)}
.xray .zone{fill:var(--acc);opacity:0;stroke:var(--acc);stroke-width:1;stroke-dasharray:4 4;transition:opacity .45s}
.xray .zone.is-hot{opacity:.16}
.spot{
  position:absolute;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;border:1px solid var(--acc);background:var(--bg);color:var(--acc);
  font:500 .72rem var(--font-mono);display:grid;place-items:center;transition:background-color .35s,color .35s,transform .45s var(--ease);
}
.spot::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1px solid var(--acc);opacity:0;transform:scale(.7);transition:opacity .4s,transform .5s var(--ease)}
.spot:hover,.spot.is-active{background:var(--acc);color:var(--bg)}
.spot.is-active::after{opacity:.5;transform:scale(1)}
.xray__panel{grid-column:8/13}
.xray__panel .mono{color:var(--acc)}
.xray__panel h3{font-size:clamp(2rem,3.6vw,3.4rem);margin:.8rem 0 1rem}
.xray__panel p{color:var(--muted);max-width:42ch}
.xray__look{margin-top:1.6rem;padding-top:1rem;border-top:1px solid var(--rule);color:var(--fg)!important}
.xray__look span{color:var(--muted)}
.xray__nav{display:flex;gap:.8rem;margin-top:2rem}
.xray__nav button{width:48px;height:48px;border:1px solid var(--fg);display:grid;place-items:center;transition:background-color .4s,color .4s}
.xray__nav button:hover{background:var(--fg);color:var(--bg)}
.xray__nav svg{width:18px;height:10px}
@media (max-width:900px){.xray__head h2,.xray__head .lead,.xray__fig,.xray__panel{grid-column:1/-1}}

/* ======================================================== stewardship ===== */
.year__grid{margin-top:clamp(36px,5vw,72px);row-gap:3rem;align-items:center}
.year__dial{grid-column:1/7;display:flex;flex-direction:column;align-items:center;gap:2rem}
.year__panel{grid-column:8/13}
@property --sel{syntax:"<number>";inherits:true;initial-value:0}
.dial{--dw:min(86vw,540px);position:relative;width:var(--dw);height:var(--dw);--sel:0;transition:--sel .8s var(--ease);touch-action:none;user-select:none}
.dial__layer{position:absolute;inset:0;border-radius:50%;pointer-events:none}
.dial__ring{background:radial-gradient(closest-side,var(--bg) 0 61%,var(--bg-2) 61.3% 99.4%,transparent 99.6%)}
.dial__ticks{background:repeating-conic-gradient(from -15.2deg,var(--rule-strong) 0 .4deg,transparent .4deg 30deg);-webkit-mask:radial-gradient(closest-side,transparent 0 61%,#000 61.3% 99.4%,transparent 99.6%);mask:radial-gradient(closest-side,transparent 0 61%,#000 61.3% 99.4%,transparent 99.6%)}
.dial__edge{border:1px solid var(--rule-strong)}
.dial__edge::after{content:"";position:absolute;inset:19.5%;border-radius:50%;border:1px solid var(--rule)}
.dial__wedge{background:conic-gradient(from calc(var(--sel) * 30deg - 15deg),var(--acc) 0 30deg,transparent 30deg 360deg);-webkit-mask:radial-gradient(closest-side,transparent 0 61%,#000 61.3% 99.4%,transparent 99.6%);mask:radial-gradient(closest-side,transparent 0 61%,#000 61.3% 99.4%,transparent 99.6%)}
.dial__heat{inset:-15px;background:conic-gradient(from 255deg,var(--acc) 0 240deg,transparent 240deg 360deg);-webkit-mask:radial-gradient(closest-side,transparent 0 96.6%,#000 97% 100%,transparent 100.3%);mask:radial-gradient(closest-side,transparent 0 96.6%,#000 97% 100%,transparent 100.3%);opacity:.8}
.dial__center{position:absolute;inset:0;display:grid;place-content:center;text-align:center;pointer-events:none;gap:.5rem}
.dial__center .mono{color:var(--acc)}
.dial__month{font:340 clamp(2.4rem,6vw,3.8rem)/1 var(--font-display);letter-spacing:-.025em}
.dial__m{
  position:absolute;left:50%;top:50%;width:52px;height:52px;margin:-26px;border-radius:50%;
  transform:rotate(var(--a)) translateY(calc(var(--dw) * -.403)) rotate(calc(var(--a) * -1));
  font:500 .7rem var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--fg);transition:color .35s;
}
.dial__m[aria-checked="true"]{color:var(--bg)}
.dial__m:hover{color:var(--acc)}
.dial__m[aria-checked="true"]:hover{color:var(--bg)}
.dial__legend{display:flex;align-items:center;gap:.8rem;font:400 .7rem/1.4 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.dial__legend i{display:block;width:34px;height:3px;background:var(--acc);opacity:.8}
.year__panel h3{font-size:clamp(2.2rem,4.4vw,4.2rem)}
.year__panel .mono{color:var(--acc)}
.year__tasks{margin-top:1.6rem;border-top:1px solid var(--rule)}
.year__tasks li{padding:1rem 0 1rem 2rem;border-bottom:1px solid var(--rule);position:relative;max-width:46ch}
.year__tasks li::before{content:"";position:absolute;left:0;top:1.75rem;width:1rem;height:1px;background:var(--acc)}
.year__panel .note{margin-top:1.4rem;color:var(--muted);font:400 .72rem/1.6 var(--font-mono);letter-spacing:.06em}
@media (max-width:900px){.year__dial,.year__panel{grid-column:1/-1}}

.care{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gutter);margin-top:clamp(36px,5vw,72px)}
.care__card{border-top:1px solid var(--rule-strong);padding-top:1.4rem;position:relative}
.care__card::before{content:"";position:absolute;left:0;top:-4px;width:7px;height:7px;border-radius:50%;background:var(--acc)}
.care__card .mono{color:var(--acc)}
.care__card h3{margin:.9rem 0 .7rem}
.care__card p{color:var(--muted);max-width:30ch}
@media (max-width:1000px){.care{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.care{grid-template-columns:1fr}}
.pair{align-items:start;row-gap:3rem;margin-top:clamp(36px,5vw,80px)}
.pair__a{grid-column:1/6}
.pair__b{grid-column:7/13;margin-top:clamp(40px,9vw,160px)}
@media (max-width:900px){.pair__a,.pair__b{grid-column:1/-1;margin-top:0}}

/* ============================================================== notes ===== */
.notefeat{align-items:center;row-gap:2.5rem}
.notefeat__plate{grid-column:1/8}
.notefeat__text{grid-column:9/13}
.notefeat__text h2{margin:1rem 0 1rem}
.notefeat__text p{color:var(--muted);max-width:40ch}
.notelist{margin-top:clamp(56px,8vw,120px);row-gap:3.5rem}
.notelist .notecard{grid-column:span 6}
@media (max-width:900px){.notefeat__plate,.notefeat__text,.notelist .notecard{grid-column:1/-1}}

.article__head{padding:clamp(52px,7vw,112px) 0 clamp(36px,5vw,64px)}
.article__head h1{margin-top:clamp(28px,4vw,56px);max-width:15ch;font-size:clamp(2.8rem,6.6vw,6.6rem)}
.article__meta{display:flex;gap:1.4rem;flex-wrap:wrap;margin-top:2rem;color:var(--muted)}
.article__body{padding:clamp(56px,8vw,120px) 0 var(--sec)}
.article__aside{grid-column:1/4;position:sticky;top:calc(var(--hh) + 36px);align-self:start;display:flex;flex-direction:column;gap:1rem}
.article__aside a{color:var(--acc)}
.article__text{grid-column:4/11}
.article__text p{font-size:clamp(1.12rem,1.45vw,1.34rem);line-height:1.68;max-width:36em}
.article__text p+p{margin-top:1.25em}
.article__text p:first-child{font:340 clamp(1.5rem,2.4vw,2.2rem)/1.3 var(--font-display);letter-spacing:-.012em;margin-bottom:1.4em}
.article__text p:first-child::first-letter{font-style:italic;color:var(--acc)}
.article__end{margin-top:3rem;display:flex;align-items:center;gap:1rem}
.article__end::before{content:"";width:48px;height:1px;background:var(--acc)}
@media (max-width:900px){.article__aside,.article__text{grid-column:1/-1}.article__aside{position:static}}

/* ============================================================ residents ===== */
.res__grid{align-items:start;row-gap:3rem}
.res__main{grid-column:1/8}
.res__side{grid-column:9/13}
.expect li{display:grid;grid-template-columns:3rem 1fr;gap:1rem;padding:1.25rem 0;border-top:1px solid var(--rule)}
.expect li:last-child{border-bottom:1px solid var(--rule)}
.expect .mono{color:var(--acc);padding-top:.35rem}
.expect strong{font:340 1.45rem/1.2 var(--font-display);display:block;margin-bottom:.2rem}
.expect span.t{color:var(--muted)}
.res__side .box{border:1px solid var(--rule-strong);padding:1.6rem 1.6rem 1.8rem;margin-bottom:1.6rem}
.res__side h3{font-size:1.5rem;margin:.6rem 0 .6rem}
.res__side p{color:var(--muted)}
.res__side .mono{color:var(--acc)}
@media (max-width:900px){.res__main,.res__side{grid-column:1/-1}}

/* ============================================================== contact ===== */
.contact__mail{display:inline-block;margin-top:clamp(28px,4vw,56px);font:340 clamp(1.8rem,5.6vw,5.8rem)/1.02 var(--font-display);letter-spacing:-.03em;word-break:break-word}
.routes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gutter);margin-top:clamp(36px,5vw,72px)}
.route{border-top:1px solid var(--rule-strong);padding-top:1.3rem;position:relative}
.route::before{content:"";position:absolute;left:0;top:-4px;width:7px;height:7px;border-radius:50%;background:var(--acc)}
.route .mono{color:var(--acc)}
.route h3{margin:.8rem 0 .6rem;font-size:1.6rem}
.route p{color:var(--muted);font-size:.98rem;max-width:30ch}
.route a{color:var(--acc)}
@media (max-width:1000px){.routes{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.routes{grid-template-columns:1fr}}
.form__grid{align-items:start;row-gap:3rem;margin-top:clamp(36px,5vw,72px)}
.form{grid-column:1/8;display:grid;gap:1.6rem}
.form__side{grid-column:9/13}
.field{display:grid;gap:.5rem}
.field label{font:500 .68rem/1.4 var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.field input,.field select,.field textarea{
  width:100%;font:340 1.3rem/1.35 var(--font-display);color:var(--fg);background:transparent;border:0;border-bottom:1px solid var(--rule-strong);
  padding:.55rem 0;border-radius:0;transition:border-color .3s;
}
.field textarea{min-height:9rem;resize:vertical;line-height:1.45}
.field select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 14px) 55%,calc(100% - 8px) 55%;background-size:6px 6px;background-repeat:no-repeat}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-bottom-color:var(--acc)}
.field option{font:400 1rem var(--font-body);color:#16211F}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem}
.form__fine{color:var(--muted);font:400 .74rem/1.7 var(--font-mono);letter-spacing:.05em;max-width:56ch}
.form__side p{color:var(--muted);max-width:34ch}
.form__side p+p{margin-top:1em}
.form__side .mono{color:var(--acc)}
@media (max-width:900px){.form,.form__side{grid-column:1/-1}.form__row{grid-template-columns:1fr}}

/* =============================================================== legal ===== */
.legal__head{padding:clamp(52px,7vw,112px) 0 clamp(36px,5vw,64px)}
.legal__head h1{margin-top:clamp(26px,4vw,52px);font-size:clamp(2.8rem,6.4vw,6.4rem)}
.legal__head .mono{margin-top:1.6rem;display:block;color:var(--muted)}
.legal__body{padding:clamp(36px,5vw,72px) 0 var(--sec)}
.legal__toc{grid-column:1/4;position:sticky;top:calc(var(--hh) + 36px);align-self:start}
.legal__toc ol{counter-reset:t;display:grid;gap:.6rem}
.legal__toc li{counter-increment:t;font-size:.94rem}
.legal__toc li::before{content:counter(t,decimal-leading-zero);font:400 .66rem var(--font-mono);color:var(--acc);margin-right:.8rem;letter-spacing:.1em}
.legal__toc a:hover{color:var(--acc)}
.legal__text{grid-column:5/12}
.legal__text h2{font-size:clamp(1.5rem,2.3vw,2.1rem);margin-top:2.4em}
.legal__text h2:first-child{margin-top:0}
.legal__text p,.legal__text li{max-width:62ch}
@media (max-width:900px){.legal__toc{display:none}.legal__text{grid-column:1/-1}}
.credits{columns:2;column-gap:2rem;margin-top:1rem}
.credits li{break-inside:avoid;padding:.25rem 0!important}
@media (max-width:640px){.credits{columns:1}}

/* ================================================================ 404 ===== */
.e404{min-height:calc(100svh - var(--hh));display:grid;place-items:center;padding:60px var(--margin);text-align:center}
.e404__svg{width:min(260px,56vw);margin:0 auto 2.4rem;color:var(--fg)}
.e404__door{fill:var(--bg-2);transition:transform 1.4s var(--ease-io)}
.e404__door--l{transform-origin:left;animation:ajarL 3.2s var(--ease-io) .6s infinite alternate}
.e404__door--r{transform-origin:right;animation:ajarR 3.2s var(--ease-io) .6s infinite alternate}
@keyframes ajarL{to{transform:translateX(-16px)}}
@keyframes ajarR{to{transform:translateX(16px)}}
.e404 h1{font-size:clamp(2.6rem,7vw,6rem);margin-bottom:1.2rem}
.e404 p{color:var(--muted);max-width:40ch;margin:0 auto 2rem}

@media (max-width:760px){
  .closing{min-height:max(100svh,700px)}
  .closing__sky{height:min(38svh,320px)}
  .closing h2{font-size:clamp(4rem,22vw,7rem)}
}
