/* Smart Fit fotomasonry. Mobile first: 2 kolommen, 3 vanaf 576px, 5 vanaf 992px. */
.sf-masonry { padding-top: 56px; overflow: hidden; }
.sf-masonry__intro { max-width: 820px; margin: 0 auto 40px; padding: 0 5vw; text-align: center; display: flex; flex-direction: column; align-items: center; }
.sf-theme .sf-masonry__title {
  margin: 0 0 20px; color: #044561; font-family: 'Leixo', 'Jost', sans-serif; font-weight: 400;
  font-size: clamp(32px, 3.6vw, 46px); line-height: 1.12; letter-spacing: -.07em; text-transform: lowercase; text-wrap: balance;
}
.sf-theme .sf-masonry__intro p { margin: 0 0 14px; font-size: 17px; line-height: 1.65; color: #1C1C1A; text-wrap: pretty; }
.sf-theme .sf-masonry__btn {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; min-height: 48px; padding: 14px 26px;
  border-radius: 100px; background: #E95123; color: #fff; font-size: 15px; font-weight: 700; transition: background .2s, transform .15s;
}
.sf-theme .sf-masonry__btn:hover { background: #D2441A; color: #fff; transform: translateY(-2px); }

.sf-masonry__wall {
  --k: .55;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 0 3px;
  max-height: calc(900px * var(--k)); overflow: hidden; align-items: start;
}
.sf-masonry__col { display: flex; flex-direction: column; gap: 12px; }
.sf-masonry__col--2 { margin-top: calc(40px * var(--k)); }
.sf-masonry__col--4 { margin-top: calc(20px * var(--k)); }
.sf-masonry__col--3, .sf-masonry__col--4, .sf-masonry__col--5 { display: none; }
.sf-masonry__item { display: block; height: calc(var(--h) * 1px * var(--k)); overflow: hidden; border-radius: 3px; }
.sf-masonry__item img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s; }
a.sf-masonry__item:hover img { transform: scale(1.04); }

@media (min-width: 576px) {
  .sf-masonry__wall { --k: .8; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sf-masonry__col--3 { display: flex; }
}
@media (min-width: 768px) { .sf-masonry { padding-top: 96px; } }
@media (min-width: 992px) {
  .sf-masonry__wall { --k: 1; grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .sf-masonry__col--4, .sf-masonry__col--5 { display: flex; }
}
@media (prefers-reduced-motion: reduce) { .sf-masonry__item img { transition: none; } }
