Mega Menu Reveal

Create a mega menu with a staggered reveal. A nav item ('Products') that opens a wide multi-column panel under the header, whose items cascade in after the panel lands. Opening: the panel drops in from opacity 0, translateY(-8px) to full over 250ms with cubic-bezier(0.22, 1, 0.36, 1), with a soft downward shadow. Then the menu items stagger: each fades and rises 6px, 200ms, 50ms apart. Closing: quick reverse of the panel (150-200ms), items leave with it. Trigger: open on hover with a ~100ms intent delay (so crossing the nav doesn't flash menus) and on click/Enter for keyboard and touch; close on mouse leaving both the trigger and panel, on Escape, and on focus moving out. Rotate the trigger's chevron 180deg in sync. Layout: full-width (or wide fixed) panel aligned under the header, 2-4 columns of items: icon in an accent-tinted rounded square + label, each row getting an accent-tinted hover background. Accessibility: aria-expanded on the trigger, the panel as a navigable region reachable by Tab. Under prefers-reduced-motion, open/close with instant fades and no stagger. Build the component, not this demo of it. - Ambient motion that IS the component may loop: a drifting background, a marquee, a spinner while something is genuinely loading. - Do not add any timer, interval, loop or script that performs a person's action by itself. No auto-hover, no auto-click, no cycling through states, no pretend submitting, no replaying the interaction on a schedule. - Every state that answers a person waits for a real event from that person. - Placeholder copy and sample content are welcome. Simulated behaviour is not.