/* Desktop + tablet: shared height, native ratio (horizontal filmstrip). */
.section-hero-horizontal .frame-99:has(.lsc-listed-media) {
  width: auto !important;
  height: 80vh !important;
  flex: 0 0 auto;
  align-items: center;
}
.section-hero-horizontal .frame-99:has(.lsc-listed-media) .lightbox-link.type-full {
  width: auto !important;
  height: 100% !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
}
.section-hero-horizontal .lsc-listed-media.image-hover-full-image {
  width: auto !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: contain !important;
  display: block !important;
}

/* Phones / narrow: shared width, native ratio (vertical stack). */
@media screen and (max-width: 767px) {
  body:has(.lsc-listed-media) .section-hero-horizontal,
  body:has(.lsc-listed-media) .hero-sticky,
  body:has(.lsc-listed-media) .frame,
  body:has(.lsc-listed-media) .frame-100 {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    position: relative !important;
    inset: auto !important;
    top: auto !important;
  }
  body:has(.lsc-listed-media) .hero-sticky {
    position: relative !important;
  }
  body:has(.lsc-listed-media) .frame {
    flex-direction: column !important;
    width: 100% !important;
  }
  .section-hero-horizontal .frame-99:has(.lsc-listed-media) {
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0.5em !important;
  }
  .section-hero-horizontal .frame-99:has(.lsc-listed-media) .lightbox-link.type-full {
    width: 100% !important;
    height: auto !important;
    display: block !important;
  }
  .section-hero-horizontal .lsc-listed-media.image-hover-full-image {
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
  }
}