Fix jarring smooth scroll with sine-based easing

- Replace easeInOutQuad with easeInOutSine for natural motion
- Add user interruption handling (cancel on wheel/touch/keyboard)
- Add accessibility support for prefers-reduced-motion
- Optimize duration from 1800ms to 1200ms
- Add proper cleanup of event listeners and animation frames
- Update all component references to use new duration

The sine-based easing creates smooth, consistent motion throughout
the entire scroll duration without jarring speed changes.

apps/website/components/HeroSection.vue

@@ -101,11 +101,11 @@ const handlePhoneClick = () => {
 }
 
 const handleServicesClick = () => {
-  scrollToElement('#services', 1800) // 1.8 seconds for smoother scrolling
+  scrollToElement('#services', 1200) // Smooth scrolling with sine easing
 }
 
 const handleScrollToExplore = () => {
-  scrollToElement('#services', 1800) // Scroll to services section
+  scrollToElement('#services', 1200) // Smooth scroll to services section
 }
 
 const handleVideoVisibility = () => {
@@ -136,7 +136,7 @@ const initSmoothScroll = () => {
       if (!href) {
         return
       }
-      scrollToElement(href, 1800) // 1.8 seconds for smoother scrolling
+      scrollToElement(href, 1200) // Smooth scrolling with sine easing
     })
   })
 }