.legacy-screens-section{position:relative;min-height:220vh;width:100%;background-color:var(--color-bg);}.legacy-screens-sticky{position:sticky;top:0;height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;--progress:0;}.legacy-screens-container{position:relative;width:min(90vw,400px);aspect-ratio:9 / 19.5;}.legacy-screen{position:absolute;width:100%;height:100%;border-radius:clamp(24px,4vw,40px);overflow:hidden;box-shadow:0 25px 50px -12px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.1);will-change:transform;--adjusted:0;--start-x:0;--start-y:0;--end-x:0;--end-y:0;--start-rotate:0deg;--end-rotate:0deg;transform:translateX(calc(var(--start-x) + (var(--end-x) - var(--start-x)) * var(--adjusted))) translateY(calc(var(--start-y) + (var(--end-y) - var(--start-y)) * var(--adjusted))) rotate(calc(var(--start-rotate) + (var(--end-rotate) - var(--start-rotate)) * var(--adjusted)));object-fit:contain;}.legacy-screen img{width:100%;height:100%;object-fit:cover;}.legacy-content{position:absolute;bottom:10%;left:50%;transform:translateX(-50%);text-align:center;opacity:calc(var(--progress) * var(--progress));pointer-events:none;}.legacy-content h2{font-size:clamp(1.5rem,4vw,2.5rem);font-weight:600;margin-bottom:.5rem;}.legacy-content p{font-size:clamp(.875rem,2vw,1.125rem);opacity:.7;}.navigation-screens-section{position:relative;min-height:150vh;width:100%;}.navigation-screens-sticky{position:sticky;top:0;height:100vh;width:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;--progress:0;}.navigation-screens-container{position:relative;width:100%;height:80vh;display:flex;align-items:center;justify-content:center;}.navigation-screen{position:absolute;width:min(70vw,350px);height:auto;background:#fff;overflow:hidden;box-shadow:0 25px 50px -12px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.1);will-change:transform;--adjusted:0;--start-y:100vh;--end-x:0;--end-y:0;transform:translateX(calc(var(--end-x) * var(--adjusted))) translateY(calc(var(--start-y) * (1 - var(--adjusted)) + var(--end-y) * var(--adjusted)));}.navigation-screen img{width:100%;height:auto;display:block;}