/* NoorVista R9.3 — mobile hero visibility stacking correction.
 * R9.2 already computes the correct height from the active image ratio.
 * This layer only guarantees that the selected mobile artwork is painted above
 * legacy hero background/fill layers and is not visually suppressed by a veil.
 */
@media (max-width: 760px) {
  html body.nv-home-page .nv-home-slide {
    position: absolute !important;
    isolation: isolate !important;
    overflow: hidden !important;
  }

  html body.nv-home-page .nv-home-slide::before {
    z-index: 0 !important;
    pointer-events: none !important;
  }

  html body.nv-home-page .nv-home-slide__picture,
  html body.nv-home-page .nv-home-slide__picture.is-adaptive {
    position: absolute !important;
    inset: 0 !important;
    z-index: 2 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    background: transparent !important;
    filter: none !important;
    transform: none !important;
    pointer-events: none !important;
  }

  html body.nv-home-page .nv-home-slide__picture .nv-home-slide__image,
  html body.nv-home-page .nv-home-slide__picture.is-adaptive .nv-home-slide__image,
  html body.nv-home-page .nv-home-slide > .nv-home-slide__image {
    position: absolute !important;
    inset: 0 !important;
    z-index: 2 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    object-fit: contain !important;
    object-position: center center !important;
    background: transparent !important;
    filter: none !important;
    transform: none !important;
  }

  /* Dedicated mobile artwork is already composed for the mobile canvas. Do not
   * place the legacy darkening veil over it; that veil was obscuring the image.
   */
  html body.nv-home-page .nv-home-slide[data-has-mobile-artwork="true"] .nv-home-slide__veil {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
  }

  html body.nv-home-page .nv-home-slide:not([data-has-mobile-artwork="true"]) .nv-home-slide__veil {
    z-index: 3 !important;
    pointer-events: none !important;
  }

  html body.nv-home-page .nv-home-slide__content {
    position: relative !important;
    z-index: 4 !important;
  }
}
