/* Scroll scenes preserve normal document scrolling and remain readable without JS. */
.cinema-second-label{display:none}
.second-project .cinema-first-label{display:none}
.second-project .cinema-second-label{display:block}
.hero{padding-bottom:65px;min-height:90svh;display:flex;flex-direction:column;justify-content:center}.hero-bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-top:46px}.hero-note{padding-bottom:0;max-width:520px}.hero-note blockquote{font-size:clamp(22px,2.2vw,32px);margin-bottom:0}.hero-note::before{margin-bottom:18px}.hero-bottom>.text-link{flex-shrink:0}
main::after{display:none}
.cinema{background:var(--orange);position:relative;scroll-margin-top:0}.cinema-sticky{position:relative;height:90svh;min-height:520px;background:var(--ink);overflow:hidden}.cinema-window{position:absolute;inset:0;overflow:hidden;background:var(--ink)}.cinema-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}.cinema-second{display:none}.cinema-shade{position:absolute;inset:0;background:linear-gradient(0deg,#000b,transparent 45%),linear-gradient(90deg,#0008,transparent 75%)}.cinema-title{position:absolute;left:var(--pad);top:12%;max-width:10em;color:white;font-size:clamp(50px,7.4vw,120px);line-height:1.02;letter-spacing:-.055em}.cinema-title em{font-family:Georgia,serif;font-weight:400}.cinema-second-title{display:none;position:absolute;left:var(--pad);top:12%;color:white;font-size:clamp(50px,7.4vw,120px);line-height:1.02;letter-spacing:-.055em}.cinema-caption{position:absolute;left:var(--pad);right:var(--pad);bottom:65px;display:flex;align-items:end;justify-content:space-between;color:white;font-size:16px;gap:20px}.cinema-caption small{font-size:13px;opacity:.8}.cinema-counter{font-size:14px;letter-spacing:.16em}.cinema-open{border:1px solid #fff9;background:#15171499;backdrop-filter:blur(12px);color:white;padding:13px 20px;min-height:48px;border-radius:40px;display:flex;align-items:center;gap:28px;font-size:15px}.cinema-open span{font-size:24px;line-height:1}.cinema-open:hover{background:white;color:var(--ink)}.cinema-skip{position:absolute;bottom:12px;right:var(--pad);z-index:3;color:white;font-size:14px;padding:10px;text-underline-offset:4px}.cinema-progress{display:none}
.motion-on .cinema{height:270svh}.motion-on .cinema-sticky{position:sticky;top:0;height:100svh;min-height:0;background:var(--orange)}.motion-on .cinema-window{clip-path:inset(var(--scene-y,9%) var(--scene-x,16%) round var(--scene-radius,20px));will-change:clip-path}.motion-on .cinema-image{will-change:transform;transform:scale(var(--scene-scale,1.18))}.motion-on .cinema-second{display:block;clip-path:inset(0 0 0 var(--scene-wipe,100%))}.motion-on .cinema-title{opacity:var(--scene-title,0);transform:translateY(var(--scene-title-y,30px))}.motion-on .cinema-second-title{display:block;opacity:var(--scene-copy2,0);transform:translateY(var(--scene-copy2-y,30px))}.motion-on .cinema-caption{opacity:var(--scene-caption,0)}.motion-on .cinema-skip{color:var(--ink);background:var(--paper);border-radius:30px;bottom:15px;right:22px;padding:8px 16px;text-decoration:none}.motion-on .cinema-progress{display:block;position:absolute;left:0;bottom:0;right:0;height:4px;background:#ffffff20}.cinema-progress span{display:block;height:100%;background:var(--green);transform:scaleX(var(--scene-progress,0));transform-origin:left}
@media(max-width:600px){.hero{min-height:auto;padding-bottom:38px}.hero-bottom{margin-top:32px;align-items:flex-start;gap:20px;flex-direction:column}.hero-note{max-width:100%}.hero-note blockquote{font-size:24px}.cinema-sticky{height:80svh;min-height:480px}.cinema-title,.cinema-second-title{font-size:clamp(42px,11vw,65px);top:13%;max-width:7em}.cinema-image{object-position:52% center}.cinema-caption{bottom:80px;left:24px;right:24px;flex-wrap:wrap;gap:12px;font-size:14px}.cinema-counter{display:none}.cinema-open{padding:10px 14px;font-size:14px;gap:14px}.motion-on .cinema{height:230svh}.motion-on .cinema-skip{right:12px;bottom:12px;font-size:12px}}
/* Each project is a large sheet: the next one slides over the previous one. */
.work{padding-top:100px}.work::before{display:none}.projects{display:block;isolation:isolate}.project:nth-child(n){width:100%;margin:0 0 100px;padding:0;background:var(--ink)}.project-image img,.project:nth-child(n) img{aspect-ratio:2;object-fit:cover}.project-caption h3{font-size:clamp(30px,4vw,60px)}.project-caption h3 br{display:none}.project-caption h3 br::after{content:' '}.project-caption{align-items:center}.project-caption p{font-size:16px}.project-caption .index{font-size:18px}.project-aside{max-width:45em}.open-project{width:64px;height:64px;bottom:24px;right:24px;font-size:36px;transition:transform .35s,background .35s}.project-button:hover .open-project{transform:rotate(90deg);background:white}.project-image{border-radius:4px}.project-caption h3{line-height:1.1}.project-button:focus-visible{outline-offset:8px}
.motion-on .project{position:sticky;top:26px;transform:scale(var(--card-scale,1));transform-origin:center top;will-change:transform;box-shadow:0 -30px 45px var(--ink);padding-bottom:28px}.motion-on .project:nth-child(1){z-index:1}.motion-on .project:nth-child(2){z-index:2}.motion-on .project:nth-child(3){z-index:3}.motion-on .project:nth-child(4){z-index:4}.motion-on .project-image img{height:clamp(260px,63svh,760px);aspect-ratio:auto;transform:scale(var(--card-image-scale,1.06));will-change:transform}.motion-on .project-image::after{content:'';position:absolute;inset:0;background:var(--ink);opacity:var(--card-shade,0);pointer-events:none}.motion-on .project-button:hover img{transform:scale(calc(var(--card-image-scale,1.06) + .025))}.motion-on .project-caption{background:var(--ink)}
.portrait-copy strong{font-weight:600;background:linear-gradient(transparent 65%,#ffffff90 65%)}
.project-caption h3 br{display:block}.project-caption h3 br::after{content:none}
.cinema-open:focus-visible,.cinema-skip:focus-visible{outline:3px solid var(--green);outline-offset:5px}
.cinema-shade{background:linear-gradient(180deg,#000a 0%,#0008 35%,transparent 65%),linear-gradient(0deg,#000c,transparent 45%)}
.header.scrolled .nav{position:fixed;right:24px;top:18px;background:#f5f4efe8;backdrop-filter:blur(18px);padding:6px 7px 6px 24px;border-radius:40px;box-shadow:0 6px 30px #0002;color:var(--ink);gap:24px}.header.scrolled .nav .contact-link{border-radius:30px}
@media(max-width:600px){.header.scrolled .menu-button{position:fixed;right:16px;top:16px;z-index:11;border:1px solid #fff6;border-radius:30px}.header.scrolled .nav{top:73px;right:16px;background:var(--ink);color:white;padding:14px 20px;border-radius:18px;gap:5px}.header.scrolled .nav .contact-link{background:var(--green);color:var(--ink)}.cinema-title,.cinema-second-title{top:15%}.motion-on .cinema-window{will-change:auto}.dialog-top,.dialog-bottom{padding:16px}.dialog-image{max-height:62svh}}
@media(max-height:600px) and (min-width:601px){.motion-on .project{position:relative;top:auto;transform:none}.motion-on .project-image img{height:65svh}.cinema-title,.cinema-second-title{font-size:clamp(38px,6vw,70px)}}
dialog{width:min(1480px,96vw);max-height:94svh;background:var(--ink);color:white;overflow-x:hidden}.dialog-image{max-height:70svh;background:#10110f;touch-action:pan-y pinch-zoom}.dialog-top h2{font-size:clamp(24px,2.6vw,40px)}.dialog-top,.dialog-bottom{padding:18px 28px}.dialog-close{border-color:#ffffff65;border-radius:50%}.dialog-close:hover,.gallery-controls button:hover:not(:disabled){background:var(--green);color:var(--ink)}.gallery-controls button{border-color:#ffffff70;border-radius:50%}.dialog-bottom p{color:#d4d5ce}.dialog-image{view-transition-class:project-image}
::view-transition-group(project-focus){animation-duration:.65s;animation-timing-function:cubic-bezier(.22,1,.36,1)}::view-transition-old(root),::view-transition-new(root){animation:none}
::view-transition{pointer-events:none}
@media print{.cinema,.motion-on .cinema{height:auto}.cinema-sticky,.motion-on .cinema-sticky{position:relative;height:500px;min-height:0}.cinema-window,.motion-on .cinema-window{clip-path:none}.cinema-image,.motion-on .cinema-image{transform:none}.cinema-first{opacity:1}.cinema-second,.cinema-second-title,.cinema-progress,.cinema-skip,.cinema-open{display:none!important}.cinema-title,.cinema-caption{opacity:1!important;transform:none!important}.motion-on .project{position:relative;top:auto;transform:none!important;box-shadow:none}.motion-on .project-image img{height:auto;transform:none!important}.motion-on .project-image::after{display:none}}
@media(max-width:600px){.work{padding-top:65px}.project:nth-child(n){margin-bottom:45px;padding:0}.motion-on .project{top:16px;padding-bottom:22px}.motion-on .project-image img{height:48svh;min-height:260px}.project-caption h3{font-size:30px;max-width:8em}.project-caption p{font-size:14px}.project-caption .index{font-size:14px}.project-caption{padding:18px 0}.open-project{width:48px;height:48px;bottom:16px;right:16px;font-size:28px}.project-aside{font-size:15px;line-height:1.5}.project:nth-child(n) img{aspect-ratio:1.25}.work-end{margin-top:10px}}
@media(prefers-reduced-motion:reduce){.motion-on .cinema{height:auto}.motion-on .cinema-sticky{position:relative;height:85svh;min-height:520px}.motion-on .cinema-window{clip-path:none;will-change:auto}.motion-on .cinema-image{transform:none;will-change:auto}.motion-on .cinema-second,.motion-on .cinema-second-title,.cinema-progress{display:none}.motion-on .cinema-title,.motion-on .cinema-caption{opacity:1;transform:none}.motion-on .project{position:relative;top:auto;transform:none;box-shadow:none}.motion-on .project-image img{transform:none;will-change:auto}.motion-on .project-image::after{display:none}}
