/* Seitenvorlage „nachsorge“ – aus page-nachsorge.php ausgelagert (13.10.2026) */
/* Vorschau-Fork: globale Chrome-Styles (Reset/Typo/Nav/Buttons/Footer) + eigener :root mit
 Hex-Werten entfernt – Palette/Schriften/Form kommen global aus base.css + css/tokens-<variante>.css.
 Hier nur seitenspezifisches CSS, Farben auf die globalen Token-Namen umgestellt. */

/* PAGE HERO (Unterseiten) */
.page-hero {
padding: 7rem 0 4rem;
background: linear-gradient(135deg, var(--grey-bg) 0%, var(--lila-light) 60%, var(--lila-soft) 100%);
position: relative; overflow: hidden;
}
.page-hero__eyebrow { margin-bottom:0.75rem; }
.page-hero__title { color:var(--lila-dark); margin-bottom:1rem; }
.page-hero__lead { color:var(--text-muted); font-size:1.1rem; line-height:1.75; max-width:640px; margin-bottom:2rem; }

/* BREADCRUMB */
.breadcrumb {
display:flex; align-items:center; gap:0.5rem;
font-size:0.82rem; color:var(--text-muted);
margin-bottom:1rem;
}
.breadcrumb a { color:var(--lila); }
.breadcrumb a:hover { text-decoration:underline; }
.breadcrumb__sep { opacity:0.4; }

/* CONTENT PROSE */
.prose p { color:var(--text-muted); line-height:1.8; margin-bottom:1.25rem; }
.prose p:last-child { margin-bottom:0; }
.prose ul { list-style:none; margin-bottom:1.25rem; display:flex; flex-direction:column; gap:0.5rem; }
.prose ul li { display:flex; align-items:flex-start; gap:0.6rem; color:var(--text-muted); font-size:0.95rem; }
.prose ul li::before { content:''; width:8px; height:8px; border-radius:50%; background:var(--lila); flex-shrink:0; margin-top:0.45rem; }

/* CARDS */
.card { background:var(--white); border-radius:var(--radius-lg); border:1px solid var(--grey-border); overflow:hidden; transition:box-shadow var(--transition), transform var(--transition); }
.card:hover { box-shadow:var(--shadow-lg); transform:translateY(-2px); }
.card__body { padding:2rem; }
.card__icon { width:52px; height:52px; border-radius:50%; background:var(--lila-light); display:flex; align-items:center; justify-content:center; font-size:1.5rem; margin-bottom:1.25rem; }
.card__title { font-family:var(--font-display); font-size:1.15rem; font-weight:600; color:var(--lila-dark); margin-bottom:0.75rem; line-height:1.3; }
.card__text { font-size:0.92rem; color:var(--text-muted); line-height:1.65; margin-bottom:1.25rem; }
.card__link { font-size:0.85rem; font-weight:600; color:var(--lila); display:inline-flex; align-items:center; gap:0.3rem; transition:gap var(--transition); }
.card__link:hover { gap:0.6rem; }
.grid-2 { display:grid; grid-template-columns:repeat(2,1fr); gap:2rem; }

/* INFO BOX */
.infobox { background:var(--lila-light); border-left:4px solid var(--lila); border-radius:var(--radius-lg); padding:1.5rem 2rem; }
.infobox__icon { font-size:1.4rem; margin-bottom:0.5rem; }
.infobox h3 { font-family:var(--font-display); font-size:1.1rem; font-weight:600; color:var(--lila-dark); margin-bottom:0.5rem; }
.infobox p { font-size:0.92rem; color:var(--text); line-height:1.65; }

/* CTA BAND */
.cta-band { background:linear-gradient(135deg,var(--lila-dark) 0%,var(--lila) 100%); color:#fff; padding:4rem 0; text-align:center; }
.cta-band .eyebrow { color:rgba(255,255,255,0.7); margin-bottom:0.75rem; }
.cta-band h2 { color:#fff; margin-bottom:1rem; }
.cta-band p { max-width:560px; margin:0 auto 2.5rem; opacity:0.88; line-height:1.75; }
.cta-band__actions { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }
@media (max-width:768px) {
.grid-2 { grid-template-columns:1fr; }
.page-hero { padding:6rem 0 3rem; }
}
@media (max-width:480px) {
.cta-band__actions { flex-direction:column; align-items:center; }
}