Mobile Scroll Snap for Anchor Links

Inspired by this forum request:
https://discourse.webflow.com/t/horizontal-anchor-link-mobile-navigation-snap-to-active-anchor-link/324774/2
This custom code creates a horizontal scrolling navigation bar that automatically tracks which section of the page is currently being viewed and keeps the corresponding navigation link visible by smoothly scrolling the navigation bar left or right. When a section comes into view, its matching navigation link becomes active (with a bold style), and the code ensures this active link stays visible in the navigation bar by automatically centering it within the viewport on mobile devices, creating a smooth, user-friendly experience similar to what you'd see in apps like Instagram's story navigation or Apple's product pages.