Image 01
Structure
Two-column layout: text navigation on the left and media viewport on the right.
Sticky pin-scroll is replaced with native horizontal swipe on mobile because it is more stable for touch devices and does not conflict with changing viewport height.
Readable card layout for small screens.
Native swipe instead of forced mobile pinning.
Stable interaction and clean visual hierarchy.
The button reacts to cursor proximity. The marquee changes direction depending on scroll direction and accelerates according to scroll velocity.
The magnetic effect calculates the distance from the cursor to the button center and moves the button only via transform. The marquee reads scroll direction and velocity from scrollY changes and renders movement inside requestAnimationFrame.