body{background:#eeeae1;color:#282e26}header{border-bottom:1px solid #b1b5a8}.brand{font-size:34px;letter-spacing:-2px}.brand span{margin-left:4px}.opener{display:grid;grid-template-columns:1fr 1fr;gap:22px 60px;padding:44px 3.5% 42px}.opener>.eyebrow{grid-column:1/-1}h1{font-size:clamp(68px,8.2vw,132px);font-weight:650;line-height:.91;letter-spacing:-.075em}.intro{max-width:360px;justify-self:end;align-self:end}.intro p{font-size:19px;line-height:1.5}.intro .link{width:100%;margin-top:28px}.panorama{margin:0 3.5%}.panorama img{height:clamp(360px,42vw,640px);object-position:50% 60%}.panorama figcaption{display:flex;justify-content:space-between;font-size:13px;padding-top:13px}.project{display:grid;grid-template-columns:4fr 6fr;gap:10%;padding:110px 3.5%}.project-text{padding-top:10px}h2{font-size:clamp(48px,5vw,80px);line-height:.98;letter-spacing:-.06em;font-weight:600;margin:30px 0}.project-text>p:not(.eyebrow){font-size:18px;line-height:1.6;max-width:40ch}.detail img{aspect-ratio:4/5;object-position:66% 50%}dl{margin:36px 0 0}dl div{display:grid;grid-template-columns:1fr 1.4fr;border-top:1px solid #a5ab9e;padding:15px 0;font-size:13px;gap:15px}dd{margin:0}.statement{background:#29352c;color:#eeeae1;padding:60px 3.5%;display:grid;grid-template-columns:1fr 2fr;gap:40px}.statement>p:not(.eyebrow){font-size:clamp(36px,4.6vw,70px);line-height:1.1;letter-spacing:-.04em}.statement .link{grid-column:2;max-width:300px}.footer{padding-top:44px;border-color:#b1b5a8}.footer strong{font-size:28px}.sample{margin-top:12px}@media(max-width:700px){.opener{grid-template-columns:1fr;padding:36px 20px 30px;gap:24px}h1{font-size:clamp(62px,14vw,94px)}.intro{max-width:none;justify-self:stretch}.intro p{font-size:17px;max-width:33ch}.intro .link{margin-top:18px}.panorama{margin:0 20px}.panorama img{height:350px;object-position:63% 50%}.panorama figcaption{font-size:11px;gap:12px}.project{grid-template-columns:1fr;padding:68px 20px;gap:32px}h2{margin:24px 0}.detail img{height:420px;aspect-ratio:auto}.statement{padding:44px 20px;grid-template-columns:1fr;gap:30px}.statement .link{grid-column:auto}.project-text>p:not(.eyebrow){font-size:17px}}
/* R3 / photographic field: the architecture owns the full first viewport. */
body{--paper:#eeeae1;--ink:#282e26;--olive:#29352c}
header{position:absolute;inset:0 0 auto;z-index:5;color:var(--paper);border-bottom:1px solid rgb(238 234 225 / .35);min-height:88px;background:linear-gradient(rgb(18 27 18 / .4),transparent)}
.opening{position:relative;isolation:isolate;min-height:100svh;background:var(--olive);color:var(--paper)}
.panorama{position:absolute;inset:0;margin:0;z-index:-2}
.panorama img{height:100%;width:100%;object-fit:cover;object-position:55% 52%}
.opening::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgb(16 24 17 / .30),transparent 35%,rgb(16 24 17 / .12) 50%,rgb(16 24 17 / .85)),linear-gradient(90deg,rgb(16 24 17 / .20),transparent 62%)}
.opener{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,330px);grid-template-rows:1fr auto;gap:24px 6%;padding:132px 3.5% 100px;min-height:max(680px,100svh)}
.opener>.eyebrow{grid-column:1/-1;align-self:start}
h1{font-size:clamp(82px,9.3vw,164px);line-height:.88;letter-spacing:-.068em;font-weight:600;align-self:end;text-wrap:balance}
.intro{max-width:330px;justify-self:end;align-self:end;padding-bottom:4px}
.intro p{font-size:17px;line-height:1.5}
.intro .link{margin-top:20px;min-height:48px;width:100%}
.panorama figcaption{position:absolute;z-index:3;inset:auto 3.5% 24px;display:flex;justify-content:space-between;border-top:1px solid rgb(238 234 225 / .45);padding-top:14px;font-size:12px;letter-spacing:.02em}
.project{padding-top:76px}
@media(min-width:701px) and (max-height:720px){h1{font-size:clamp(78px,8vw,128px)}.opener{min-height:680px;padding-top:120px}}
@media(max-width:700px){
 header{min-height:80px;padding:16px 20px}header .brand{font-size:32px}
 .opener{grid-template-columns:1fr;grid-template-rows:1fr auto auto;gap:24px;min-height:max(700px,100svh);padding:112px 20px 86px}
 .opener>.eyebrow{font-size:10px;letter-spacing:1px;max-width:25ch}
 h1{font-size:clamp(62px,16vw,106px);line-height:.91;letter-spacing:-.06em}
 .intro{justify-self:start;max-width:32ch;padding:0}.intro p{font-size:15px;line-height:1.45}.intro .link{margin-top:14px;min-height:44px;font-size:14px}
 .panorama img{height:100%;object-position:64% 50%}.panorama figcaption{inset:auto 20px 20px;font-size:10px;gap:12px;padding-top:12px}
 .opening::before{background:linear-gradient(180deg,rgb(16 24 17 / .4),transparent 25%,rgb(16 24 17 / .35) 42%,rgb(16 24 17 / .9))}
 .project{padding-top:56px}
}

/* Keep the project legend above the photographic scrim. */
.panorama{z-index:auto}.panorama img{position:absolute;inset:0;z-index:-2}

/* Independent QA delta: small label contrast only; image exposure is unchanged. */
.opener>.eyebrow{width:fit-content;max-width:100%;background:#29352c;color:#eeeae1;padding:8px 10px}

/* Final independent QA: the noninteractive photo must not intercept hero links. */
.panorama{pointer-events:none}