/* Scroll is the timeline. Without JS this is a readable photograph and story. */
.scroll-cinema{position:relative;background:var(--paper);color:var(--brand)}
.cinema-stage{position:relative;isolation:isolate;overflow:hidden;min-height:850px;background:#143b31}
.cinema-photo{position:absolute;inset:0;margin:0;overflow:hidden;z-index:0}
.cinema-photo>img{width:100%;height:100%;object-fit:cover;object-position:57% 52%}
.cinema-caption{position:absolute;right:45px;bottom:70px;z-index:5;color:#143b31;font-size:10px;letter-spacing:.02em;background:#f5f3edeb;padding:6px 10px;margin:0}
.cinema-shade{position:absolute;inset:0;z-index:1;background:#061e19;opacity:.42;pointer-events:none}
.cinema-curtain{display:none}
.atelier-site .cinema-title{position:relative;z-index:3;color:var(--paper);font-size:clamp(80px,11.8vw,190px);font-weight:450;line-height:.91;letter-spacing:var(--tracking-display);margin:0;padding:85px 5% 0;pointer-events:none}
.cinema-title>span{display:block}
.cinema-copy{position:relative;z-index:4;color:var(--paper);width:min(610px,45%);margin:65px 5% 110px auto}
.cinema-copy .eyebrow{color:#f5f3ed}
.atelier-site .cinema-copy .cinema-statement{font-family:var(--font-sans);font-size:clamp(38px,4.3vw,67px);line-height:1.07;letter-spacing:var(--tracking-heading);margin:20px 0 30px}
.cinema-copy .cinema-detail{font-size:15px;line-height:1.8;max-width:410px;margin-bottom:24px}
.cinema-copy .textlink{color:var(--paper)}
.cinema-footer{position:absolute;inset:auto 45px 30px;display:flex;align-items:center;justify-content:space-between;gap:30px;color:var(--paper);font-size:9px;letter-spacing:.1em;z-index:5}
.cinema-progress{display:block;width:clamp(120px,28vw,420px);height:1px;background:#f5f3ed50;overflow:hidden}
.cinema-progress i{display:block;width:100%;height:100%;background:var(--paper);transform:scaleX(var(--cinema-progress,1));transform-origin:left}
@media(min-width:761px) and (prefers-reduced-motion:no-preference){
 .scroll-cinema[data-cinema-ready=true]{height:270svh}
 [data-cinema-ready=true] .cinema-stage{position:sticky;top:88px;height:calc(100svh - 88px);min-height:570px;background:var(--paper)}
 [data-cinema-ready=true] .cinema-photo{clip-path:inset(calc((1 - var(--cinema-expand,0))*18%) calc((1 - var(--cinema-expand,0))*23%));will-change:clip-path}
 [data-cinema-ready=true] .cinema-photo>img{transform:scale(var(--cinema-scale,1.08));will-change:transform}
 [data-cinema-ready=true] .cinema-shade{opacity:var(--cinema-shade,.08);clip-path:inset(calc((1 - var(--cinema-expand,0))*18%) calc((1 - var(--cinema-expand,0))*23%))}
 [data-cinema-ready=true] .cinema-curtain{position:absolute;display:block;top:0;bottom:0;width:40%;background:var(--paper);z-index:2;will-change:transform}
 [data-cinema-ready=true] .cinema-curtain-left{left:0;transform:translateX(calc(var(--cinema-open,0)*-110%));border-right:1px solid #143b3122}
 [data-cinema-ready=true] .cinema-curtain-right{right:0;transform:translateX(calc(var(--cinema-open,0)*110%));border-left:1px solid #143b3122}
 .cinema-curtain>span{position:absolute;top:38px;font-size:9px;letter-spacing:.1em;color:var(--brand)}
 .cinema-curtain-left>span{left:45px}.cinema-curtain-right>span{right:45px}
 .atelier-site [data-cinema-ready=true] .cinema-title{position:absolute;top:20%;left:5%;right:0;padding:0;margin:0;color:var(--paper);mix-blend-mode:difference;transform:translate3d(var(--cinema-title-x,0px),var(--cinema-title-y,0px),0);will-change:transform,opacity;white-space:nowrap;opacity:clamp(0,calc((1 - var(--cinema-open,0))*2.5),1)}
 [data-cinema-ready=true] .cinema-title>span:nth-child(2){padding-left:15%}
 [data-cinema-ready=true] .cinema-copy{position:absolute;top:26%;left:47%;width:48%;margin:0;padding:0 4% 0 0;transform:translateY(var(--cinema-copy-y,300px));opacity:var(--cinema-copy-opacity,0);will-change:transform,opacity}
 [data-cinema-ready=true] .cinema-footer{mix-blend-mode:difference;color:var(--paper)}
 [data-cinema-ready=true] .cinema-caption{opacity:var(--cinema-copy-opacity,0)}
 [data-cinema-ready=true]:focus-within .cinema-copy{opacity:1;transform:none}
 [data-cinema-ready=true]:focus-within .cinema-title{opacity:.16}
}
@media(min-width:761px) and (max-width:1100px){[data-cinema-ready=true] .cinema-stage{top:78px;height:calc(100svh - 78px)}}
@media(max-width:760px){
 .cinema-stage{min-height:0;padding-bottom:1px}
 .cinema-photo{position:relative;height:105vw;max-height:650px}
 .cinema-caption{position:relative;inset:auto;margin:0 20px 25px;width:fit-content;font-size:9px;max-width:85%}
 .cinema-shade{display:none}
 .atelier-site .cinema-title{font-size:clamp(58px,14vw,94px);padding:35px 20px 0;line-height:.98}
 .cinema-copy{width:auto;margin:35px 20px 60px}
 .atelier-site .cinema-copy .cinema-statement{font-size:37px;max-width:18ch}
 .cinema-copy .cinema-detail{font-size:13px;max-width:40ch}
 .cinema-footer{position:relative;inset:auto;margin:0 20px 25px;font-size:8px;gap:15px}
 .cinema-footer>span:first-child{display:none}
}
@media(prefers-reduced-motion:reduce){.cinema-footer>span:first-child{display:none}.cinema-progress i{transform:none}}