_content-gallery.scss

@use "../abstracts/" as *;

.content-gallery--cols-5 {
  ul {
    list-style-type: none;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: $size-6px;
    // unterhalb 859 px Breite:
    @media (width < 53.625em) {
      grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    }
    // unterhalb 534 px Breite:
    @media (width < 33.375em) {
      grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
    }
    img {
      width: 100%;
    }
    figcaption {
      display: none;
    }
  }
}

// gallery with 1, 2, 3 or 4 elements
.content-gallery--cols-1,
.content-gallery--cols-2,
.content-gallery--cols-3,
.content-gallery--cols-4 {
  ul {
    list-style-type: none;
    padding: 0;
    display: flex;
    gap: 0.5rem 0.5em;
  }
}
.content-gallery--cols-4 ul {
  // unterhalb 400 px Breite:
  @media (width < 25em) {
    flex-wrap: wrap;
    gap: 0.375em 2%;
    li {
      flex: 0 1 48%;
    }
  }
}
Check

ISP hat zusätzliche Galerie drinnen (Team, für Desktop und Scrollsnap)