/* Global fixed background video (from kalakbayson.ofisarama.com) */
.global-video{position:fixed;inset:0;z-index:0;overflow:hidden;background:radial-gradient(1200px 700px at 70% 20%, rgba(255,255,255,.08), transparent 60%),linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.70));}
.global-video iframe{position:absolute;top:50%;left:50%;width:120vw;height:120vh;transform:translate(-50%,-50%);border:0;opacity:.85;pointer-events:none;}
.global-video:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.55));}

/* Many WP themes set an opaque body background which can hide a negative z-index video.
   Keep the video at z=0 and lift page content above it. */
html,body{background:transparent!important;}
body>*:not(.global-video){position:relative;z-index:1;}

/* If the theme uses opaque wrapper backgrounds, force them transparent so the video is visible. */
#page,.site,.site-content,.elementor{background:transparent!important;}

/* The hero section in this WP snapshot is configured as a full-screen container with a black
   background + overlay, and its original hosted video URL is currently not accessible.
   Make the hero background transparent so our global video shows through. */
.elementor-11 .elementor-element.elementor-element-f9a81bd,
.elementor-11 .elementor-element.elementor-element-f9a81bd:not(.elementor-motion-effects-element-type-background),
.elementor-11 .elementor-element.elementor-element-f9a81bd > .elementor-motion-effects-container > .elementor-motion-effects-layer {
  background-color: transparent !important;
}
.elementor-11 .elementor-element.elementor-element-f9a81bd::before,
.elementor-11 .elementor-element.elementor-element-f9a81bd > .elementor-background-video-container::before,
.elementor-11 .elementor-element.elementor-element-f9a81bd > .e-con-inner > .elementor-background-video-container::before,
.elementor-11 .elementor-element.elementor-element-f9a81bd > .elementor-background-slideshow::before,
.elementor-11 .elementor-element.elementor-element-f9a81bd > .e-con-inner > .elementor-background-slideshow::before,
.elementor-11 .elementor-element.elementor-element-f9a81bd > .elementor-motion-effects-container > .elementor-motion-effects-layer::before {
  background-color: transparent !important;
  opacity: 0 !important;
}
