Fix critical mobile optimizations for iPhone

- Update viewport meta to prevent zoom-out issues
- Add video preload and smooth fallback transitions
- Implement iOS overscroll bounce prevention
- Center service offering buttons properly
- Add mobile-specific padding and touch target sizing
- Optimize video loading with canplaythrough event
- Add fade-out transition for fallback image

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

apps/website/assets/css/voyage-layout.css

@@ -397,6 +397,9 @@ html {
     height: 100vh;
     min-height: 600px;
     overflow: hidden;
+    /* Prevent iOS overscroll bounce */
+    overscroll-behavior-y: none;
+    -webkit-overflow-scrolling: touch;
 }
 
 .hero-video-container {
@@ -424,6 +427,13 @@ html {
     background-position: center;
     background-repeat: no-repeat;
     z-index: -1;
+    opacity: 1;
+    transition: opacity 0.5s ease-in-out;
+}
+
+.hero-image-fallback.fade-out {
+    opacity: 0;
+    pointer-events: none;
 }
 
 .hero-overlay {
@@ -1415,6 +1425,11 @@ html {
     transition: var(--transition);
     opacity: 1;
     visibility: visible;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    text-align: center;
+    margin: 0 auto;
 }
 
 /* Non-featured card buttons */