synced scroll, no dead animations

A landing kit that survives contact with production.

Astro, GSAP and Lenis, wired together the way you'd expect them to work — not the way they do by default.

See it in motion

4 bugs fixed at the config level, not left for you to find

Every one of these is the actual reason a motion-design landing breaks in production.

scroll-triggered animations

ScrollTrigger never fires — Lenis intercepts scroll before GSAP sees it

Lenis piped into GSAP's ticker, ScrollTrigger.update on every scroll tick

image fade-ins

opacity animates before the image has decoded — reveals a blank box

animation gated on the image's real load/decode event

dead click targets

z-index from an animated layer silently eats the click

z-index architecture documented per section, islands keep their listeners

SEO / Lighthouse score

missing OG tags, broken heading order, images without alt

complete head from the base layout, semantic hierarchy, required alt

try it — this isn't a screenshot

That glow is animating right now, positioned to overlap the button below. It can't eat the click — pointer-events: noneplus the z-index scale in tokens.cssmake that architecturally impossible, not just untested. The button is also a React island hydrating with client:visible— it stays disabled until hydration is confirmed, so it's never clickable-but-broken in the gap before its listener attaches.

real screenshots, not stock mockups

See it in motion.

Every image below is a real capture of this exact kit — light, dark, and a mobile viewport with zero horizontal overflow. Click through, or use the arrow keys.