/* Fotos gallery: masonry grid. Base rules first; Bekifft-specific changes at the end. */
.masonry-wrap {
  padding-bottom: 4em;
  padding-left: 2em;
  padding-right: 2em;
}

.masonry-list {
  grid-column-gap: var(--masonry-gap);
  grid-row-gap: var(--masonry-gap);
  flex-flow: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
  position: relative;
}

.masonry-item {
  width: calc(((100% - 1px)  - (var(--masonry-col)  - 1) * var(--masonry-gap)) / var(--masonry-col));
}

.masonry-item__visual {
  border-radius: 1.25em;
  width: 100%;
  overflow: hidden;
}

.masonry-item__visual.is--square {
  aspect-ratio: 1;
}

.masonry-item__visual.is--wide {
  aspect-ratio: 3 / 2;
}

.masonry-item__visual.is--tall {
  aspect-ratio: 2 / 3;
}

.masonry-item__visual-img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

[data-masonry-list] {
  --masonry-col: 4;
  --masonry-gap: 1em;
}

@media screen and (max-width: 991px) {
  [data-masonry-list] {
    --masonry-col: 3;
    --masonry-gap: 1em;
  }
}

@media screen and (max-width: 767px) {
  [data-masonry-list] {
    --masonry-col: 2;
    --masonry-gap: 0.5em;
  }
}

/* ---- Bekifft ---- */
.fotos-section { background: var(--bk-bg-alt); position: relative; width: 100vw; margin-left: calc(50% - 50vw); }
.fotos-section__inner { max-width: var(--bk-container); margin: 0 auto; padding: var(--bk-section-y) var(--bk-gutter); }
.fotos-section__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: var(--bk-space-4); margin-bottom: var(--bk-space-7); }
.fotos-section .masonry-wrap { padding: 0; }
/* only 5 photos: 3 columns on desktop (the original default is 4), 2 on tablet and phone */
.fotos-section [data-masonry-list] { --masonry-col: 3; --masonry-gap: var(--bk-space-4); }
@media screen and (max-width: 767px) { .fotos-section [data-masonry-list] { --masonry-col: 2; --masonry-gap: var(--bk-space-2); } }
.fotos-section .masonry-item__visual { position: relative; border-radius: var(--bk-radius-md); background: var(--bk-brown-700); }
.fotos-section .masonry-item__visual-img { display: block; transition: transform .8s cubic-bezier(.2, .7, .2, 1), filter .8s; }
.fotos-section .masonry-item__visual:hover .masonry-item__visual-img { transform: scale(1.06); filter: saturate(1.1); }
.masonry-item__caption { position: absolute; left: var(--bk-space-3); bottom: var(--bk-space-3); max-width: calc(100% - var(--bk-space-5)); background: var(--bk-cream-100); color: var(--bk-brown-800); font-size: var(--bk-text-xs); font-weight: 800; line-height: var(--bk-lh-snug); padding: var(--bk-space-2) var(--bk-space-3); border-radius: var(--bk-radius-sm); }
.masonry-item__caption span, .masonry-item__caption a { display: block; }
.masonry-item__caption a { color: var(--bk-orange-600); font-weight: 700; text-decoration: none; }
.masonry-item__caption a:hover { text-decoration: underline; }
.masonry-item__caption a:focus-visible { outline: 3px solid var(--bk-brown-800); outline-offset: 2px; }