.media-accordion-fade-enter-active {
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: opacity 0.33s ease;
}
.media-accordion-fade-leave-active {
  transition: opacity 0.33s ease;
}
.media-accordion-fade-enter-from,
.media-accordion-fade-leave-to {
  opacity: 0;
}
.media-accordion {
  padding-block: var(--space-96) var(--space-48);
  padding-inline: var(--side-spacing);
}
.media-accordion,
.media-accordion__media {
  position: relative;
}
.media-accordion__accordion {
  padding-bottom: var(--space-48);
}
.media-accordion__accordion h2 {
  -webkit-padding-before: var(--space-32);
  padding-block-start: var(--space-32);
}
@media (min-width: 64rem) {
  .media-accordion {
    -moz-column-gap: var(--grid-gap);
    column-gap: var(--grid-gap);
    display: grid;
    grid-template-columns: repeat(12, 1fr);
  }
  .media-accordion__media {
    grid-column: 7 / span 6;
    grid-row: 1;
  }
  .media-accordion__accordion {
    grid-column: 1 / span 5;
    grid-row: 1;
  }
  .media-accordion__accordion h2 {
    -webkit-padding-before: 0;
    padding-block-start: 0;
  }
  .media-accordion--media-large .media-accordion__accordion {
    grid-column: 1 / span 4;
  }
  .media-accordion--media-large .media-accordion__media {
    grid-column: 6 / span 7;
  }
}
@media (min-width: 120rem) {
  .media-accordion__accordion {
    grid-column: 1 / span 4;
  }
}