:root{--paper:#f4f1e9;--paper-dark:#e9e5da;--ink:#172c32;--navy:#122b32;--muted:#5d6966;--green:#51633c;--lime:#bec892;--terracotta:#8c4c3d;--line:#d2d2c5;--serif:Georgia,'Times New Roman',serif;--sans:Arial,Helvetica,sans-serif;--max:1240px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.65 var(--sans);-webkit-font-smoothing:antialiased}button,input,textarea,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default;opacity:.5}a{color:inherit;text-underline-offset:5px}img{display:block;max-width:100%;height:auto}button{color:inherit}p{margin:0 0 1em}h1,h2,h3,h4{font-family:var(--serif);font-weight:400;line-height:1.04;margin:0}h2{font-size:clamp(38px,4.65vw,67px);letter-spacing:-2px}h3{font-size:32px;line-height:1.15}h4{font-size:35px;line-height:1.15}button:focus-visible,a:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid #95683b;outline-offset:5px}::selection{background:var(--lime);color:var(--ink)}.wrap{width:min(var(--max),calc(100% - 96px));margin:0 auto}.site-header{padding:22px 48px;background:var(--paper);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:28px;position:sticky;top:0;z-index:20;min-height:86px}.wordmark{font:800 14px/1.13 var(--sans);letter-spacing:1px;text-decoration:none;position:relative;padding-right:23px;flex-shrink:0}.wordmark span:not(.wordmark-dot){font-weight:500;font-size:11px;letter-spacing:1.2px}.wordmark-dot{position:absolute;width:11px;height:11px;background:var(--green);border-radius:50%;right:1px;top:5px}.site-header nav{display:flex;gap:27px;font-size:13px}.site-header nav a{text-decoration:none;white-space:nowrap}.site-header nav a:hover{color:var(--terracotta)}.languages{display:flex;align-items:center;gap:9px;flex-shrink:0;font-size:12px}.languages button{background:none;border:0;border-bottom:1px solid transparent;font-size:12px;font-weight:600;padding:8px 4px;min-height:42px;min-width:32px}.languages button[aria-pressed=true]{border-color:var(--ink)}.languages span{color:#a4aaa0}.menu-button{display:none}.skip-link{position:fixed;top:-100px;left:20px;z-index:1000;background:var(--ink);color:white;padding:10px 20px}.skip-link:focus{top:10px}.eyebrow,.section-index,.kicker{font-size:11px;font-weight:600;letter-spacing:1.45px;text-transform:uppercase;line-height:1.7}.eyebrow{display:flex;gap:12px;align-items:center}.small-dot{width:6px;height:6px;border-radius:50%;background:var(--green);display:inline-block}.hero{padding-top:44px}.hero-heading{display:grid;grid-template-columns:1.24fr 1fr;gap:70px;align-items:end;margin:40px 0 44px}.hero h1{font-size:clamp(76px,8.4vw,125px);letter-spacing:-6px;line-height:.92}.hero h1 em{font-weight:400;color:var(--green)}.title-stop{color:var(--terracotta)}.hero-intro{font-size:17px;max-width:460px;padding-bottom:4px}.hero-intro .kicker{margin-bottom:16px;font-size:11px;letter-spacing:1.3px}.hero-actions{display:flex;flex-direction:column;align-items:flex-start;gap:9px;margin-top:23px}.text-link{background:transparent;border:0;border-bottom:1px solid currentColor;border-radius:0;padding:3px 0;text-decoration:none;font-size:13px;line-height:1.5;display:inline-block;text-align:left;color:inherit;max-width:100%;width:fit-content}.text-link:hover{color:var(--terracotta)}.hero-image{margin:0}.image-button{border:0;padding:0;margin:0;background:transparent;display:block;width:100%;cursor:zoom-in;text-align:left}.hero-image img{width:100%;height:auto}.hero-image figcaption,figure.source-diagram figcaption{display:flex;justify-content:space-between;gap:15px;padding-top:12px;font-size:11px;line-height:1.5;color:var(--muted)}.caption-divider{margin:0 10px;color:#a4aaa0}.opening-note{display:grid;grid-template-columns:1fr 2fr;gap:45px;align-items:start;margin:64px 0 90px;padding-top:25px;border-top:1px solid var(--line)}.opening-note p{font:29px/1.5 var(--serif);letter-spacing:-.3px;margin:0;max-width:800px}.section-top{display:flex;justify-content:space-between;gap:20px;align-items:center}.quiet{font-size:12px;color:var(--muted)}.process-section{background:var(--navy);color:var(--paper);padding:70px 0 80px}.process-section .quiet{color:#b6c0b8}.process-section .section-index{color:var(--lime)}.section-heading{display:grid;grid-template-columns:1.1fr 1fr;gap:75px;align-items:end;margin:32px 0 45px}.section-heading p{max-width:510px;margin:0;line-height:1.7}.stage-layout{display:grid;grid-template-columns:360px 1fr;gap:64px;padding-top:20px}.stage-list{display:flex;flex-direction:column}.stage-button{padding:17px 14px 17px 0;background:none;border:0;border-bottom:1px solid #3f5357;text-align:left;color:#c8d0c5;display:grid;grid-template-columns:42px 1fr 20px;gap:4px;font-size:15px;align-items:center;line-height:1.4;min-height:62px}.stage-button .num{font-size:11px;font-weight:600;color:#aebb98}.stage-button[aria-selected=true]{color:var(--paper);border-color:var(--lime)}.stage-button[aria-selected=true] .arrow{color:var(--lime)}.stage-button:hover{background:#1e373d}.stage-panel{min-height:380px;background:#1b353b;padding:34px 38px}.stage-panel .eyebrow{color:var(--lime);margin:0 0 24px}.stage-panel h3{font-size:38px;line-height:1.12;margin-bottom:20px}.stage-panel p{font-size:16px;line-height:1.8;color:#e2e5dc}.stage-panel .stage-focus{padding-top:20px;margin-top:24px;border-top:1px solid #455b5c;font-size:14px;color:var(--lime)}.stage-panel .stage-evidence{font-size:11px;letter-spacing:.3px;color:#b7c4be;margin:12px 0 0}.process-source{display:flex;justify-content:space-between;gap:24px;font-size:11px;line-height:1.8;color:#c5cdc2;margin:22px 0 0}.process-source a{font-size:11px;white-space:nowrap}.process-section .text-link:hover{color:var(--lime)}.curation-lab{border-top:1px solid #4b5a58;margin-top:65px;padding-top:48px}.lab-heading{display:grid;grid-template-columns:1.1fr 1fr;gap:70px;align-items:end}.lab-heading .kicker{color:var(--lime);margin-bottom:16px;display:block}.lab-heading h3{font-size:43px;letter-spacing:-1px}.lab-heading p{font-size:15px;margin:0;color:#d6dcd3}.lab-controls{display:flex;align-items:center;justify-content:space-between;gap:25px;margin:30px 0 22px}.lab-controls label{font-size:13px}.lab-controls select{max-width:490px;width:100%;padding:12px 40px 12px 14px;background:var(--paper);border:0;color:var(--ink);font-size:14px;border-radius:0}.lab-body{display:grid;grid-template-columns:1.35fr 1fr;gap:46px;align-items:center}.source-diagram{margin:0;min-width:0}.source-diagram img{width:100%;height:auto}.source-diagram figcaption{color:#c9d3c6!important}.source-diagram figcaption .text-link{font-size:11px;white-space:nowrap}.lab-reading .eyebrow{color:var(--lime);font-size:10px;margin-bottom:19px}.lab-reading h4{margin-bottom:20px;font-size:35px}.lab-reading p{font-size:15px;line-height:1.75;color:#dce1d7}.lab-reading p.small{color:#b7c4be;font-size:12px}.lab-reading .text-link{display:block;margin-top:14px}.works-section{padding-top:78px;padding-bottom:88px}.work-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:42px 27px;align-items:start}.work-tile{min-width:0;margin:0}.work-tile:nth-child(1){grid-column:span 2}.work-tile:nth-child(10){grid-column:span 2}.work-tile a{display:block;text-decoration:none}.work-tile .image-well{height:247px;display:flex;align-items:center;background:var(--paper-dark);overflow:hidden}.work-tile:nth-child(1) .image-well,.work-tile:nth-child(10) .image-well{height:247px;background:var(--paper-dark)}.work-tile img{object-fit:contain;width:100%;height:100%;transition:filter .25s}.work-tile a:hover img{filter:brightness(1.05)}.work-tile figcaption{padding-top:13px;display:grid;grid-template-columns:28px 1fr 20px;gap:7px}.work-number{font-size:11px;color:var(--terracotta);padding-top:4px}.work-tile h3{font:21px/1.25 var(--serif);letter-spacing:-.3px}.work-tile .artist-name{font-size:12px;color:var(--muted);line-height:1.5;margin-top:7px}.work-tile .tile-arrow{font-size:19px}.use-section{background:var(--paper-dark);padding:70px 0}.use-layout{display:grid;grid-template-columns:1fr 1fr;gap:100px;margin-top:40px}.use-layout>div>p{margin-top:26px;max-width:470px}.use-layout h2 em{color:var(--green)}.use-steps article{display:grid;grid-template-columns:35px 1fr;gap:18px;border-top:1px solid #c3c7b7;padding:24px 0}.use-steps article>span{font-size:12px;color:var(--terracotta);padding-top:5px}.use-steps h3{font-size:27px;margin-bottom:13px}.use-steps p{font-size:15px;line-height:1.75;margin:0}.source-note{font-size:11px;color:var(--muted);line-height:1.7;margin:32px 0 0}.people-section{padding:78px 0}.team-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px}.team-grid article{border-top:1px solid var(--line);padding-top:24px}.team-number{font:italic 32px var(--serif);color:var(--green);margin-bottom:20px}.team-grid h3{font-size:34px;margin-bottom:16px}.role{font-size:11px;text-transform:uppercase;letter-spacing:1px;min-height:44px;font-weight:600;color:var(--terracotta);line-height:1.6}.team-grid article>p:not(.role){font-size:15px}.affiliation{font-size:12px;color:var(--muted)}.artists-heading{margin-top:65px;border-top:1px solid var(--line);padding-top:30px;display:flex;justify-content:space-between;gap:30px;align-items:end}.artists-heading h3{font-size:32px}.small{font-size:12px;line-height:1.7}.artists-heading p{max-width:340px;margin:0}.artist-directory{display:grid;grid-template-columns:1fr 1fr;column-gap:55px;margin-top:25px}.artist-item{border-bottom:1px solid var(--line);padding:15px 0}.artist-item summary{list-style:none;display:grid;grid-template-columns:30px 1fr 20px;align-items:start;gap:8px;cursor:pointer;min-height:42px}.artist-item summary::-webkit-details-marker{display:none}.artist-item summary .num{font-size:10px;color:var(--terracotta);padding-top:4px}.artist-item summary strong{font-weight:400;font-size:15px}.artist-item summary .plus{font-size:20px;line-height:1.4}.artist-item[open] summary .plus{transform:rotate(45deg)}.artist-bio{padding-left:38px;font-size:14px;line-height:1.75;padding-top:13px}.artist-bio-links{display:flex;flex-wrap:wrap;column-gap:18px;row-gap:12px;margin-top:10px}.artist-bio-links a,.artist-bio-links button{font-size:12px}.reflection-section{background:var(--green);color:var(--paper);padding:75px 0}.reflection-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:85px}.reflection-layout h2{margin:28px 0 24px}.reflection-layout p{max-width:490px}.button{display:inline-flex;align-items:center;padding:13px 21px;font-size:13px;text-decoration:none;border:1px solid currentColor;background:none;gap:15px}.button.light{color:var(--paper);margin:12px 0 15px}.button:hover{background:var(--paper);color:var(--green)}.reflection-layout .small{color:#e5e8da;font-size:11px}.private-note{padding-top:48px}.private-note label{font:26px/1.3 var(--serif);display:block;margin-bottom:22px}.private-note textarea{resize:vertical;border:1px solid #a3b085;background:#ffffff0b;color:var(--paper);width:100%;min-height:200px;border-radius:0;padding:20px;font:18px/1.7 var(--serif)}.private-note textarea::placeholder{color:#dce2cb}.note-actions{display:flex;justify-content:space-between;gap:20px;margin:16px 0 18px}.reflection-section .text-link:hover{color:#e5d1a3}.resources-section{padding-top:75px;padding-bottom:76px}.resources-section h2{margin:33px 0 35px;font-size:clamp(30px,3.2vw,45px);letter-spacing:-1px}.resource-list>a{padding:24px 0;display:flex;justify-content:space-between;align-items:center;gap:25px;border-top:1px solid var(--line);text-decoration:none}.resource-list>a:last-child{border-bottom:1px solid var(--line)}.resource-list strong{display:block;font:27px/1.2 var(--serif)}.resource-list small{font-size:12px;display:block;margin-top:8px;color:var(--muted)}.resource-list>a>span:last-child{font-size:30px;color:var(--green)}.resource-list>a:hover strong{color:var(--terracotta)}.credit-details{margin-top:35px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.credit-details summary{padding:21px 0;font-size:15px;cursor:pointer}.credit-content{max-width:890px;padding:0 0 30px;font-size:14px;overflow-wrap:anywhere}.credit-content h3{font-family:var(--sans);font-size:13px;font-weight:bold;margin:25px 0 12px}.exhibition-context{margin-top:45px;display:grid;grid-template-columns:1fr 1fr;gap:85px}.exhibition-context h3{font-size:25px;line-height:1.2;margin-bottom:18px}.exhibition-context p{font-size:14px}.partner-logos{display:flex;align-items:center;gap:26px;margin-top:30px;flex-wrap:wrap}.partner-logos img{object-fit:contain;max-width:150px;max-height:55px}.partner-logos img:nth-child(2){width:80px;height:80px;max-height:80px;mix-blend-mode:multiply}.partner-logos img:nth-child(3){max-height:65px;width:75px}footer{padding:48px 0;background:var(--navy);color:var(--paper)}.footer-inner{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:40px;align-items:start}.footer-title{font:29px/1.3 var(--serif)}.footer-title em{color:var(--lime)}.footer-inner p{font-size:13px}.footer-end{text-align:right;font-size:13px}.footer-end small{display:block;font-size:10px;margin-top:20px;color:#b7c4be}.art-dialog{position:fixed;inset:0;width:min(1160px,calc(100% - 64px));max-width:none;max-height:94dvh;border:none;padding:0;background:var(--paper);color:var(--ink);margin:auto;box-shadow:0 20px 100px #0005}.art-dialog::backdrop,.image-dialog::backdrop{background:#061c23d9;backdrop-filter:blur(4px)}.dialog-top{display:flex;justify-content:space-between;align-items:center;gap:20px;position:sticky;top:0;background:var(--paper);padding:15px 28px;border-bottom:1px solid var(--line);z-index:2}.dialog-top>span{font-size:11px;letter-spacing:1.2px;text-transform:uppercase}.dialog-tools{display:flex;gap:7px;align-items:center}.small-button,.close-button{background:none;border:0;min-width:44px;min-height:44px;font-size:24px;line-height:1;padding:8px}.close-button{font-size:35px;margin-left:12px}.dialog-body{padding:34px 48px 28px}.art-heading h2{font-size:48px;line-height:1.1;letter-spacing:-1.8px}.art-heading .kicker{color:var(--muted);margin-bottom:14px}.art-tabs{margin:28px 0 24px;display:flex;gap:25px;border-bottom:1px solid var(--line);overflow-x:auto}.art-tab{background:none;border:0;border-bottom:2px solid transparent;padding:12px 0;font-size:13px;white-space:nowrap;min-height:44px}.art-tab[aria-selected=true]{border-color:var(--green);color:var(--green);font-weight:bold}.art-panel-image{margin:0}.art-panel-image img{max-height:60vh;object-fit:contain;width:100%;background:var(--paper-dark)}.art-panel-image figcaption{font-size:11px;color:var(--muted);margin-top:11px}.encounter-note{display:flex;gap:30px;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:22px;margin-top:25px}.encounter-note p{font:24px/1.5 var(--serif);margin:0;max-width:650px}.narrative-layout{display:grid;grid-template-columns:1fr 1.25fr;gap:35px;align-items:start}.narrative-layout>figure{margin:0;position:sticky;top:95px}.narrative-layout>figure img{width:100%;height:auto}.narrative-text{font:20px/1.75 var(--serif)}.narrative-text p{margin-bottom:1.15em}.narrative-text .text-source{font:11px/1.6 var(--sans);color:var(--muted);border-top:1px solid var(--line);padding-top:17px}.artist-narrative-label{font:11px/1.5 var(--sans);letter-spacing:1px;text-transform:uppercase;color:var(--terracotta);margin-bottom:19px}.work-process img{max-height:65vh;object-fit:contain;width:100%;background:white}.work-process .process-description{font-size:15px;margin:23px 0}.work-process .small{color:var(--muted)}.prompt-layout{display:grid;grid-template-columns:1fr 1fr;gap:45px;align-items:start}.prompt-layout .prompt-note{font-size:14px;color:var(--muted)}.prompt-list{padding:0;margin:0;list-style:none}.prompt-list li{font:25px/1.6 var(--serif);border-top:1px solid var(--line);padding:20px 0}.prompt-list li:first-child{border:0;padding-top:0}.prompt-cta{padding:28px;background:var(--paper-dark)}.prompt-cta h3{font-size:28px;margin-bottom:17px}.prompt-cta p{font-size:14px}.dialog-bottom{display:flex;align-items:center;gap:25px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:20px;margin-top:32px}.image-dialog{border:0;padding:20px;background:var(--paper);max-width:96vw;max-height:96dvh;margin:auto;inset:0}.image-dialog>div{overflow:auto;max-height:80vh}.image-dialog img{max-width:none;width:min(1400px,calc(100vw - 75px));height:auto;max-height:none}.image-dialog>.close-button{position:sticky;float:right;top:0;z-index:3;background:var(--paper)}.image-dialog p{font-size:12px;margin-top:12px}.screen-reader-only{position:absolute!important;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.scroll-lock{overflow:hidden}
@media(min-width:1500px){.hero h1{font-size:132px}.hero-heading{gap:105px}}
@media(max-width:1080px){.site-header{padding:16px 28px;gap:18px}.site-header nav{gap:17px;font-size:12px}.wrap{width:calc(100% - 64px)}.hero-heading{gap:40px}.hero h1{font-size:clamp(74px,9vw,108px);letter-spacing:-4px}.hero-intro{font-size:15px}.stage-layout{grid-template-columns:310px 1fr;gap:35px}.stage-panel{padding:30px}.section-heading{gap:45px}.lab-body{gap:30px}.lab-heading{gap:40px}.work-tile .image-well,.work-tile:nth-child(1) .image-well,.work-tile:nth-child(10) .image-well{height:200px}.use-layout{gap:55px}.team-grid{gap:25px}.team-grid h3{font-size:29px}.role{font-size:10px}.reflection-layout{gap:45px}.exhibition-context{gap:45px}.art-dialog{width:calc(100% - 40px)}}
@media(max-width:820px){.site-header{min-height:76px}.menu-button{display:block;background:none;border:0;font-size:13px;padding:8px 10px;margin-left:auto;min-height:44px}.site-header nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--paper);padding:22px 32px;border-bottom:1px solid var(--line);font-size:16px;flex-direction:column;gap:12px}.site-header nav.menu-open{display:flex}.site-header nav a{padding:7px 0}.hero-heading{grid-template-columns:1fr;gap:32px;margin:32px 0}.hero h1{font-size:105px;letter-spacing:-5px}.hero-intro{max-width:650px;font-size:16px}.hero-intro .kicker br{display:block}.hero-actions{flex-direction:row;gap:30px;flex-wrap:wrap}.opening-note{grid-template-columns:1fr;gap:20px;margin:40px 0 60px}.opening-note p{font-size:27px}.section-heading{grid-template-columns:1fr;gap:26px}.section-heading p{max-width:650px}.stage-layout{grid-template-columns:1fr;gap:20px}.stage-list{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}.stage-panel{min-height:300px}.process-source{flex-direction:column;gap:12px}.lab-heading{grid-template-columns:1fr;gap:26px}.lab-body{grid-template-columns:1fr;gap:30px}.lab-reading{max-width:650px}.lab-reading .text-link{display:inline-block;margin-right:20px}.lab-controls{flex-direction:column;align-items:flex-start;gap:12px}.lab-controls select{max-width:none}.work-grid{grid-template-columns:1fr 1fr;gap:35px 24px}.work-tile:nth-child(10){grid-column:auto}.work-tile:nth-child(1) .image-well{height:auto}.work-tile:nth-child(1) .image-well img{height:auto}.work-tile .image-well,.work-tile:nth-child(10) .image-well{height:230px}.use-layout{grid-template-columns:1fr;gap:35px}.use-layout>div>p{max-width:650px}.team-grid{grid-template-columns:1fr;gap:35px}.role{min-height:0;font-size:11px}.team-grid article>p:not(.role){max-width:650px}.team-number{float:right}.team-grid h3{font-size:32px}.reflection-layout{grid-template-columns:1fr;gap:22px}.private-note{padding-top:10px}.exhibition-context{grid-template-columns:1fr}.footer-inner{grid-template-columns:1fr 1fr}.footer-title{grid-column:span 2}.art-dialog{width:calc(100% - 24px);max-height:96dvh}.dialog-body{padding:25px}.art-heading h2{font-size:38px}.narrative-layout{grid-template-columns:1fr}.narrative-layout>figure{position:static}.narrative-layout>figure img{max-height:240px;object-fit:contain}.prompt-layout{grid-template-columns:1fr;gap:25px}.encounter-note{flex-direction:column;align-items:start}.artists-heading{display:block}.artists-heading p{margin-top:18px;max-width:none}.partner-logos{gap:30px}.section-top>.quiet{display:none}}
@media(max-width:520px){.wrap{width:calc(100% - 40px)}.site-header{padding:13px 20px;gap:12px}.wordmark{font-size:12px}.wordmark span:not(.wordmark-dot){font-size:10px}.languages{gap:4px}.hero{padding-top:28px}.hero .eyebrow{font-size:9px;letter-spacing:.8px}.hero h1{font-size:clamp(60px,16vw,91px);letter-spacing:-3.5px}.hero-heading{gap:24px}.hero-intro{font-size:15px}.hero-actions{flex-direction:column;gap:11px;margin-top:19px}.hero-image figcaption{flex-direction:column;gap:3px;font-size:10px}.opening-note p{font-size:24px}.opening-note{margin-bottom:50px}h2{font-size:43px;letter-spacing:-1.6px}.section-index{font-size:10px;letter-spacing:1.1px}.process-section{padding:48px 0}.section-heading{margin-top:25px;margin-bottom:28px;gap:25px}.section-heading p{font-size:15px}.stage-list{column-gap:12px}.stage-button{grid-template-columns:23px 1fr;gap:4px;font-size:12px;min-height:65px;padding:12px 2px}.stage-button .arrow{display:none}.stage-button .num{font-size:10px}.stage-panel{padding:24px;min-height:365px}.stage-panel h3{font-size:30px}.stage-panel p{font-size:14px}.stage-panel .stage-focus{font-size:13px;margin-top:18px;padding-top:15px}.stage-panel .stage-evidence{font-size:10px}.curation-lab{margin-top:42px;padding-top:32px}.lab-heading h3{font-size:34px}.lab-reading h4{font-size:29px}.lab-heading p,.lab-reading p{font-size:14px}.lab-body{gap:27px}.lab-controls select{font-size:12px}.works-section{padding-top:50px;padding-bottom:55px}.work-grid{grid-template-columns:1fr;gap:35px}.work-tile:nth-child(1),.work-tile:nth-child(10){grid-column:auto}.work-tile .image-well,.work-tile:nth-child(10) .image-well{height:auto;background:transparent}.work-tile img{height:auto}.work-tile h3{font-size:26px}.work-tile .artist-name{font-size:12px}.use-section,.people-section,.reflection-section,.resources-section{padding-top:50px;padding-bottom:50px}.use-steps article{grid-template-columns:27px 1fr;gap:12px}.use-steps h3{font-size:26px}.use-steps p{font-size:14px}.artist-directory{grid-template-columns:1fr}.artists-heading{margin-top:40px}.team-grid article>p:not(.role){font-size:14px}.team-grid{gap:29px}.private-note textarea{font-size:18px;min-height:180px}.resource-list strong{font-size:25px}.resource-list small{font-size:11px}.exhibition-context{gap:26px;margin-top:30px}.footer-inner{grid-template-columns:1fr;gap:22px}.footer-title{grid-column:auto}.footer-end{text-align:left}.footer-inner p{margin:0}.footer-end small{margin-top:16px}.art-dialog{width:100%;max-height:100dvh;height:100dvh;margin:0;inset:0}.dialog-top{padding:8px 15px}.dialog-top>span{font-size:9px;letter-spacing:.8px}.dialog-body{padding:25px 20px}.art-heading h2{font-size:35px;letter-spacing:-1px}.art-heading .kicker{font-size:10px}.art-tabs{gap:22px;margin-top:20px}.art-tab{font-size:12px}.narrative-text{font-size:19px}.encounter-note p{font-size:23px}.prompt-list li{font-size:23px}.prompt-cta{padding:22px}.image-dialog{padding:10px}.image-dialog img{min-width:900px}.image-dialog>div{max-height:75dvh}.image-dialog p{max-width:calc(100vw - 50px);font-size:11px}.art-panel-image img{max-height:53dvh}.partner-logos img{max-width:135px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
@media print{.site-header,button,.art-dialog,.image-dialog,.languages,textarea,.note-actions{display:none!important}body{background:white;color:black}.wrap{width:100%}.process-section,.reflection-section,footer{background:white;color:black}.work-grid{grid-template-columns:1fr 1fr}.work-tile{break-inside:avoid}.work-tile:nth-child(1),.work-tile:nth-child(10){grid-column:auto}.stage-panel,.lab-reading{color:black}.stage-panel p,.lab-reading p{color:black}}

.process-documentation{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center;margin-top:52px;padding-top:40px;border-top:1px solid #42595b}.process-documentation figure{margin:0}.process-documentation img{width:100%;height:auto}.process-documentation figcaption{font-size:11px;color:#c7d0c3;line-height:1.7;margin-top:12px}.process-documentation .eyebrow{color:var(--lime);margin-bottom:24px}.process-documentation h3{font-size:39px;margin-bottom:25px;line-height:1.13}.process-documentation p{font-size:15px;line-height:1.8;color:#dce1d7}.process-documentation p.small{font-size:11px;color:#bdc8bb}.diagram-transcript{margin:22px 0 10px;border-top:1px solid #667565;padding-top:15px}.diagram-transcript summary{font-size:12px;cursor:pointer}.diagram-transcript p{margin-top:15px;font-size:13px}.work-process .diagram-transcript{border-color:var(--line);margin-bottom:25px}.work-process .diagram-transcript p{font-size:14px}.source-diagram figcaption button{min-height:30px}
@media(max-width:820px){.process-documentation{gap:30px}.process-documentation h3{font-size:32px}.process-documentation .eyebrow{font-size:9px}.process-documentation p{font-size:13px}}
@media(max-width:600px){.process-documentation{grid-template-columns:1fr;margin-top:35px;gap:28px}.process-documentation .eyebrow{margin-bottom:17px}.process-documentation h3{font-size:33px;margin-bottom:20px}.process-documentation p{font-size:14px}}

.hero-intro .project-by{font-size:11px;line-height:1.7;color:var(--muted);margin:22px 0 0;max-width:430px}.dialog-tools{flex-shrink:0}.dialog-tools .languages{margin-right:10px}.dialog-tools .languages button{font-size:11px}.marker-description{margin-left:7px}@media(max-width:520px){.marker-description{display:none}.dialog-tools .languages{margin-right:2px}.dialog-tools{gap:1px}.dialog-top{gap:10px}.dialog-tools .close-button{margin-left:2px}.dialog-tools .small-button{min-width:39px}}

/* Artist photographs in the People directory.
   Thumbnails vary from 1.34:1 to 3:1, so a fixed box with object-fit:cover
   keeps the list aligned instead of letting one wide diptych set the rhythm. */
.artist-item summary{grid-template-columns:30px 64px 1fr 20px}
.artist-thumb{width:64px;height:44px;object-fit:cover;background:var(--paper-dark);align-self:start}
.artist-bio{padding-left:110px}
@media(max-width:520px){
 .artist-item summary{grid-template-columns:24px 52px 1fr 20px;gap:10px}
 .artist-thumb{width:52px;height:38px}
 .artist-bio{padding-left:0}
}

/* Four alternatives + reflections, inside the process tab's dark panel. */
.alt-gallery{margin-top:30px;border-top:1px solid #4b5a58;padding-top:26px}
.alt-gallery h4{font-size:22px;margin-bottom:8px}
.alt-gallery>.small{color:#c5cdc2;max-width:560px;margin-bottom:20px}
.alt-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.alt-item{margin:0;background:#1b353b;padding:16px}
.alt-item img{width:100%;height:auto;margin-bottom:12px;background:var(--paper-dark)}
.alt-index{display:block;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--lime);margin-bottom:8px}
.alt-item figcaption p:not(.small){font-size:14px;line-height:1.7;color:#e2e5dc;margin:0 0 10px}
.alt-item .small{color:#b7c4be;margin:0}
.alt-item .small a{color:inherit}
@media(max-width:520px){
 .alt-grid{grid-template-columns:1fr;gap:16px}
 .alt-gallery h4{font-size:20px}
}

/* Hero: the image now leads (before the title/intro), and needs its own
   unambiguous "this opens the exhibition" affordance since it is no longer
   sitting right beside a "Begin with an image" text link. */
.hero-image .image-button{position:relative;cursor:pointer}
.hero-enter{position:absolute;left:24px;bottom:24px;display:inline-flex;align-items:center;gap:8px;background:var(--ink);color:var(--paper);padding:12px 20px;font-size:13px;font-weight:600;letter-spacing:.3px}
.hero-image .image-button:hover .hero-enter{background:var(--terracotta)}
@media(max-width:520px){
 .hero-enter{left:14px;bottom:14px;padding:9px 15px;font-size:11px}
}

/* ---- Hero: title/intro text first, then the cover photograph ------------- */
.hero-image figcaption{justify-content:space-between}
.hero-intro p+p{margin-top:1em}
.opening-note{grid-template-columns:1fr;gap:18px}
.opening-note p{font-size:26px;max-width:820px}

/* ---- Ten artistic reflections: uniform tiles, no grey letterbox --------- */
/* Every tile is the same size and the image fills it (object-fit:cover), so
   the grid reads as one even field. Previously two tiles spanned two columns
   and portrait images sat inside a fixed-height grey well. */
.work-tile:nth-child(1),.work-tile:nth-child(10){grid-column:auto}
.work-tile .image-well,.work-tile:nth-child(1) .image-well,.work-tile:nth-child(10) .image-well{height:auto;aspect-ratio:4/3;background:transparent;overflow:hidden}
.work-tile img{object-fit:cover;width:100%;height:100%}

/* ---- People: artists as full text beside a larger portrait -------------- */
.artist-directory{grid-template-columns:1fr;column-gap:0;row-gap:34px;margin-top:32px}
.artist-item{display:grid;grid-template-columns:220px 1fr;gap:26px;align-items:start;border-bottom:1px solid var(--line);padding-bottom:30px}
.artist-item:last-child{border-bottom:0}
.artist-item .artist-thumb{width:220px;height:165px;object-fit:cover;background:var(--paper-dark)}
.artist-item .num{display:block;font-size:11px;color:var(--terracotta);margin-bottom:8px}
.artist-item h4{font-size:27px;line-height:1.15;margin-bottom:12px}
.artist-item .artist-body p{font-size:15px;line-height:1.75;margin:0 0 12px;max-width:62ch}
@media(max-width:760px){
 .artist-item{grid-template-columns:1fr;gap:14px}
 .artist-item .artist-thumb{width:100%;height:200px}
 .artist-item h4{font-size:24px}
}

/* ---- The card's questions: the printed card, front-facing ---------------- */
.card-stage{display:flex;justify-content:center}
.print-card{position:relative;width:min(720px,100%);background:var(--green);color:var(--paper);border-radius:12px;padding:30px 30px 26px;overflow:hidden}
.print-card-category{position:absolute;left:18px;bottom:2px;font:82px/1 var(--serif);color:#ffffff21;white-space:nowrap;pointer-events:none}
.print-card-body{position:relative;z-index:1}
.print-card-kicker{font-size:13px;letter-spacing:.5px;opacity:.9}
.print-card h3{font-size:32px;line-height:1.12;margin:8px 0 20px}
.print-card-cols{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.print-card-cols p{font-size:14px;line-height:1.65;margin:0}
.print-card-cols ul{list-style:none;margin:0;padding:0;font-size:14px;font-weight:700;line-height:1.55}
.print-card-cols ul li{margin-bottom:11px}
.print-card-logo{position:relative;z-index:1;display:block;margin-left:auto;margin-top:18px;width:40px;filter:brightness(0) invert(1);opacity:.9}
@media(max-width:640px){
 .print-card{padding:22px 20px 20px}
 .print-card h3{font-size:25px}
 .print-card-cols{grid-template-columns:1fr;gap:16px}
 .print-card-category{font-size:52px}
}

/* ---- Hero spacing: close the gap above the title ------------------------ */
/* The two columns used to bottom-align, so the taller right-hand text column
   pushed a large empty band above the left-hand title. Top-align them and give
   the text column more width, as requested. */
.hero{padding-top:20px}
.hero-heading{align-items:start;grid-template-columns:1fr 1.05fr;gap:48px;margin:18px 0 34px}
.hero-intro{max-width:none;padding-bottom:0}
.hero h1{margin-top:-.08em}
.hero-intro .project-by{margin:0 0 18px;font-size:13px;line-height:1.6;color:var(--muted)}
@media(max-width:900px){
 .hero-heading{grid-template-columns:1fr;gap:20px;margin-top:10px}
}

/* ---- The ten photographs, straight after the invitation ----------------- */
.opening-strip{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(210px,1fr);gap:16px;overflow-x:auto;overscroll-behavior-x:contain;padding-bottom:14px;margin-bottom:var(--stack,0)}
.strip-item{display:block;text-decoration:none;min-width:0}
.strip-item img{width:100%;height:160px;object-fit:cover;display:block}


.strip-item:hover 
@media(max-width:520px){
 .opening-strip{grid-auto-columns:minmax(168px,1fr);gap:12px}
 .strip-item img{height:126px}
}

/* ---- Diptych works: both photographs shown side by side ----------------- */
.art-panel-image.is-pair,.narrative-layout figure.is-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.art-panel-image.is-pair figcaption{grid-column:1/-1}
.art-panel-image.is-pair img,.narrative-layout figure.is-pair img{width:100%;height:auto;max-height:56vh;object-fit:contain;background:var(--paper-dark)}

/* Credit and the link through to the artist's reflection share one line. */
.art-panel-image figcaption{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:10px 20px}
.art-panel-image figcaption .text-link{font-size:12px}

/* ---- Card view: the physical card, both faces --------------------------- */
/* Left = the photograph face with its name band; right = the printed reverse,
   matching the production layout (kicker + DfV mark, title band, description
   and prompts in two columns over a large category watermark). */
.card-spread{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:stretch}
.card-face-front{position:relative;margin:0;border-radius:10px;overflow:hidden;background:var(--paper-dark);display:flex}
.card-face-front img{width:100%;height:100%;object-fit:cover;display:block}
.card-face-front.is-pair{display:grid;grid-template-columns:1fr 1fr;gap:3px}
.card-front-bar{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:flex-end;justify-content:space-between;gap:10px;padding:34px 14px 12px;background:linear-gradient(0deg,#000000b0,transparent);color:#fff;font:22px/1.15 var(--serif)}
.card-front-credit{font:10px/1.3 var(--sans);opacity:.9;white-space:nowrap;padding-bottom:3px}
.print-card{border-radius:10px}
.print-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.print-card .print-card-logo{position:static;margin:0;width:38px;flex-shrink:0}
.print-card h3{border-bottom:1px solid #ffffff59;padding-bottom:12px}
@media(max-width:820px){
 .card-spread{grid-template-columns:1fr;gap:18px}
 .card-face-front{aspect-ratio:4/3}
 .card-front-bar{font-size:18px}
}

/* ---- Hero: image tucked under the title, filling the old void ------------ */
/* The title column used to run out ~350px before the text column did, leaving
   a large empty band under the heading. The cover photograph now sits in that
   column directly beneath the title, so both columns end together. */
.hero-title-col{display:flex;flex-direction:column;gap:22px;min-width:0}
.hero-title-col .hero-image{margin:0}
.hero-title-col .hero-image img{width:100%;height:auto;display:block}
.hero-heading{align-items:start;gap:52px}
.hero-intro p:last-child{margin-bottom:0}
@media(max-width:900px){
 .hero-title-col{gap:16px}
}

/* ---- Hero: the title sits inside the cover photograph -------------------- */
/* Previously the title stood above the image and the image ran to the column
   edge; overlaying it lets the picture stop earlier and removes the stacked
   title+image height entirely. */
.hero-heading{grid-template-columns:1fr 1fr;align-items:start;gap:44px}
.hero-image{position:relative;margin:0;border-radius:10px;overflow:hidden}
.hero-image img{width:100%;height:auto;display:block}
.hero-image h1{position:absolute;left:0;right:0;bottom:0;margin:0;padding:90px 26px 20px;
  color:var(--paper);font-size:clamp(44px,4.6vw,74px);letter-spacing:-2.5px;line-height:.94;
  background:linear-gradient(0deg,#000000b3,#00000070 45%,transparent)}
.hero-image h1 em{color:var(--lime)}
.hero-image .title-stop{color:var(--terracotta)}
.hero-image figcaption{position:absolute;top:12px;right:14px;display:block;padding:0;
  font-size:10px;color:#fff;background:#00000059;border-radius:3px;padding:3px 8px}

/* ---- The invitation runs the full width --------------------------------- */
.opening-note{grid-template-columns:1fr;margin:44px 0 26px;padding-top:26px}
.opening-note p{max-width:none;font-size:clamp(21px,2.1vw,30px);line-height:1.45}

/* ---- Participating artists in two columns ------------------------------- */
.artist-directory{grid-template-columns:1fr 1fr;column-gap:44px;row-gap:30px}
.artist-item{grid-template-columns:150px 1fr;gap:18px;padding-bottom:24px}
.artist-item .artist-thumb{width:150px;height:112px}
.artist-item h4{font-size:22px;margin-bottom:9px}
.artist-item .artist-body p{font-size:14px;line-height:1.65;max-width:none}
@media(max-width:1000px){ .artist-directory{grid-template-columns:1fr} }

/* ---- The making: a decision tree of the four interpretations ------------- */
/* The chosen branch is shown large with its own reflection beside it; the four
   branches sit above it and swap the selection. */
.alt-tree{margin-top:22px}
.alt-branches{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;position:relative;padding-bottom:26px}
.alt-branches::after{content:"";position:absolute;left:12.5%;right:12.5%;bottom:13px;height:1px;background:#5b6f6a}
.alt-branch{position:relative;background:none;border:0;padding:0;text-align:left;display:block;min-width:0}
.alt-branch img{width:100%;height:108px;object-fit:cover;display:block;opacity:.55;transition:opacity .2s,outline-color .2s;outline:2px solid transparent;outline-offset:2px}
.alt-branch .alt-index{display:block;margin-top:7px;color:#b7c4be}
.alt-branch[aria-selected="true"] img{opacity:1;outline-color:var(--lime)}
.alt-branch[aria-selected="true"] .alt-index{color:var(--lime)}
.alt-branch:hover img{opacity:.85}
.alt-branch::after{content:"";position:absolute;left:50%;bottom:-13px;width:1px;height:13px;background:#5b6f6a}
.alt-selected{display:grid;grid-template-columns:1.15fr 1fr;gap:26px;align-items:start;
  border-top:1px solid #5b6f6a;padding-top:24px}
.alt-selected figure{margin:0}
.alt-selected img{width:100%;height:auto;display:block;background:var(--paper-dark)}
.alt-selected-text p:not(.small){font-size:15px;line-height:1.7;color:#e2e5dc;margin:10px 0 12px}
.alt-selected-text .small{color:#b7c4be;margin:0}
@media(max-width:760px){
 .alt-branches{grid-template-columns:repeat(4,1fr);gap:8px}
 .alt-branch img{height:66px}
 .alt-selected{grid-template-columns:1fr;gap:16px}
}

/* ---- Artists: portrait centred against the text block ------------------- */
.artist-item{align-items:center}

/* ---- Hero: title above the picture, columns matched in height ----------- */
/* The title is no longer overlaid; the title+image column is made to match the
   text column's height so the two sides finish together. */
.hero-heading{grid-template-columns:1fr 1fr;align-items:stretch;gap:44px}
.hero-media{display:flex;flex-direction:column;gap:16px;min-width:0}
.hero-media h1{position:static;margin:0;padding:0;background:none;color:var(--ink);
  font-size:clamp(46px,4.9vw,86px);letter-spacing:-3px;line-height:.95}
.hero-media h1 em{color:var(--green)}
.hero-media h1 .title-stop{color:var(--terracotta)}
.hero-media .hero-image{flex:1;min-height:0;border-radius:10px;overflow:hidden}
.hero-media .hero-image img{width:100%;height:100%;object-fit:cover;display:block}
.hero-intro .kicker{font-size:15px;line-height:1.35;letter-spacing:.6px;margin-bottom:18px;color:var(--ink)}
@media(max-width:900px){
 /* phone: title and image stacked above the text, never side by side */
 .hero-heading{grid-template-columns:1fr;gap:24px;align-items:start}
 .hero-media .hero-image{flex:none}
 .hero-media .hero-image img{height:auto}
 .hero-intro .kicker{font-size:14px}
}

/* ---- The making: darker, readable panel text ---------------------------- */
.work-process{color:var(--ink)}
.alt-gallery h4{color:var(--ink)}
.alt-gallery>.small{color:var(--muted)}
.alt-selected-text p:not(.small){color:var(--ink);font-size:16px;line-height:1.72}
.alt-selected-text .small{color:var(--muted)}
.alt-selected{border-top:0;padding-top:0;grid-template-columns:1.1fr 1fr}
.alt-branch .alt-index{color:var(--muted)}
.alt-branch[aria-selected="true"] .alt-index{color:var(--terracotta)}
.alt-branch[aria-selected="true"] img{outline-color:var(--terracotta)}

/* family-tree connectors: trunk down from the chosen image, then a crossbar
   with a riser to each of the four branches */
.alt-tree{position:relative}
.alt-branches{margin-top:44px;padding-bottom:0;padding-top:26px}
.alt-branches::after{top:13px;bottom:auto;background:var(--line)}
.alt-branch::after{top:-13px;bottom:auto;background:var(--line)}
.alt-tree::before{content:"";position:absolute;left:50%;width:1px;height:26px;background:var(--line);
  margin-top:18px}
.alt-branch img{opacity:.62}
.alt-branch[aria-selected="true"] img{opacity:1}

/* ---- Dialog: tighter top, edge arrows, joined credit -------------------- */
.dialog-top{justify-content:space-between;padding:10px 26px}
.dialog-top .kicker{margin:0;font-size:11px;letter-spacing:1.2px;text-transform:uppercase}
.art-heading{margin-bottom:4px}
.art-heading h2{font-size:clamp(28px,3vw,40px);letter-spacing:-1.2px}
.art-heading #dialog-marker{font-size:11px;letter-spacing:1.1px;color:var(--muted);display:block;margin-bottom:4px}
.dialog-body{padding:16px 40px 24px}
.art-tabs{margin:16px 0 18px}
.art-panel-image img{max-height:52vh}
.credit-line{white-space:nowrap}
.art-panel-image figcaption{justify-content:flex-start}
.edge-nav{position:fixed;top:50%;transform:translateY(-50%);z-index:30;width:46px;height:46px;
  border:0;border-radius:50%;background:var(--ink);color:var(--paper);font-size:20px;line-height:1;
  display:grid;place-items:center;box-shadow:0 4px 18px #0005}
.edge-nav:hover{background:var(--terracotta)}
.edge-prev{left:14px} .edge-next{right:14px}
@media(max-width:900px){
 .edge-nav{width:38px;height:38px;font-size:17px}
 .edge-prev{left:6px} .edge-next{right:6px}
 .dialog-body{padding:14px 18px 20px}
}

/* ---- Card back: smaller watermark, larger institutional mark ------------ */
.print-card-category{font-size:44px;left:16px;bottom:8px}
.print-card .print-card-logo{width:74px}

/* The thumbnail carried align-self:start from the old accordion layout, which
   beat the container's align-items:center and pinned it to the top. */
.artist-item .artist-thumb{align-self:center}
/* The full set name is the subtitle of the whole exhibition -- give it presence. */
.hero-intro .kicker{font-size:clamp(19px,1.6vw,25px);line-height:1.25;letter-spacing:.2px;
  text-transform:none;font-weight:600;margin-bottom:20px}

/* ---- Process film: click-to-load facade --------------------------------- */
/* Poster is local; the YouTube iframe replaces it only on click. */
.process-video{margin:0}
.video-facade{position:relative;display:block;width:100%;padding:0;border:0;background:#000;
  cursor:pointer;overflow:hidden;border-radius:8px;line-height:0}
.video-facade img{width:100%;height:auto;display:block;opacity:.86;transition:opacity .2s}
.video-facade:hover img{opacity:1}
.video-play{position:absolute;left:50%;top:50%;width:72px;height:72px;margin:-36px 0 0 -36px;
  border-radius:50%;background:#000000a6;display:block}
.video-play::after{content:"";position:absolute;left:28px;top:22px;border-style:solid;
  border-width:14px 0 14px 22px;border-color:transparent transparent transparent #fff}
.video-facade:hover .video-play{background:var(--terracotta)}
.video-label{position:absolute;left:0;right:0;bottom:0;padding:34px 16px 14px;color:#fff;
  font:13px/1.4 var(--sans);text-align:left;
  background:linear-gradient(0deg,#000000a6,transparent)}
.process-video iframe{width:100%;aspect-ratio:16/9;height:auto;border:0;display:block;border-radius:8px}
.process-video figcaption{margin-top:10px;color:#c7d0c3}
@media(max-width:520px){
 .video-play{width:54px;height:54px;margin:-27px 0 0 -27px}
 .video-play::after{left:21px;top:16px;border-width:11px 0 11px 17px}
}

/* The work marker (01 / 10 — ARTISTIC REFLECTION) now sits in the header tools,
   immediately before the language switch. */
.dialog-tools #dialog-marker{display:flex;align-items:baseline;gap:8px;margin-right:6px;
  font-size:11px;letter-spacing:1.1px;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.dialog-tools #dialog-marker .marker-description{color:var(--muted)}
.art-heading h2{margin-top:2px}
@media(max-width:640px){
 .dialog-tools #dialog-marker{font-size:9px;letter-spacing:.6px;gap:5px}
 .dialog-tools{gap:8px}
}

/* On phones the header has no room for "— ARTISTIC REFLECTION" beside the
   number, the language switch and the close control. It was being flex-crushed
   to zero width -- present in the DOM but invisible and unreadable. Hide it
   deliberately at that size and keep the number, which is what identifies the
   work; screen readers still get the full text from the heading. */
@media(max-width:640px){
 .dialog-tools #dialog-marker .marker-description{display:none}
 .dialog-tools #dialog-marker{flex:0 0 auto}
}

/* ---- Make it obvious the photographs open ------------------------------- */
/* Previously the only cue was a 5% brightness bump (work grid), a caption
   colour change (opening strip) or a slight opacity shift (tree) -- easy to
   miss, so people could not tell the images were interactive. Each now gets a
   scrim and a magnifier badge on hover AND on keyboard focus, plus a zoom
   cursor. The badge is drawn, not written, so it needs no translation.
   NOTE: .alt-branch::after is the tree's connector line, so the cue uses
   ::before there. */
.work-tile a,.strip-item,.alt-branch{position:relative;cursor:zoom-in}
.work-tile .image-well,.strip-item img,.alt-branch img{transition:filter .22s,transform .5s}

.work-tile a::after,.strip-item::after,.alt-branch::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .22s;
  background:
    /* magnifier: lens ring + handle, centred */
    linear-gradient(#fff,#fff) center/2px 15px no-repeat,
    radial-gradient(circle at 50% 50%, transparent 12px, #fff 12px, #fff 14px, transparent 14px) center/100% 100% no-repeat,
    linear-gradient(#00000059,#00000059);
}
/* the handle is the small bar; rotate the whole badge so it reads as a lens */
.work-tile a::after{background-size:2px 14px,100% 100%,100% 100%}
.strip-item::after{background-size:2px 12px,100% 100%,100% 100%}
.alt-branch::before{background-size:2px 10px,100% 100%,100% 100%;z-index:1}

/* the image-well is the box that must clip, and the branches sit above the line */
.work-tile a:hover::after,.work-tile a:focus-visible::after,
.strip-item:hover::after,.strip-item:focus-visible::after,
.alt-branch:hover::before,.alt-branch:focus-visible::before{opacity:1}

.work-tile a:hover img,.work-tile a:focus-visible img,
.strip-item:hover img,.strip-item:focus-visible img{transform:scale(1.03)}
.work-tile .image-well,.strip-item{overflow:hidden}

/* keyboard users get the same affordance, not just a focus ring */
.work-tile a:focus-visible,.strip-item:focus-visible,.alt-branch:focus-visible{outline:3px solid var(--terracotta);outline-offset:3px}

/* the hero cover opens nothing, so it must NOT advertise itself as clickable */
.hero-image{cursor:default}

/* ---- Hero balance: narrower picture, roomier text ------------------------ */
/* The text column was cramped enough that the title line wrapped. Giving the
   text more of the row and the image less lets the title sit on one row, and
   the image still stretches to match the text column's height. */
.hero-heading{grid-template-columns:0.82fr 1.18fr;gap:40px}
.hero-intro{font-size:17.5px}
.hero-intro .kicker{font-size:clamp(20px,1.5vw,26px);text-wrap:balance}
.hero-intro p:not(.kicker):not(.project-by){line-height:1.62}
.hero-media h1{font-size:clamp(40px,4.1vw,70px)}
@media(max-width:900px){
 .hero-heading{grid-template-columns:1fr}
 .hero-intro{font-size:16px}
}

/* ---- Credits list -------------------------------------------------------- */
.credits{margin:22px 0 0;font-size:13px;line-height:1.55}
.credits dt{font-weight:700;color:var(--ink);margin-top:12px}
.credits dt:first-child{margin-top:0}
.credits dd{margin:2px 0 0;color:var(--muted)}

/* ---- The making: the SolipsisArt decision tree --------------------------- */
/* A real nested tree: the photographer's final image, the two curatorial
   images beneath it, and two originals beneath each of those -- the same shape
   the diagrams draw.
   Connectors are placed in PERCENTAGES, not pixels. Every branch has exactly
   two children, so the crossbar always runs 25%->75% and the risers sit at
   25% and 75%. An earlier version used fixed pixel offsets computed for one
   viewport and drifted out of alignment at every other width. */
.tree{margin:26px 0 30px;display:flex;justify-content:center}
.subtree{display:flex;flex-direction:column;align-items:center;min-width:0;flex:1}
.subtree{--gap:16px}
.tree-kids{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);width:100%;align-items:start}

/* With a gap between the two children, a child's centre is NOT at 25% of the
   row: it sits at (100% - gap)/4, i.e. gap/4 inboard of 25%. Measuring showed
   exactly that 4px error for a 16px gap, so the offset is subtracted here
   rather than left as a visible drift. */
.branch{position:relative;width:100%;height:30px;flex:none}
.branch::before{content:"";position:absolute;left:50%;top:0;width:1px;height:14px;background:var(--line)}
.branch::after{content:"";position:absolute;left:calc(25% - var(--gap) / 4);right:calc(25% - var(--gap) / 4);top:14px;height:1px;background:var(--line)}
.branch i{position:absolute;top:14px;width:1px;height:16px;background:var(--line)}
.branch i:nth-child(1){left:calc(25% - var(--gap) / 4)}
.branch i:nth-child(2){left:calc(75% + var(--gap) / 4)}

.tree-node{display:block;margin:0;padding:0;border:1.5px solid var(--line);border-radius:10px;
  overflow:hidden;background:var(--paper-dark);cursor:pointer;line-height:0;width:100%;
  transition:border-color .18s,transform .18s,box-shadow .18s}
.tree-node img{width:100%;height:100%;object-fit:cover;display:block}
.is-root>.tree-node.is-final{aspect-ratio:16/10;max-width:330px;border-color:var(--terracotta);cursor:default}
.tree-kids>.subtree>.tree-node{aspect-ratio:4/3;max-width:230px}
.tree-kids>.subtree>.tree-kids>.tree-node{aspect-ratio:4/3;max-width:100%}
.tree-node.is-empty{border-style:dashed;aspect-ratio:4/3;background:transparent;cursor:default}
button.tree-node:hover{border-color:var(--terracotta);transform:translateY(-2px)}
button.tree-node[aria-selected="true"]{border-color:var(--terracotta);border-width:2.5px;
  box-shadow:0 0 0 3px #8c4c3d33}

@media(max-width:640px){
 .subtree{--gap:8px}
 .branch{height:20px}
 .branch::before{height:9px}
 .branch::after{top:9px}
 .branch i{top:9px;height:11px}
}

/* ---- Project context: prose left, logos and credits right --------------- */
.exhibition-context{grid-template-columns:1.45fr 1fr;gap:56px;align-items:stretch}
.context-credits{display:flex;flex-direction:column}
.context-credits .credits{flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:14px}
.context-credits .credits dt{margin-top:0}
.context-prose p{font-size:14.5px;line-height:1.75;max-width:76ch}
/* The logo strip sits below both columns and spans their full width, so the
   marks can be considerably larger than they were inside the narrow column. */
.exhibition-context+.partner-logos{display:flex;justify-content:space-around;align-items:center;
  gap:40px;flex-wrap:wrap;margin:46px 0 0;padding-top:34px;border-top:1px solid var(--line)}
.exhibition-context+.partner-logos img,
.exhibition-context+.partner-logos img:nth-child(2){max-width:none;width:auto;height:104px;max-height:104px}
.exhibition-context+.partner-logos img:nth-child(1){height:56px;max-height:56px}
@media(max-width:900px){
 .exhibition-context{grid-template-columns:1fr;gap:34px}
 .exhibition-context+.partner-logos{gap:26px;margin-top:32px;padding-top:26px}
 .exhibition-context+.partner-logos img,
 .exhibition-context+.partner-logos img:nth-child(2){height:64px;max-height:64px}
}

/* ---- Hero call-to-action buttons ---------------------------------------- */
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.hero-cta{--cta:#B87F63}
.cta{display:inline-flex;align-items:center;gap:10px;padding:13px 20px;
  background:var(--cta,var(--ink));color:#fff;text-decoration:none;
  font-size:13.5px;line-height:1.35;border:1px solid var(--cta,var(--ink));border-radius:4px;
  transition:background .18s,color .18s,border-color .18s,filter .18s}
.cta::after{content:"\2192";font-size:15px;line-height:1}
.cta:hover{filter:brightness(.92)}
.cta-alt{--cta:#B7956B}
@media(max-width:520px){
 .hero-cta{flex-direction:column;align-items:stretch}
 .cta{justify-content:space-between}
}

/* Images: discourage casual saving and dragging. */
img{-webkit-user-drag:none;user-drag:none;-webkit-touch-callout:none;user-select:none;-webkit-user-select:none}