.btn span {
  align-items: center;
}

/* Red CTA */
.cta-rot {
  background-color: var(--color-red-300);
  margin-bottom: var(--spacing-8);
}

.cta-rot .block-type-heading:first-of-type {
  padding-top: var(--spacing-8);
}

.cta-rot h4,
.cta-rot h2,
.cta-rot span,
.cta-rot p {
  color: var(--color-gray-900);
}

.cta-rot .btn--outlined,
.cta-rot .btn--outlined span,
.cta-rot .btn--outlined p {
  border-color: var(--color-gray-900);
  color: var(--color-gray-900);
}

.cta-rot .btn--outlined:hover,
.cta-rot .btn--outlined:focus,
.cta-rot .btn--outlined:hover span {
  background-color: var(--color-red-800);
  color: var(--color-white);
}

/* Yellow CTA */
.cta-gelb .block-type-heading:first-of-type {
  padding-top: var(--spacing-8);
}

.cta-gelb {
  background-color: var(--color-yellow-500);
}

.cta-gelb h4,
.cta-gelb h2,
.cta-gelb span,
.cta-gelb p {
  color: var(--color-yellow-900);
}

.cta-gelb .btn--outlined,
.cta-gelb .btn--outlined span {
  border-color: var(--color-yellow-700);
  color: var(--color-yellow-700);
}

.cta-gelb .btn--outlined:hover,
.cta-gelb .btn--outlined:focus,
.cta-gelb .btn--outlined:hover span {
  background-color: var(--color-yellow-700);
  color: var(--color-black);
}

.cta-gelb img {
  max-width: 10%;
  mix-blend-mode: multiply;
}

/*
  Mobile
  ========================================================================== */
@media screen and (max-width: 40em) {
  .cta-gelb img {
    max-width: 100%;
  }
}
