/* Image-led project introductions. Existing shortlist variants stay independent. */
.photo-head,.purpose-head{padding:52px 5vw 38px;display:grid;grid-template-columns:1.25fr 1fr;gap:5vw;align-items:end}
.photo-head .ip-kicker{margin-bottom:22px}
.intro-concepts .photo-head h2,.intro-concepts .purpose-head h2{font-size:clamp(44px,4.9vw,88px)}
.photo-summary,.purpose-head>div{max-width:430px}
.photo-summary>p,.purpose-head p{color:var(--muted);font-size:17px;line-height:1.55}
.photo-summary .ip-link,.purpose-head .ip-link{margin-top:12px;padding-block:14px;max-width:270px}
.photo-rail{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-inline:5vw;scroll-padding-inline:5vw;position:relative;overscroll-behavior-x:contain;overscroll-behavior-y:auto;touch-action:pan-x pan-y pinch-zoom}
.photo-rail::-webkit-scrollbar{display:none}
.photo-card{flex:0 0 84vw;height:clamp(480px,72svh,880px);position:relative;overflow:hidden;scroll-snap-align:start;background:var(--ink);color:var(--paper)}
.photo-card>img{position:absolute;inset:0;transition:transform 1.2s cubic-bezier(.22,1,.36,1);object-position:center 48%}
.photo-card:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#101a233d,transparent 30%,transparent 42%,#111921c4);pointer-events:none}
.photo-card-top{position:absolute;inset:26px 32px auto;display:flex;justify-content:space-between;gap:16px;font-size:10px;letter-spacing:.1em;z-index:1}
.photo-card-copy{position:absolute;inset:auto 3vw 32px;z-index:1;max-width:800px}
.intro-concepts .photo-card-copy h3{font-size:clamp(35px,4.1vw,74px);max-width:13ch;text-wrap:balance;line-height:1.02}
.photo-card-copy p{font-size:16px;max-width:44ch;line-height:1.5;margin-top:16px;color:#f2eee8}
.photo-card-copy a{display:inline-flex;gap:42px;align-items:center;padding-block:14px 10px;border-bottom:1px solid #fff8;font-size:14px;margin-top:7px}
.photo-card-copy a span{font-size:20px;transition:transform .25s}
.photo-card-copy a:hover span{transform:translate(3px,-3px)}
.photo-keyfacts{display:flex;gap:30px;margin:24px 0 8px;padding:0;max-width:760px}
.photo-keyfacts>div{display:flex;flex-direction:column-reverse;gap:7px}
.photo-keyfacts dt{font-size:10px;line-height:1.4;color:#ffffffe0;letter-spacing:.025em}
.photo-keyfacts dd{margin:0;font-size:clamp(20px,1.65vw,30px);line-height:1.1;letter-spacing:-.035em;color:#fff;font-weight:400;white-space:nowrap}
.photo-keyfacts-overview{display:grid;grid-template-columns:max-content max-content;gap:40px}
@media(max-width:700px){.photo-keyfacts{gap:18px;margin-top:20px}.photo-keyfacts-overview{grid-template-columns:1fr 1fr;gap:14px 22px}.photo-keyfacts dd{font-size:21px}.photo-keyfacts dt{font-size:10px}.photo-keyfacts>div{gap:4px}.photo-card-copy:has(.photo-keyfacts-overview) h3{font-size:32px}}
.photo-controls{padding:20px 5vw 24px;display:flex;justify-content:space-between;align-items:center;gap:20px}
.photo-controls>p{font-size:13px;color:var(--muted)}
.photo-controls>div{display:flex;align-items:center;gap:10px}
.photo-counter{font-size:12px;letter-spacing:.08em;margin-right:22px;color:var(--olive);min-width:52px}
.photo-controls button{background:transparent;border:1px solid var(--line);border-radius:50%;width:46px;height:46px;font:inherit;font-size:22px;color:var(--ink);cursor:pointer;transition:background .2s,color .2s}
.photo-controls button:hover:enabled{background:var(--ink);color:var(--paper)}
.photo-controls button:disabled{opacity:.3;cursor:default}
.photo-facts{margin:0 5vw;padding:22px 0 30px;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.photo-facts>div{display:flex;flex-direction:column-reverse;gap:9px}
.photo-facts dt{color:var(--muted);font-size:12px}
.photo-facts dd{margin:0;font-weight:300;font-size:clamp(28px,2.9vw,48px);letter-spacing:-.05em;line-height:1.1;color:var(--olive)}
.photo-facts small{font-size:.48em;letter-spacing:0}
.ip-purpose .ip-meta{padding-block:18px}
.purpose-head{padding-block:32px}
.purpose-viewer{padding:0 5vw 26px}
.purpose-viewer>.ip-tabs{max-width:760px;border-top:1px solid var(--line);margin-bottom:18px}
.purpose-viewer .ip-tabs button{padding:17px 16px;gap:14px}
.purpose-panel{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(280px,1fr);min-height:clamp(510px,40vw,740px)}
.purpose-panel .ip-image-layers{min-width:0}
.purpose-panel .ip-image-layers>img{object-position:50% center}
.ip-purpose .ip-stories{background:var(--ink);color:var(--paper);padding:36px 30px;display:flex;align-items:center}
.purpose-index{display:block;color:var(--gold);font-weight:300;font-size:clamp(42px,5vw,78px);letter-spacing:-.06em;line-height:1}
.purpose-index small{font-size:12px;letter-spacing:.03em;color:#bcb8b2;margin-left:12px}
.intro-concepts .ip-purpose .ip-stories h3{font-size:clamp(30px,2.8vw,50px);margin:36px 0 20px}
.ip-purpose .ip-description{color:#d9d5cf;font-size:16px;line-height:1.6}
.ip-purpose .ip-stories .ip-link{font-size:14px;border-color:#fff5;margin-top:36px}
@media(min-width:761px) and (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.photo-card:hover>img{transform:scale(1.018)}}
@media(max-width:1000px){.purpose-panel{grid-template-columns:minmax(0,1.6fr) minmax(270px,1fr)}.photo-head,.purpose-head{gap:35px}.ip-purpose .ip-stories{padding:28px 24px}.photo-card{flex-basis:88vw}.photo-summary>p,.purpose-head p{font-size:16px}}
@media(max-width:700px){
 .photo-head,.purpose-head{grid-template-columns:1fr;gap:22px;padding:30px 5vw}
 .photo-head .ip-kicker{margin-bottom:18px}
 .intro-concepts .photo-head h2,.intro-concepts .purpose-head h2{font-size:46px}
 .photo-summary>p,.purpose-head p{font-size:15px}
 .photo-summary .ip-link,.purpose-head .ip-link{margin-top:8px;padding-block:12px;max-width:260px;font-size:14px}
 .photo-rail{gap:12px}
 .photo-card{flex-basis:88vw;height:540px;max-height:76svh;min-height:440px}
 .photo-card-top{inset:20px 20px auto;font-size:9px}.photo-card-top>span:last-child{display:none}
 .photo-card-copy{inset:auto 22px 24px}.intro-concepts .photo-card-copy h3{font-size:37px;max-width:12ch}
 .photo-card-copy p{font-size:14px;max-width:31ch}.photo-card-copy a{font-size:13px}
 .photo-controls{padding-block:16px}.photo-controls>p{font-size:11px;max-width:120px;line-height:1.5}.photo-counter{margin-right:2px;font-size:11px}.photo-controls button{width:42px;height:42px}
 .photo-facts{grid-template-columns:1fr 1fr;gap:24px 18px;padding-block:24px 30px}.photo-facts dd{font-size:34px}.photo-facts dt{font-size:11px}
 .purpose-viewer{padding-inline:0;padding-bottom:24px}.purpose-viewer>.ip-tabs{margin-inline:5vw}.purpose-viewer .ip-tabs button{padding:14px 9px;display:block}.purpose-viewer .ip-tabs button>span{margin-bottom:8px}.purpose-viewer .ip-tabs strong{font-size:12px}.purpose-panel{display:flex;flex-direction:column;min-height:0}.purpose-panel .ip-image-layers{height:420px}.ip-purpose .ip-stories{padding:28px 6vw}.purpose-index{font-size:44px}.intro-concepts .ip-purpose .ip-stories h3{font-size:36px;margin:22px 0 16px}.ip-purpose .ip-description{font-size:15px}.ip-purpose .ip-stories .ip-link{margin-top:18px}
}
@media(prefers-reduced-motion:reduce){.photo-card>img{transition:none!important;transform:none!important}.photo-rail{scroll-behavior:auto}}
.motion-off .photo-card>img{transition:none!important;transform:none!important}

@media(min-width:701px){.ic-review .ip-review-groups>div:last-child nav{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* Keep D5's original inset photographic layout while pinning its composition. */
.photo-scroll-track{position:relative}
.photo-scroll-track.is-pinned{height:calc(var(--photo-stage-height,100svh) + 150svh)}
.is-pinned .photo-stage{position:sticky;top:var(--photo-pin-top,0);background:var(--paper)}
.is-pinned .photo-rail{overflow:hidden;scroll-snap-type:none;scroll-behavior:auto;overscroll-behavior:auto}
.is-pinned .photo-card{scroll-snap-align:none}
/* Keep each native-scroll slide on a stable paint layer as it enters the viewport. */
.photo-scroll-track:not(.is-pinned) .photo-card{isolation:isolate;transform:translateZ(0)}
.photo-scroll-track:not(.is-pinned) .photo-card>img{transform:none;transition:none}
.photo-scroll-caption{display:flex;align-items:center;gap:24px}
.photo-controls .photo-scroll-caption p{font-size:13px;color:var(--muted)}
.photo-controls button[data-photo-exit]{border:0;border-radius:0;width:auto;height:auto;font-size:12px;color:var(--muted)}
.photo-controls button[data-photo-exit]:hover{background:transparent;color:var(--ink);text-decoration:underline}
.photo-scroll-progress{display:none}
@media(max-width:700px){.photo-controls>.photo-scroll-caption{align-items:start;flex-direction:column;gap:6px}.photo-controls .photo-scroll-caption p,.photo-controls button[data-photo-exit]{font-size:10px}}

/* Fine transparent chapter controls, kept clear of the architecture. */
.photo-chapter-heading{display:flex;flex-direction:column;align-items:start;gap:12px}
.photo-chapters{display:flex;gap:15px;padding:10px 14px;background:#16212a1c;border:1px solid #ffffff26;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.photo-chapters button{color:#fff8;padding:0;min-width:42px;text-align:left;font-size:12px;letter-spacing:.1em;line-height:1.3;transition:color .2s}
.photo-chapters button[aria-current=step],.photo-chapters button:hover{color:#fff}
.photo-chapters button>span{display:block;margin-bottom:8px}
.photo-chapters i{display:block;height:1px;background:#ffffff40;overflow:hidden}
.photo-chapters i b{display:block;height:100%;background:#fff;transform:scaleX(var(--chapter-fill,0));transform-origin:left}
.photo-chapter-heading>span{font-size:10px;letter-spacing:.12em;text-shadow:0 1px 8px #0006}
@media(max-width:700px){.photo-chapters{padding:8px 10px;gap:12px}.photo-chapters button{min-width:32px;font-size:11px}.photo-chapter-heading{gap:9px}}
