Fix iPhone Safari viewport issue - hero section now fills entire screen

- Removed safe area padding from .hero-voyage container (was reducing height)
- Simplified video container positioning to fill parent (top:0, bottom:0)
- Applied safe area padding only to .hero-content to protect text/buttons
- Container now uses full viewport height without reduction

The issue was that adding safe area padding to the container itself was
reducing the available height instead of extending it. Safe areas should
only protect content from being obscured, not shrink containers.

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

@@ -399,31 +399,27 @@ html {
 .hero-voyage {
     position: relative;
     height: 100vh; /* Fallback for browsers that don't support newer units */
-    height: -webkit-fill-available; /* iOS Safari */
+    height: -webkit-fill-available; /* iOS Safari - fills available space */
     height: 100dvh; /* Dynamic viewport height */
-    min-height: 100vh;
-    min-height: -webkit-fill-available;
-    min-height: 100dvh;
     overflow: hidden;
     overscroll-behavior-y: none;
     -webkit-overflow-scrolling: touch;
     overflow-x: hidden !important;
     max-width: 100vw !important;
     contain: layout;
-    /* Extend into safe areas on iOS */
-    padding-top: env(safe-area-inset-top);
-    padding-bottom: env(safe-area-inset-bottom);
+    /* NO padding here - let container fill entire viewport */
+    /* Safe areas will be applied to content only */
 }
 
 .hero-video-container {
     position: absolute;
-    /* Extend beyond safe areas */
-    top: calc(-1 * env(safe-area-inset-top));
+    /* Simple positioning - fill entire parent container */
+    top: 0;
     left: 0;
     right: 0;
-    bottom: calc(-1 * env(safe-area-inset-bottom));
+    bottom: 0;
     width: 100%;
-    height: calc(100% + env(safe-area-inset-top) + env(safe-area-inset-bottom));
+    height: 100%;
     overflow: hidden;
     z-index: 1;
 }
@@ -460,14 +456,14 @@ html {
     position: relative;
     z-index: 10;
     height: 100%;
-    object-fit: cover;
     width: 100%;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     text-align: center;
-    padding: var(--space-md);
+    /* Apply safe area padding HERE to protect content from being obscured */
+    padding: max(env(safe-area-inset-top), var(--space-md)) var(--space-md) max(env(safe-area-inset-bottom), var(--space-md));
 }
 
 .trust-badge {