/* Generated raster art overlaps the actual module seam. No viewport scroll positioning. */
.ms-section-separator {
  position: relative;
  z-index: 3;
  height: clamp(16px, 2vw, 28px);
  pointer-events: none;
  user-select: none;
}
.ms-section-separator picture {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  display: block;
  height: max(33.35vw, 274px);
  overflow: hidden;
  transform: translateY(-50%);
}
.ms-section-separator img {
  position: absolute;
  left: 50%;
  top: 50%;
  display: block;
  width: max(100%, 820px);
  max-width: none;
  height: auto;
  transform: translate(-50%, -50%);
}
.ms-section-separator__pair { display: none; }
.ms-section-separator + * {
  --ms-separator-content-gap: clamp(24px, 2vw, 48px);
}
@media (min-width: 1440px) {
  .ms-section-separator:has(.ms-section-separator__pair) > picture { display: none; }
  .ms-section-separator__pair {
    --separator-overlap: clamp(32px, 2vw, 64px);
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    transform: translateY(-50%);
  }
  .ms-section-separator__pair picture {
    position: relative;
    inset: auto;
    flex: 1 1 50%;
    min-width: 0;
    height: auto;
    transform: none;
  }
  .ms-section-separator__pair img {
    position: static;
    width: 100%;
    transform: none;
  }
  .ms-section-separator__pair picture:first-child {
    z-index: 1;
    margin-right: calc(-1 * var(--separator-overlap));
    mask-image: linear-gradient(to right, #000 calc(100% - var(--separator-overlap)), transparent);
  }
  .msm-foodtruck-route:has(+ [data-ms-separator="foodtruck-route-menu"]) {
    padding-bottom: max(112px, 5vw);
  }
}
/* Ezelsoor's standalone divider leads into the about section. */
.ms-section-separator[data-ms-separator="boekhandel-leestafel"] {
  height: clamp(96px, 12vw, 160px);
}
/* The small-screen crop keeps the artwork large; reserve room before the next heading. */
.ms-section-separator[data-ms-separator="foodtruck-route-menu"] + .msm-foodtruck-menu {
  padding-top: calc(clamp(80px, 9vw, 128px) + var(--ms-separator-content-gap));
}
.ms-section-separator[data-ms-separator="snackbar-friet-snacks"] + .msm-snackbar-snackmuur,
.ms-section-separator[data-ms-separator="lunchroom-kaart-verhaal"] + .msm-lunchroom-huis {
  padding-top: calc(clamp(76px, 8vw, 112px) + var(--ms-separator-content-gap));
}
.ms-section-separator[data-ms-separator="boekhandel-leestafel"] + .over {
  padding-top: calc(58px + var(--ms-separator-content-gap));
}
@media (max-width: 560px) {
  .msm-snackbar-frietmeter:has(+ [data-ms-separator="snackbar-friet-snacks"]) {
    padding-bottom: 72px;
  }
}
@media (min-width: 1440px) {
  .ms-section-separator[data-ms-separator="foodtruck-route-menu"] + .msm-foodtruck-menu {
    padding-top: calc(max(128px, 5vw) + var(--ms-separator-content-gap));
  }
  .msm-snackbar-frietmeter:has(+ [data-ms-separator="snackbar-friet-snacks"]),
  .msm-lunchroom-kaart:has(+ [data-ms-separator="lunchroom-kaart-verhaal"]) {
    padding-bottom: max(112px, 5vw);
  }
  .ms-section-separator[data-ms-separator="snackbar-friet-snacks"] + .msm-snackbar-snackmuur,
  .ms-section-separator[data-ms-separator="lunchroom-kaart-verhaal"] + .msm-lunchroom-huis {
    padding-top: calc(max(112px, 5vw) + var(--ms-separator-content-gap));
  }
  .ms-section-separator[data-ms-separator="boekhandel-leestafel"] {
    height: max(160px, 9vw);
  }
}