/* v3.52 — Experience/Amenity detail gallery: even heights.
   Previously the main image had a fixed aspect-ratio (4/3) while the two
   side thumbnails just stacked at their own natural heights, so the two
   columns rarely lined up (the side stack was usually taller). The whole
   gallery block now gets one fixed height and every image — main and
   side — stretches to fill it via object-fit:cover, so the bottoms of
   all three images always match exactly. */
.hl-xd-gallery{
  aspect-ratio: 21 / 9;
  height: auto;
}
.hl-xd-gallery__main{
  aspect-ratio: auto;
  height: 100%;
}
.hl-xd-gallery__side{
  height: 100%;
}
.hl-xd-gallery__side img{
  height: 100%;
}
.hl-xd-gallery--single{
  aspect-ratio: 16 / 9;
}
.hl-xd-gallery--single .hl-xd-gallery__main{
  aspect-ratio: auto;
  height: 100%;
}

@media (max-width: 782px){
  /* Side-by-side stretch only makes sense with the wide two-column
     layout; below that breakpoint the gallery already stacks into a
     single column (main image on top, two thumbnails in a row), so give
     it a taller, phone-friendly ratio instead of forcing the ultra-wide
     desktop one. */
  .hl-xd-gallery{
    aspect-ratio: auto;
    height: auto;
  }
  .hl-xd-gallery__main{
    aspect-ratio: 4 / 3;
    height: auto;
  }
  .hl-xd-gallery__side img{
    height: auto;
    aspect-ratio: 1 / 1;
  }
}