:root {
  --block-padding: 20px;
  --container-width: 1450px;
  --small-container-width: calc(1170px + var(--block-padding) * 2 );
}
@media (min-width: 768px) {
  :root {
    --block-padding: clamp(60px, 6.6667px + 6.9444vw, 140px);
  }
}

section.custom-media-text .container {
  max-width: unset;
}
@media (max-width: 1023px) {
  section.custom-media-text .container {
    flex-direction: column-reverse;
  }
}
@media (min-width: 1024px) {
  section.custom-media-text .container {
    align-items: center;
    display: grid;
    grid-template-columns: var(--media-width) auto;
  }
  section.custom-media-text .container.text-first {
    flex-direction: row-reverse;
    grid-template-columns: auto var(--media-width);
  }
  section.custom-media-text .container.text-first .media {
    order: 2;
  }
}
@media (min-width: 1024px) {
  section.custom-media-text .text-first .media figure {
    padding-left: 4%;
    padding-right: 0;
  }
}
@media (min-width: 1024px) and (max-width: 1365px) {
  section.custom-media-text .text-first .content {
    padding-left: 5%;
    padding-right: 8%;
  }
}
section.custom-media-text .media {
  height: 100%;
}
@media (min-width: 1024px) {
  section.custom-media-text .media.align-content--center {
    display: inline-grid;
    align-items: center;
  }
}
@media (min-width: 1024px) {
  section.custom-media-text .media.align-content--bottom {
    display: inline-grid;
    align-items: flex-end;
  }
}
section.custom-media-text .media figure {
  margin: 0;
}
@media (min-width: 1024px) {
  section.custom-media-text .media figure {
    padding-right: 4%;
    padding-left: 0;
  }
}
section.custom-media-text .media figure.image-format--design picture {
  display: block;
  position: relative;
  height: 100%;
  width: 100%;
  aspect-ratio: 1;
  padding-bottom: 100%;
}
section.custom-media-text .media figure.image-format--design img {
  position: absolute;
  top: 0;
  height: 100%;
  width: 100%;
  object-fit: cover;
}
section.custom-media-text .media figure.image-format--textheight {
  height: 100%;
}
section.custom-media-text .media figure.image-format--textheight img {
  object-fit: cover;
  height: 100%;
}
section.custom-media-text .media img {
  display: block;
  max-width: 100%;
  object-position: var(--background-position-left) var(--background-position-top);
  margin: 0 auto;
}
section.custom-media-text .media img, section.custom-media-text .media video, section.custom-media-text .media iframe {
  border-radius: var(--top-left) var(--top-right) var(--bottom-right) var(--bottom-left);
}
section.custom-media-text .media.video figure {
  position: relative;
  margin: 0;
  cursor: pointer;
  aspect-ratio: 16/9;
  padding-bottom: 56%;
  max-width: 100%;
  height: auto;
}
section.custom-media-text .media.video figure.interacted picture {
  opacity: 0;
  pointer-events: none;
}
section.custom-media-text .media.video figure.interacted button {
  display: none;
}
section.custom-media-text .media.video figure:hover video ~ button, section.custom-media-text .media.video figure:hover iframe ~ button {
  transform: translate(-50%, -50%) scale(1.2);
}
section.custom-media-text .media.video figure video, section.custom-media-text .media.video figure iframe {
  position: absolute;
  top: 0;
  left: 0;
  cursor: pointer;
  background-color: black;
}
section.custom-media-text .media.video figure video ~ button, section.custom-media-text .media.video figure iframe ~ button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 1;
  background: none;
  border: none;
  padding: 0;
  height: 50px;
  width: 50px;
  transition: all 0.2s ease-in-out;
}
section.custom-media-text .media.video figure video ~ button svg, section.custom-media-text .media.video figure iframe ~ button svg {
  height: 100%;
  width: 100%;
}
@media (min-width: 768px) {
  section.custom-media-text .media.video figure video ~ button, section.custom-media-text .media.video figure iframe ~ button {
    height: 60px;
    width: 60px;
  }
}
section.custom-media-text .media.video figure video ~ button:not(.is-paused), section.custom-media-text .media.video figure iframe ~ button:not(.is-paused) {
  opacity: 0;
}
section.custom-media-text .media.video figure video ~ picture, section.custom-media-text .media.video figure iframe ~ picture {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: all 0.3s ease;
}
section.custom-media-text .media.video figure video, section.custom-media-text .media.video figure img, section.custom-media-text .media.video figure iframe {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
section.custom-media-text .content {
  align-self: center;
  padding: 0 0 8%;
}
@media (min-width: 1024px) {
  section.custom-media-text .content {
    padding-left: 8%;
    padding-right: 5%;
    padding-bottom: 0;
  }
}
@media (min-width: 1366px) {
  section.custom-media-text .content {
    padding-inline: 8%;
  }
}
@media (min-width: 1600px) {
  section.custom-media-text .content {
    padding-inline: 12%;
  }
}
section.custom-media-text .content p:last-of-type {
  margin-bottom: 0;
}