Mobile Landscape UI: Header menus not visible

Problem

On mobile devices in landscape orientation, the header navigation menus are not visible. This is a high priority issue since we don't currently have native mobile apps - the responsive web UI is the only mobile experience.

Environment

• Device: Mobile phones in landscape orientation
• Browsers: All mobile browsers
• Pages affected: All pages with header navigation (needs audit)

Symptoms

• Header menus are cut off or completely hidden in landscape mode
• Users cannot navigate the site on mobile in landscape orientation
• Core navigation functionality is broken

Impact

• Severity: High
• User Impact: All mobile users in landscape orientation
• Business Impact: High - no native apps means web UI must work on all orientations

Scope of Work

Immediate Fix

• [ ] Fix header menu visibility in landscape orientation
• [ ] Ensure hamburger menu (if used) is accessible
• [ ] Test on common mobile viewport sizes in landscape

Full Mobile Audit Required

• [ ] Landing page / Home page
• [ ] Live page
• [ ] Artist pages
• [ ] Venue pages
• [ ] Stream player page
• [ ] Checkout flow
• [ ] Login / Registration
• [ ] Admin pages (lower priority)

Acceptance Criteria

• [ ] Header menus visible and functional on mobile landscape (all common devices)
• [ ] All navigation options accessible
• [ ] No content cut off or overlapping
• [ ] Touch targets appropriately sized (minimum 44x44px)

Technical Notes

• Check CSS media queries for landscape-specific rules
• Review viewport meta tag configuration
• Test with iOS Safari and Android Chrome at minimum
• Consider orientation: landscape media query handling

---
Priority: High
Labels: bug, mobile, UI/UX