.cinema-hero{height:225svh;position:relative;background:#100e0b}.cinema-stage{height:100svh;min-height:620px;position:sticky;top:0;overflow:hidden;isolation:isolate;--progress:0}.cinema-image{position:absolute;inset:0;overflow:hidden}.cinema-image img{height:100%;width:65%;position:absolute;right:0;object-fit:cover;object-position:50% 32%;transform:scale(var(--image-scale,1.06)) translateX(var(--drift,0px));will-change:transform}.cinema-warm{background:#291c13}.cinema-mono{background:#171917;clip-path:inset(0 var(--wipe,0%) 0 0);will-change:clip-path}.cinema-mono img{filter:contrast(1.06);object-position:50% 24%}.cinema-stage:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(12,14,12,.91),rgba(12,14,12,.35) 46%,transparent 75%),linear-gradient(0deg,rgba(0,0,0,.75),transparent 35%);pointer-events:none;z-index:1}.cinema-title{position:absolute;z-index:2;left:7vw;top:25%;transform:translateY(var(--title-y,0px));color:#f0ece3}.cinema-title h1{font:normal clamp(85px,14vw,210px)/.79 Georgia,serif;letter-spacing:-.075em;margin:36px 0 24px}.cinema-title h1>span{display:block;overflow:hidden;padding:0 .06em .1em 0;animation:title-enter 1.8s cubic-bezier(.16,1,.3,1) both}.cinema-title h1>span:nth-child(2){animation-delay:.17s}.cinema-persian{font:30px Tahoma;margin:10px 0}.cinema-title .eyebrow{animation:soft-enter 2s .3s both}.cinema-caption{position:absolute;left:7vw;right:7vw;bottom:9%;z-index:3;display:flex;align-items:center;gap:32px;font-size:14px}.cinema-caption p{font:italic 24px Georgia;margin:0}.cinema-caption a{margin-left:auto;text-decoration:none;border-bottom:1px solid #b9b5ac;padding:12px 0}.scene-number{font:11px monospace;color:#d1c8b7}.cinema-instruction{position:absolute;bottom:22px;left:7vw;z-index:3;font:10px Arial;letter-spacing:.16em;text-transform:uppercase}.cinema-track{position:absolute;bottom:0;left:0;right:0;height:3px;background:#ffffff20;z-index:4}.cinema-track span{display:block;width:calc(3% + var(--progress)*97%);height:100%;background:#ddab64}.projection{position:absolute;inset:-50%;z-index:2;pointer-events:none;background:linear-gradient(105deg,transparent 42%,#ffdfa114 48%,transparent 54%);mix-blend-mode:screen;animation:projector 11s ease-in-out infinite alternate}.frame-lines{position:absolute;inset:105px 32px 58px;border:1px solid #ffffff15;z-index:2;pointer-events:none}.motion-toggle{position:fixed;right:20px;bottom:18px;z-index:20;background:#161916e8;color:#ece8df;border:1px solid #999a8950;border-radius:30px;padding:11px 17px;font:11px Arial;cursor:pointer;backdrop-filter:blur(12px)}.masthead{z-index:10}.portrait-window{overflow:hidden;background:#d3cec5}.portrait-window svg{width:100%;height:420px;display:block}.portrait-study label{display:flex;justify-content:space-between;gap:20px}.portrait-study #portrait-play{margin:16px 0 0}.motion-reveal{opacity:1;transform:none}.motion-enabled .motion-reveal{opacity:0;transform:translateY(65px);clip-path:inset(16% 0 0 0);transition:opacity 1.15s ease,transform 1.35s cubic-bezier(.2,.75,.2,1),clip-path 1.35s ease}.motion-enabled .motion-reveal.is-visible{opacity:1;transform:none;clip-path:inset(0)}.painting-prologue{position:relative;overflow:hidden;isolation:isolate}.painting-prologue:before{content:'';position:absolute;width:95vw;height:95vw;right:-30vw;top:-45vw;border-radius:50%;background:conic-gradient(from 40deg,#cc625f70,#d4a44665,#7da98b60,#508d9d60,#ac738a60,#cc625f70);filter:blur(22px);opacity:.45;z-index:-1;transform:rotate(var(--colour-turn,0deg));will-change:transform}.art-monument{overflow:hidden}.art-monument img{transform:scale(var(--art-scale,1));transform-origin:center;will-change:transform}.art-piece{transition:transform .45s ease}.art-piece:hover{transform:translateY(-12px)}.art-strip{scroll-snap-type:x mandatory}.art-piece{scroll-snap-align:start}.motion-paused *, .motion-paused *:before,.motion-paused *:after{animation-play-state:paused!important}.motion-paused .motion-reveal{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}html[dir=rtl] .cinema-title{left:auto;right:7vw;text-align:right}html[dir=rtl] .cinema-title h1{direction:ltr}html[dir=rtl] .cinema-caption a{margin-left:0;margin-right:auto}html[dir=rtl] .cinema-caption{direction:rtl}
@keyframes title-enter{from{opacity:0;transform:translateY(95%) rotate(4deg);clip-path:inset(0 0 100% 0)}to{opacity:1;transform:none;clip-path:inset(0)}}@keyframes soft-enter{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}@keyframes projector{from{transform:translateX(-18%) rotate(-4deg)}to{transform:translateX(18%) rotate(4deg)}}
@media(max-width:700px){.cinema-hero{height:190svh}.cinema-stage{min-height:600px}.cinema-image img{width:100%;object-position:58% 28%}.cinema-stage:after{background:linear-gradient(90deg,#11131077,transparent),linear-gradient(0deg,#10120fd9,transparent 80%)}.cinema-title{top:40%;left:7vw}.cinema-title h1{font-size:clamp(78px,22vw,150px);margin:20px 0 14px}.cinema-persian{font-size:23px}.cinema-caption{bottom:12%;gap:14px;flex-wrap:wrap}.cinema-caption p{font-size:20px}.cinema-caption a{width:100%;margin:0;font-size:12px;border:0;padding:0}.cinema-instruction{bottom:57px;font-size:8px}.frame-lines{inset:94px 14px 94px}.motion-toggle{right:12px;bottom:12px}.portrait-window svg{height:390px}}
@media(prefers-reduced-motion:reduce){.cinema-hero{height:100svh;min-height:650px}.cinema-stage{position:relative}.cinema-mono{clip-path:inset(0 50% 0 0)}.cinema-title h1>span,.cinema-title .eyebrow,.projection{animation:none}.motion-enabled .motion-reveal{opacity:1;transform:none;clip-path:none;transition:none}.art-piece{transition:none}.art-piece:hover{transform:none}}
