/**
 * Mobile-only banners (show_desktop off): viewport width alone is not enough —
 * resized desktop windows must not show them. Use coarse/touch vs fine pointer.
 *
 * banner-mobile-viewport = (max-width: 1023px) and (not ((hover: hover) and (pointer: fine)))
 */

/* —— Visibility —— */
@media (max-width: 1023px) and (not ((hover: hover) and (pointer: fine))) {
    :is(.home-banners-stack, .index-banners-stack, .footer-banners-stack):not(.banner-stack--desktop) {
        display: flex;
    }
}

:is(.home-banners-stack, .index-banners-stack, .footer-banners-stack).banner-stack--desktop {
    display: flex;
}

@media (hover: hover) and (pointer: fine) {
    :is(.home-banners-stack, .index-banners-stack, .footer-banners-stack):not(.banner-stack--desktop) {
        display: none !important;
    }
}

/* Narrow desktop + mobile-only config: hero spacing like full desktop (no banner gap) */
@media (max-width: 1023px) and (hover: hover) and (pointer: fine) {
    body.page-hero-zone-b .page-hero-band.page-hero-band--zone-a-mobile-only,
    body.page-hero-zone-b #top.page-hero-band--zone-a-mobile-only,
    body.page-hero-zone-b:not(:has(.home-banners-stack.banner-stack--desktop)) .page-hero-band,
    body.page-hero-zone-b:not(:has(.home-banners-stack.banner-stack--desktop)) #top.page-hero-band {
        --page-hero-edge-gap: 0.25rem;
        padding-top: 1.25rem !important;
    }

    body.page-hero-zone-b .page-hero-follow.page-hero-follow--zone-b-mobile-only,
    body.page-hero-zone-b .page-hero-follow.page-hero-follow--no-zone-b {
        padding-top: 0 !important;
    }

    body.page-hero-zone-b:not(:has(.index-banners-stack.banner-stack--desktop)) .page-hero-band,
    body.page-hero-zone-b:not(:has(.index-banners-stack.banner-stack--desktop)) #top.page-hero-band {
        padding-bottom: 1.25rem !important;
    }
}