/* ============================================================================
   Aurelia Luxe — v3.50
   Loads last, after v349.

   BUG — Gallery "Mosaic" layout: near the end of the grid, a tile (e.g. the
   gym photo) sits inside a taller cell than its own photo, leaving a slab of
   empty cream background under it — while the tile beside it (the feature
   tile, e.g. the badminton court) fills that same row correctly.

   Root cause (measured): mosaic uses real CSS Grid (`.hl-gallery-grid--mosaic`,
   which is NOT `.hl-gallery-grid--masonry`), with `grid-auto-flow: dense`.
   Every 7th tile gets `.is-feature`, which spans 2 columns × 2 rows
   (refinements-v331.css). Grid rows are sized "auto", so the tall feature
   tile stretches that implicit row pair to its own height.

   Every `.hl-gallery-item` (the <figure>, i.e. the actual grid cell) then
   stretches to fill that row height — that part is correct, default grid
   behaviour. But `.hl-gallery-item__inner` (the child that actually holds
   the photo) is given a *fixed* `aspect-ratio` in refinements-v331.css:
       .hl-gallery-grid:not(.hl-gallery-grid--masonry) .hl-gallery-item__inner
         { aspect-ratio: 4/3 (or 1/1, 3/4, 16/9 depending on setting); }
   Only `.is-feature .hl-gallery-item__inner` was ever told to ignore that
   and fill its cell (`aspect-ratio: auto; height: 100%`). Every *other*
   tile that happens to land in the same dense-packed row as a feature tile
   keeps its fixed aspect-ratio height — shorter than the row — so the
   figure (cell) is tall enough, but the photo inside it isn't, and the gap
   shows as bare page background under the cropped-looking photo.

   Fix: in the mosaic layout, every tile's `.hl-gallery-item__inner` fills
   its grid cell (`height: 100%`, `aspect-ratio: auto`) instead of following
   a fixed aspect ratio, and the grid gets an explicit `grid-auto-rows` so
   the cell heights it fills are consistent and never zero. This mirrors
   what already happened for `.is-feature` and simply applies it to all
   mosaic tiles, so no cell is ever taller than the photo inside it.
============================================================================ */

@media (min-width: 769px) {
  .hl-gallery-page .hl-gallery-grid--mosaic:not(.hl-gallery-grid--masonry) {
    grid-auto-rows: clamp(170px, 16vw, 260px);
  }

  .hl-gallery-page .hl-gallery-grid--mosaic:not(.hl-gallery-grid--masonry) .hl-gallery-item__inner {
    height: 100% !important;
    aspect-ratio: auto !important;
  }
}

/* Below 769px (or at data-cols="2") feature tiles no longer span rows
   (refinements-v349.css forces span 1/span 1), so mosaic behaves like the
   uniform grid again — leave the fixed aspect-ratio tiles as-is there. */