/**
 * Header Double Display Fix
 * 
 * PROBLEM: The theme had a CSS gap between 992px-1199px viewport widths
 * where BOTH the desktop header (.header--1) AND mobile header (.header--mobile)
 * were visible, causing a "double header" issue.
 *
 * ROOT CAUSE:
 * - @media (max-width: 991px): Desktop header hidden, mobile header shown
 * - @media (min-width: 1200px): Mobile header hidden  
 * - GAP 992px-1199px: NO RULE = both visible!
 *
 * FIX: Hide mobile header at 992px and above (closes the gap)
 * Created: 2025-12-09
 */

/* Hide mobile header from 992px and up (tablet landscape and desktop) */
@media (min-width: 992px) {
    .header--mobile {
        display: none !important;
    }
    
    /* Also hide mobile bottom navigation bar */
    .navigation--footer {
        display: none !important;
    }
}