.site-gallery { margin: var(--sp-5) 0; }

.site-gallery--grid {
  display: grid;
  grid-template-columns: repeat(var(--gallery-columns, 3), minmax(0, 1fr));
  gap: var(--sp-3);
}
.site-gallery--grid .site-gallery__item img {
  width: 100%;
  height: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.site-gallery--masonry {
  columns: var(--gallery-columns, 3);
  column-gap: var(--sp-3);
}
.site-gallery--masonry .site-gallery__item {
  break-inside: avoid;
  margin-bottom: var(--sp-3);
}

.site-gallery__item img {
  width: 100%;
  border-radius: var(--r-none);
  background: var(--surface-2);
}

.site-gallery__item a { display: block; }
.site-gallery__item a:hover img { opacity: 0.9; }

@media (max-width: 720px) {
  .site-gallery--grid {
    grid-template-columns: repeat(min(var(--gallery-columns, 3), 2), minmax(0, 1fr));
  }
  .site-gallery--masonry { columns: min(var(--gallery-columns, 3), 2); }
}

@media (max-width: 560px) {
  .site-gallery--grid { grid-template-columns: minmax(0, 1fr); }
  .site-gallery--masonry { columns: 1; }
}