/* T18: weiße Karten. --ivory bleibt für bestehende Textfarben erhalten. */
:root { --card: #FFFFFF; }
.hero-card, .problem-box, #zielbild .vision-benefit,
.about-card, .voice-card, .voice-content, .voice-logo,
.service-card, .final-cta .final-card { background: var(--card); }
.skip-link { background: var(--card); }

/* Der bestehende ::after-Glow bleibt frei; ::before hellt den Inhalt auf.
   36 % statt ca. 50 % sichern mindestens 3:1 für unveränderten Fließtext. */
#zielbild .vision-benefit::before {
  content: ''; position: absolute; inset: 0; border-radius: inherit;
  background: var(--card); opacity: .36; z-index: 2;
  pointer-events: none; transition: opacity .4s ease;
}
#zielbild .vision-benefit.is-reached::before { opacity: 0; }
#zielbild .vision-number, #zielbild .is-reached .vision-number {
  color: #9a7c5d; transition: none;
}
#zielbild .vision-solution { border: 2px solid #B99A7B; }

.costs { border-bottom: 0; }
.t18-cta { text-align: center; }
.costs-cta { margin-top: 48px; }
.vision-cta { margin-top: 56px; }
.about-cta { margin-top: 32px; text-align: left; }
.about-copy > p:last-of-type { margin-bottom: 0; }
.t18-cta .primary-cta { max-width: 100%; }

@media (max-width: 760px) {
  .vision-cta { margin-inline: 22px; }
  .t18-cta .primary-cta {
    width: 100%; padding-inline: 10px; font-size: 11.5px;
    gap: 7px; white-space: normal;
  }
  .t18-cta .button-label { min-width: 0; }
  .about-cta { text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
  #zielbild .vision-benefit::before { display: none; opacity: 0; transition: none; }
}