/* OFF WORLD / seven original films, real CSS perspective and scroll-linked rotation. */
#film-journey{height:auto;background:#eceeef;padding:0;isolation:isolate}
#film-journey .film-stage{position:relative;height:auto;min-height:0;max-height:none;background:#eceeef;padding:96px 24px 100px;overflow:hidden;isolation:isolate}
#film-journey .film-space{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#film-journey .film-tile,#film-journey .film-main{position:relative;display:block;inset:auto;margin:0;padding:0;width:100%;height:auto;aspect-ratio:4/3;transform:none;opacity:1;overflow:hidden;border:0;border-radius:0;background:transparent;box-shadow:none;pointer-events:auto;cursor:inherit;z-index:auto}
#film-journey .film-main{grid-column:1/-1;aspect-ratio:16/9}
#film-journey video{display:block;width:100%;height:100%;object-fit:contain;background:transparent;pointer-events:none}
#film-journey .film-phrase{display:block;inset:0;z-index:4;color:#151719;font:450 clamp(45px,6.4vw,96px)/.9 Antonio,sans-serif;letter-spacing:-.045em;pointer-events:none}
#film-journey .film-word{position:absolute;opacity:1;left:24px;right:auto;transform:none;top:10px}
#film-journey .word-right{top:auto;bottom:12px;right:140px;left:auto}
#film-journey.depth-ready:not(.film-still){height:330svh}
#film-journey.depth-ready:not(.film-still) .film-stage{position:sticky;top:0;padding:0;height:100svh;min-height:500px;max-height:none;overflow:hidden}
#film-journey.depth-ready:not(.film-still) .film-space{display:block;width:100%;height:100%;perspective:1300px;perspective-origin:50% 50%;transform-style:flat;overflow:visible}
#film-journey.depth-ready:not(.film-still) .film-tile,#film-journey.depth-ready:not(.film-still) .film-main{position:absolute;left:0;top:0;aspect-ratio:auto;transform-origin:center;backface-visibility:hidden;will-change:transform;box-shadow:0 16px 32px #13202c1c}
#film-journey.depth-ready:not(.film-still) .word-left{transform:translateX(var(--word-travel,0%))}
#film-journey.depth-ready:not(.film-still) .word-right{transform:translateX(calc(-1 * var(--word-travel,0%)))}
@media(max-width:767px){
 #film-journey .film-stage{padding:76px 12px 84px}
 #film-journey .film-space{gap:12px 7px}
 #film-journey .film-phrase{font-size:clamp(48px,15vw,67px)}
 #film-journey .film-word{left:12px;top:12px}
 #film-journey .word-right{left:auto;right:104px;top:auto;bottom:15px}
 #film-journey.depth-ready:not(.film-still){height:260svh}
 #film-journey.depth-ready:not(.film-still) .film-stage{min-height:500px}
 #film-journey.depth-ready:not(.film-still) .film-space{perspective:850px}
 #film-journey.depth-ready:not(.film-still) .film-word{transform:none}
 #film-journey.film-still .film-space{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){#film-journey{height:auto!important}#film-journey .film-stage{position:relative!important}#film-journey .film-word{transform:none!important}}

/* Atomic compositing: whole film faces occlude by depth; never cut through each other. */