/* Ratgeber-Artikel · Erstgespräch nach dem Artikel (auch Ratgeber-Übersicht) (Owner: wdf-section-builder, Auftrag P7-ratgeber-artikel) — nur Tokens, mobil zuerst. */
.ra-cta { position: relative; padding: 0 0 var(--space-section); }
.ra-cta--seite { padding-bottom: var(--space-section-end); }
.ra-cta-karte { display: grid; gap: var(--space-32); padding: var(--space-32) var(--space-24); }
.ra-cta-text { display: grid; gap: var(--space-24); align-content: start; }
.ra-cta-h { font: var(--font-weight-display) var(--font-size-h2) / var(--leading-h2) var(--font-display); letter-spacing: var(--tracking-h2); text-wrap: balance; max-width: 18ch; }
.ra-cta-liste { display: grid; gap: var(--space-12); }
.ra-cta-liste li { display: flex; gap: var(--space-12); align-items: flex-start; color: var(--color-text-secondary); font-size: var(--font-size-body); line-height: var(--leading-text); }
.ra-cta-liste svg { flex: none; width: var(--space-18); height: var(--space-18); margin-top: var(--space-3); color: var(--color-accent); }
.ra-cta-aktion { margin-top: var(--space-8); }
.ra-cta-aktion .btn { width: 100%; }
.ra-cta-person { display: flex; align-items: center; gap: var(--space-12); margin: 0; padding-top: var(--space-24); border-top: 1px solid var(--color-line); }
.ra-cta-person figcaption { display: grid; gap: var(--space-2); font-size: var(--font-size-small); color: var(--color-text-tertiary); line-height: var(--leading-snug); }
.ra-cta-person b { color: var(--color-text); font-size: var(--font-size-ui); font-weight: var(--font-weight-display); }
@media (min-width: 560px) { .ra-cta-aktion .btn { width: auto; } }
@media (min-width: 768px) { .ra-cta-karte { padding: var(--space-48); } }
@media (min-width: 1024px) {
  .ra-cta-karte { grid-template-columns: minmax(0, 1fr) auto; column-gap: var(--space-96); align-items: end; padding: var(--space-64); }
  .ra-cta-person { flex-direction: column; align-items: flex-start; padding: 0 0 0 var(--space-32); border-top: 0; border-left: 1px solid var(--color-line); }
  .ra-cta-por { width: var(--space-96); height: var(--space-96); }
}
/* Artikel: Karte steht in der Textspalte (gleiches Raster wie der Inhalt), damit sie als Ende des Artikels liest */
@media (min-width: 1024px) {
  .ra-cta:not(.ra-cta--seite) .wrap { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); column-gap: var(--space-96); }
  .ra-cta:not(.ra-cta--seite) .ra-cta-karte { grid-column: 2; max-width: 68ch; font-size: var(--font-size-body-lg); padding: var(--space-48); column-gap: var(--space-48); }
  /* Übersicht: Karte über die volle Breite, Kopf links, Liste und Aktion rechts */
  .ra-cta--seite .ra-cta-text { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--space-64); }
  .ra-cta--seite .ra-cta-text > .eyebrow, .ra-cta--seite .ra-cta-h { grid-column: 1; }
  .ra-cta--seite .ra-cta-h { grid-row: 2 / span 2; align-self: start; }
  .ra-cta--seite .ra-cta-liste, .ra-cta--seite .ra-cta-aktion { grid-column: 2; }
  .ra-cta--seite .ra-cta-liste { grid-row: 2; }
  .ra-cta--seite .ra-cta-aktion { grid-row: 3; }
}
@media (min-width: 1280px) {
  .ra-cta:not(.ra-cta--seite) .wrap { grid-template-columns: minmax(0, 320px) minmax(0, 1fr); column-gap: var(--space-128); }
}

/* ---------- Passend zum Thema (P9 K-CONV-03): Brücke vom Artikel zur passenden Leistung / zum Baustein, Aussehen der Artikel-Karte ---------- */
.ra-thema { display: grid; gap: var(--space-16); margin-bottom: var(--space-48); }
.ra-thema-karte { display: grid; }
.ra-thema-karte .rg-karte-bild { margin: 0; }
.ra-thema-text { display: flex; flex-direction: column; gap: var(--space-12); padding: var(--space-24); }
.ra-thema-text .rg-weiter { margin-top: var(--space-4); }
@media (min-width: 768px) {
  .ra-thema-karte { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
  .ra-thema-karte .rg-karte-bild { aspect-ratio: auto; min-height: 100%; }
  .ra-thema-text { justify-content: center; padding: var(--space-32); }
  .ra-thema .ra-thema-titel { font-size: var(--font-size-h3); line-height: var(--leading-h3); letter-spacing: var(--tracking-h3); }
}
@media (min-width: 1024px) {
  .ra-cta:not(.ra-cta--seite) .ra-thema { grid-column: 2; max-width: 68ch; font-size: var(--font-size-body-lg); }
}
/* P9-3 A07: Titel-Link misst ≥ 24 px (Innenabstand am Inline-Link verschiebt kein Layout; Klickfläche ist ohnehin die ganze Karte über ::after) */
.ra-thema-titel a { padding-block: var(--space-3); }
