@font-face{font-family:Williwaw;src:url('../assets/fonts/williwaw-book.otf')}*{box-sizing:border-box}html{scroll-padding-top:0}body{margin:0;background:#000;color:#fff;font:16px/1.6 Arial,sans-serif}a{color:inherit;text-underline-offset:5px}button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}button:focus-visible,a:focus-visible{outline:2px solid currentColor;outline-offset:5px}header{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;background:#000;position:relative;z-index:3}header img{width:190px}nav{display:flex;gap:26px;font-size:14px}.skip{position:absolute;top:-100px}.skip:focus{top:10px;z-index:10;background:#000;padding:10px}.stage{height:calc(100svh - 76px);min-height:380px;position:relative;overflow:hidden;touch-action:none}.stage>img{position:absolute;max-width:none;transition:width .85s ease,height .85s ease,left .85s ease,top .85s ease}.excerpt{position:absolute;left:7%;bottom:15%;max-width:650px;font:clamp(23px,2.5vw,38px)/1.4 Williwaw,Georgia; text-shadow:0 2px 8px #000;background:#00000099;padding:12px 18px;opacity:0;transition:opacity .35s}.excerpt.visible{opacity:1}.stage-controls{position:absolute;bottom:20px;left:5%;right:5%;display:flex;gap:28px;align-items:center;font-size:14px;text-shadow:0 1px 5px #000}.stage-controls a{margin-left:auto}.stage-controls button{padding:10px;background:#000000cc}.reading{background:#fff;color:#000;display:grid;grid-template-columns:1fr 1fr;gap:7vw;padding:100px 7vw;align-items:start}.reading-art{margin:0;position:sticky;top:35px}.reading-art img{display:block;max-width:100%;max-height:82svh;object-fit:contain;margin:auto}.reading-art button{display:block;width:100%;padding:0}.reading-art span{display:block;font-size:13px;margin-top:14px}.reading article{max-width:640px}h1,h2{font-family:Williwaw,Georgia;font-weight:400;line-height:1.1}h1{font-size:clamp(38px,4vw,64px);margin:0 0 20px}h2{font-size:42px}.byline{font-size:13px;color:#666;margin-bottom:40px}.letter{font:21px/1.65 Williwaw,Georgia}.letter p{margin:0 0 1.3em}dl{font-size:13px;margin-top:45px}dl div{display:flex;gap:15px}dt{min-width:65px}dd{margin:0}footer{display:flex;justify-content:space-between;padding:40px 5vw;font-size:14px}dialog{border:0;padding:0;width:96vw;max-width:1600px;max-height:94svh;background:#fff;color:#000}dialog::backdrop{background:#000c}.close{position:sticky;top:0;display:block;margin-left:auto;padding:15px 25px;background:#fff;z-index:5}.dialog-content .reading{padding:25px 5vw 50px;gap:5vw}.dialog-nav{display:flex;justify-content:space-between;padding:25px}.dialog-nav button{padding:10px}body:has(dialog[open]){overflow:hidden}@media(max-width:750px){header{height:66px}header img{width:130px}nav{gap:13px;font-size:12px}.stage{height:calc(100svh - 66px)}.reading{grid-template-columns:1fr;padding:50px 7vw;gap:40px}.reading-art{position:static}.reading-art img{max-height:75svh}.letter{font-size:20px}.excerpt{left:5%;right:5%;bottom:18%}.stage-controls{gap:10px;font-size:12px}.dialog-content .reading{padding:20px 7vw}.stage-controls button{padding:8px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* Measured movement and optional inspection. */
.stage>img{transition:width 1.6s cubic-bezier(.22,.65,.2,1),height 1.6s cubic-bezier(.22,.65,.2,1),left 1.6s cubic-bezier(.22,.65,.2,1),top 1.6s cubic-bezier(.22,.65,.2,1)}
.excerpt{transition:opacity 1.2s ease}.reading article{transition:opacity 1.2s ease,transform 1.4s ease}.reading.arriving article{opacity:0;transform:translateY(25px)}.reading.arriving .reading-art{visibility:hidden}.letter-arriving{overflow:hidden}#viewer{width:100vw;max-width:100vw;height:100svh;max-height:100svh}#viewer::backdrop{background:#000}.detail-surface{position:relative;width:fit-content;max-width:100%;margin:auto}.detail-surface img{max-height:78svh;width:auto;max-width:100%}.detail-marker{position:absolute;width:36px;height:36px;transform:translate(-50%,-50%);border:0;background:transparent;opacity:0;transition:opacity 1.2s}.detail-marker::after{content:'';position:absolute;inset:10px;border:1.5px solid #fff;border-radius:50%;box-shadow:0 0 3px #222;background:#00000033}.markers-visible .detail-marker,.detail-marker:focus-visible{opacity:1}.detail-marker:hover::after{background:#fff8}.detail-hint{text-align:center;font-size:13px;margin-top:18px}dialog .travelling-painting{object-fit:contain}@media(prefers-reduced-motion:reduce){.stage>img,.reading article,.detail-marker{transition:none}}

/* Explicit timing and independent marker geometry. */
.stage>img{transition-property:width,height,left,top;transition-duration:var(--zoom-duration,2000ms);transition-timing-function:cubic-bezier(.42,0,.25,1)}
.reading-art .detail-surface .detail-marker{display:block;width:36px;min-width:36px;max-width:36px;height:36px;padding:0;margin:0;aspect-ratio:1;box-sizing:border-box}
#viewer{background:transparent;isolation:isolate}#viewer::before{content:'';position:fixed;inset:0;background:#fff;z-index:-1;pointer-events:none}#viewer[open]::before{animation:paper-reveal 2.4s ease both}#viewer::backdrop{background:transparent}#viewer .reading{background:transparent}#viewer.opening .dialog-nav{visibility:hidden}
@keyframes paper-reveal{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.stage>img{transition:none}#viewer[open]::before{animation:none}}

/* Letter is hidden without a fade before the painting travels into place. */
.reading.instant article{transition:none}

/* Detail view: the painting itself becomes the view. */
dialog#inspection{position:fixed;inset:0;width:100vw;max-width:100vw;height:100vh;height:100svh;max-height:none;margin:0;padding:0;background:transparent;color:#fff;overflow:hidden;outline:none}
#inspection::backdrop{background:transparent}
.inspection-shade{position:absolute;inset:0;background:#000;opacity:0}
.inspection-layer{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform}
.inspection-layer img{position:absolute;inset:0;width:100%;height:100%;display:block;max-width:none}
.inspection-layer .sharp{opacity:0;transition:opacity 1.2s ease}.inspection-layer .sharp.loaded{opacity:1}
.inspection-controls{position:absolute;left:5%;right:5%;bottom:20px;display:flex;gap:28px;align-items:center;font-size:14px;text-shadow:0 1px 5px #000;opacity:0;visibility:hidden;transition:opacity .9s ease,visibility 0s .9s}
#inspection.shown .inspection-controls{opacity:1;visibility:visible;transition:opacity .9s ease}
.inspection-controls button{padding:10px;background:#000000cc}
.inspection-status{padding:10px;background:#000000cc;font-size:13px}
.inspection-next{margin-left:auto}
@media(max-width:750px){.inspection-controls{gap:10px;font-size:12px;flex-wrap:wrap}.inspection-controls button{padding:8px}}
@media(prefers-reduced-motion:reduce){.inspection-layer .sharp,.inspection-controls{transition:none}}

/* Once the letter has taken over, the opening controls step away. */
.stage.handed .stage-controls{opacity:0;visibility:hidden;transition:opacity .9s ease,visibility 0s .9s}
.reading-art:not(:has(.detail-surface)) .detail-hint{display:none}

/* Entrances, matching Home. */
.reveal-item{transition:opacity 1.05s ease,transform 1.05s cubic-bezier(.2,.7,.2,1)}
.reveal-pending{opacity:0;transform:translateY(32px)}

/* Section labels and shared text. */
.label{font:13px/1.4 Arial,sans-serif;letter-spacing:.02em;margin:0 0 28px;color:inherit;opacity:.75}

/* The series: walking the wall.
   One pinned stage carries three movements: the words read in, the walk along the paintings,
   and the gathering of all six into one grid before the page moves on. */
.w-series{--w-h:min(62svh,740px);--w-gap:clamp(56px,7vw,120px);--w-ease:cubic-bezier(.42,0,.25,1);position:relative;height:var(--track,300svh)}
.w-pin{position:sticky;top:0;height:100svh;overflow:hidden;background:var(--tone,#000)}
.w-threshold{position:absolute;inset:0;display:flex;align-items:center;padding:0 8vw;pointer-events:none}
.w-quote{margin:0;font-family:Williwaw,Georgia;font-weight:400;width:100%}
.w-quote .l1,.w-quote .l2{display:block;font-size:clamp(52px,8.4vw,150px);line-height:.98;letter-spacing:-.01em}
.w-quote .l2{padding-left:18vw}
.w-quote .l3,.w-quote .l4{display:block;font-size:clamp(22px,2vw,36px);line-height:1.35;margin-left:var(--under,18vw);white-space:nowrap}
.w-quote .l3{margin-top:1.1em}.w-quote .l4{margin-top:.35em}
.w-quote .w{display:inline-block;opacity:.08;transform:translateY(.12em);transition:opacity .9s ease,transform 1.1s var(--w-ease);transition-delay:calc(var(--i) * 140ms)}
.w-quote.read .w{opacity:1;transform:none}
.w-stage{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:20px 0}
.w-head{padding:0 5vw;margin:0 0 3.2svh;display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap}
.w-head h2{margin:0 0 8px}
.w-head p{margin:0;font-size:14px;color:#c6c6c6}
.w-index{list-style:none;margin:0;padding:0;display:flex;gap:4px 26px;flex-wrap:wrap;justify-content:flex-end;max-width:60vw;transition:opacity .8s ease}
.w-index button{font:17px/1.4 Williwaw,Georgia;color:#c6c6c6;opacity:.5;padding:4px 0;transition:opacity .8s ease,color .8s ease}
.w-index button:hover{opacity:.85}
.w-index button.met{opacity:.78}
.w-index button[aria-current="true"]{opacity:1;color:#fff}
.w-wall{display:flex;align-items:flex-start;gap:var(--w-gap);overflow-x:auto;overscroll-behavior-x:contain;padding:0 5vw 26px;scrollbar-width:thin;scrollbar-color:#545454 transparent;cursor:grab}
.w-wall.dragging{cursor:grabbing;user-select:none}
.w-wall::-webkit-scrollbar{height:6px}.w-wall::-webkit-scrollbar-thumb{background:#545454}
.w-wall>*{flex:none}
.w-end{width:18vw}
.w-work{margin:0;display:flex;flex-direction:column}
.w-open{display:block;line-height:0;cursor:inherit;transform-origin:50% 100%;will-change:transform;padding:0}
.w-work img{display:block;height:var(--w-h);width:auto;max-width:none;-webkit-user-drag:none;user-select:none;transition:transform .8s var(--w-ease),box-shadow .8s ease}
.w-work figcaption{margin-top:20px;width:var(--cap-w,40ch);display:flex;flex-direction:column;gap:6px}
.w-name{font:22px/1.3 Williwaw,Georgia}
.w-line{font:18px/1.5 Williwaw,Georgia;color:#c6c6c6;margin:0;min-height:3em}
.w-line span{opacity:0;transition:opacity .9s ease}
.w-line span.said{opacity:1}
.w-cue{align-self:flex-start;font-size:13px;color:#c6c6c6;text-decoration:underline;text-underline-offset:5px;padding:0}
.w-cue:hover,.w-work.here .w-cue{color:#fff}
/* Invitation: a soft light frames the painting and it comes a little closer. */
.w-open:hover img,.w-open:focus-visible img{transform:scale(1.025);box-shadow:0 0 0 1px rgba(255,255,255,.55),0 0 48px 4px rgba(255,255,255,.16)}
.w-open:focus-visible{outline:none}
.w-gathered{position:absolute;inset:0;pointer-events:none}
.w-g{position:absolute;left:0;top:0;transform-origin:0 0;opacity:0;padding:0;line-height:0;will-change:transform,opacity}
.w-g img{display:block;width:100%;height:100%;object-fit:contain;transition:box-shadow .8s ease}
.w-g span{position:absolute;left:0;top:calc(100% + 10px);font:16px/1.3 Williwaw,Georgia;white-space:nowrap;opacity:0;transition:opacity .9s ease}
.w-gathered.done .w-g{pointer-events:auto}
.w-gathered.done .w-g span{opacity:1}
.w-gathered.done .w-g:hover img,.w-gathered.done .w-g:focus-visible img{box-shadow:0 0 0 1px rgba(255,255,255,.55),0 0 40px 3px rgba(255,255,255,.14)}
.gathering .w-wall{scrollbar-color:transparent transparent}.gathering .w-wall::-webkit-scrollbar-thumb{background:transparent}
.gathering .w-index{opacity:0;pointer-events:none}
.w-skip{position:absolute;right:5vw;bottom:22px;z-index:3;font-size:13px;color:#c6c6c6;text-decoration:underline;text-underline-offset:5px;padding:6px 0;transition:opacity .6s ease}
.w-skip:hover{color:#fff}

/* ---------- After the wall: design pass ----------
   Rhythm: paper (the project) → one dark passage (behind the scenes, then the film)
   → paper (history) → a dark close that answers the wall's opening words. */

/* The project: "Ordinary is" set at the scale of the wall's words; the sentence runs on beneath at reading size. */
.project{background:#fff;color:#000;padding:16svh 8vw}
.p-lede{margin:0;padding-left:18vw;max-width:calc(40ch + 18vw);font:clamp(26px,2.45vw,40px)/1.34 Williwaw,Georgia}
.p-big{display:block;margin-left:-18vw;font-size:clamp(64px,10vw,180px);line-height:.92;letter-spacing:-.015em;margin-bottom:.12em}
.p-body{margin:7svh 0 0 18vw;max-width:48ch;font:clamp(18px,1.25vw,21px)/1.7 Williwaw,Georgia;color:#3b3b3b}

/* Behind the scenes: a sequenced spread. Photographs at different sizes; the quote held among them. */
.documentary{padding:16svh 5vw 12svh;display:grid;grid-template-columns:repeat(12,1fr);column-gap:1.8vw;row-gap:7svh;align-items:start}
.documentary .label{grid-column:1/-1;margin:0 0 -3svh}
.bts{margin:0}.bts img{display:block;width:100%;height:auto}
.b1{grid-column:1/span 6;grid-row:2}
.b2{grid-column:8/span 3;grid-row:2;margin-top:10svh}
.b3{grid-column:11/span 2;grid-row:2;align-self:end}
.quote{grid-column:2/span 5;grid-row:3;align-self:center;margin:0;font:clamp(24px,2.1vw,34px)/1.5 Williwaw,Georgia}
.quote p{margin:0 0 .8em}
.quote footer{font:13px/1.4 Arial,sans-serif;margin-top:26px;color:#c6c6c6}
.b4{grid-column:8/span 5;grid-row:3}
.b5{grid-column:1/span 3;grid-row:4}
.b6{grid-column:4/span 3;grid-row:4;margin-top:14svh}
.b7{grid-column:8/span 3;grid-row:4;margin-top:4svh}
.b8{grid-column:11/span 2;grid-row:4;align-self:end}

/* The film: the projector screening from film-h. */
.film{position:relative;overflow:hidden;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:14svh 32px;background:linear-gradient(#000,#050505 22%);color:#f2f2f2;text-align:center}
.film-beam{position:absolute;top:0;left:50%;width:150%;height:75%;transform:translateX(-50%);pointer-events:none;background:radial-gradient(ellipse 55% 65% at 50% 0%,rgba(139,139,139,.18) 0%,transparent 70%)}
.film-kicker{position:relative;margin:0 0 16px;font:12px/1 Arial,sans-serif;letter-spacing:.4em;text-transform:uppercase;color:rgba(239,239,239,.6)}
.film-title{position:relative;margin:0 0 10px;font:italic 400 clamp(30px,3.6vw,50px)/1.1 Williwaw,Georgia;color:#fff}
.film-cap{position:relative;margin:0 0 36px;font:italic 16px/1.6 Williwaw,Georgia;color:rgba(239,239,239,.6);opacity:.82}
.film-frame{position:relative;width:min(52.9vw,644px);aspect-ratio:4/3;background:#000;overflow:hidden;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 1px rgba(239,239,239,.08),0 60px 160px rgba(0,0,0,.8)}
.film-frame.playing{width:min(84vw,1200px);aspect-ratio:16/9;cursor:auto}
.film-thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%}
.film-frame::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(46% 60% at 50% 46%,rgba(6,6,6,.3) 0%,transparent 68%),linear-gradient(180deg,rgba(5,5,5,.2) 0%,rgba(5,5,5,.04) 30%,rgba(5,5,5,.08) 60%,rgba(5,5,5,.55) 100%)}
.film-frame.playing::after{display:none}
.film-grain{position:absolute;inset:0;pointer-events:none;opacity:.05;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.film-glow{position:absolute;width:min(46vw,380px);height:min(46vw,380px);border-radius:50%;background:radial-gradient(circle,rgba(139,139,139,.3) 0%,transparent 72%);filter:blur(6px);opacity:.4;animation:film-glow 5.5s ease-in-out infinite}
@keyframes film-glow{0%,100%{transform:scale(1);opacity:.42}50%{transform:scale(1.14);opacity:.68}}
.film-play{position:relative;z-index:2;width:clamp(52px,5.6vw,72px);height:clamp(52px,5.6vw,72px);padding:0;color:#fff;transition:transform .4s cubic-bezier(.19,1,.22,1)}
.film-frame:hover .film-play{transform:scale(1.07)}
.film-play svg{width:100%;height:100%;display:block}
.film-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* History: image and biography side by side, as in the Koudelka reference. */
.history{background:#fff;color:#000;display:grid;grid-template-columns:repeat(12,1fr);column-gap:2vw;padding:18svh 8vw;align-items:start}
.history-art{grid-column:1/span 5;margin:0;position:sticky;top:8svh}.history-art img{display:block;width:100%;height:auto;max-height:84svh;object-fit:contain;object-position:left top}
.history-text{grid-column:7/span 5;font:20px/1.7 Williwaw,Georgia;max-width:62ch}
.history-text .label{opacity:.7}
.history-text .lede{font-size:clamp(30px,2.8vw,44px);line-height:1.25;margin:0 0 1.2em}
.history-text p{margin:0 0 1.3em}
.history-text .coda{margin-top:2em;font-size:clamp(24px,2vw,30px);line-height:1.35}

/* The close: the sentence stands centred; scrolling brings the three words in beneath it. */
.closing{position:relative;height:230svh;background:#000;color:#fff}
.c-pin{position:sticky;top:0;height:100svh;overflow:hidden}
.c-lead{position:absolute;left:50%;top:50%;width:min(86vw,980px);transform:translate(-50%,calc(-50% + var(--lift,0px)));text-align:center;font-family:Williwaw,Georgia}
.c-say{margin:0 auto;max-width:30ch;font-size:clamp(24px,2.3vw,36px);line-height:1.45}
.c-refrain{margin:1.1em 0 0;font-size:clamp(16px,1.2vw,19px);line-height:1.6;color:#c6c6c6}
.c-words{position:absolute;left:8vw;right:8vw;top:44%;margin:0;font-family:Williwaw,Georgia}
.c-words span{display:block;font-size:clamp(52px,8vw,146px);line-height:.98;letter-spacing:-.01em;opacity:0;transform:translateY(.25em)}
.c-words .c2{padding-left:18vw}
.c-words .c3{padding-left:36vw}

@media(max-width:750px){
 /* Markers: visible at once, small and quiet, with a full-size touch area. */
 .detail-marker{opacity:1;width:44px!important;min-width:44px!important;max-width:44px!important;height:44px!important}
 .detail-marker::after{inset:auto;left:50%;top:50%;width:11px;height:11px;transform:translate(-50%,-50%);border:1px solid #00000099;background:#ffffffd9;box-shadow:0 0 0 3px #ffffff33}
 .detail-hint{font-size:12px;margin-top:12px}
  .w-series{--w-h:min(52svh,520px);--w-gap:34px}
  .w-threshold{padding:0 7vw}
  .w-quote .l1,.w-quote .l2{font-size:clamp(46px,14vw,70px)}
  .w-quote .l2{padding-left:10vw}
  .w-quote .l3,.w-quote .l4{font-size:20px;white-space:normal}
  .w-head{margin-bottom:24px}.w-index{display:none}
  .w-wall{padding:0 12vw 22px 6vw;cursor:auto}
  .w-name{font-size:19px}.w-line{font-size:16px}
  .w-g span{font-size:13px}
 .project{padding:12svh 7vw}.p-lede{padding-left:0}.p-big{margin-left:0;font-size:clamp(54px,16vw,80px)}.p-body{margin:5svh 0 0;font-size:18px}
 .documentary{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:12svh 5vw 8svh}.documentary .label{grid-column:1/-1;margin:0 0 10px}
 .documentary .bts{grid-column:auto!important;grid-row:auto!important;margin:0!important;align-self:start}
 .b1{grid-column:1/-1!important}.b4{grid-column:1/-1!important}
 .quote{grid-column:1/-1!important;grid-row:auto!important;margin:40px 0!important;font-size:22px}
 .film{padding:12svh 20px}.film-frame{width:100%}.film-frame.playing{width:100%}.film-cap{font-size:14px}
 .history{display:block;padding:12svh 7vw}.history-art{position:static;margin-bottom:40px}.history-art img{max-height:70svh;width:auto;max-width:100%}
 .history-text{font-size:18px}
 .closing{height:200svh}.c-words{left:7vw;right:7vw;top:50%}.c-words span{font-size:clamp(46px,14vw,70px)}.c-words .c2{padding-left:10vw}.c-words .c3{padding-left:20vw}
}
@media(prefers-reduced-motion:reduce){.reveal-item,.reveal-pending{opacity:1;transform:none;transition:none}.w-quote .w,.w-line span,.c-words span{opacity:1;transform:none;transition:none}.film-glow{animation:none}}

/* Review pass: quiet opening controls, unboxed detail notes, and a single page measure. */
html,body{max-width:100%;overflow-x:clip}
#viewer{width:100%;max-width:100vw}
#inspection{width:100%;max-width:100vw}
.stage-controls{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .75s ease,visibility 0s .75s}
.stage.has-zoomed .stage-controls{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .75s ease}
.stage-controls button,.stage-controls a,.inspection-controls button,.inspection-status,.dialog-nav button{padding:8px 0!important;border:0!important;border-bottom:1px solid currentColor!important;border-radius:0!important;background:transparent!important;color:inherit!important;box-shadow:none!important;text-decoration:none;text-shadow:0 1px 9px #0008;}
.stage-controls a{margin-left:auto}
.excerpt{left:7%;right:auto;bottom:15%;max-width:min(28ch,70vw);padding:0;background:transparent;box-shadow:none;text-shadow:0 2px 12px #000,0 1px 28px #000;}
.inspection-controls{left:5%;right:5%;gap:clamp(14px,2.5vw,32px);padding:10px 0;text-shadow:0 1px 10px #000;}
.inspection-status{border-bottom:0!important;margin-right:auto;font-size:12px;}
.inspection-next{margin-left:0!important}
.project{padding:16svh 7vw;overflow:hidden}
.p-col{width:min(100%,64rem);margin-inline:auto}
.p-lede{max-width:56ch;margin-inline:auto;padding-left:0}
.p-big{margin-left:clamp(-8rem,-8vw,-3rem);}
.p-body{max-width:56ch;margin:7svh auto 0;}
.c-words{left:50%;right:auto;width:min(86vw,980px);transform:translateX(-50%);text-align:center}
.c-words .c2,.c-words .c3{padding-left:0}
@media(max-width:750px){.excerpt{left:6%;right:6%;bottom:17%;max-width:30ch}.stage-controls{left:6%;right:6%}.p-big{margin-left:0}.p-body{margin-top:5svh}.c-words{width:86vw}}
/* Apply option A from ordinary-close-tester: one centred staircase with a shared spine. */
#closing .c-words{left:50%;right:auto;top:52%;width:max-content;max-width:86vw;margin:0;text-align:left;transform:translateX(-50%)}
#closing .c-words .c2{padding-left:2.6em}
#closing .c-words .c3{padding-left:5.2em}
#closing .c-words span{font-size:clamp(46px,7.2vw,132px);letter-spacing:-.018em}
.bts-head{grid-column:1/-1;white-space:nowrap;font-size:clamp(34px,7.5vw,108px);line-height:.98;letter-spacing:-.025em;margin:0 0 -3svh}
@media(max-width:750px){#closing .c-words{top:54%;max-width:88vw}#closing .c-words .c2{padding-left:1.2em}#closing .c-words .c3{padding-left:2.4em}#closing .c-words span{font-size:clamp(42px,12vw,74px)}.bts-head{font-size:clamp(32px,8.5vw,60px);margin-bottom:8px}}
/* A sitter’s words follow the project statement as part of its account of representation. */
.p-col .alice-voice{max-width:46ch;margin:clamp(52px,8svh,96px) auto 0;padding:0;border:0;font:400 clamp(22px,1.75vw,28px)/1.48 Williwaw,Georgia,serif;color:inherit}
.p-col .alice-voice p{margin:0;text-wrap:pretty}
.p-col .alice-voice footer{margin-top:22px;font:13px/1.5 Arial,Helvetica,sans-serif;color:#666}
@media(max-width:750px){.p-col .alice-voice{margin-top:7svh;font-size:22px}}


/* The encounter controls and sitter caption sit over artwork, regardless of the page theme. */
body.ordinary-page .encounter .stage {color:#fff}
body.ordinary-page .encounter .excerpt {color:#fff;background:#000000d9;text-shadow:0 1px 8px #000;padding:12px 18px}
body.ordinary-page .encounter .stage-controls,
body.ordinary-page .encounter .stage-controls button,
body.ordinary-page .encounter .stage-controls a {color:#fff;text-shadow:0 1px 6px #000}
body.ordinary-page .encounter .stage-controls button {background:#000000e8}
body.ordinary-page .encounter .stage-controls a {text-decoration-color:#ffffffaa}

/* Fit the opening artwork before enabling its deliberate zoom transitions. */
.stage:not(.ready)>img{transition:none!important}.stage.ready>img{transition:width var(--zoom-duration,2000ms) cubic-bezier(.42,0,.25,1),height var(--zoom-duration,2000ms) cubic-bezier(.42,0,.25,1),left var(--zoom-duration,2000ms) cubic-bezier(.42,0,.25,1),top var(--zoom-duration,2000ms) cubic-bezier(.42,0,.25,1)}

/* Keep the opening encounter gesture-led on touch; the visitor has explicit next/read controls. */
@media(max-width:750px){body.ordinary-page .encounter .stage{touch-action:none;overscroll-behavior:contain}}
/* A quiet film frame: let the moving image carry the moment. */
.film{min-height:0;padding:clamp(88px,11svh,150px) 32px;background:#000}
.film-beam,.film-grain,.film-glow{display:none!important}
.film-frame{width:min(72vw,1280px);box-shadow:none;border:0;background:transparent}
.film-frame::after{background:linear-gradient(180deg,#0003,transparent 28%,transparent 68%,#0005)}
.film-frame.playing{width:min(84vw,1440px)}
@media(max-width:750px){.film{padding:72px 20px}.film-frame,.film-frame.playing{width:100%}}
