.block-cta {
  --block-width: var(--ly--width--large);
  container-type: inline-size;
}
.block-cta .cta {
  max-width: var(--block-width);
  text-align: center;
  position: relative;
  background: var(--co--primary--lower);
  color: var(--co--primary--higher);
  border-radius: var(--sp--5);
  overflow: hidden;
  display: grid;
  align-items: center;
  min-height: 31.25rem;
  margin: 0 auto;
}
.cta.secondary {
  background: var(--co--secondary--medium);
  color: var(--co--neutral--lower);
}
.block-cta .cta-text {
  position: relative;
  padding: var(--sp--7) var(--sp--6);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--sp--6);
}
.block-cta.has-image .cta-text {
  align-items: flex-start;
  text-align: left;
}
.block-cta .block-type-buttons {
  margin: 0;
}
.block-cta img {
  position: relative;
  border-radius: 0;
  width: 100%;
}

.block-cta .scribble {
  position: absolute;
}
.block-cta .scribble.v1 {
  color: var(--co--secondary--medium);
  transform: translate(50%, -50%) rotate(-18deg);
  width: 18.5rem;
  top: 7rem;
  right: 0;
}
.block-cta .scribble.v2 {
  color: var(--co--primary--low);
  transform: translate(-50%, 50%) rotate(180deg);
  width: 19.5rem;
  bottom: 2rem;
  left: 4rem;
}
.block-cta.has-image .scribble {
  display: none;
}
.block-cta .secondary .scribble.v1 {
  color: var(--co--primary--high);
}
.block-cta .secondary .scribble.v2 {
  color: var(--co--secondary--low);
}

@container (min-width: 40rem) {
  .block-cta .cta {
    min-height: 25rem;
  }
  .cta .cta-text {
    padding: var(--sp--8) var(--sp--9);
  }
  .block-cta .scribble.v1 {
    top: -2rem;
    right: 1rem;
    transform: translate(50%, 0);
  }
  .block-cta .scribble.v2 {
    left: 5.75rem;
    bottom: 3.25rem;
    transform: translate(-50%, 50%);
  }
}
@container (min-width: 64rem) {
  .cta.has-image {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
  }
  .cta.has-image .media,
  .cta.has-image img {
    height: 100%;
  }
}
