fix: mobile menu now renders in front of hero banner video on mobile

- Moved mobile drawer (and AnimatePresence) out of <nav> into sibling in React fragment so its z-index is evaluated at root stacking context (was previously confined inside nav's z context).
- Raised mobile menu container to z-[9999], sliding panel to z-[10000].
- Bumped LanguageSwitcher backdrop/dropdown to z-[9998]/z-[9999] for when opened from inside mobile menu.
- Lowered hero video to z-0 and gradient to z-5 (true background).
- Nav back to z-[50] (still above normal content).
- This ensures the full mobile menu (hamburger + drawer + language dropdown when clicked inside it) always stacks above the mobile_banner video and is fully visible.

app/page.tsx

@@ -196,7 +196,7 @@ export default function ShahiKitchenHomepage() {
           muted
           playsInline
           preload="auto"
-          className="absolute inset-0 z-10 w-full h-full object-cover 
+          className="absolute inset-0 z-0 w-full h-full object-cover 
                      object-[50%_10%] sm:object-[50%_12%] md:object-[50%_16%] 
                      lg:object-[50%_20%] xl:object-[50%_24%]"
           onError={(e) => console.error('Hero banner video failed to load', e)}
@@ -217,7 +217,7 @@ export default function ShahiKitchenHomepage() {
         </video>
 
         {/* Subtle gradient to improve visibility of baked-in text */}
-        <div className="absolute inset-0 z-20 bg-gradient-to-b from-black/5 via-transparent to-black/30" />
+        <div className="absolute inset-0 z-5 bg-gradient-to-b from-black/5 via-transparent to-black/30" />
       </section>
 
       {/* ADVANCED SIGNATURE MENU */}