/* 261 Osprey Preserve microsite. Tokens mirror /assets/css/tokens.css; acid is the only shout. */
/* Pass 16: Georgia sized to Instrument Serif (width and line metrics measured in Chrome), so the headlines keep
   their line breaks while the web fonts load without blocking render */
@font-face{font-family:'Instrument Serif Fallback';src:local('Georgia');size-adjust:75.5%;ascent-override:131%;descent-override:41%;line-gap-override:0%}
@font-face{font-family:'Instrument Serif Fallback';font-style:italic;src:local('Georgia Italic'),local('Georgia-Italic');size-adjust:78.4%;ascent-override:126.3%;descent-override:39.5%;line-gap-override:0%}
/* Pass 17: Instrument Serif (regular, italic) and Inter (variable, used at 400/500/600) self-hosted from /261/fonts/,
   latin subset from Google Fonts, SIL OFL 1.1 (license files beside the fonts). No requests to Google. */
@font-face{font-family:'Instrument Serif';font-style:normal;font-weight:400;font-display:swap;src:url(/261/fonts/instrument-serif-regular-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url(/261/fonts/instrument-serif-italic-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 600;font-display:swap;src:url(/261/fonts/inter-var-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{
  --bg:#2c2f32;--ink:#1d2021;--surface:#353840;--text:#d7e8bc;--paper:#e6ecbd;--muted:#9aa88c;
  --acid:#e9f056;--line:rgba(215,232,188,.10);--line-2:rgba(215,232,188,.18);
  --serif:'Instrument Serif','Instrument Serif Fallback',Georgia,'Times New Roman',serif;
  --sans:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --ease:cubic-bezier(.22,.8,.35,1);--pad:clamp(20px,5vw,72px);--navh:52px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--text);font:16px/1.65 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul,ol{list-style:none}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:.95;color:var(--paper)}
h2{font-size:clamp(40px,7vw,88px);letter-spacing:-.01em}
h3{font-size:clamp(26px,3.2vw,36px)}
i{font-style:italic}
:focus-visible{outline:2px solid var(--acid);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:-9999px;top:0;z-index:300;background:var(--acid);color:var(--ink);padding:10px 16px;font-weight:600}
.skip:focus{left:12px;top:12px}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{max-width:1280px;margin-inline:auto;padding-inline:var(--pad)}
.eyebrow{font:500 10px/1.4 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--acid)}
.lede{max-width:560px;color:var(--text);opacity:.85;margin-top:20px;font-size:17px}


/* Buttons + links */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 26px;border-radius:999px;font:500 14px/1 var(--sans);letter-spacing:.02em;text-decoration:none;overflow:hidden;transition:transform .12s var(--ease),background-color .3s}
.btn::after{content:"";position:absolute;left:22px;right:22px;bottom:11px;height:1px;background:var(--acid);transform:scaleX(0);transform-origin:left;transition:transform .12s var(--ease)}
.btn:hover::after,.btn:focus-visible::after,.btn:active::after{transform:scaleX(1)}
.btn:active{transform:scale(.97)}
.btn-acid{background:var(--acid);color:var(--ink)}
.btn-acid::after{background:var(--ink)}
.btn-ghost{border:1px solid var(--line-2);color:var(--paper)}
.btn-ghost:hover{border-color:rgba(233,240,86,.5)}
.ul,.btn-link{text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .5s var(--ease)}
.ul:hover,.ul:focus-visible,.btn-link:hover,.btn-link:focus-visible{background-size:100% 1px}
.icon-btn{display:inline-grid;place-items:center;min-width:44px;min-height:44px;border:1px solid var(--line-2);border-radius:999px;color:var(--paper);font-size:18px;line-height:1;background:rgba(29,32,33,.6);transition:transform .12s var(--ease),border-color .3s}
.icon-btn:active{transform:scale(.97)}
.icon-btn:hover{border-color:rgba(233,240,86,.5)}

/* Mini nav retired in pass 4: header, menu and rail live in 261-p4.css */

/* Sticky CTA bar, phone thumb zone */
.ctabar{position:fixed;left:0;right:0;bottom:0;z-index:40;display:grid;grid-template-columns:1.4fr 1fr;gap:10px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(29,32,33,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--line);transform:translateY(110%);transition:transform .6s var(--ease)}
.ctabar.on{transform:none}
.ctabar .btn{min-height:50px}
@media (min-width:900px){.ctabar{display:none}}

/* ===== HERO ===== */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;background:var(--ink)}
.hero-media{position:absolute;inset:0;overflow:hidden}
.hero-par{position:absolute;inset:-6% 0 -12%}
.hero-lqip,.hero-photo,.hero-canvas{position:absolute;inset:0;width:100%;height:100%}
.hero-lqip{background:var(--lqip) center/cover;filter:blur(18px);transform:scale(1.1);opacity:.55}
.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 45%}
.hero-canvas{opacity:0;transition:opacity .4s var(--ease)}
html.hero-gl .hero-canvas{opacity:1}
/* Pass 16 (NS7): the iris opens from a 12% aperture, not 0%. Chrome skips an image that fills the whole viewport
   as an LCP candidate, so a fully open (or fully closed) first paint left the poster out; the small first aperture
   makes the poster the LCP element. */
html.js .hero-photo{clip-path:circle(var(--iris-from,12%) at 50% 50%)}
html.js.hero-gl .hero-photo{visibility:hidden}
html.js.hero-css .hero-photo{visibility:visible;animation:iris 1.4s var(--ease) forwards}
html.hero-css .hero-photo img{animation:settle 1.6s var(--ease) both}
@keyframes iris{from{clip-path:circle(var(--iris-from,12%) at 50% 50%)}to{clip-path:circle(150% at 50% 50%)}}
@keyframes settle{from{transform:scale(1.08)}to{transform:scale(1)}}
.hero-shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(29,32,33,.94) 0%,rgba(29,32,33,.7) 28%,rgba(29,32,33,.18) 58%,rgba(29,32,33,0) 72%),linear-gradient(to bottom,rgba(29,32,33,.5),rgba(29,32,33,0) 18%)}
.hero-copy{position:relative;z-index:2;width:100%;max-width:1280px;margin:0 auto;padding:0 var(--pad) calc(48px + env(safe-area-inset-bottom))}
.hero-title{font-size:clamp(64px,14vw,184px);line-height:.88;letter-spacing:-.02em;margin:14px 0 22px}
.ln{display:block;overflow:hidden;padding-bottom:.06em}
.ln>span{display:block}
html.js .ln>span{transform:translateY(106%)}
html.hero-gl .ln>span,html.hero-css .ln>span{transform:none;transition:transform .9s var(--ease) .55s}
html.hero-gl .ln+.ln>span,html.hero-css .ln+.ln>span{transition-delay:.63s}
html.js .hero-eye{opacity:0}
html.hero-gl .hero-eye,html.hero-css .hero-eye{opacity:1;transition:opacity .8s var(--ease) .4s}
/* Pass 16 (NS7): the facts line paints at once (it was the phone LCP at 2.3 to 2.5 s); only a short rise plays */
html.js .hero-facts{transform:translateY(10px)}
html.hero-gl .hero-facts,html.hero-css .hero-facts{transform:none;transition:transform .8s var(--ease) .2s}
.hero-facts{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px;color:var(--paper);max-width:760px}
.hero-facts>span{display:inline-flex;align-items:center;flex-wrap:wrap}
.hero-facts>span+span::before{content:"";width:3px;height:3px;border-radius:50%;background:var(--muted);margin-right:18px}

/* ===== Sections ===== */
.sec{padding-block:clamp(88px,14vw,180px)}
.sec-head{margin-bottom:clamp(32px,5vw,64px)}
.sec-head h2{margin-top:14px}
.intro{padding-block:clamp(96px,16vw,200px) clamp(40px,6vw,80px)}
.intro-q{margin-top:28px;max-width:1000px}
.intro-q p{font:clamp(32px,5.2vw,64px)/1.08 var(--serif);color:var(--paper)}
.intro-sub{margin-top:28px;max-width:520px;color:var(--muted)}

/* Reveals: scroll-driven where supported, IO fallback (.in) otherwise; visible without JS */
@supports (animation-timeline: view()){
  .rv{animation:rv linear both;animation-timeline:view();animation-range:entry 0% entry 55%}
  .hero-par{animation:par linear both;animation-timeline:scroll(root);animation-range:0 100vh}
  .m-route{animation:route linear both;animation-timeline:view();animation-range:entry 30% cover 60%}
}
@keyframes rv{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes par{to{transform:translateY(15vh)}}
@keyframes route{to{stroke-dashoffset:0}}
html.no-sda .rv{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
html.no-sda .rv.in{opacity:1;transform:none}

/* Lqip layers that sharpen */
.ph{position:relative;overflow:hidden;background:var(--surface)}
.ph::before{content:"";position:absolute;inset:-14px;background:var(--lqip) center/cover;filter:blur(14px);transition:opacity .7s var(--ease)}
.ph img{position:relative;width:100%;height:100%;object-fit:cover;transition:opacity .7s var(--ease)}
html.js .ph img{opacity:0}
html.js .ph.ld img{opacity:1}
.ph.ld::before{opacity:0}

/* ===== Gallery ===== */
.chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:4px 2px 18px;margin:0 calc(var(--pad) * -1);padding-inline:var(--pad)}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;min-height:40px;padding:0 16px;border:1px solid var(--line-2);border-radius:999px;font-size:13px;color:var(--muted);transition:color .3s,border-color .3s,transform .12s var(--ease)}
.chip:active{transform:scale(.97)}
.chip[aria-pressed="true"]{color:var(--paper);border-color:rgba(233,240,86,.55);box-shadow:inset 0 -2px 0 -1px var(--acid)}

/* ===== Open house ===== */
.oh{display:grid;gap:40px}
@media (min-width:960px){.oh{grid-template-columns:.8fr 1.2fr;gap:64px;align-items:start}}
.oh-card{position:relative;display:grid;justify-items:center;text-align:center;gap:12px;padding:56px 20px;min-height:360px;align-content:center}
.oh-ring{position:absolute;left:50%;top:50%;width:min(340px,86%);aspect-ratio:1;transform:translate(-50%,-50%) rotate(-90deg);pointer-events:none}
.oh-ring circle{fill:none;stroke:var(--acid);stroke-opacity:.55;stroke-width:1;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:0}
html.js .oh-ring circle{stroke-dashoffset:1;transition:stroke-dashoffset 1.8s var(--ease) .2s}
html.js .oh-card.in .oh-ring circle{stroke-dashoffset:0}
.oh-date{display:grid;justify-items:center;font-family:var(--serif);color:var(--paper)}
.oh-day{font-size:clamp(96px,16vw,148px);line-height:.85}
.oh-mon{font-size:24px;font-style:italic;margin-top:6px}
.oh-time{font-size:14px;color:var(--muted)}
.cal-bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.cal-title{font-size:28px}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.cal-row{display:contents}
.cal-wd{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);text-align:center;padding:6px 0}
.cal-d{position:relative;display:grid;place-items:center;aspect-ratio:1;min-height:44px;font-size:14px;color:var(--text);border-radius:4px;cursor:pointer;overflow:hidden;background:rgba(215,232,188,.03)}
.cal-d.out{color:rgba(154,168,140,.4);background:none}
.cal-d .n{position:relative;z-index:2}
.cal-d .fill{position:absolute;inset:0;background:var(--acid);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease) var(--d,0s)}
.cal-d.sel .fill{transform:scaleX(1)}
.cal-d.sel{color:var(--ink)}
.cal-d.is-av::after{content:"";position:absolute;left:22%;right:22%;bottom:7px;height:2px;border-radius:2px;background:rgba(215,232,188,.45)}
.cal-d.is-oh::before{content:"";position:absolute;top:7px;right:7px;width:6px;height:6px;border-radius:50%;background:var(--acid);z-index:2}
.cal-d.sel.is-oh::before{background:var(--ink)}
.cal-d.today .n{text-decoration:underline;text-underline-offset:4px}
.cal-d:focus-visible{outline-offset:-2px}
.rip{position:absolute;width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;background:var(--paper);opacity:.35;transform:scale(0);pointer-events:none;z-index:1;animation:rip .6s var(--ease) forwards}
@keyframes rip{to{transform:scale(5);opacity:0}}
html.js .cal-grid.stag .cal-d{opacity:0;transform:translateY(8px);animation:day .5s var(--ease) forwards;animation-delay:calc(var(--r) * 60ms)}
@keyframes day{to{opacity:1;transform:none}}
.cal-msg{margin-top:14px;font-size:14px;color:var(--muted)}
.cal-legend{display:flex;flex-wrap:wrap;gap:16px;margin-top:16px;font-size:12px;color:var(--muted)}
.lg{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:-1px}
.lg-oh{background:var(--acid)}.lg-av{background:rgba(215,232,188,.45);height:2px;border-radius:2px;vertical-align:3px}.lg-sel{background:var(--acid);border-radius:2px;opacity:.7}
.cal-help{margin-top:10px;font-size:12px;color:var(--muted)}
.cal-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.cal-actions p{font-size:14px}
.pulse{animation:pulse .6s var(--ease)}
@keyframes pulse{50%{transform:scale(1.05)}}

/* Upgrades: the pass 8 stepper lives in 261-p8.css */

/* ===== Amenities: blueprint to photo ===== */
.bp{margin-bottom:56px}
.bp-frame{position:relative;aspect-ratio:3/2;overflow:hidden;border-radius:4px;container-type:inline-size;background:var(--ink);touch-action:pan-y}
@media (max-width:600px){.bp-frame{aspect-ratio:4/5}.bp-photo img{object-position:40% 50%}}
.bp-photo,.bp-plan{position:absolute;inset:0}
.bp-photo img{width:100%;height:100%;object-fit:cover}
.bp-plan{background:var(--ink);clip-path:inset(0 0 0 var(--x,50%));display:grid;place-items:center;padding:4%}
.bp-plan svg{width:100%;height:100%}
.bp-lines path{fill:none;stroke:var(--text);stroke-opacity:.75;stroke-width:1.25;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:0}
.bp-lines text{fill:var(--muted);font:11px var(--sans)}
.bp-lines .bp-lvl{fill:var(--acid);font-size:9px;letter-spacing:.18em;text-transform:uppercase}
html.js .bp-lines path{stroke-dashoffset:1;transition:stroke-dashoffset 1.8s var(--ease)}
html.js .bp-lines path:nth-of-type(2){transition-delay:.25s}html.js .bp-lines path:nth-of-type(3){transition-delay:.4s}html.js .bp-lines path:nth-of-type(4){transition-delay:.5s}html.js .bp-lines path:nth-of-type(5){transition-delay:.7s}
html.js .bp-lines text{opacity:0;transition:opacity .8s var(--ease) 1.1s}
html.js .bp.in .bp-lines path{stroke-dashoffset:0}
html.js .bp.in .bp-lines text{opacity:1}
.bp-handle{position:absolute;top:0;bottom:0;left:0;width:44px;margin-left:-22px;transform:translateX(calc(var(--xn,.5) * 100cqw));cursor:ew-resize;display:grid;place-items:center;touch-action:none}
.bp-handle::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:1px;background:var(--acid)}
.bp-handle span{position:relative;width:36px;height:36px;border-radius:50%;background:var(--ink);border:1px solid var(--acid)}
.bp-handle span::before{content:"\2194";position:absolute;inset:0;display:grid;place-items:center;color:var(--acid);font-size:15px}
.bp figcaption{margin-top:12px;font-size:12px;color:var(--muted)}
.am{display:grid;grid-template-columns:repeat(2,1fr);gap:0 20px}
@media (min-width:900px){.am{grid-template-columns:repeat(5,1fr)}}
.am-t{position:relative;padding:18px 0 22px;font-size:13px;color:var(--muted);border-top:1px solid var(--line)}
.am-t::before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:var(--acid);transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease) var(--d,0s),opacity 1.4s var(--ease) calc(var(--d,0s) + .9s)}
.am-t.in::before{transform:scaleX(1);opacity:.35}
.am-t b{display:block;font:400 30px/1 var(--serif);color:var(--paper);margin-bottom:8px}
.am-ph{grid-column:1/-1}
@media (min-width:900px){.am-ph{grid-column:auto}}
.comm{margin-top:56px;padding-top:28px;border-top:1px solid var(--line)}
.comm-l{display:grid;gap:10px;margin-top:16px;font:clamp(20px,2.4vw,28px)/1.25 var(--serif);color:var(--paper)}
@media (min-width:900px){.comm-l{grid-template-columns:1fr 1fr;gap:14px 48px}}

/* ===== Area ===== */
.strip{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:0 var(--pad) 8px;margin-bottom:56px}
.strip::-webkit-scrollbar{display:none}
.strip .ph{flex:0 0 78%;aspect-ratio:4/5;scroll-snap-align:center;border-radius:3px}
@media (min-width:900px){.strip{display:grid;grid-template-columns:1.2fr .9fr 1fr;max-width:1280px;margin-inline:auto;overflow:visible}.strip .ph{aspect-ratio:auto;height:440px}.strip .ph:nth-child(2){margin-top:64px}}
.map-wrap{display:grid;gap:36px}
@media (min-width:960px){.map-wrap{grid-template-columns:1.2fr .8fr;align-items:start}}
.map{position:relative}
.map-vp{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:4px;background:var(--ink);aspect-ratio:400/520;max-height:78vh;max-width:calc(78vh * 400 / 520);margin-inline:auto;touch-action:pan-y;cursor:grab}
.map-vp.zoomed{touch-action:none}
.map-vp.grab{cursor:grabbing}
.map-vp svg{width:100%;height:100%;display:block}
#mapG{transform-origin:0 0;transform:translate(var(--tx,0),var(--ty,0)) scale(var(--sc,1))}
#mapG.ease{transition:transform .5s var(--ease)}
.m-sea{fill:rgba(215,232,188,.035)}
.m-isl{fill:rgba(215,232,188,.06);stroke:var(--line-2)}
.m-lag{fill:rgba(215,232,188,.02);stroke:var(--line)}
.m-riv{fill:none;stroke:rgba(215,232,188,.22);stroke-width:6;stroke-linecap:round}
.m-rd{fill:none;stroke:rgba(215,232,188,.22);stroke-width:1;stroke-dasharray:3 4}
.m-route{fill:none;stroke:var(--acid);stroke-width:2;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:var(--route,1)}
html:not(.js) .m-route{stroke-dashoffset:0}
.m-lbl{fill:var(--muted);font:italic 13px var(--serif);letter-spacing:.02em}
.pin{cursor:pointer;outline:none}
.pin .hit{fill:transparent}
.pin .dot{fill:var(--ink);stroke:var(--acid);stroke-width:1.5}
.pin.home .dot{fill:var(--acid)}
.pin .ring{fill:none;stroke:var(--acid);stroke-width:1;opacity:0;transform-box:fill-box;transform-origin:center}
.pin .foc{fill:none;stroke:var(--acid);stroke-width:2;opacity:0}
.pin:focus-visible .foc{opacity:1}
.pin text{fill:var(--paper);font:11px var(--sans)}
.pin .drop{transition:transform .7s var(--ease) var(--d,0s),opacity .5s var(--ease) var(--d,0s)}
html.js .map:not(.in) .pin .drop{transform:translateY(-18px);opacity:0}
.map.in .pin .ring{animation:ring 1.4s var(--ease) calc(var(--d,0s) + .3s) 1}
@keyframes ring{0%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:scale(3.2)}}
.map-ctl{position:absolute;top:10px;right:10px;display:grid;gap:6px}
.map-note{margin-top:12px;font-size:12px;color:var(--muted)}
.area-notes p+p{margin-top:8px}
.area-notes p+.eyebrow{margin-top:28px}
.area-notes p:not(.eyebrow){font:22px/1.3 var(--serif);color:var(--paper)}

/* Bottom sheet */
.sheet{position:fixed;inset:0;z-index:120}
.sheet[hidden]{display:none}
.sheet-bg{position:absolute;inset:0;background:rgba(20,22,23,.6);opacity:0;transition:opacity .5s var(--ease)}
.sheet-p{position:absolute;left:0;right:0;bottom:0;max-width:560px;margin:0 auto;padding:22px 22px calc(26px + env(safe-area-inset-bottom));background:var(--surface);border:1px solid var(--line);border-radius:16px 16px 0 0;transform:translateY(100%);transition:transform .6s var(--ease)}
.sheet.open .sheet-bg{opacity:1}
.sheet.open .sheet-p{transform:none}
.sheet-x{position:absolute;top:12px;right:12px}
.sheet-img{aspect-ratio:16/9;border-radius:4px;overflow:hidden;margin:0 56px 16px 0;background:var(--ink);display:grid;place-items:center}
.sheet-img img{width:100%;height:100%;object-fit:cover}
.sheet-img:empty{display:none}
.sheet-p h3{font-size:32px;margin-bottom:8px}
.sheet-min{font-size:14px;color:var(--paper);margin-bottom:8px;font-variant-numeric:tabular-nums}
.sheet-p p:last-child{color:var(--muted);font-size:14px}

/* ===== Ask + final ===== */
.ask{padding-block:clamp(72px,10vw,120px)}
.ask-h{font-size:clamp(32px,4.6vw,56px);margin:14px 0 12px;color:var(--text)}
.ask p:last-child{color:var(--muted)}
.final{position:relative;text-align:center;padding:clamp(120px,18vw,220px) var(--pad);border-top:1px solid var(--line);overflow:hidden}
.final h2{margin:16px auto 44px;max-width:900px}
.final-ctas{position:relative;display:inline-flex;flex-wrap:wrap;justify-content:center;gap:12px}
.halo{position:absolute;left:50%;top:50%;width:340px;height:340px;margin:-170px 0 0 -170px;border-radius:50%;border:1px solid rgba(233,240,86,.4);box-shadow:0 0 60px rgba(233,240,86,.12),inset 0 0 60px rgba(233,240,86,.08);opacity:.25;pointer-events:none;animation:breathe 6s ease-in-out infinite}
@keyframes breathe{0%,100%{opacity:.18;transform:scale(.96)}50%{opacity:.38;transform:scale(1.04)}}

/* ===== Lightbox ===== */
/* gallery grid + lightbox rules moved to 261-p3.css (pass 3) */

/* View transitions */
::view-transition-group(lbimg){animation-duration:.55s;animation-timing-function:var(--ease)}
::view-transition-old(root),::view-transition-new(root){animation-duration:.35s}
/* clip-path permitted here: the in-page nav wipe */
html[data-vt="nav"]::view-transition-old(root){animation:vt-out .6s var(--ease) both}
html[data-vt="nav"]::view-transition-new(root){animation:vt-wipe .6s var(--ease) both}
@keyframes vt-wipe{from{clip-path:inset(100% 0 0 0)}to{clip-path:inset(0)}}
@keyframes vt-out{to{opacity:.4}}

/* ===== Reduced motion: fades and final states only ===== */
@media (prefers-reduced-motion: reduce){
  .rv,.hero-par,.m-route{animation:none!important}
  html.no-sda .rv{transform:none;transition:opacity .4s linear}
  html.js .hero-photo{clip-path:none!important;opacity:0}
  html.hero-css .hero-photo{animation:fade .6s linear forwards!important}
  html.hero-css .hero-photo img{animation:none}
  @keyframes fade{to{opacity:1}}
  html.js .ln>span{transform:none!important}
  html.js .hero-facts{transform:none!important;transition:none!important}
  html.js .hero-title{opacity:0;transition:opacity .6s linear}
  html.hero-gl .hero-title,html.hero-css .hero-title{opacity:1}
  .halo,.map.in .pin .ring,.rip{animation:none}
  .halo{opacity:.25}
  html.js .cal-grid.stag .cal-d{animation:none;opacity:1;transform:none}
  .cal-d .fill{transition:none}
  .btn,.gt,.chip,.icon-btn,.ctabar,.sheet-p,#mapG.ease{transition-duration:.01ms!important}
  .gt:hover,.gt:active{transform:none}
  html.js .bp-lines path{stroke-dashoffset:0;transition:none}
  html.js .bp-lines text{opacity:1;transition:none}
  html.js .oh-ring circle{stroke-dashoffset:0;transition:none}
  .m-route{stroke-dashoffset:0}
  html.js .map:not(.in) .pin .drop{transform:none;opacity:1}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
  .pulse{animation:none}
}
