/* Responsive video container for widgets */
.video-container {
    position: relative;
    padding-bottom: 56.25%;
    /* 16:9 aspect ratio */
    height: 0;
    overflow: hidden;
    max-width: 100%;
}

.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* Background video styles - Ultra Specific */
html body .elementor-background-video-container {
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    overflow: hidden !important;
    z-index: 0 !important;
    pointer-events: none !important;
    opacity: 1 !important;
    visibility: visible !important;
}

html body .elementor-background-video-embed {
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    visibility: visible !important;
}

/* 
   Robust cover effect for background iframes 
   Using large viewport units to guarantee it covers everything, 
   while parents use overflow: hidden to prevent overlap.
*/
html body .elementor-background-video-embed iframe {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 115vw !important;
    height: 64.68vw !important;
    /* 115 * 9/16 */
    min-width: 100% !important;
    min-height: 100% !important;
    transform: translate(-50%, -50%) !important;
    border: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Aspect ratio specific adjustments to ensure vertical cover as well */
@media (max-aspect-ratio: 16/9) {
    html body .elementor-background-video-embed iframe {
        height: 115vh !important;
        width: 204.44vh !important;
        /* 115 * 16/9 */
    }
}

/* Ensure parents are positioned correctly and MASK the overflow */
html body .elementor-section,
html body .elementor-inner-section,
html body .elementor-column-wrap,
html body .elementor-widget-wrap {
    position: relative !important;
    overflow: hidden !important;
}

html body .elementor-background-overlay {
    z-index: 1 !important;
}

html body .elementor-container {
    position: relative !important;
    z-index: 2 !important;
}