/* ===============================
   HERO VIDEO FIXES ONLY
   =============================== */

/* =========================================
   Media container for videos only
   ========================================= */
.hero .item .media-container {
    position: relative;
    width: 100%;
    overflow: hidden;
}

/* Portrait slides: taller container */
.hero .item.portrait .media-container {
    height: 0;
    padding-bottom: 133.3%; /* 4:3 portrait ratio */
}

/* Landscape slides: wider container */
.hero .item.landscape .media-container {
    height: 0;
    padding-bottom: 56.25%; /* 16:9 landscape ratio */
}

/* Make video fill container */
.hero .item .media-container video {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    object-fit: cover;
}

/* videos: height dominates */
.hero .item.portrait .media-container video,
.hero .item.landscape .media-container video {
    width: 100%;
    height: 100%;
}

@media (max-width: 640px) {
    .hero--small  .item.landscape,
    .hero--small.item.landscape .row {
        height: 100%;
    }
    .hero--small .item.landscape .row img {
        min-width: 100% !important;
        min-height: 100% !important;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        object-fit: cover;
    }
}