/*
 * Washnah Hero Video Performance — Final
 * Shows a branded poster/gradient immediately, then fades video in only when ready.
 */
.hero-home,
#hero.hero-home {
  background:
    linear-gradient(135deg, rgba(20, 6, 9, .78), rgba(128, 25, 34, .45)),
    url("../img/hero-posters/hero-home-poster.webp") center center / cover no-repeat,
    #4d0d14;
}

.sector-hero--eco {
  background:
    linear-gradient(135deg, rgba(0, 28, 25, .84), rgba(0, 71, 65, .42)),
    url("../img/hero-posters/hero-eco-poster.webp") center center / cover no-repeat,
    #004741;
}

.sector-hero--water {
  background:
    linear-gradient(135deg, rgba(12, 36, 56, .84), rgba(73, 148, 185, .38)),
    url("../img/hero-posters/hero-water-poster.webp") center center / cover no-repeat,
    #17435d;
}

.contact-hero,
.contact-hero-pro {
  background:
    linear-gradient(135deg, rgba(33, 12, 16, .84), rgba(128, 25, 34, .38)),
    url("../img/hero-posters/hero-contact-poster.webp") center center / cover no-repeat,
    #4d0d14;
}

.vision-cta {
  background:
    linear-gradient(135deg, rgba(16, 16, 22, .84), rgba(128, 25, 34, .30)),
    url("../img/hero-posters/hero-home-poster.webp") center center / cover no-repeat,
    #1f2028;
}


.media-hero,
.news-detail-hero {
  background:
    linear-gradient(135deg, rgba(20, 6, 9, .80), rgba(128, 25, 34, .40)),
    url("../img/hero-posters/hero-home-poster.webp") center center / cover no-repeat,
    #4d0d14;
}

.media-hero .media-hero__video {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.media-hero .media-hero__overlay,
.media-hero .media-hero__inner {
  position: relative;
  z-index: 2;
}

.hero video,
#hero video,
[class*="hero"] video,
[id*="hero"] video,
.video-banner video,
.vision-cta video,
.hero-video,
.bg-video,
.washnah-hero-smart-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: transparent !important;
  transform: translateZ(0);
  backface-visibility: hidden;
  will-change: opacity, transform;
}

.washnah-hero-video-box {
  isolation: isolate;
}

.washnah-hero-smart-video {
  opacity: 0;
  transition: opacity .55s ease, filter .35s ease;
}

.washnah-hero-smart-video.is-ready,
.washnah-hero-smart-video.is-playing,
.is-video-ready > .washnah-hero-smart-video,
.is-video-ready video.washnah-hero-smart-video {
  opacity: 1;
}

.washnah-hero-smart-video.is-buffering {
  filter: saturate(.94) contrast(.98);
}

.washnah-hero-smart-video.has-video-error,
.has-video-error > .washnah-hero-smart-video,
.has-video-error video.washnah-hero-smart-video {
  opacity: 0 !important;
  visibility: hidden;
}

#preloader.is-hidden,
.preloader.is-hidden,
.loader.is-hidden,
.loading.is-hidden,
.loading-screen.is-hidden,
.page-loader.is-hidden,
.site-loader.is-hidden,
.washnah-loader.is-hidden {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

@media (max-width: 768px) {
  .hero video,
  #hero video,
  [class*="hero"] video,
  [id*="hero"] video,
  .video-banner video,
  .vision-cta video,
  .hero-video,
  .bg-video,
  .washnah-hero-smart-video {
    object-position: center center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .washnah-hero-smart-video {
    opacity: 0 !important;
    animation: none !important;
  }
}


/* Washnah final media hero gradient fix — matches the homepage hero mood */
.media-hero.video-banner,
.media-hero {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(0,0,0,.74) 0%, rgba(0,0,0,.34) 38%, rgba(0,0,0,.72) 100%),
    linear-gradient(115deg, rgba(128,25,34,.58) 0%, rgba(128,25,34,.25) 34%, rgba(0,0,0,.18) 68%, rgba(0,0,0,.58) 100%),
    url("../img/hero-posters/hero-home-poster.webp") center center / cover no-repeat,
    #111;
}

.media-hero.video-banner::before,
.media-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.10) 42%, rgba(0,0,0,.70) 100%),
    radial-gradient(circle at 18% 78%, rgba(128,25,34,.40), transparent 36%);
}

html[dir="rtl"] .media-hero.video-banner::before,
html[dir="rtl"] .media-hero::before {
  background:
    linear-gradient(180deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.10) 42%, rgba(0,0,0,.70) 100%),
    radial-gradient(circle at 82% 78%, rgba(128,25,34,.40), transparent 36%);
}

.media-hero.video-banner .media-hero__video,
.media-hero .media-hero__video {
  z-index: 0 !important;
  opacity: .62;
  filter: saturate(1.05) contrast(1.05) brightness(.74);
}

.media-hero.video-banner .media-hero__overlay,
.media-hero .media-hero__overlay {
  z-index: 2 !important;
  background:
    linear-gradient(90deg, rgba(0,0,0,.78) 0%, rgba(0,0,0,.24) 50%, rgba(0,0,0,.70) 100%) !important;
}

html[dir="rtl"] .media-hero.video-banner .media-hero__overlay,
html[dir="rtl"] .media-hero .media-hero__overlay {
  background:
    linear-gradient(-90deg, rgba(0,0,0,.78) 0%, rgba(0,0,0,.24) 50%, rgba(0,0,0,.70) 100%) !important;
}

.media-hero.video-banner .media-hero__inner,
.media-hero .media-hero__inner {
  position: relative;
  z-index: 3 !important;
}