.cta {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 1rem;
  padding: calc(var(--padding) * 2) var(--padding);
  min-height: 75svh;
  align-items: center;
}
@media (max-width: 1023px) {
  .cta {
    position: relative;
    min-height: 100%;
    padding: 180px var(--padding);
  }
}
.cta__text {
  grid-column: span 3;
}
@media (max-width: 1024px) {
  .cta__text {
    grid-column: 1/-1;
  }
}
.cta__text .large-heading {
  text-wrap: balance;
}
.cta__text .button {
  margin-top: 1.77em;
}
.cta__media-trail {
  grid-column: span 7;
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
@media (max-width: 1023px) {
  .cta__media-trail {
    display: flex;
    justify-content: center;
  }
}
.cta__media-trail .cta__media-item {
  position: fixed;
  top: 0;
  left: 0;
  opacity: 0;
  will-change: transform;
  transform: scale(0);
  display: block;
  width: auto;
  height: max(100px, 9.7vw);
}
@media (max-width: 1023px) {
  .cta__media-trail .cta__media-item {
    position: absolute;
    opacity: 1;
    width: 120px;
    height: 120px;
    -o-object-fit: contain;
       object-fit: contain;
    transform: scale(0) rotate(0);
  }
  .cta__media-trail .cta__media-item:nth-of-type(n + 7) {
    display: none;
  }
  .cta__media-trail .cta__media-item:nth-of-type(-n + 3) {
    top: var(--padding);
  }
  .cta__media-trail .cta__media-item:nth-of-type(n + 4) {
    top: unset;
    bottom: var(--padding);
  }
  .cta__media-trail .cta__media-item:nth-of-type(1),
  .cta__media-trail .cta__media-item:nth-of-type(4) {
    left: var(--padding);
  }
  .cta__media-trail .cta__media-item:nth-of-type(1) {
    transform: rotate(-4deg) scale(0);
  }
  .cta__media-trail .cta__media-item:nth-of-type(4) {
    transform: rotate(4deg) scale(0);
  }
  .cta__media-trail .cta__media-item:nth-of-type(2),
  .cta__media-trail .cta__media-item:nth-of-type(5) {
    left: unset;
    z-index: 1;
  }
  .cta__media-trail .cta__media-item:nth-of-type(3),
  .cta__media-trail .cta__media-item:nth-of-type(6) {
    left: unset;
    right: var(--padding);
  }
  .cta__media-trail .cta__media-item:nth-of-type(3) {
    transform: rotate(4deg) scale(0);
  }
  .cta__media-trail .cta__media-item:nth-of-type(6) {
    transform: rotate(-4deg) scale(0);
  }
}
