/*
 * WAHAJ • precision media/layout fixes
 * Scoped to media boxes; original GSAP ScrollTrigger, headers and other animations untouched.
 */

/* Old theme forces video max-width:max-content;width:auto. This was the root cause
   of 960px videos spilling out of 366px mobile cards and showing at wrong scale. */
html[lang="ar"] #nxr-portfolio .nxr-portfolio-item .item-img-wrap{
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate;
}
html[lang="ar"] #nxr-portfolio .nxr-portfolio-item .item-img{
  width:100%;
  overflow:hidden!important;
}
html[lang="ar"] #nxr-portfolio .nxr-portfolio-item .item-img img{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  object-fit:cover!important;
}
html[lang="ar"] #nxr-portfolio .nxr-portfolio-item.wahaj-portfolio-video-card .item-video {
  position:absolute!important;
  inset:0!important;
  top:0!important;bottom:0!important;right:0!important;left:0!important;
  overflow:hidden!important;
  display:block!important;
  height:100%!important;
  width:100%!important;
  border-radius:inherit;
}
html[lang="ar"] #nxr-portfolio .nxr-portfolio-item.wahaj-portfolio-video-card .item-video video {
  display:block!important;
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  min-width:100%!important;
  max-height:100%!important;
  min-height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  aspect-ratio:auto!important;
  pointer-events:none!important;
}
html[lang="ar"] #nxr-portfolio .nxr-portfolio-item.wahaj-portfolio-image-card .item-video{
  display:none!important;
}
html[lang="ar"] #nxr-portfolio .nxr-portfolio-item.wahaj-portfolio-image-card .item-img-wrap:hover img{
  filter:saturate(1.07)!important;
}
html[lang="ar"] #nxr-portfolio .nxr-port-year {display:none!important}

/* Image fit in service cards: never stretch people/screens. Keep source card
   dimensions and the original card GSAP animation intact. */
html[lang="ar"] #nxr-service .nxr-ser-card-item .inner-img{
  overflow:hidden;
}
html[lang="ar"] #nxr-service .nxr-ser-card-item .inner-img img{
  display:block!important;
  object-fit:cover!important;
  object-position:center!important;
  max-width:100%!important;
}
html[lang="ar"] #nxr-about .nxr-about-img-wrap .item-img img,
html[lang="ar"] #nxr-about .nxr-ab-img .item-img img,
html[lang="ar"] #nxr-why-choose .nxr-wc-part1 .item-img img,
html[lang="ar"] #nxr-why-choose .nxr-wc-part3 .item-img img,
html[lang="ar"] #nxr-blog .nxr-blog-item .blg-item-img img{
  object-fit:cover!important;
}
/* Authentic three portraits from already supplied Wahaj images. */
html[lang="ar"] .hero-photo .wahaj-team-hero-real{
  display:grid!important;
  width:100%!important;
  height:100%!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  overflow:hidden!important;
  border-radius:inherit;
  gap:3px;
  background:#1a151e;
}
html[lang="ar"] .hero-photo .wahaj-team-hero-real img{
  height:100%!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  object-fit:cover!important;
  object-position:center 22%!important;
  display:block!important;
  filter:contrast(1.04);
}
/* Widescreen video components should fill their allocated (original) media
   frame and not add extra elements to normal page flow. */
html[lang="ar"] .hero-photo.wahaj-media-stage > video.wahaj-motion-video {
  width:100%!important;
  height:100%!important;
  min-width:100%!important;
  max-width:100%!important;
  object-fit:cover!important;
  object-position:center!important;
}
html[lang="ar"] .portfolio-card.wahaj-motion-card > .wahaj-motion-video{
  left:0!important;right:0!important;
  top:0!important;width:100%!important;max-width:100%!important;
  object-fit:cover!important;object-position:center!important;
}
/* Touchscreens do not have hover, so keep videos visible inside the actual
   portfolio cards when they are playing, never outside their bounding boxes. */
@media (hover:none) and (pointer:coarse){
  html[lang="ar"] #nxr-portfolio .nxr-portfolio-item.wahaj-portfolio-video-card .item-video {
    opacity:1!important;
  }
}
/* Small widths: constrain the ancillary About photo that legacy LTR CSS
   placed to the right outside its container. */
@media(max-width:767px){
  html[lang="ar"] #nxr-about .nxr-about-text-img{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    width:100%!important;
    gap:18px!important;
  }
  html[lang="ar"] #nxr-about .nxr-about-text-img .nxr-ab-img{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:auto!important;
    margin:0!important;
  }
  html[lang="ar"] #nxr-about .nxr-about-text-img .nxr-ab-img .item-img,
  html[lang="ar"] #nxr-about .nxr-about-text-img .nxr-ab-img img{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
  }
}
/* Motion preferences are handled by existing JS, no global animation disable. */