/*
  Six squares from the care series, shown whole and dealt like a chessboard:
  a dark studio shot beside a light one. Every photo goes through the one
  black-and-white filter, whatever its source.
*/
.gallery__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-sm);
}

.gallery__photo {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  filter: var(--filter-mono);
}

/*
  The towel in this shot carries a supplier's lettering on its right edge.
  The square is cut from a box one fifth taller, anchored left, so that
  edge stays out of frame; the box still takes one square in the grid.
*/
.gallery__photo--trim {
  aspect-ratio: 5 / 6;
  margin-block: -10%;
  object-position: 0 50%;
  clip-path: inset(8.3% 0);
}

/* Three across: the middle pair swaps so dark still alternates with light */
@media (min-width: 48em) {
  .gallery__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .gallery__photo:nth-child(4) {
    order: 1;
  }

  .gallery__photo:nth-child(3) {
    order: 2;
  }

  .gallery__photo:nth-child(n + 5) {
    order: 3;
  }
}

@media (min-width: 64em) {
  .gallery__grid {
    gap: var(--space-lg);
  }
}