/* AKSO - project photo strip (small thumbnails under the videos)
   and the larger gallery used when a project has no video. Loads last. */
.project .project-gallery {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: var(--space-2);
}
.project .project-gallery__trigger {
  aspect-ratio: 4 / 5;
  cursor: zoom-in;
}
@media (max-width: 1200px) { .project .project-gallery { grid-template-columns: repeat(6, 1fr); } }
@media (max-width: 900px)  { .project .project-gallery { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 560px)  { .project .project-gallery { grid-template-columns: repeat(3, 1fr); } }

/* Projects without a video (Gunnar, BOXRAW): big gallery fills the video space */
.project--photo-only .project-gallery {
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-3);
}
.project--photo-only .project-gallery__item:first-child {
  grid-column: 1 / -1;
}
.project--photo-only .project-gallery__item:first-child .project-gallery__trigger {
  aspect-ratio: 16 / 9;
}
@media (max-width: 900px)  { .project--photo-only .project-gallery { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px)  { .project--photo-only .project-gallery { grid-template-columns: repeat(2, 1fr); gap: var(--space-2); } }

/* Fill each tile edge to edge (no letterbox bars) */
.project .project-gallery__trigger picture,
.project .project-gallery__trigger img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Phones: tighter vertical rhythm between projects */
@media (max-width: 768px) {
  .project { padding-bottom: var(--space-6); }
  .project__content { gap: var(--space-5); }
  .project__divider { margin-bottom: var(--space-6); }
}