/* nebula-data-sg.com — gallery layout fixes
 *
 * The gallery is a hand-rolled masonry: items are dealt round-robin into 2-5
 * flex columns and each media element was `w-full h-auto`, so every tile took
 * the intrinsic aspect ratio of its source image. Mixed portrait/landscape
 * sources therefore produced ragged, misaligned columns.
 *
 * The compiled Tailwind bundle contains no aspect-ratio utilities, so the
 * uniform tile shape is defined here and applied via the .nds-tile class.
 */

.nds-tile {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  background-color: #f1f2f4;          /* placeholder while lazy-loading */
  transition: transform 0.35s ease;
  will-change: transform;
}

.dark .nds-tile {
  background-color: #1f2937;
}

/* Gentle zoom on card hover. The card already has overflow-hidden. */
.group:hover > .relative > .nds-tile,
.group:hover .nds-tile {
  transform: scale(1.04);
}

@media (prefers-reduced-motion: reduce) {
  .nds-tile {
    transition: none;
  }
  .group:hover .nds-tile {
    transform: none;
  }
}