/* About the studio: an editorial photo essay, separate from its people. */
.story-page{background:var(--bg);color:var(--text);padding:125px var(--pad) 0}
.story-opening{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(0,1fr);gap:7vw;align-items:end;padding:48px 0 72px}
.story-opening h1{font-size:clamp(52px,6.6vw,170px);font-weight:400;letter-spacing:-.065em;line-height:1.05}
.story-opening h1 em{position:relative;display:inline-block;font-family:var(--serif);font-size:1.23em;font-weight:300;letter-spacing:-.035em}
.story-opening h1 svg{position:absolute;inset:36% -5% auto;width:110%;height:95%;fill:none;stroke:var(--accent-text);stroke-width:2;pointer-events:none}
.story-opening-note{padding-bottom:8px;max-width:35ch}
.story-opening-note .hand{color:var(--accent-text);font-size:23px;display:block;margin-bottom:22px;transform:rotate(-3deg)}
.story-opening-note p,.story-detail p,.story-ai>p,.story-invite p{font-size:clamp(16px,1.22vw,24px);line-height:1.75}
.story-link{display:inline-flex;align-items:center;gap:32px;font-size:12px;font-weight:500;border-bottom:1px solid var(--line);padding-bottom:10px;margin-top:26px}
.story-link>span{font-size:23px;line-height:1}.story-link:hover{color:var(--accent-text);border-color:currentColor}
.story-diptych{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(0,1fr);gap:22px}
.story-figure{min-width:0;margin:0}
.story-figure img{width:100%;height:clamp(340px,58svh,900px);object-fit:cover;background:var(--surface)}
.story-figure:first-child img{object-position:70% 48%}.story-figure:last-child img{object-position:50% 25%}
.story-figure figcaption{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-top:14px;font-size:10px;color:var(--muted)}
.story-figure figcaption .hand{font-size:21px;color:var(--accent-text)}
.story-approach{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:10vw;padding:100px 3vw 110px 0;align-items:start}
.story-statement{font-family:var(--serif);font-size:clamp(32px,3.25vw,76px);line-height:1.18;letter-spacing:-.025em}
.story-detail{padding-top:8px;max-width:52ch}
.story-ai{border-block:1px dashed var(--line);display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:10vw;padding:42px 3vw 42px 0;align-items:center}
.story-ai-title{display:flex;align-items:center;gap:35px;font-family:var(--serif);font-size:clamp(44px,5.5vw,110px);line-height:1.1;letter-spacing:-.04em}
.story-ai-title svg{width:70px;height:60px;fill:none;stroke:var(--accent-text);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.story-ai-title:hover{color:var(--accent-text)}
.story-invite{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:6vw;align-items:end;background:var(--accent);color:#fff3eb;padding:60px 3vw;margin-top:85px}
.story-invite h2{font-size:clamp(34px,3.8vw,90px);line-height:1.14;letter-spacing:-.05em}
.story-invite h2 em{font-family:var(--serif);font-size:1.2em;letter-spacing:-.025em}
.story-invite p{max-width:37ch}.story-invite .story-link{border-color:#e2b7c4}.story-invite .story-link:hover{color:#fff}
@media(min-width:2200px){
 .story-opening{padding-block:65px 100px;gap:8vw}
 .story-opening h1{font-size:clamp(150px,10svh,230px)}
 .story-opening-note{max-width:40ch}.story-opening-note .hand{font-size:34px}
 .story-opening-note p,.story-detail p,.story-ai>p,.story-invite p{font-size:clamp(25px,2svh,38px)}
 .story-link{font-size:clamp(17px,1.5svh,25px)}
 .story-figure figcaption{font-size:15px}.story-figure figcaption .hand{font-size:30px}
 .story-statement{font-size:clamp(60px,5.7svh,100px)}
 .story-approach{padding-block:120px 140px}.story-ai{padding-block:65px}
 .story-invite{padding-block:90px;margin-top:110px}.story-invite h2{font-size:clamp(80px,7svh,135px)}
}
@media(max-width:1000px){
 .story-opening{grid-template-columns:1.5fr 1fr;gap:25px;padding-bottom:45px}.story-opening h1{font-size:6.5vw}.story-opening-note .hand{font-size:19px}
 .story-opening-note p{font-size:14px}.story-approach{gap:6vw}.story-ai{gap:6vw}.story-invite{grid-template-columns:1fr;gap:30px}
}
@media(max-width:700px){
 .story-page{padding-top:103px}.story-opening{grid-template-columns:1fr;gap:38px;padding:30px 0 40px}
 .story-opening h1{font-size:clamp(36px,9.2vw,64px)}.story-opening-note{max-width:32ch;padding:0}.story-opening-note .hand{font-size:22px;margin-bottom:17px}
 .story-opening-note p,.story-detail p,.story-ai>p,.story-invite p{font-size:15px;line-height:1.7}
 .story-link{font-size:11px;gap:24px;margin-top:20px}
 .story-diptych{gap:12px;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}
 .story-figure img{height:clamp(220px,35svh,340px)}
 .story-figure figcaption{font-size:9px;line-height:1.4;align-items:flex-start;margin-top:10px;min-height:26px}.story-figure figcaption .hand{display:none}
 .story-approach{grid-template-columns:1fr;gap:30px;padding:45px 0 48px}.story-statement{font-size:30px;line-height:1.2}.story-detail{padding-top:0;max-width:none}
 .story-ai{grid-template-columns:1fr;gap:22px;padding:30px 0}.story-ai-title{font-size:45px;gap:30px}.story-ai-title svg{width:49px;height:45px}
 .story-invite{margin-top:45px;padding:28px 20px;gap:24px}.story-invite h2{font-size:clamp(29px,7.8vw,45px)}.story-invite h2 br{display:none}
 .story-invite .story-link{font-size:12px}
}
@media(max-width:360px){.story-opening h1{font-size:9.2vw}.story-statement{font-size:27px}.story-invite{padding-inline:16px}}
/* Set reading width at the text's own font size, including ultrawide. */
.story-opening-note,.story-detail{max-width:none}
.story-opening-note p{max-width:34em}
.story-detail p{max-width:56ch}
@media(min-width:2200px){
 .story-opening h1{font-size:clamp(150px,4.3vw,230px)}
 .story-figure:first-child img{object-position:70% 14%}
 .story-figure:last-child img{object-position:50% 4%}
}