.gallery {
  display: grid;
  gap: calc(var(--gap-s) / 2) var(--gap-s);
}
.gallery figure {
  margin: 0;
}
.gallery .has_video,
.fc_split_content .has_video {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
}
.gallery .has_video img {
  grid-row-start: 1;
  grid-column-start: 1;
}
.gallery .has_video::after,
.fc_split_content .has_video::after {
  display: block;
  content: "";
  background: center / 40px 40px no-repeat
    url("data:image/svg+xml,%3csvg width='40' height='40' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m16 27 12-7-12-7v14Zm4-27a20 20 0 1 0 0 40 20 20 0 0 0 0-40Zm0 36a16 16 0 1 1 0-32 16 16 0 0 1 0 32Z' fill='white'/%3e%3c/svg%3e");
  opacity: 0.5;
  transition: 0.4s;
  grid-row-start: 1;
  grid-column-start: 1;
  width: 100%;
  height: 100%;
}
.gallery .has_video:hover::after,
.fc_split_content .has_video:hover::after {
  opacity: 1;
}
.gallery a,
.gallery img {
  display: block;
  width: 100%;
}
.gallery-caption {
  display: none;
}
.columns_1 {
  grid-template-columns: repeat(1, 1fr);
}
.columns_2 {
  grid-template-columns: repeat(2, 1fr);
}
.columns_3 {
  grid-template-columns: repeat(3, 1fr);
}
.columns_4 {
  grid-template-columns: repeat(4, 1fr);
}
.columns_5 {
  grid-template-columns: repeat(5, 1fr);
}
.columns_6 {
  grid-template-columns: repeat(6, 1fr);
}
.columns_7 {
  grid-template-columns: repeat(7, 1fr);
}
.columns_8 {
  grid-template-columns: repeat(8, 1fr);
}
.columns_9 {
  grid-template-columns: repeat(9, 1fr);
}
.gallery.columned_gallery_item {
  display: block;
  columns: 1;
  column-gap: var(--gap-s);
}
.gallery.columned_gallery_item > figure {
  display: inline-block;
}
.gallery.columned_gallery_item > figure {
  display: block;
  margin: 0 0 calc(var(--gap-s) / 2) 0;
}
.gallery.row_gallery_item {
  display: flex;
  flex-wrap: wrap;
}
.gallery.row_gallery_item > figure {
  --ratio: calc(var(--width)/var(--height));
  --row-height: clamp(100px, 15vw, 250px);
  flex-basis: calc(var(--ratio) * var(--row-height));
  flex-grow: calc(var(--ratio) * 100);
}

/* responsive */
@media (width >= 576px) {
  .columned_gallery_item {
    &:not(.columns_3) {
      columns: 2;
    }
  }
}

@media (width >= 768px) {
  .columned_gallery_item {
    &.columns_3,
    &.columns_5,
    &.columns_9 {
      columns: 3;
    }
  }
}

@media (width >= 992px) {
  .columned_gallery_item {
    &.columns_6 {
      columns: 3;
    }

    &.columns_4,
    &.columns_7,
    &.columns_8 {
      columns: 4;
    }
  }
}

@media (width >= 1200px) {
  .columned_gallery_item {
    &.columns_5,
    &.columns_9 {
      columns: 5;
    }

    &.columns_6 {
      columns: 6;
    }
  }
}