/* Overschrijft de omliggende Elementor-container (die de widget zelf verticaal
   centreert/uitrekt in een hoge kolom) — dit is de eigenlijke flex/grid-item,
   niet .fsr-instance zelf, dus dit moet hier overschreven worden. */
.elementor-widget-foto_scroll_reveal {
  align-self: flex-start !important;
  justify-self: flex-start !important;
  height: auto !important;
  align-content: flex-start !important;
}
.elementor-widget-foto_scroll_reveal > .elementor-widget-container {
  height: auto !important;
}

.fsr-instance {
  position: relative;
  display: flex !important;
  align-items: flex-start !important; /* bovenaan uitlijnen i.p.v. verticaal centreren in de kolom */
  flex-wrap: wrap;
  gap: 5vw;
  width: auto !important;
  max-width: 100%;
}
.fsr-hero-text-spacer {
  visibility: hidden;
  flex: 1 1 320px;
}
.fsr-hero-text-fixed {
  position: fixed;
  z-index: 40; /* onder de foto (z-index 9999), zodat de foto er straks overheen groeit */
  will-change: top, left, width;
}
.fsr-hero-text-inner > * {
  margin: 0 0 16px;
}
.fsr-hero-text-inner > *:last-child {
  margin-bottom: 0;
}
.fsr-spacer {
  visibility: hidden;
  flex: 0 0 auto !important;
}
.fsr-morph {
  position: fixed;
  top: 0;
  left: 0;
  overflow: hidden;
  border-radius: 4px;
  z-index: 9999;
  will-change: width, height, top, left, border-radius;
}
.fsr-morph img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.fsr-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  padding: 6vh 6vw;
  box-sizing: border-box;
  opacity: 0;
  pointer-events: none;
  transition: opacity .05s linear;
}
.fsr-overlay-textbox {
  max-width: 80%;
  box-sizing: border-box;
}
.fsr-overlay-text {
  margin: 0;
}
.fsr-pin-track {
  position: relative;
}