Nav Flyout
The shared header nav used across all services. Items with children get a caret; on hover or focus, panels cascade open to the right step by step (cascading flyout, amplemarket/retool-style, recursive). Data comes from the recursive tree in site-nav.ts. Nodes with href render as pages (<a>); nodes without render as categories (<button>, expand only).
Cascading Panels
Only one branch is open at a time (openPath chain) — ancestors stay open while siblings and deeper branches close. Child panels attach to the right via left: 100%, and a 140ms exit delay lets users travel diagonally without losing the panel (hover-intent). The demo below is a static representation of a three-level expansion.
Rules
With href — page (<a>); without — category (<button> — no navigation, expand only).
openPath chain keeps ancestors open and closes siblings. 140ms hover-intent delay.
Header = flyout; mobile = accordion (MobileNav); footer = flattened leaves. All share the same SITE_LINKS tree.
Hidden when signed out (visibleTree). The path is preserved if the node has public children.
navChildren — if the sole child points to the same URL as the top-level item, skip the dropdown and link directly (single-row redundant dropdowns are prohibited). Child rows use a single label with no tagline.