/*
 * Mobile sub-page header fix (Media Street, 2026-06)
 * -------------------------------------------------------------
 * Problem: on sub-pages (which use header.php) the mobile rule
 *   .header { height:0; overflow:hidden }  (style.css ~line 2112)
 * clipped the ENTIRE header — banner, logo and hamburger were all
 * rendered but hidden inside a zero-height, overflow:hidden box, so
 * mobile users had no logo and no way to open the menu.
 *
 * The homepage is unaffected: it uses a different template with no
 * .header element, so these rules only ever touch sub-pages.
 *
 * Fix: un-clip .header on mobile and lay the logo (centred) and
 * hamburger (top-right) over the banner, matching the homepage.
 * Loaded after style.css; !important so it wins regardless of the
 * Asset CleanUp CSS combine/minify order.
 */
@media (max-width: 750px) {

    /* un-clip the header so its contents are visible again */
    .header {
        height: auto !important;
        overflow: visible !important;
        position: relative !important;
    }

    /* make .header the positioning context for logo + hamburger */
    .header .container {
        position: static !important;
    }

    /* logo: show it (it carries .nomobile) and align it left on the banner */
    .header .logo_container.nomobile {
        display: block !important;
        position: absolute !important;
        top: 22px !important;
        left: 20px !important;
        right: auto !important;
        margin: 0 !important;
        transform: none !important;
        width: 165px !important;
        text-align: left !important;
        z-index: 6 !important;
    }
    .header .logo_container.nomobile img {
        width: 100% !important;
        height: auto !important;
    }

    /* hamburger: pin to the top-right of the banner */
    .header .absolute.ham_absolute {
        position: absolute !important;
        top: 26px !important;
        right: 20px !important;
        left: auto !important;
        margin: 0 !important;
        z-index: 7 !important;
    }

    /* hide the empty black mobile-menu placeholder strip */
    .header #mob-menu {
        display: none !important;
    }

    /* size the banner to its image (was fixed 500px, leaving a white gap) */
    .header .nodesktop,
    .header .nodesktop .glide_header,
    .header .nodesktop .glide__slide {
        height: auto !important;
    }
    .header .nodesktop .glide__slide img {
        display: block !important;
    }
}