/* ==========================================
   PAGE HERO VIDEOS - SEPARATE PHONE VIDEO
   Below 768px the live site swaps the landscape banner for a
   portrait video in an 800px tall section. Used by About,
   Products, SPM and Global Export.
========================================== */

.hero-mobile-video {
    display: none;
}

@media (max-width: 767px) {
    .has-mobile-hero {
        height: 800px !important;
        min-height: 0 !important;
        aspect-ratio: auto !important;
    }

    .has-mobile-hero > video:not(.hero-mobile-video) {
        display: none !important;
    }

    .has-mobile-hero > .hero-mobile-video {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }
}