.accordion-element {
  margin: var(--section-margin) 0;
}
.accordion-element .container {
  margin: 0 auto;
  padding: 0 var(--container-padding);
  width: var(--container-width);
}
.accordion-element .image-box {
  border-radius: var(--border-radius);
  overflow: hidden;
}
.accordion-element .image-box img {
  display: block;
  width: 100%;
  max-height: 100%;
  object-fit: cover;
  height: auto;
}
@media (min-width: 1000px) {
  .accordion-element[data-image-position=right] .image-box {
    order: 1;
    margin-right: calc(var(--container-padding) * -1);
  }
}
@media (min-width: 1000px) and (max-width: 1539px) {
  .accordion-element[data-image-position=right] .image-box {
    margin-right: calc(var(--container-padding) * -0.5);
  }
}
@media (min-width: 1000px) {
  .accordion-element[data-image-position=right] .text-box {
    padding-right: var(--container-padding);
  }
}
@media (min-width: 1000px) and (max-width: 1539px) {
  .accordion-element[data-image-position=right] .text-box {
    padding-right: calc(var(--grid-padding) * 3);
  }
}
@media (min-width: 1000px) {
  .accordion-element[data-image-position=left] .image-box {
    margin-left: calc(var(--container-padding) * -1);
  }
}
@media (min-width: 1000px) and (max-width: 1539px) {
  .accordion-element[data-image-position=left] .image-box {
    margin-left: calc(var(--container-padding) * -0.5);
  }
}
@media (min-width: 1000px) {
  .accordion-element[data-image-position=left] .text-box {
    padding-left: var(--container-padding);
  }
}
@media (min-width: 1000px) and (max-width: 1539px) {
  .accordion-element[data-image-position=left] .text-box {
    padding-left: calc(var(--grid-padding) * 3);
  }
}
@media (min-width: 1000px) {
  .accordion-element .container {
    display: flex;
    align-items: flex-start;
  }
  .accordion-element .image-box, .accordion-element .text-box {
    max-width: 50%;
  }
  .accordion-element .image-box {
    position: sticky;
    max-width: calc(50% + var(--container-padding));
    top: calc(var(--header-height) * 1.5);
    max-height: calc(100vh - var(--header-height) * 2.5);
  }
  .accordion-element .text-box {
    margin: calc(var(--header-height) / 2) 0;
  }
}
@media (max-width: 999px) {
  .accordion-element .text-box {
    position: relative;
    padding-top: 1em;
  }
  .accordion-element .kicker {
    position: absolute;
    bottom: 100%;
    margin: 0;
    background-color: var(--white-hex);
    padding: 0.4em 1em 0 0;
    border-top-right-radius: var(--border-radius);
  }
  .accordion-element .kicker::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 100%;
    width: calc(var(--border-radius) * 2);
    aspect-ratio: 1;
    border-radius: 50%;
    box-shadow: calc(var(--border-radius) * -1) var(--border-radius) 0 0 var(--white-hex);
    pointer-events: none;
  }
}

/*# sourceMappingURL=accordion-element.css.map */