.gm-masonry{
  position: relative;
  --gm-gap: 40px;
  --gm-cols-d:  4;
  --gm-cols-ds: 3;
  --gm-cols-t:  2;
  --gm-cols-m:  1;
}

/* Query Loop list reset */
.gm-masonry .wp-block-post-template{
  margin: 0;
  padding: 0;
}

/* Sizer: definieert kolombreedte voor masonry.js */
.gm-masonry__sizer{
  width: calc((100% - var(--gm-gap) * (var(--gm-cols-d) - 1)) / var(--gm-cols-d));
  padding: 0 !important;
  margin: 0 !important;
  list-style: none;
}

/* Gutter element: masonry.js meet dit als horizontale ruimte tussen kolommen */
.gm-masonry__gutter{
  width: var(--gm-gap);
  padding: 0 !important;
  margin: 0 !important;
}

/* Query Loop items: <li class="wp-block-post"> */
.gm-masonry .wp-block-post{
  width: calc((100% - var(--gm-gap) * (var(--gm-cols-d) - 1)) / var(--gm-cols-d));
  box-sizing: border-box;
  padding: calc(var(--gm-gap) / 2) 0;
  margin: 0 !important;
  list-style: none;
}

/* Responsive */
@media (max-width: 1500px){
  .gm-masonry__sizer{ width: calc((100% - var(--gm-gap) * (var(--gm-cols-ds) - 1)) / var(--gm-cols-ds)); }
  .gm-masonry .wp-block-post{ width: calc((100% - var(--gm-gap) * (var(--gm-cols-ds) - 1)) / var(--gm-cols-ds)); }
}
@media (max-width: 1250px){
  .gm-masonry__sizer{ width: calc((100% - var(--gm-gap) * (var(--gm-cols-t) - 1)) / var(--gm-cols-t)); }
  .gm-masonry .wp-block-post{ width: calc((100% - var(--gm-gap) * (var(--gm-cols-t) - 1)) / var(--gm-cols-t)); }
}
@media (max-width: 640px){
  .gm-masonry__sizer{ width: calc((100% - var(--gm-gap) * (var(--gm-cols-m) - 1)) / var(--gm-cols-m)); }
  .gm-masonry .wp-block-post{ width: calc((100% - var(--gm-gap) * (var(--gm-cols-m) - 1)) / var(--gm-cols-m)); }
}

/* Cover hoogte volgt ratio, niet de tekst */
.gm-masonry .gm-cover{
  position: relative;
  aspect-ratio: var(--gm-ar, 4 / 3) !important;
  min-height: 0 !important;      /* cover zet vaak min-height */
  overflow: hidden;
}

/* Afbeelding vult het cover-vlak */
.gm-masonry .gm-cover img,
.gm-masonry .gm-cover .wp-block-cover__image-background{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Maak de inner container absoluut -> tekst telt niet mee voor hoogte */
.gm-masonry .gm-cover .wp-block-cover__inner-container{
  position: absolute;
  inset: 0;
  /*display: flex;/*
  align-items: flex-end;   /* onderaan; wil je midden: center */
  padding: 14px;
  box-sizing: border-box;
}

/* === Custom items (gm/item) === */
.gm-masonry .gm-masonry__item{
  box-sizing: border-box;
  padding: calc(var(--gm-gap) / 2) 0;
  margin: 0 !important;
  width: calc(
    (100% - var(--gm-gap) * (var(--gm-cols-d) - 1)) / var(--gm-cols-d) * var(--gm-span-d, 1)
    + var(--gm-gap) * (var(--gm-span-d, 1) - 1)
  );
}

/* Responsive spans */
@media (max-width: 1500px){
  .gm-masonry .gm-masonry__item{
    width: calc(
      (100% - var(--gm-gap) * (var(--gm-cols-ds) - 1)) / var(--gm-cols-ds) * var(--gm-span-d, 1)
      + var(--gm-gap) * (var(--gm-span-d, 1) - 1)
    );
  }
}

@media (max-width: 1250px){
  .gm-masonry .gm-masonry__item{
    width: calc(
      (100% - var(--gm-gap) * (var(--gm-cols-t) - 1)) / var(--gm-cols-t) * var(--gm-span-t, 1)
      + var(--gm-gap) * (var(--gm-span-t, 1) - 1)
    );
  }
}

@media (max-width: 640px){
  .gm-masonry .gm-masonry__item{
    width: calc(
      (100% - var(--gm-gap) * (var(--gm-cols-m) - 1)) / var(--gm-cols-m) * var(--gm-span-m, 1)
      + var(--gm-gap) * (var(--gm-span-m, 1) - 1)
    );
  }
}

/* === Post excerpt verbergen op mobiel === */
@media (max-width: 640px){
  .gm-masonry .wp-block-post-excerpt{
    display: none;
  }
}

/* === Bijschrift over de afbeelding – linksonder met witte achtergrond === */
.gm-masonry figure.wp-block-image,
.gm-masonry .wp-block-post figure.wp-block-image {
  position: relative;
  margin: 0;
}

.gm-masonry figcaption,
.gm-masonry .wp-element-caption,
.gm-masonry figure.wp-block-image figcaption {
  position: absolute !important;
  bottom: 0;
  left: 0;
  margin: 0 !important;
  padding: 4px 10px;
  background: #ffffff;
  opacity: 40%;
  border-radius: 0 0 0 0;
  font-size: 0.6em;
  line-height: 1.4;
  max-width: 90%;
  z-index: 2;
}