.spwk-pattern__teaser-before-after {
  --teaser-before-after-content-max-inline-size: 1280px;
  --teaser-before-after-panel-padding-inline: max(
      clamp(1.25rem, 4.4vi, 4rem),
      calc((100% - var(--teaser-before-after-content-max-inline-size)) / 2)
  );
  --teaser-before-after-panel-padding-block: clamp(4rem, 7.8vi, 7rem);
  --teaser-before-after-media-fraction: 843fr;
  --teaser-before-after-text-fraction: 406fr;
  --teaser-before-after-column-gap: 31px;
  --teaser-before-after-heading-inline-size: 620px;
  --teaser-before-after-body-gap: 80px;
  --teaser-before-after-text-gap: var(--wp--preset--spacing--15);
  --teaser-before-after-text-padding-block-end: 100px;
  --teaser-before-after-caption-gap: var(--wp--preset--spacing--10);
  --teaser-before-after-caption-line-height: var(--wp--custom--line-height--small);
  --teaser-before-after-photo-radius: var(--wp--preset--border-radius--small);
  --teaser-before-after-photo-frame-width: 6px;
  --teaser-before-after-photo-frame-color: var(--wp--preset--color--grau-2);
  --teaser-before-after-after-offset: 39.03%;
  --teaser-before-after-after-inline-size: 60.97%;
  --teaser-before-after-before-inline-size: 42.7%;
  --teaser-before-after-before-offset-block: 10.22%;
  --teaser-before-after-glow-offset-inline: 15%;
  --teaser-before-after-glow-inline-size: 117%;
  --teaser-before-after-glow-offset-block: -35%;
  --teaser-before-after-glow-block-size: 123%;
  --teaser-before-after-glow-opacity: 1;
}
.wp-site-blocks .spwk-pattern__teaser-before-after .teaser-before-after__heading {
  hyphens: manual;
  overflow-wrap: normal;
}
.spwk-pattern__teaser-before-after .teaser-before-after__panel:not(.has-background) {
  --teaser-before-after-photo-frame-color: var(--wp--preset--color--light);
  --teaser-before-after-panel-padding-block: 0;
}
.spwk-pattern__teaser-before-after .teaser-before-after__panel.alignwide {
  position: relative;
  isolation: isolate;
  border-radius: var(--wp--preset--border-radius--large);
  padding-block: var(--teaser-before-after-panel-padding-block);
  padding-inline: var(--teaser-before-after-panel-padding-inline);
  max-inline-size: none;
  overflow: clip;
}
.spwk-pattern__teaser-before-after .teaser-before-after__heading {
  margin-block: 0;
  max-inline-size: var(--teaser-before-after-heading-inline-size);
}
.spwk-pattern__teaser-before-after .teaser-before-after__body {
  display: grid;
  grid-template-rows: [row-start] auto [row-end];
  grid-template-columns: [media-start] var(--teaser-before-after-media-fraction) [media-end text-start] var(--teaser-before-after-text-fraction) [text-end];
  align-items: end;
  margin-block-start: var(--teaser-before-after-body-gap);
  gap: var(--teaser-before-after-column-gap);
}
.spwk-pattern__teaser-before-after .teaser-before-after__media {
  position: relative;
  grid-row: row;
  grid-column: media;
  min-inline-size: 0;
}
.spwk-pattern__teaser-before-after .teaser-before-after__text {
  display: flex;
  flex-direction: column;
  grid-row: row;
  grid-column: text;
  gap: var(--teaser-before-after-text-gap);
  padding-block-end: var(--teaser-before-after-text-padding-block-end);
  min-inline-size: 0;
}
.spwk-pattern__teaser-before-after .teaser-before-after__lead {
  margin-block: 0;
}
.spwk-pattern__teaser-before-after .teaser-before-after__actions {
  margin-block: calc(var(--wp--custom--gap--actions) - var(--teaser-before-after-text-gap)) 0;
}
.spwk-pattern__teaser-before-after .teaser-before-after__media::before {
  position: absolute;
  inset-block-start: var(--teaser-before-after-glow-offset-block);
  inset-inline-start: var(--teaser-before-after-glow-offset-inline);
  opacity: var(--teaser-before-after-glow-opacity);
  z-index: var(--wp--custom--z-index--below);
  background-image: radial-gradient(ellipse 33% 33% at 50% 52%, var(--wp--preset--color--primary-75) 0%, var(--wp--preset--color--primary-50) 45%, var(--wp--preset--color--primary-25) 70%, var(--wp--preset--color--transparent) 100%);
  background-repeat: no-repeat;
  inline-size: var(--teaser-before-after-glow-inline-size);
  block-size: var(--teaser-before-after-glow-block-size);
  content: "";
  pointer-events: none;
}
.spwk-pattern__teaser-before-after .teaser-before-after__item {
  margin-block: 0;
}
.spwk-pattern__teaser-before-after .teaser-before-after__item--after {
  margin-inline-start: var(--teaser-before-after-after-offset);
  inline-size: var(--teaser-before-after-after-inline-size);
}
.spwk-pattern__teaser-before-after .teaser-before-after__item--before {
  position: absolute;
  inset-block-start: var(--teaser-before-after-before-offset-block);
  inset-inline-start: 0;
  z-index: var(--wp--custom--z-index--base);
  inline-size: var(--teaser-before-after-before-inline-size);
}
.spwk-pattern__teaser-before-after .teaser-before-after__photo {
  margin-block: 0;
}
.spwk-pattern__teaser-before-after .teaser-before-after__photo img {
  border-radius: var(--teaser-before-after-photo-radius);
  inline-size: 100%;
}
.spwk-pattern__teaser-before-after .teaser-before-after__photo figcaption {
  margin-block-start: var(--teaser-before-after-caption-gap);
}
.spwk-pattern__teaser-before-after .teaser-before-after__photo--before img {
  border: var(--teaser-before-after-photo-frame-width) var(--wp--custom--border--style--default) var(--teaser-before-after-photo-frame-color);
}
.spwk-pattern__teaser-before-after .teaser-before-after__photo figcaption,
.spwk-pattern__teaser-before-after .teaser-before-after__caption--lead {
  margin-inline: 0;
  line-height: var(--teaser-before-after-caption-line-height);
  color: var(--wp--preset--color--dark);
  font-size: var(--wp--preset--font-size--large);
  font-weight: var(--wp--custom--font-weight--medium);
}
.spwk-pattern__teaser-before-after .teaser-before-after__caption--lead {
  display: none;
  margin-block: 0 var(--wp--preset--spacing--5);
}
@media (max-width: 1100px) {
  .spwk-pattern__teaser-before-after {
    --teaser-before-after-body-gap: var(--wp--preset--spacing--15);
    --teaser-before-after-text-padding-block-end: 0;
    --teaser-before-after-photo-radius: var(--wp--preset--border-radius--tiny);
    --teaser-before-after-photo-frame-width: 4px;
    --teaser-before-after-after-offset: 21.19%;
    --teaser-before-after-after-inline-size: 78.81%;
    --teaser-before-after-before-inline-size: 40.9%;
    --teaser-before-after-before-offset-block: 0;
    --teaser-before-after-glow-offset-inline: -17%;
    --teaser-before-after-glow-inline-size: 154%;
    --teaser-before-after-glow-offset-block: -39%;
    --teaser-before-after-glow-block-size: 160%;
    --teaser-before-after-glow-opacity: 0.6;
    --teaser-before-after-stacked-max-inline-size: 620px;
    --teaser-before-after-caption-line-box: calc(
        var(--wp--preset--font-size--large) * var(--teaser-before-after-caption-line-height)
    );
    --teaser-before-after-before-clearance: calc(
        var(--teaser-before-after-caption-line-box) + var(--wp--preset--spacing--5)
    );
    --teaser-before-after-stagger-block: 6.6%;
    --teaser-before-after-after-offset-block: calc(
        var(--teaser-before-after-before-clearance) + var(--teaser-before-after-stagger-block)
    );
  }
  .spwk-pattern__teaser-before-after .teaser-before-after__heading {
    margin-inline: auto;
    max-inline-size: var(--teaser-before-after-stacked-max-inline-size);
  }
  .spwk-pattern__teaser-before-after .teaser-before-after__body {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: var(--wp--preset--spacing--40);
    margin-inline: auto;
    max-inline-size: var(--teaser-before-after-stacked-max-inline-size);
  }
  .spwk-pattern__teaser-before-after .teaser-before-after__item--after {
    margin-block-start: var(--teaser-before-after-after-offset-block);
  }
  .spwk-pattern__teaser-before-after .teaser-before-after__media--unlabelled {
    --teaser-before-after-after-offset-block: var(--teaser-before-after-stagger-block);
  }
  .spwk-pattern__teaser-before-after .teaser-before-after__caption--lead {
    display: block;
  }
  .spwk-pattern__teaser-before-after .teaser-before-after__photo--before figcaption {
    display: none;
  }
}

/*# sourceMappingURL=teaser-before-after.css.map */