Behaviour layer
| file | what it does |
|---|---|
components/wire.ts | mega-menu (hover/click/Escape), FAQ accordion, country selector |
components/animations.ts | hero state machine, stats marquee, rating roll-up, scroll reveals |
All of it mirrors nsave's own implementation rather than approximating it:
- the hero is the original
hero-load--pending/--animating/--settledCSS machine, settled after the durations declared in its own--hero-*-mscustom properties; - the stats strip uses nsave's
stats-marquee-ltrkeyframes and--marquee-distance; - the mega-menu animates the CSS
translate/opacityproperties (the utilities it names, liketranslate-y-[32px], are not in nsave's stylesheet, so inline styles are what the live site actually animates); - rating digits roll up from
translateY(calc(0 * 1lh))to the value nsave server-rendered, driven by the enclosing section entering the viewport; - reduced-motion is respected (marquee and reveals switch off, as in nsave's CSS).
Source captured: 2026-10-11