.image-text {
  --item-border-radius: var(--border-radius);
  --item-shadow: none;
  --section-space-top: clamp(40px, 5cqw, 72px);
  --section-space-bottom: clamp(32px, 4cqw, 72px);
  display: grid;
  gap: calc(var(--gap) * 2);
  margin: var(--gap) 0;
}
.image-text--image-left {
  grid-template-columns: 1fr var(--media-width, 50%);
  --media-order: 1;
  --text-order: 2;
}
.image-text--image-right {
  grid-template-columns: var(--media-width, 50%) 1fr;
  --media-order: 2;
  --text-order: 1;
}
.image-text--vertical-align-center {
  align-items: center;
}
.image-text--vertical-align-top {
  align-items: flex-start;
}
.image-text--vertical-align-bottom {
  align-items: flex-end;
}
.image-text + .image-text {
  margin-top: var(--section-space-top);
  padding-top: var(--section-space-bottom);
  background-image: linear-gradient(to right, var(--color-primary-light) 50%, rgba(255, 255, 255, 0) 0%);
  background-position: top;
  background-size: 8px 1px;
  background-repeat: repeat-x;
}
.image-text__text {
  padding: 0;
  order: var(--text-order);
}
.image-text__text > *:first-child {
  margin-top: 0;
}
.image-text__text > *:last-child {
  margin-bottom: 0;
}
.image-text__image {
  order: var(--media-order);
  position: relative;
  display: grid;
  gap: var(--gap);
}
.image-text__image--multiple {
  display: var(--image-text-multiple-display, grid);
  grid-template-columns: var(--image-text-multiple-columns, repeat(2, 1fr));
  gap: var(--image-text-multiple-gap, var(--gap));
}
.image-text__image-link {
  display: block;
}
.image-text__image img {
  width: auto !important;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  border-radius: var(--item-border-radius);
  filter: drop-shadow(var(--item-shadow));
  display: block;
}
.image-text__image-wrapper--2 {
  margin-top: calc(var(--gap) * 2);
}
@media screen and (min-width: 769px) {
  .image-text--image-left .image-text__image img {
    border-radius: 0 20em 20em 0;
  }
  .image-text--image-right .image-text__image img {
    border-radius: 20em 0 0 20em;
  }
}
@media screen and (max-width: 768px) {
  .image-text {
    grid-template-columns: 1fr;
  }
  .image-text__image {
    grid-column: auto;
    order: 2;
    grid-row: auto;
  }
  .image-text__image img {
    border-bottom-right-radius: 200px;
    aspect-ratio: 1/1;
    object-fit: cover;
  }
  .image-text__text {
    grid-column: auto;
    order: 1;
    grid-row: auto;
  }
  .image-text:has(.mobile-image-renderer) .image-text__image {
    display: none;
  }
}