/* self-hosted fonts
   Display/body: Neue Montreal when licensed (see fonts/README), otherwise Switzer.
   Switzer — ITF Free Font License, free for commercial use, self-hosting permitted.
   IBM Plex Mono — SIL Open Font License. */
@font-face{font-family:'Switzer';font-style:normal;font-weight:400;font-display:swap;
  src:url('fonts/Switzer-Regular.woff2') format('woff2');}
@font-face{font-family:'Switzer';font-style:normal;font-weight:500;font-display:swap;
  src:url('fonts/Switzer-Medium.woff2') format('woff2');}
@font-face{font-family:'Switzer';font-style:normal;font-weight:600;font-display:swap;
  src:url('fonts/Switzer-Semibold.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;
  font-display:swap;src:url('fonts/IBMPlexMono-400-latin-ext.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;
  font-display:swap;src:url('fonts/IBMPlexMono-400-latin.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;
  font-display:swap;src:url('fonts/IBMPlexMono-500-latin-ext.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;
  font-display:swap;src:url('fonts/IBMPlexMono-500-latin.woff2') format('woff2');}

/* ==========================================================================
   OVATION SEATING — v3
   Editorial architecture direction. Warm paper, charcoal, brand navy/red
   used only as punctuation. Photography carries the colour.
   ========================================================================== */

:root{
  --paper:#F3F1EC;
  --paper-2:#E9E5DC;
  --ink:#17181A;
  --ink-70:#4E4E4C;
  --ink-45:#6C6A63;   /* 4.9:1 on paper — AA for small text */
  --line:#D8D3C8;
  --navy:#0D1E38;
  --red:#A6222A;
  --sans:"Neue Montreal","PP Neue Montreal","Switzer","Helvetica Neue",Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --u:clamp(20px,4.6vw,84px);          /* page inset */
  --max:1680px;
  --sec:clamp(62px,9vw,150px);         /* section rhythm — tightened */
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);
  font-size:17px;line-height:1.78;font-weight:400;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
::selection{background:var(--ink);color:var(--paper)}
:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
.on-dark :focus-visible,.dk :focus-visible{outline-color:var(--paper)}
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--ink);color:#fff;padding:12px 18px;
  font-size:12px;letter-spacing:.16em;text-transform:uppercase}
.skip:focus{left:0}

/* ---------- structure ---------- */
.u{max-width:var(--max);margin:0 auto;padding-left:var(--u);padding-right:var(--u)}
.sec{padding:var(--sec) 0}
.sec--tight{padding:calc(var(--sec)*.42) 0}
.sec--hero{padding:calc(var(--sec)*1.4) 0}
.sec--half{padding:calc(var(--sec)*.55) 0}
.sec--flush-t{padding-top:0}
.sec--flush-b{padding-bottom:0}
.pull-up{margin-top:clamp(-140px,-9vw,-60px);position:relative;z-index:2}
.bleed{width:100%}
.dk{background:var(--navy);color:#EDEFF2}
.dk .lab{color:#8FA0B5}
.hr{height:1px;background:var(--line);border:0;margin:0}
.dk .hr{background:rgba(255,255,255,.16)}

.g{display:grid;gap:clamp(22px,3vw,54px)}
.g12{grid-template-columns:repeat(12,minmax(0,1fr))}
.c2{grid-column-end:span 2}.c3{grid-column-end:span 3}.c4{grid-column-end:span 4}
.c5{grid-column-end:span 5}.c6{grid-column-end:span 6}.c7{grid-column-end:span 7}
.c8{grid-column-end:span 8}.c9{grid-column-end:span 9}.c10{grid-column-end:span 10}
.c12{grid-column-end:span 12}
.s2{grid-column-start:2}.s3{grid-column-start:3}.s4{grid-column-start:4}.s5{grid-column-start:5}
.s6{grid-column-start:6}.s7{grid-column-start:7}.s8{grid-column-start:8}.s9{grid-column-start:9}
.s10{grid-column-start:10}
@media (max-width:1020px){
  .c2,.c3,.c4,.c5{grid-column-end:span 6}
  .c6,.c7,.c8,.c9,.c10{grid-column-end:span 12}
  .s2,.s3,.s4,.s5,.s6,.s7,.s8,.s9,.s10{grid-column-start:auto}
}
@media (max-width:640px){.c2,.c3,.c4,.c5{grid-column-end:span 12}}

/* ---------- type ---------- */
h1,h2,h3,h4{margin:0;font-weight:500;letter-spacing:-.03em;line-height:.94}
.d1{font-size:clamp(3rem,9.2vw,9.5rem);line-height:.9;letter-spacing:-.042em;font-weight:500}
.d2{font-size:clamp(2.3rem,6.4vw,6rem);line-height:.94;letter-spacing:-.038em;font-weight:500}
.d3{font-size:clamp(1.9rem,3.6vw,3.4rem);line-height:1.02;letter-spacing:-.03em;font-weight:500}
.d4{font-size:clamp(1.35rem,2vw,1.9rem);line-height:1.14;letter-spacing:-.022em;font-weight:500}
.lab{font-size:11px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-45);
  margin:0 0 clamp(18px,2.4vw,34px)}
.lab--rule{padding-top:16px;border-top:1px solid var(--line)}
.dk .lab--rule{border-top-color:rgba(255,255,255,.2)}
p{margin:0 0 1.2em;max-width:64ch}
p:last-child{margin-bottom:0}
.lede{font-size:clamp(1.1rem,1.5vw,1.42rem);line-height:1.55;letter-spacing:-.012em;max-width:46ch}
.sub{color:var(--ink-70)}
.dk .sub{color:#A9B6C6}
.sm{font-size:.94rem;line-height:1.72}
.mono{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-45)}
strong{font-weight:600}

/* link with a reveal underline */
.ln{display:inline-block;position:relative;font-size:.84rem;font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;padding-bottom:9px}
.ln::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:currentColor;
  transform-origin:right;transform:scaleX(1);transition:transform .5s cubic-bezier(.19,1,.22,1)}
.ln:hover::after{transform-origin:left;animation:swipe .55s cubic-bezier(.19,1,.22,1)}
@keyframes swipe{0%{transform:scaleX(1)}49%{transform:scaleX(0);transform-origin:right}
  50%{transform:scaleX(0);transform-origin:left}100%{transform:scaleX(1)}}
.ln .ar{display:inline-block;margin-left:.6em;transition:transform .45s cubic-bezier(.19,1,.22,1)}
.ln:hover .ar{transform:translateX(6px)}

/* ---------- header ---------- */
.hd{position:fixed;top:0;left:0;right:0;z-index:90;transition:background .45s ease,border-color .45s ease}
.hd::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:transparent;transition:background .45s}
.hd.is-solid{background:var(--paper)}
.hd.is-solid::after{background:var(--line)}
.hd__in{display:flex;align-items:center;justify-content:space-between;gap:24px;
  max-width:var(--max);margin:0 auto;padding:clamp(16px,2vw,26px) var(--u)}
.hd__logo img{height:clamp(30px,3vw,40px);width:auto}
.hd__logo .rev{display:none}
.hd--over .hd__logo .rev{display:block}
.hd--over .hd__logo .std{display:none}
.hd--over.is-solid .hd__logo .rev{display:none}
.hd--over.is-solid .hd__logo .std{display:block}
.nav{display:flex;align-items:center;gap:clamp(20px,2.6vw,44px)}
.nav a{position:relative;font-size:.8rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;padding:6px 0}
.nav a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:currentColor;
  transform:scaleX(0);transform-origin:right;transition:transform .45s cubic-bezier(.19,1,.22,1)}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.hd--over:not(.is-solid){color:#fff}
.hd--over:not(.is-solid) .nav a{color:#fff}
.burger{display:none;background:none;border:0;padding:8px 0;cursor:pointer;color:inherit;
  font-size:.8rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase}
@media (max-width:960px){
  .burger{display:block}
  .nav{position:fixed;inset:0;background:var(--paper);color:var(--ink);flex-direction:column;
    align-items:flex-start;justify-content:center;gap:6px;padding:0 var(--u);
    clip-path:inset(0 0 100% 0);transition:clip-path .7s cubic-bezier(.76,0,.24,1);z-index:95}
  .nav.is-open{clip-path:inset(0 0 0 0)}
  .nav a{font-size:clamp(2rem,8vw,3.2rem);letter-spacing:-.03em;text-transform:none;font-weight:500;
    padding:10px 0;color:var(--ink)!important}
  .nav a::after{display:none}
  .nav__x{position:absolute;top:clamp(16px,2vw,26px);right:var(--u);font-size:.8rem;letter-spacing:.14em;
    text-transform:uppercase;background:none;border:0;cursor:pointer;color:var(--ink)}
}
@media (min-width:961px){.nav__x{display:none}}

/* ---------- hero ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;background:var(--navy)}
.hero__bg{position:absolute;inset:0}
.hero__bg img{width:100%;height:100%;object-fit:cover;
  transform:scale(1.06);animation:heroIn 2.4s cubic-bezier(.19,1,.22,1) forwards}
@keyframes heroIn{to{transform:scale(1)}}
.hero__veil{position:absolute;inset:0;background:rgba(10,16,26,.34)}
.hero__veil::after{content:"";position:absolute;left:0;right:0;bottom:0;height:62%;
  background:linear-gradient(to bottom,rgba(10,16,26,0),rgba(10,16,26,.62))}
.hero__in{position:relative;width:100%;max-width:var(--max);margin:0 auto;
  padding:0 var(--u) clamp(38px,7vh,84px);color:#fff}
.hero h1{color:#fff;max-width:14ch}
.hero__sub{margin-top:clamp(20px,2.6vw,34px);max-width:40ch;color:rgba(255,255,255,.82);font-size:1.05rem}
.hero__foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px 28px;align-items:flex-end;
  margin-top:clamp(38px,7vh,80px);padding-top:18px;border-top:1px solid rgba(255,255,255,.28)}
.hero__foot .mono{color:rgba(255,255,255,.66)}

/* ---------- figures ---------- */
figure{margin:0}
.fig{position:relative;overflow:hidden;background:var(--paper-2);display:block}
.fig::before{content:"";display:block}
.r32::before{padding-top:62%}
.r43::before{padding-top:78%}
.r45::before{padding-top:128%}
.r21::before{padding-top:46%}
.r11::before{padding-top:100%}
.rfull::before{padding-top:74vh}
.fig picture{position:absolute;inset:0;display:block}
.fig img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transition:transform 1.1s cubic-bezier(.19,1,.22,1)}
a:hover .fig img,.pj:hover .fig img{transform:scale(1.035)}
.cap{margin-top:14px;font-size:.84rem;color:var(--ink-45);letter-spacing:.02em}
.dk .cap{color:#8FA0B5}

/* ---------- featured work, editorial ---------- */
.pj{display:block}
.pj__no{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-45)}
.pj__nm{margin:14px 0 0;font-size:clamp(1.7rem,3.1vw,2.9rem);line-height:1.02;letter-spacing:-.032em;font-weight:500}
.pj__mt{margin-top:14px;display:flex;flex-wrap:wrap;gap:6px 26px;font-size:.86rem;color:var(--ink-70);
  letter-spacing:.02em}
.pj__mt span{position:relative}
.dk .pj__nm{color:#fff}.dk .pj__mt{color:#A9B6C6}

/* ---------- oversized statement ---------- */
.stmt{font-size:clamp(2.4rem,8.4vw,8rem);line-height:.92;letter-spacing:-.042em;font-weight:500;max-width:15ch}
.stmt em{font-style:normal;color:var(--red)}
.stmt--sm{font-size:clamp(1.8rem,3.9vw,3.6rem);line-height:1;letter-spacing:-.032em}

/* ---------- numbered approach ---------- */
.steps{border-top:1px solid var(--line)}
.step{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,4fr) minmax(0,5fr);
  gap:clamp(18px,3vw,60px);align-items:start;padding:clamp(30px,4vw,58px) 0;border-bottom:1px solid var(--line)}
.step__n{font-size:clamp(2.6rem,6vw,5.4rem);line-height:.8;letter-spacing:-.04em;font-weight:500;color:var(--ink)}
.step h3{font-size:clamp(1.4rem,2.2vw,2.1rem);letter-spacing:-.028em}
.step p{color:var(--ink-70);font-size:.98rem;max-width:52ch}
.dk .step p{color:#EDEFF2}
@media (max-width:860px){
  .step{grid-template-columns:minmax(0,1fr);gap:10px}
  .step__n{font-size:2.6rem;color:var(--ink-45)}
}

/* ---------- expertise list with image reveal ---------- */
.expo{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
  gap:clamp(24px,4vw,70px);align-items:center}
.expo__list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.expo__list li{border-bottom:1px solid var(--line)}
.expo__list a{display:flex;align-items:baseline;justify-content:space-between;gap:20px;
  padding:clamp(16px,2.2vw,30px) 0;font-size:clamp(1.5rem,3.2vw,2.9rem);letter-spacing:-.032em;
  font-weight:500;line-height:1.06;transition:color .4s,padding-left .5s cubic-bezier(.19,1,.22,1)}
.expo__list a:hover{padding-left:16px}
.expo__list .n{font-size:11px;letter-spacing:.2em;color:var(--ink-45);font-weight:500}
.expo__media{position:relative;aspect-ratio:4/5;background:var(--paper-2);overflow:hidden}
.expo__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;
  transition:opacity .6s cubic-bezier(.19,1,.22,1)}
.expo__media img.is-on{opacity:1}
@media (max-width:1020px){.expo{grid-template-columns:minmax(0,1fr)}.expo__media{display:none}}

/* ---------- quote ---------- */
.qt{font-size:clamp(1.5rem,3.4vw,3.1rem);line-height:1.14;letter-spacing:-.03em;font-weight:500;max-width:20ch}
.qt__c{margin-top:26px;font-size:.84rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-45);
  font-style:normal;display:block}

/* ---------- spec / facts ---------- */
.facts{margin:0;border-top:1px solid var(--line)}
.facts div{display:flex;justify-content:space-between;gap:20px;padding:15px 0;border-bottom:1px solid var(--line)}
.facts dt{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-45)}
.facts dd{margin:0;font-size:.95rem;text-align:right}
.dk .facts,.dk .facts div{border-color:rgba(255,255,255,.16)}

/* ---------- plain list ---------- */
.ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.ul li{padding:15px 0;border-bottom:1px solid var(--line);font-size:.98rem;line-height:1.6;color:var(--ink-70)}
.ul li strong{color:var(--ink)}
.dk strong,.dk .ul li strong,.hero strong{color:#fff}
.dk .ul,.dk .ul li{border-color:rgba(255,255,255,.16)}
.dk .ul li{color:#A9B6C6}

/* ---------- index table ---------- */
.tbl{width:100%;border-collapse:collapse}
.tbl th{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-45);text-align:left;
  font-weight:500;padding:0 20px 14px 0;border-bottom:1px solid var(--ink)}
.tbl td{padding:20px 20px 20px 0;border-bottom:1px solid var(--line);vertical-align:top;font-size:.96rem}
.tbl td:first-child{font-size:1.12rem;letter-spacing:-.018em}
.tbl tbody tr{transition:background .3s}
.tbl tbody tr:hover{background:var(--paper-2)}
@media (max-width:760px){
  .tbl thead{position:absolute;left:-9999px}
  .tbl tr{display:grid;grid-template-columns:1fr auto;gap:2px 16px;padding:18px 0;border-bottom:1px solid var(--line)}
  .tbl td{border:0;padding:0}
  .tbl td:nth-child(2),.tbl td:nth-child(3){grid-column:1/3;color:var(--ink-70);font-size:.9rem}
}

/* ---------- forms ---------- */
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 34px}
.form .full{grid-column:1/-1}
@media (max-width:700px){.form{grid-template-columns:minmax(0,1fr)}}
.fld label{display:block;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-45);margin-bottom:10px}
.fld input,.fld select,.fld textarea{width:100%;background:transparent;border:0;border-bottom:1px solid var(--ink);
  border-radius:0;padding:12px 0;font-family:var(--sans);font-size:1.05rem;color:var(--ink)}
.fld textarea{min-height:130px;resize:vertical}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-bottom-width:2px}
.btn{display:inline-block;border:1px solid currentColor;padding:17px 34px;font-size:.8rem;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;background:transparent;cursor:pointer;color:inherit;
  transition:background .4s,color .4s}
.btn:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.dk .btn:hover{background:var(--paper);color:var(--navy);border-color:var(--paper)}

/* ---------- footer ---------- */
.ft{background:var(--navy);color:#BEC9D6;padding-top:clamp(60px,9vw,120px)}
.ft a:hover{color:#fff}
.ft__cta{padding-bottom:clamp(52px,7vw,96px);border-bottom:1px solid rgba(255,255,255,.16)}
.ft__cta h2{color:#fff}
.ft__grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));
  gap:clamp(26px,4vw,52px);padding:clamp(40px,5vw,72px) 0}
@media (max-width:900px){.ft__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.ft__grid{grid-template-columns:minmax(0,1fr)}}
.ft__logo{height:64px;width:auto;margin-bottom:22px}
.ft h4{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#8FA0B5;font-weight:500;margin:0 0 18px}
.ft ul{list-style:none;margin:0;padding:0}
.ft li{margin-bottom:12px;font-size:.95rem}
.ft__bar{border-top:1px solid rgba(255,255,255,.16);padding:20px 0 30px;display:flex;flex-wrap:wrap;
  justify-content:space-between;gap:10px 26px;font-size:.78rem;letter-spacing:.1em;color:#7A8A9C}

/* ---------- motion ---------- */
[data-rv]{opacity:0;transform:translateY(26px);transition:opacity 1s cubic-bezier(.19,1,.22,1),
  transform 1s cubic-bezier(.19,1,.22,1);transition-delay:var(--d,0ms)}
[data-rv].in{opacity:1;transform:none}
.jsoff [data-rv]{opacity:1;transform:none}
[data-mask] .fig img{transform:scale(1.07)}
[data-mask].in .fig img{transform:scale(1)}
@media (prefers-reduced-motion:reduce){
  [data-rv]{opacity:1!important;transform:none!important}
  .hero__bg img{animation:none;transform:none}
  .fig img,a:hover .fig img{transition:none;transform:none}
}
@media print{.hd{position:static}.hero__veil{display:none}}

/* ---------- drawings (kept for technical pages) ---------- */
.dwg{width:100%;height:auto}
.dwg .ln1{fill:none;stroke:var(--ink);stroke-width:1.1}
.dwg .lt{fill:none;stroke:var(--ink-45);stroke-width:.85}
.dwg .fill{fill:var(--ink)}
.dwg .dim{fill:none;stroke:var(--red);stroke-width:.85}
.dwg text{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;fill:var(--ink-45);text-transform:uppercase}
.dwg text.dm{fill:var(--red)}

/* ==========================================================================
   Iteration: spectator-seating specificity
   ========================================================================== */

/* red as punctuation on the numbered rows */
.step__n--red{color:var(--red)}

/* seat counts and technical metadata — always mono */
.count{font-family:var(--mono);font-weight:500;font-size:clamp(1.7rem,4.6vw,4.4rem);
  line-height:.94;letter-spacing:-.02em;display:block}
.count--xl{font-size:clamp(2.6rem,9vw,8rem);letter-spacing:-.035em}
.count--sm{font-size:clamp(1.05rem,1.7vw,1.5rem);letter-spacing:0}
.count sup{font-size:.42em;vertical-align:super;letter-spacing:.06em}
.meta{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-45);display:flex;flex-wrap:wrap;gap:6px 26px;margin:0}
.dk .meta{color:#8FA0B5}
.rule-r{width:44px;height:2px;background:var(--red);border:0;margin:0 0 20px}

/* project head: number / seat count above the venue name */
.pj__hd{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;
  font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-45)}
.pj__hd b{color:var(--ink);font-weight:500}
.dk .pj__hd b{color:#fff}

/* specification rows — deliberately not cards */
.specs{margin:0;border-top:1px solid var(--line)}
.specs > div{display:grid;grid-template-columns:minmax(0,190px) minmax(0,1fr);gap:14px 28px;
  padding:17px 0;border-bottom:1px solid var(--line)}
.specs dt{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-45)}
.specs dd{margin:0;font-size:1rem;line-height:1.5}
.dk .specs,.dk .specs > div{border-color:rgba(255,255,255,.16)}
.dk .specs dd{color:#EDEFF2}
@media (max-width:620px){.specs > div{grid-template-columns:minmax(0,1fr);gap:4px}}

/* the applications list, reversed for the navy engineering band */
.dk .expo__list,.dk .expo__list li{border-color:rgba(255,255,255,.2)}
.dk .expo__list a{color:#fff}
.dk .expo__list .n{color:#8FA0B5}
.dk .expo__media{background:#0A1830}

/* technical drawing plate */
.plate{padding:clamp(24px,4vw,64px) 0}
.plate__note{margin-top:18px;font-family:var(--mono);font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-45)}
.dwg .ln1{stroke-width:1.15}
.dwg .hair{fill:none;stroke:var(--ink-45);stroke-width:.7;stroke-dasharray:4 4}
.dwg .sw{fill:none;stroke:var(--ink);stroke-width:1.6}
@media (max-width:820px){.plate{overflow-x:auto}.plate > svg{min-width:760px}}


/* ==========================================================================
   Iteration 2 — active space
   ========================================================================== */

/* header compaction */
.hd__in{transition:padding .45s cubic-bezier(.19,1,.22,1)}
.hd.is-compact .hd__in{padding-top:10px;padding-bottom:10px}
.hd.is-compact .hd__logo img{height:clamp(26px,2.4vw,32px)}
.hd__logo img{transition:height .45s cubic-bezier(.19,1,.22,1)}

/* ---------- sticky product story ---------- */
.story{display:grid;grid-template-columns:minmax(0,1.32fr) minmax(0,1fr);
  gap:clamp(28px,5vw,86px);align-items:start}
.story__media{position:sticky;top:104px;height:min(80vh,760px);overflow:hidden;background:var(--paper-2)}
.story__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transform:scale(1.05);
  transition:opacity .85s cubic-bezier(.19,1,.22,1),transform 1.6s cubic-bezier(.19,1,.22,1)}
.story__media img.is-on{opacity:1;transform:scale(1)}
.story__cap{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:15px 22px;background:rgba(13,30,56,.88);
  color:#fff;font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase}
.story__steps{display:flex;flex-direction:column}
.story__step{min-height:min(66vh,600px);display:flex;flex-direction:column;justify-content:center;
  padding:clamp(26px,4vw,54px) 0;border-top:1px solid var(--line);
  opacity:.34;transition:opacity .55s cubic-bezier(.19,1,.22,1)}
.story__step.is-active{opacity:1}
.story__step:first-child{border-top:0}
.story__step .n{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--red);
  display:block;margin-bottom:16px}
.story__step h3{font-size:clamp(1.7rem,3vw,2.7rem);letter-spacing:-.03em;margin-bottom:16px}
.story__step p{color:var(--ink-70);max-width:42ch}
.story__step .shot{display:none}
@media (max-width:1020px){
  .story{grid-template-columns:minmax(0,1fr);gap:0}
  .story__media{display:none}
  .story__step{min-height:0;opacity:1;padding:clamp(22px,4vw,40px) 0}
  .story__step .shot{display:block;margin-bottom:22px}
}
@media (prefers-reduced-motion:reduce){.story__step{opacity:1}}

/* ---------- interactive pillars ---------- */
.pillars{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);
  gap:clamp(26px,4vw,72px);align-items:start}
.pillars__list{border-top:1px solid var(--line)}
.pillar{border-bottom:1px solid var(--line);transition:opacity .4s ease}
.pillar a{display:grid;grid-template-columns:minmax(70px,.5fr) minmax(0,3fr);gap:clamp(14px,2vw,34px);
  align-items:baseline;padding:clamp(20px,2.8vw,38px) 0;
  transition:padding-left .55s cubic-bezier(.19,1,.22,1)}
.pillar .n{font-size:clamp(1.9rem,3.4vw,3.2rem);line-height:.86;letter-spacing:-.04em;font-weight:500;
  color:var(--ink-45);transition:color .35s ease}
.pillar h3{font-size:clamp(1.4rem,2.5vw,2.2rem);letter-spacing:-.03em;margin-bottom:10px}
.pillar p{color:var(--ink-45);font-size:.95rem;max-width:46ch;margin:0;transition:color .35s ease}
.pillars__list.is-hovering .pillar{opacity:.5}
.pillars__list.is-hovering .pillar.is-on{opacity:1}
.pillar.is-on a{padding-left:16px}
.pillar.is-on .n{color:var(--red)}
.pillar.is-on p{color:var(--ink-70)}
.pillars__media{position:relative;aspect-ratio:4/5;background:var(--paper-2);overflow:hidden;
  position:sticky;top:120px}
.pillars__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;
  transition:opacity .7s cubic-bezier(.19,1,.22,1)}
.pillars__media img.is-on{opacity:1}
@media (max-width:1020px){
  .pillars{grid-template-columns:minmax(0,1fr)}
  .pillars__media{display:none}
  .pillar.is-on a{padding-left:0}
}

/* ---------- project hover ---------- */
.pj{position:relative;display:block}
.pj .fig img{transform:translate3d(var(--px,0),var(--py,0),0) scale(1);
  transition:transform 1.1s cubic-bezier(.19,1,.22,1)}
.pj:hover .fig img{transform:translate3d(var(--px,0),var(--py,0),0) scale(1.04)}
.pj__view{display:inline-flex;align-items:center;gap:.6em;margin-top:16px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-45);
  opacity:0;transform:translateY(8px);
  transition:opacity .5s cubic-bezier(.19,1,.22,1),transform .5s cubic-bezier(.19,1,.22,1)}
.pj:hover .pj__view,.pj:focus-visible .pj__view{opacity:1;transform:none}
.pj__hd b{transition:color .35s ease}
.pj:hover .pj__hd b{color:var(--red)}
.pj__nm{transition:transform .55s cubic-bezier(.19,1,.22,1)}
.pj:hover .pj__nm{transform:translateX(6px)}
@media (prefers-reduced-motion:reduce){
  .pj__view{opacity:1;transform:none}
  .pj:hover .pj__nm{transform:none}
}

/* ---------- horizontal venue strip ---------- */
.strip{position:relative}
.strip__vp{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;
  scroll-snap-type:x proximity;padding-bottom:16px}
.strip.is-driven .strip__vp{overflow:hidden;padding-bottom:0}
.strip__track{display:flex;gap:clamp(16px,2.2vw,36px);width:max-content;
  padding-left:var(--u);padding-right:var(--u);will-change:transform}
.strip.is-driven .strip__track{transition:transform .18s linear}
.strip__item{width:clamp(250px,32vw,520px);flex:none;scroll-snap-align:start}
.strip__item .fig::before{padding-top:72%}
.strip__meta{display:flex;justify-content:space-between;gap:14px;margin-top:14px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-45)}
.strip__nm{margin-top:8px;font-size:clamp(1.05rem,1.5vw,1.4rem);letter-spacing:-.022em;font-weight:500}
.strip__hint{margin-top:18px;font-family:var(--mono);font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink-45)}
@media (min-width:1021px){.strip__hint{display:none}}

/* ---------- statistics ---------- */
.stats{display:grid;gap:0;border-top:1px solid var(--line)}
.stat{padding:clamp(20px,2.6vw,32px) 0;border-bottom:1px solid var(--line)}
.stat .fig-n{font-family:var(--mono);font-weight:500;font-size:clamp(2.1rem,5.4vw,4.6rem);
  line-height:.95;letter-spacing:-.03em;display:block}
.stat .lb{margin-top:12px;font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink-45)}
.dk .stats,.dk .stat{border-color:rgba(255,255,255,.18)}

/* ---------- sequential statement ---------- */
.seq{margin:0}
.seq span{display:block}
.seq .l3,.seq .l4{color:var(--red)}
.seq .l{opacity:0;transform:translateY(30px);
  transition:opacity .9s cubic-bezier(.19,1,.22,1),transform .9s cubic-bezier(.19,1,.22,1)}
.seq.in .l,.in .seq .l{opacity:1;transform:none}
.seq.in .l2,.in .seq .l2{transition-delay:.14s}
.seq.in .l3,.in .seq .l3{transition-delay:.28s}
.seq.in .l4,.in .seq .l4{transition-delay:.42s}
@media (prefers-reduced-motion:reduce){.seq .l{opacity:1;transform:none}}

/* ---------- parallax crop ---------- */
[data-para]{overflow:hidden}
[data-para] img{will-change:transform}

/* ---------- interactive drawing ---------- */
.plate__grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);
  gap:clamp(24px,4vw,64px);align-items:start}
@media (max-width:1020px){.plate__grid{grid-template-columns:minmax(0,1fr)}}
.hotlist{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.hotlist li{border-bottom:1px solid var(--line)}
.hotlist button{display:flex;justify-content:space-between;align-items:center;gap:14px;width:100%;
  background:none;border:0;padding:15px 0;cursor:pointer;text-align:left;font-family:var(--sans);
  font-size:.95rem;font-weight:500;letter-spacing:-.008em;color:var(--ink-45);
  transition:color .3s ease,padding-left .45s cubic-bezier(.19,1,.22,1)}
.hotlist button::after{content:"";width:20px;height:1px;background:currentColor;flex:none;
  transition:width .45s cubic-bezier(.19,1,.22,1)}
.hotlist button.is-on{color:var(--ink);padding-left:10px}
.hotlist button.is-on::after{width:42px;background:var(--red)}
.hotpanel{margin-top:26px;min-height:120px}
.hotpanel h4{font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--red);font-weight:500;margin-bottom:12px}
.hotpanel p{font-size:.98rem;line-height:1.65;color:var(--ink-70);margin:0}
.dwg .hot .ln1,.dwg .hot .sw,.dwg .hot .dim{transition:stroke .35s ease}
.dwg .hot text{transition:fill .35s ease}
.dwg .hot.is-on .ln1,.dwg .hot.is-on .sw{stroke:var(--red)}
.dwg .hot.is-on .dim{stroke:var(--red);stroke-width:1.2}
.dwg .hot.is-on text{fill:var(--red)}
.dwg .dim{stroke:var(--ink-45)}
.dwg text.dm{fill:var(--ink-45)}

/* image crops that run off the page edge */
.bleed-r{margin-right:calc(-1 * var(--u))}
.bleed-l{margin-left:calc(-1 * var(--u))}
@media (max-width:1020px){.bleed-r,.bleed-l{margin-right:0;margin-left:0}}

/* ---------- document request rows ---------- */
.docs{border-top:1px solid var(--line)}
.doc{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 34px;align-items:center;
  padding:clamp(20px,2.6vw,34px) 0;border-bottom:1px solid var(--line);transition:padding-left .5s cubic-bezier(.19,1,.22,1)}
.doc:hover{padding-left:14px}
.doc h3{font-size:clamp(1.1rem,1.7vw,1.5rem);letter-spacing:-.024em;margin-bottom:8px}
.doc p{margin:0;color:var(--ink-45);font-size:.94rem;max-width:60ch}
@media (max-width:640px){.doc{grid-template-columns:minmax(0,1fr);align-items:start}}


/* ---------- belief / capability rows (deliberately un-numbered) ---------- */
.rows{border-top:1px solid var(--line)}
.row2{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,6fr);gap:clamp(16px,3vw,56px);
  align-items:baseline;padding:clamp(22px,3vw,40px) 0;border-bottom:1px solid var(--line)}
.row2 h3{font-size:clamp(1.3rem,2.2vw,2rem);letter-spacing:-.028em}
.row2 .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--red);display:block;margin-bottom:12px}
.row2 p{margin:0;color:var(--ink-70);font-size:.98rem;max-width:56ch}
.dk .rows,.dk .row2{border-color:rgba(255,255,255,.18)}
.dk .row2 p{color:#A9B6C6}
@media (max-width:820px){.row2{grid-template-columns:minmax(0,1fr);gap:8px}}


/* ---------- embedded 3D model ---------- */
.model{position:relative;background:var(--paper-2);border:1px solid var(--line);overflow:hidden}
.model iframe{display:block;width:100%;height:clamp(420px,64vh,720px);border:0}
.model__bar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:10px 24px;
  margin-top:14px}
.model__bar .mono{margin:0}
@media (max-width:640px){.model iframe{height:clamp(340px,52vh,460px)}}
