.gallery {
  display: grid;
  gap: var(--gap-l);
}
.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.3s;
  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: 4;
  column-gap: var(--gap-l);
}

.columned_gallery_item.columns_3 {
  columns: 3;
}
.columned_gallery_item.columns_4 {
  columns: 4;
}
.columned_gallery_item.columns_5 {
  columns: 5;
}
.columned_gallery_item.columns_6 {
  columns: 6;
}

.gallery.columned_gallery_item > figure {
  display: inline-block;
}
.gallery.columned_gallery_item > figure {
  display: block;
  margin: 0 0 var(--gap-l) 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);
}

@media (max-width: 1100px) {
  .columned_gallery_item.columns_6 {
    columns: 5;
  }
  .columns_9,
  .columns_8,
  .columns_7,
  .columns_6 {
    grid-template-columns: repeat(5, 1fr);
  }
}
@media (max-width: 1024px) {
  .columned_gallery_item.columns_6,
  .columned_gallery_item.columns_5 {
    columns: 4;
  }

  .columns_9,
  .columns_8,
  .columns_7,
  .columns_6,
  .columns_5 {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media (max-width: 750px) {
  .columned_gallery_item.columns_6,
  .columned_gallery_item.columns_5,
  .columned_gallery_item.columns_4 {
    columns: 3;
  }
}
@media (max-width: 750px) {
  .columns_9,
  .columns_8,
  .columns_7,
  .columns_6,
  .columns_5,
  .columns_4 {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 450px) {
  .columned_gallery_item.columns_6,
  .columned_gallery_item.columns_5,
  .columned_gallery_item.columns_4,
  .columned_gallery_item.columns_3 {
    columns: 2;
  }
}
