@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=League+Spartan:wght@500;600&display=swap');
:root{--board:#eeeae1;--paper:#f8f6f0;--ink:#191b1c;--red:#d43b2a;--gray:#77766f;--line:#c7c2b8;--concrete:#d8d3c9}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--board);color:var(--ink);font:16px/1.55 'DM Sans',sans-serif;overflow-x:clip}::selection{background:var(--red);color:white}a{color:inherit;text-underline-offset:5px}button,input,select{font:inherit}:focus-visible{outline:3px solid var(--red);outline-offset:4px}img{display:block;max-width:100%;height:auto}h1,h2,h3,p,figure,dl,dd{margin-top:0}.skip{position:fixed;top:-70px;left:18px;background:white;padding:12px;z-index:50}.skip:focus{top:18px}
header{min-height:76px;display:flex;align-items:center;padding:0 clamp(20px,5vw,76px);gap:35px;background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}.logo{text-decoration:none;font:600 22px 'League Spartan';display:flex;gap:10px}.logo span{font:500 9px 'DM Sans';letter-spacing:.12em;margin-top:2px}nav{margin-left:auto;display:flex;gap:28px}header>a:last-child{font-size:13px}.menu-toggle{display:none;min-width:52px;min-height:44px;border:1px solid currentColor;background:transparent}
.hero{min-height:calc(100svh - 76px);min-height:calc(100dvh - 76px);display:grid;grid-template-columns:.72fr 1.28fr}.hero-copy{padding:clamp(60px,8vw,125px) clamp(22px,6vw,95px);display:flex;justify-content:center;flex-direction:column}.hero h1,.section-lab h2,.works h2,.studio h2,.process h2,.contact h2,.position h2,.constraints h2,.material-story h2,.daylight h2,.case-detail h2,.responsibility h2,.deliverables h2,.engagement h2,.project-questions h2{font:600 clamp(48px,6vw,86px)/.88 'League Spartan';letter-spacing:-.03em;margin:0;text-transform:uppercase;text-wrap:balance}.hero h1{font-size:clamp(54px,7vw,96px)}.hero p{max-width:50ch;color:#575853;font-size:18px;margin:30px 0}.hero figure{margin:0;position:relative;min-width:0}.hero figure img{width:100%;height:100%;object-fit:cover}.hero figcaption{position:absolute;left:20px;right:20px;bottom:20px;background:var(--paper);padding:14px 17px;display:flex;justify-content:space-between;font-size:11px}
.position,.section-lab,.constraints,.material-story,.daylight,.works,.case-detail,.studio,.responsibility,.process,.deliverables,.engagement,.project-questions,.contact{padding:clamp(75px,9vw,130px) clamp(20px,5vw,76px)}
.position{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(50px,9vw,150px);background:var(--paper)}.position>div>p{font-size:19px;color:#575853;margin:0 0 42px}.position dl{margin:0;border-top:1px solid var(--line)}.position dl div{display:grid;grid-template-columns:110px 1fr;gap:20px;padding:17px 0;border-bottom:1px solid var(--line)}.position dt{font-size:10px;color:var(--red);text-transform:uppercase}.position dd{margin:0}
.lab-title{display:grid;grid-template-columns:.35fr 1fr;gap:40px;align-items:end;margin-bottom:50px}.lab-title>span{font-size:10px;color:var(--red)}.lab{display:grid;grid-template-columns:70px 1.25fr .75fr;background:var(--paper);min-height:650px;border:1px solid var(--line)}.lab-tabs{display:grid;grid-template-rows:repeat(4,1fr);border-right:1px solid var(--line)}.lab-tabs button{writing-mode:vertical-rl;transform:rotate(180deg);border:0;border-bottom:1px solid var(--line);background:transparent;text-transform:uppercase;font-size:10px;cursor:pointer}.lab-tabs button[aria-selected=true]{background:var(--red);color:white}.lab figure{margin:0;position:relative;overflow:hidden}.lab figure img{width:100%;height:100%;object-fit:cover}.datum{position:absolute;left:30%;top:0;bottom:0;border-left:2px solid var(--red)}.datum:after{content:"SECTION A—A";position:absolute;top:14px;left:8px;color:var(--red);font-size:9px;white-space:nowrap}.lab article{padding:clamp(28px,5vw,70px);display:flex;justify-content:center;flex-direction:column}.lab article>span{font-size:10px;color:var(--red)}.lab h3{font:600 clamp(40px,4vw,62px)/.92 'League Spartan';text-transform:uppercase;margin:35px 0 20px}.lab article>p{color:#5e5f5b}.lab dl div{display:grid;grid-template-columns:90px 1fr;border-top:1px solid var(--line);padding:13px 0}.lab dt{font-size:10px;color:var(--red);text-transform:uppercase}.lab dd{margin:0}
.constraints{display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(40px,8vw,130px);background:var(--concrete)}.constraints>div:first-child p,.daylight>div:first-child p,.responsibility>div:first-child p,.deliverables>div:first-child p,.engagement-copy p{color:#5d5d58;margin:30px 0 0}.constraint-drawing{min-height:460px;position:relative;border:1px solid var(--ink);background:var(--paper);overflow:hidden}.constraint-drawing:before{content:"";position:absolute;left:12%;right:8%;bottom:24%;height:42%;border:2px solid var(--ink);clip-path:polygon(0 35%,30% 0,80% 0,100% 28%,100% 100%,0 100%)}.constraint-drawing .ground{position:absolute;left:0;right:0;bottom:24%;border-top:2px solid var(--red)}.constraint-drawing span{position:absolute;font-size:9px;color:var(--red)}.street{left:3%;bottom:29%}.sun{right:7%;top:8%}.garden{right:3%;bottom:29%}.court{left:48%;bottom:31%}.constraint-drawing b{position:absolute;left:15px;top:15px;font-size:10px}.constraints ol{grid-column:2;display:grid;grid-template-columns:repeat(3,1fr);margin:0;padding:0;list-style:none;border-top:1px solid var(--ink)}.constraints li{display:flex;gap:15px;padding:18px 15px 18px 0;border-right:1px solid var(--line)}.constraints li b{color:var(--red);font-size:10px}
.material-story{display:grid;grid-template-columns:.6fr 1fr .8fr;gap:clamp(24px,4vw,64px);align-items:stretch}.material-copy p{color:#5d5d58;margin-top:30px}.material-story figure{margin:0}.material-story figure img{width:100%;height:100%;object-fit:cover}.material-story figcaption{font-size:9px;margin-top:8px;color:var(--red)}.material-ledger{border-top:1px solid var(--ink)}.material-ledger>div{padding:18px 0;border-bottom:1px solid var(--line)}.material-ledger span{display:block;color:var(--red);font-size:9px}.material-ledger b{display:block;font:600 25px 'League Spartan';text-transform:uppercase;margin:10px 0}.material-ledger p{color:#666;font-size:13px}
.daylight{display:grid;grid-template-columns:.65fr 1.35fr;gap:clamp(50px,9vw,150px);background:var(--ink);color:white}.daylight>div:first-child p{color:#bbb}.light-sequence{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #555}.light-sequence article{min-height:390px;position:relative;padding:24px;border-right:1px solid #555;overflow:hidden}.light-sequence time{font-size:10px;color:#ee7466}.light-sequence strong{display:block;font:600 27px/1 'League Spartan';text-transform:uppercase;margin-top:65px;position:relative;z-index:2}.beam{position:absolute;width:180%;height:55%;background:#eeeae1;opacity:.17;transform:rotate(-28deg);transform-origin:left center;left:15%;top:18%}.beam-two{transform:rotate(-8deg);top:35%}.beam-three{transform:rotate(18deg);top:55%;background:var(--red)}
.works{display:grid;grid-template-columns:1fr 1fr;gap:26px;background:var(--concrete)}.works>div{grid-column:1/-1;display:grid;grid-template-columns:1fr .5fr;gap:40px}.works figure{margin:0}.works figure:last-child{grid-column:1/-1}.works img{width:100%;aspect-ratio:16/10;object-fit:cover}.works figcaption{display:flex;justify-content:space-between;gap:20px;padding:12px 0}.works figcaption span{color:#666;font-size:12px}
.case-detail{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(35px,7vw,110px);background:var(--paper)}.case-detail figure{margin:0}.case-detail figure img{width:100%;height:100%;object-fit:cover}.case-detail figcaption{font-size:9px;color:var(--red);margin-top:8px}.case-detail>div{display:flex;flex-direction:column;justify-content:center}.case-detail>div>p{color:#5d5d58}.case-detail dl{margin-top:35px;border-top:1px solid var(--line)}.case-detail dl div{display:grid;grid-template-columns:100px 1fr;padding:14px 0;border-bottom:1px solid var(--line)}.case-detail dt{font-size:10px;color:var(--red);text-transform:uppercase}.case-detail dd{margin:0}
.studio{display:grid;grid-template-columns:1fr 1fr;gap:35px}.studio>div{grid-column:1/-1;display:grid;grid-template-columns:1fr .55fr}.studio img{width:100%;height:100%;object-fit:cover}.studio dl{margin:0}.studio dl div{padding:24px;border-top:1px solid var(--line)}.studio dt{font:600 28px 'League Spartan';text-transform:uppercase}.studio dd{margin:8px 0 0;color:#666}
.responsibility{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(50px,9vw,150px);background:var(--concrete)}.responsibility-table{border-top:1px solid var(--ink)}.responsibility-table>div{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;padding:19px 0;border-bottom:1px solid #aaa59c}.responsibility-table span,.responsibility-table em{font-size:11px}.responsibility-table b{font:600 16px 'League Spartan'}.responsibility-table em{font-style:normal;color:#666}
.process{background:var(--ink);color:white}.process ol{display:grid;grid-template-columns:repeat(3,1fr);list-style:none;padding:0;margin:50px 0 0;border-top:1px solid #555}.process li{padding:22px;border-right:1px solid #555;border-bottom:1px solid #555}.process li span{font-size:10px;color:#ee7466}.process li b{display:block;font:600 28px 'League Spartan';text-transform:uppercase}.process li p{color:#bbb}
.deliverables{display:grid;grid-template-columns:.75fr 1.25fr;gap:clamp(50px,9vw,150px);background:var(--paper)}.deliverable-rows{border-top:1px solid var(--ink)}.deliverable-rows article{display:grid;grid-template-columns:80px 1.4fr 1fr;gap:20px;align-items:center;padding:20px 0;border-bottom:1px solid var(--line)}.deliverable-rows span{font-size:9px;color:var(--red)}.deliverable-rows b{font:600 22px 'League Spartan';text-transform:uppercase}.deliverable-rows p{color:#666;font-size:13px;margin:0}
.engagement{display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(50px,9vw,150px);background:var(--red);color:white}.engagement-copy p{color:#ffe1dd}.meeting-rhythm{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid white}.meeting-rhythm article{min-height:320px;padding:22px;border-right:1px solid rgba(255,255,255,.5)}.meeting-rhythm span{font-size:9px}.meeting-rhythm b{display:block;font:600 28px/1 'League Spartan';text-transform:uppercase;margin-top:70px}.meeting-rhythm p{font-size:13px;color:#ffe1dd}
.project-questions{display:grid;grid-template-columns:1fr .8fr;gap:clamp(50px,9vw,150px)}.project-questions details{padding:20px 0;border-top:1px solid var(--line)}.project-questions details:last-child{border-bottom:1px solid var(--line)}.project-questions summary{min-height:44px;cursor:pointer;font-weight:600}.project-questions details p{color:#666}
.contact{display:grid;grid-template-columns:1fr .75fr;gap:60px}.contact form{align-self:end}.contact label{display:block;font-size:11px;margin-bottom:14px}.contact input,.contact select{width:100%;height:48px;border:0;border-bottom:1px solid var(--ink);background:transparent;border-radius:0}.contact button{height:48px;background:var(--red);color:white;border:0;padding:0 20px}.contact #status{min-height:25px}footer{padding:30px clamp(20px,5vw,76px);background:var(--paper);display:flex;justify-content:space-between}footer p{font-size:11px}
@media(max-width:900px){.menu-toggle{display:block;margin-left:auto}nav{position:absolute;top:76px;left:0;right:0;display:none;flex-direction:column;gap:0;background:var(--paper);border-bottom:1px solid var(--ink)}nav.is-open{display:flex}nav a{min-height:50px;display:flex;align-items:center;padding:0 20px;border-top:1px solid var(--line)}header>a:last-child{margin-left:0}.hero,.lab,.studio,.contact,.position,.constraints,.material-story,.daylight,.case-detail,.responsibility,.deliverables,.engagement,.project-questions{grid-template-columns:1fr}.hero figure{min-height:60svh}.lab{grid-template-columns:1fr}.lab-tabs{grid-template-columns:repeat(4,1fr);grid-template-rows:1fr;border-right:0}.lab-tabs button{writing-mode:initial;transform:none;min-height:48px}.lab figure{min-height:500px}.works>div,.studio>div{grid-template-columns:1fr}.process ol{grid-template-columns:1fr 1fr}.constraints ol{grid-column:auto}.material-story figure{min-height:540px}.light-sequence,.meeting-rhythm{grid-template-columns:1fr}.light-sequence article,.meeting-rhythm article{min-height:250px}.responsibility-table>div,.deliverable-rows article{grid-template-columns:1fr 1fr}.responsibility-table em,.deliverable-rows p{grid-column:2}}
@media(max-width:600px){header{padding:0 16px;gap:14px}header>a:last-child{display:none}.hero-copy,.position,.section-lab,.constraints,.material-story,.daylight,.works,.case-detail,.studio,.responsibility,.process,.deliverables,.engagement,.project-questions,.contact{padding-left:18px;padding-right:18px}.hero h1,.position h2,.section-lab h2,.constraints h2,.material-story h2,.daylight h2,.works h2,.case-detail h2,.studio h2,.responsibility h2,.process h2,.deliverables h2,.engagement h2,.project-questions h2,.contact h2{font-size:50px}.hero figcaption{flex-direction:column;gap:6px}.lab-title{grid-template-columns:1fr}.lab figure{min-height:400px}.works{grid-template-columns:1fr}.works figure:last-child,.works>div,.studio>div{grid-column:auto}.works figcaption{flex-direction:column}.process ol{grid-template-columns:1fr}.constraints ol,.light-sequence,.meeting-rhythm{grid-template-columns:1fr}.constraints li{border-right:0;border-bottom:1px solid var(--line)}.material-story figure{min-height:380px}.responsibility-table>div,.deliverable-rows article,.position dl div,.case-detail dl div{grid-template-columns:1fr}.responsibility-table em,.deliverable-rows p{grid-column:auto}.contact{gap:40px}footer{flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Lab study: every view is stacked in one cell so switching tabs crossfades
   without resizing the block. The frame is pinned because figure only carries
   a min-height on narrow layouts, where height:100% would resolve to auto. */
.lab figure{position:relative}
.lab-frames{position:absolute;inset:0}
.lab-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s ease}
.lab-frame.is-active{opacity:1}
#viewCode,#viewTitle,#viewText,#viewDecision{display:grid;align-items:center}
#viewCode>span,#viewTitle>span,#viewText>span,#viewDecision>span{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .4s ease,visibility .4s}
#viewCode>span.is-active,#viewTitle>span.is-active,#viewText>span.is-active,#viewDecision>span.is-active{opacity:1;visibility:visible}