/* Selected imagery: editorial compositions on the shared page grid. */
.imagery-gallery{padding-top:96px}
.imagery-heading{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;align-items:end;margin-bottom:40px}
.imagery-heading h2{grid-column:span 7;font-size:clamp(48px,5.5vw,80px);line-height:1.12;letter-spacing:-.035em;margin:0}
.imagery-heading>div{grid-column:9/13}
.imagery-heading p+p{margin-top:16px}
.imagery-index{display:flex;flex-wrap:wrap;gap:8px 24px;padding-block:16px;border-block:1px solid var(--divider);margin-bottom:56px}
.imagery-index a{min-height:44px;align-items:center}
.imagery-story{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;margin:0 0 96px;scroll-margin-top:104px}
.imagery-copy{grid-column:1/-1;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px 24px}
.imagery-copy h3{grid-column:1/6;font-size:clamp(30px,3vw,44px);line-height:1.15;align-self:start}
.imagery-copy .imagery-statement{grid-column:8/13;font-size:20px;line-height:28px;color:var(--text);margin:0}
.imagery-copy>p:not(.imagery-statement){grid-column:8/13;margin:0}
.imagery-copy .imagery-use{font-size:13px;line-height:20px;color:var(--muted)}
.imagery-figure{grid-column:1/-1;margin:8px 0 0;min-width:0}
.imagery-open{display:block;width:100%;overflow:clip;cursor:zoom-in;background:#08090b}
.imagery-open:focus-visible{outline:3px solid var(--accent);outline-offset:5px}
.imagery-open img{display:block;width:100%;height:auto}
.imagery-caption{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:8px;min-height:44px}
.imagery-caption>a{min-height:44px;white-space:nowrap}
.imagery-caption svg{width:16px;height:16px}
.imagery-guidance{grid-column:8/13;font-size:14px;line-height:22px;margin:0;color:var(--secondary)}
.imagery-offset .imagery-copy{grid-column:1/4;display:block;align-self:center}
.imagery-offset .imagery-copy h3{margin-bottom:24px}
.imagery-offset .imagery-copy p{margin-bottom:16px}
.imagery-offset .imagery-figure{grid-column:5/13;grid-row:1}
.imagery-offset .imagery-guidance{grid-column:5/13;max-width:64ch}
.image-theme-controls{flex-wrap:wrap;margin-top:4px}
.image-theme-controls button[aria-pressed=true]{color:var(--tint);border-bottom-color:var(--accent)}
.image-load-status:empty{display:none}
.image-load-status{margin:8px 0 0}
.imagery-duet{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.imagery-half{display:flex;flex-direction:column;gap:24px;min-width:0}
.imagery-half .imagery-copy{display:block}
.imagery-half .imagery-copy h3{font-size:32px;line-height:40px;margin-bottom:24px}
.imagery-half .imagery-copy p{margin-bottom:16px}
.imagery-half .imagery-figure{order:-1;margin:0}
.imagery-half .imagery-guidance{max-width:60ch}
.imagery-material{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;padding:48px 0;border-top:1px solid var(--divider)}
.imagery-material>h3{grid-column:1/6;font-size:32px;line-height:40px}
.imagery-material>div{grid-column:8/13}
.imagery-origins .art-pair{margin-top:32px}
.imagery-provenance{margin-top:24px;max-width:95ch}
#imagery-viewer{width:calc(100vw - 48px);max-width:1800px;max-height:calc(100dvh - 48px);padding:24px;border-radius:24px;overflow:auto;background:var(--page);color:var(--text)}
#imagery-viewer::backdrop{background:rgba(0,0,0,.85);backdrop-filter:blur(8px)}
.imagery-viewer-bar{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:16px}
.imagery-viewer-bar h3{font-size:20px;line-height:28px;outline:none}
.imagery-viewer-bar .actions{gap:8px}
.imagery-viewer-canvas{height:min(70dvh,900px);overflow:auto;display:grid;place-items:center;background:#08090b}
.imagery-viewer-canvas img{display:block;width:100%;height:100%;object-fit:contain;min-height:0;min-width:0}
.imagery-viewer-canvas.is-zoomed{display:block}
.imagery-viewer-canvas.is-zoomed img{width:var(--image-width);max-width:none;height:auto;object-fit:initial}
#imagery-viewer>.note{margin-top:16px}
html:has(#imagery-viewer[open]){overflow:hidden}
@media(min-width:1101px) and (max-width:1300px){header nav{gap:20px}}
@media(min-width:901px) and (max-width:1100px){header .header-inner nav{display:none}#menu{display:inline-flex}#mobile-nav{display:flex;flex-direction:column;gap:0;background:var(--surface);padding:16px 32px}#mobile-nav a{min-height:44px;display:flex;align-items:center}}
@media(max-width:1100px){.imagery-heading>div{grid-column:8/13}.imagery-offset .imagery-copy{grid-column:1/5}.imagery-offset .imagery-figure{grid-column:6/13}.imagery-offset .imagery-guidance{grid-column:6/13}.imagery-duet{gap:24px}}
@media(max-width:760px){
 .imagery-gallery{padding-top:64px}.imagery-heading{display:block}.imagery-heading h2{font-size:48px;margin-bottom:32px}.imagery-heading>div{max-width:60ch}
 .imagery-index{gap:0 20px;margin-bottom:40px}.imagery-index a{font-size:14px}
 .imagery-story{display:flex;flex-direction:column;gap:24px;margin-bottom:64px;scroll-margin-top:88px}
 .imagery-copy{display:block}.imagery-copy h3{font-size:32px;line-height:40px;margin-bottom:24px}.imagery-copy>p{margin-bottom:16px!important}
 .imagery-copy>p:last-child{margin-bottom:0!important}.imagery-figure{margin:0}.imagery-guidance{max-width:60ch}
 .imagery-duet{display:block}.imagery-half .imagery-figure{order:0}.imagery-half .imagery-copy h3{font-size:32px}
 .imagery-material{display:block;padding:32px 0}.imagery-material>h3{font-size:28px;line-height:36px;margin-bottom:24px}
 .imagery-caption{align-items:start;font-size:12px;line-height:18px}.imagery-caption>span{padding-top:12px}
 #imagery-viewer{width:calc(100vw - 24px);max-height:calc(100dvh - 24px);padding:16px;border-radius:16px}
 .imagery-viewer-bar{display:block}.imagery-viewer-bar h3{margin-bottom:12px}.imagery-viewer-bar .actions{gap:4px}.imagery-viewer-bar .btn{padding-inline:10px;font-size:14px}
 .imagery-viewer-canvas{height:55dvh}.image-theme-controls{gap:24px}
}

/* Composite only the near-black field; bright glass and its pastel hues remain intact. */
:root[data-theme="dark"] img[data-field="dark"]{filter:url(#dark-art-field)}
:root[data-theme="dark"] .imagery-open,:root[data-theme="dark"] .imagery-viewer-canvas{background:var(--page)}

/* Copy and artwork share a row; captions do not influence vertical centring. */
@media(min-width:761px){
 .imagery-offset{grid-template-rows:auto auto;row-gap:16px;align-items:center}
 .imagery-offset .imagery-copy{grid-column:1/5;grid-row:1}
 .imagery-offset .imagery-figure{grid-column:5/13;grid-row:1/3;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:subgrid;row-gap:16px;margin:0}
 .imagery-offset .imagery-open{grid-row:1;align-self:center;min-width:0}
 .imagery-offset .imagery-meta{grid-row:2}
 .imagery-offset .imagery-guidance{grid-column:5/13}
}
/* Crop empty field, retaining the entire silhouette; keep copy clear of the glass. */
#image-protein{align-items:center;margin-block:0 96px;grid-template-rows:auto auto;row-gap:16px}
.imagery-index:has(+ #image-protein){margin-bottom:16px}
#image-protein .imagery-copy{grid-column:9/13;grid-row:1;display:block;padding:0}
#image-protein .imagery-copy h3{font-size:clamp(36px,3.7vw,64px);line-height:1.12;margin-bottom:24px}
#image-protein .imagery-copy p{margin-bottom:24px}
#image-protein .imagery-copy .imagery-use{margin-bottom:0}
#image-protein .imagery-figure{grid-column:1/8;grid-row:1/3;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:subgrid;margin:0}
#image-protein .imagery-open{grid-row:1;align-self:center;min-width:0;aspect-ratio:1.45;background:var(--page)}
#image-protein .media-window{height:100%}
#image-protein .imagery-open img{height:100%;object-fit:cover;object-position:right center}
#image-protein .imagery-caption{grid-row:2;margin:0}
#image-protein .imagery-guidance{grid-column:9/13;align-self:start}
:root[data-theme=light] .fx-image-stage{background:var(--page)}
@media(max-width:760px){
 #image-protein{display:flex;gap:24px;margin-block:32px 64px}
 #image-protein .imagery-copy h3{font-size:36px}
 #image-protein .imagery-figure{display:block;width:100%}
 #image-protein .imagery-caption{margin-top:8px}
}

/* Documentary references retain their original colour in either theme. */
.photography-reference{margin:0 0 96px;scroll-margin-top:104px}
.photography-reference>.imagery-copy>h3{grid-column:1/8;grid-row:1/4;font-size:clamp(48px,5.5vw,80px);line-height:1.08;letter-spacing:-.035em}
@media(max-width:719px){.photography-reference>.imagery-copy>h3{font-size:48px;margin-bottom:24px}}
.photography-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin:40px 0 24px;align-items:start}
.photo-study{margin:0;min-width:0}
.photo-study .imagery-open{background:transparent}
.photo-study img{width:100%;height:auto;filter:none;mix-blend-mode:normal}
.photo-credit{display:inline-block;color:var(--muted);font-size:12px;line-height:18px;margin-top:12px;text-underline-offset:4px}
.photo-credit:hover{color:var(--text);text-decoration:underline}
.photo-study h4{font-size:24px;line-height:32px;letter-spacing:-.02em;margin:24px 0 12px}
.photo-study figcaption p{font-size:15px;line-height:24px}
@media(max-width:900px){.photography-grid{gap:24px}.photo-study h4{font-size:20px;line-height:28px}}
@media(max-width:719px){.photography-reference{margin-bottom:64px}.photography-grid{grid-template-columns:1fr;gap:40px;margin-top:32px}.photo-study h4{margin-top:16px;font-size:24px;line-height:32px}}
/* Frames round; free-standing forms keep their own complete contours. */
.imagery-figure .imagery-open,.photo-study .imagery-open{border-radius:var(--radius-image);overflow:hidden}
#image-humanoid .imagery-open{border-radius:var(--radius-feature)}
#image-protein .imagery-open,#image-computation .imagery-open,#image-variations .imagery-open,#image-biology .imagery-open{border-radius:0}
#image-protein .imagery-open{aspect-ratio:1.45}
#image-protein .imagery-open img{object-fit:cover;object-position:right center;height:100%}
#image-protein .media-window{height:100%}
#image-cutaway .imagery-open{background:transparent}
.camera-credit{font-size:12px;line-height:20px;margin-top:16px;overflow-wrap:anywhere}.camera-credit span{display:block;margin-top:4px}
.grid-art img{object-fit:contain}
#motion-image{max-width:960px;justify-self:center}
#motion-image img{object-fit:contain}
/* A single shared form breaks the section boundary and passes under live type. */
.imagery-material{position:relative;isolation:isolate;min-height:560px;margin:160px 0 96px;padding:64px 0;border:0;align-items:start;overflow:visible}
.imagery-material .signature-art{position:absolute;z-index:-1;top:-104px;left:6%;width:min(82%,1100px);margin:0;pointer-events:none}
.signature-art img{display:block;width:100%;height:auto}
.imagery-material>h3{grid-column:1/8;grid-row:1;font-size:clamp(56px,6.3vw,96px);line-height:1.04;letter-spacing:-.035em;max-width:9em;position:relative;text-shadow:0 4px 28px rgba(8,9,11,.7)}
.imagery-material>.signature-copy{grid-column:9/13;grid-row:1;position:relative;margin-top:112px}
.imagery-material>h3::before,.signature-copy::before{content:"";position:absolute;z-index:-1;inset:-32px;background:radial-gradient(ellipse,rgba(8,9,11,.83),rgba(8,9,11,0) 74%);pointer-events:none}
:root[data-theme=light] .imagery-material>h3{text-shadow:0 4px 28px rgba(247,248,245,.8)}
:root[data-theme=light] .imagery-material>h3::before,:root[data-theme=light] .signature-copy::before{background:radial-gradient(ellipse,rgba(247,248,245,.96),rgba(247,248,245,0) 74%)}
@media(max-width:1023px){.imagery-material{min-height:520px}.imagery-material>h3{font-size:64px;grid-column:1/9}.imagery-material>.signature-copy{grid-column:8/13;margin-top:200px}.imagery-material .signature-art{left:0;width:90%;top:-56px}}
@media(max-width:719px){.imagery-material{display:flex;flex-direction:column;min-height:0;margin:112px 0 64px;padding:0;gap:24px}.imagery-material>h3{font-size:48px;line-height:1.08;max-width:8em;z-index:1}.imagery-material .signature-art{position:relative;order:1;top:auto;left:auto;width:calc(100% + 48px);max-width:none;margin:-96px -24px -24px}.imagery-material>.signature-copy{order:2;margin-top:0}.imagery-material>h3::before{inset:-24px}.signature-copy::before{display:none}}
.imagery-material>h3,.imagery-material>.signature-copy{z-index:1;isolation:isolate}
.imagery-material>.signature-copy{text-shadow:0 2px 12px var(--page)}
.imagery-material .signature-art{width:min(74%,1000px);left:0}
.signature-copy::before{inset:-48px;background:radial-gradient(ellipse,rgba(8,9,11,.96) 25%,rgba(8,9,11,0) 76%)}
.imagery-half .imagery-open{background:var(--page)}
@media(max-width:719px){.imagery-material .signature-art{width:calc(100% + 48px);left:auto}}

/* Official photography: aligned frames with large, grounded editorial titles. */
.photography-grid{gap:32px;align-items:start}
.photo-scene{position:relative;isolation:isolate}
.photo-study .imagery-open{aspect-ratio:4/5;background:#111918}
.photo-study .media-window{height:100%;width:100%}
.photo-study .imagery-open img{height:100%;width:100%;object-fit:cover;object-position:50% 50%;filter:saturate(.78) contrast(1.09) brightness(.95)}
.photo-study:first-child .imagery-open img{object-position:72% 50%}
.photo-study:last-child .imagery-open img{object-position:73% 50%}
.photo-scene::after{content:"";position:absolute;inset:35% 0 0;z-index:1;border-radius:0 0 var(--radius-image) var(--radius-image);background:linear-gradient(0deg,rgba(5,13,12,.94),rgba(5,13,12,.74) 38%,transparent);pointer-events:none}
.photo-study .photo-scene h4{position:absolute;z-index:2;left:32px;right:20px;bottom:32px;margin:0;color:#f3f2ef;font-family:Manrope,Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;font-size:clamp(30px,3.2vw,56px);font-weight:500;line-height:1.1;letter-spacing:-.03em;pointer-events:none;text-shadow:0 2px 16px rgba(0,0,0,.25)}
.photo-study .photo-credit{margin:20px 0 12px;color:var(--accent);font-size:13px;line-height:20px}
.photo-study figcaption p{margin:0;max-width:52ch;color:var(--secondary)}
@media(min-width:720px) and (max-width:1000px){.photography-grid{gap:24px}.photo-study .photo-scene h4{left:20px;bottom:24px;font-size:30px}}
@media(max-width:719px){.photography-grid{gap:40px}.photo-study .imagery-open{aspect-ratio:4/5}.photo-study .photo-scene h4{left:24px;bottom:24px;font-size:40px}.photo-study .photo-credit{margin-top:16px}}
/* Keep the closing copy's soft contrast field inside the tablet viewport. */
@media(min-width:720px) and (max-width:1023px){.signature-copy::before{right:0}}
/* The dark motion study keeps its complete frame; light/reduced motion use the companion still. */
.signature-art video{display:none;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;mix-blend-mode:lighten}
.has-signature-video .signature-art{background:var(--page);isolation:isolate}
.has-signature-video .signature-art video{display:block}
.has-signature-video .signature-art img{display:none}
.imagery-material.has-signature-video .signature-art{width:min(88%,1200px);left:-5%;top:-48px}
.signature-playback{display:flex;align-items:center;flex-wrap:wrap;gap:16px;margin-top:24px}
.signature-playback[hidden]{display:none}
.signature-playback span{font-size:13px;color:var(--secondary)}
@media(max-width:719px){.imagery-material.has-signature-video .signature-art{width:calc(100% + 48px);left:auto;top:auto;margin:-48px -24px 0}}
/* Match the opening: heading and explanation at left, full artwork at right. */
.imagery-material{align-content:start;row-gap:32px;min-height:680px;scroll-margin-top:104px}
.imagery-material>h3{grid-column:1/9;grid-row:1;margin:0}
.imagery-material>.signature-copy{grid-column:1/6;grid-row:2;margin-top:0;max-width:42ch;text-shadow:none}
:root .imagery-material>.signature-copy::before{display:none}
.imagery-material .signature-art,.imagery-material.has-signature-video .signature-art{width:72%;max-width:1200px;left:auto;right:calc(-1 * var(--gutter));top:0}
@media(min-width:720px) and (max-width:1023px){
 .imagery-material{min-height:650px}
 .imagery-material>.signature-copy{grid-column:1/7;max-width:36ch}
}
@media(min-width:720px) and (max-width:1439px){
 .imagery-material .signature-art,.imagery-material.has-signature-video .signature-art{width:76%;top:50%;transform:translateY(-50%)}
 :root .imagery-material>.signature-copy::before{display:block;inset:-72px -100px -72px -32px;background:radial-gradient(ellipse at 20% 50%,color-mix(in srgb,var(--page) 72%,transparent),color-mix(in srgb,var(--page) 45%,transparent) 40%,transparent 74%);border:0;box-shadow:none;mask-image:none}
}
@media(min-width:720px) and (max-width:1023px){.imagery-material .signature-art,.imagery-material.has-signature-video .signature-art{width:72%}}
@media(max-width:719px){
 .imagery-material{min-height:0;gap:24px}
 .imagery-material>h3{order:0}
 .imagery-material>.signature-copy{order:1;max-width:none}
 .imagery-material .signature-art,.imagery-material.has-signature-video .signature-art{order:2;top:auto;right:auto;left:auto;width:calc(100% + 48px);margin:0 -24px}
}

/* Preserve the vanishing point in the official corridor photograph. */
.photo-study:nth-child(2) .imagery-open img{object-position:65% 50%}

@media(min-width:761px) and (max-width:1023px){#image-protein .imagery-copy,#image-protein .imagery-guidance{grid-column:8/13}#image-protein .imagery-copy h3{font-size:36px}}

/* Reversible display-only brand glaze. Real photographs and source downloads are untouched.
   SourceGraphic isolates blending to the artwork; dark field cleanup runs last. */
:root{--concept-tone:url(#brand-art-light)}
:root[data-theme="dark"]{--concept-tone:url(#brand-art-dark)}
img[src*="assets/imagery/"]:not(.fx-artwork img){filter:var(--concept-tone)}
img[src*="assets/imagery/"][data-field="light"]{filter:url(#brand-art-light)}
:root[data-theme="dark"] img[src*="assets/imagery/"][data-field="dark"]{filter:url(#brand-art-dark) url(#dark-art-field)}
/* Preserve the natural skin in the fictional humanoid study. */
:root img[src*="assets/imagery/humanoid-"]:not(.fx-artwork img){filter:url(#brand-art-gentle)}
.fx-image-stage{filter:var(--concept-tone)}
:root[data-theme="dark"] .fx-image-stage{filter:url(#brand-art-dark) url(#dark-art-field)}
.fx-artwork>.fx-still,.fx-artwork>div>.fx-still{filter:var(--concept-tone)}

/* The motion study carries the same brand tone as the conceptual stills. */
.signature-art video{filter:var(--concept-tone)}
:root[data-theme="dark"] .signature-art video{filter:url(#brand-art-dark) url(#dark-art-field)}