/* Gallery: photos as tiles that open in the lightbox (gallery controller) */
.gallery {
  --auto-grid-min: 14rem;
  --auto-grid-space: var(--space-xs);
}

.gallery__item {
  aspect-ratio: 4 / 3;
  background-position: center;
  background-size: cover;
  border-radius: var(--radius-m);
  display: block;
  overflow: hidden;
  transition: opacity var(--duration-fast) var(--ease-out);

  &:hover {
    opacity: 0.85;
  }
}

.gallery__item[data-feature] {
  aspect-ratio: 16 / 9;
}

/* The style's pictures (data-look-images): mono in black and white, duotone
   laid over the accent */
[data-look-images="mono"] .gallery__item {
  filter: grayscale(1) contrast(1.06);
}

[data-look-images="duotone"] .gallery__item {
  background-blend-mode: luminosity;
  background-color: var(--color-accent-fill);
}