/* Ressourcen-Ergänzungen zum Webflow-Design: Lesegrößen im Beitrag, Inhaltsverzeichnis, CTA-Boxen, FAQ.
   Farben aus dem Webflow-CSS (:root-Variablen), Schrift wird vererbt. */

.ww-kein-bild { background: var(--alice-blue); min-height: 14rem; }

/* Der Webflow-Beitrag hatte drei Spalten (Autor | Text | leer); ohne Autorenkasten wird daraus eine zentrierte Lesespalte */
.post-body-component { display: block; max-width: 46rem; margin: 0 auto; }
.post-body { width: 100%; }
@media (max-width: 991px) {
  .post-body-component { padding: 0 1.5rem; }
}
@media (max-width: 479px) {
  .post-body-component { padding: 0 1.25rem; }
}
.post-hero-content .text-size-large { color: #111; }

.ww-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .6rem; margin-top: 1rem; color: var(--dim-grey); }
.ww-meta .ww-dot { display: inline-block; width: .3rem; height: .3rem; border-radius: 50%; background: var(--dodger-blue); }

/* Beitragstext: Lesegrößen statt der Webflow-Überschriften-Skala */
.text-rich-text.w-richtext h2 { font-size: 1.9rem; line-height: 1.3; font-weight: 500; margin: 2.6rem 0 .8rem; }
.text-rich-text.w-richtext h3 { font-size: 1.4rem; line-height: 1.35; font-weight: 500; margin: 2rem 0 .6rem; }
.text-rich-text.w-richtext h4 { font-size: 1.15rem; line-height: 1.4; font-weight: 500; margin: 1.6rem 0 .4rem; }
.text-rich-text.w-richtext { color: #111; }
.text-rich-text.w-richtext p { font-size: 1.125rem; line-height: 1.75; font-weight: 400; margin: 0 0 1.2rem; color: #111; }
.text-rich-text.w-richtext ul, .text-rich-text.w-richtext ol { margin: 0 0 1.2rem; padding-left: 1.5rem; }
.text-rich-text.w-richtext li { font-size: 1.125rem; line-height: 1.7; font-weight: 400; margin: .4rem 0; color: #111; }
.text-rich-text.w-richtext a { color: var(--dodger-blue); text-decoration: underline; }
.text-rich-text.w-richtext strong { font-weight: 500; }
.text-rich-text.w-richtext blockquote { border-left: 3px solid var(--dodger-blue); margin: 1.5rem 0; padding: .4rem 1.2rem; font-size: 1.2rem; font-weight: 300; }
.text-rich-text.w-richtext img, .text-rich-text.w-richtext figure img { max-width: 100%; height: auto; border-radius: 1rem; }
.text-rich-text.w-richtext figure { margin: 1.8rem 0; }
.text-rich-text.w-richtext table { width: 100%; border-collapse: collapse; margin: 1.5rem 0; font-size: 1rem; }
.text-rich-text.w-richtext th, .text-rich-text.w-richtext td { border-bottom: 1px solid var(--alice-blue); padding: .6rem .5rem; text-align: left; vertical-align: top; }

/* Inhaltsverzeichnis */
.ww-toc { background: var(--white-smoke); border: 1px solid var(--alice-blue); border-radius: 1rem; padding: 1.4rem 1.6rem; margin: 0 0 2.2rem; }
.ww-toc p { font-weight: 500; font-size: 1rem; letter-spacing: 1px; text-transform: uppercase; margin: 0 0 .6rem; color: var(--dim-grey); }
.ww-toc ol { margin: 0; padding-left: 1.4rem; }
.ww-toc li { margin: .35rem 0; font-size: 1.05rem; line-height: 1.5; font-weight: 400; color: #111; }
.text-rich-text.w-richtext .ww-toc a { color: #111; text-decoration: none; }
.text-rich-text.w-richtext .ww-toc a:hover { color: var(--dodger-blue); }

/* CTA-Boxen */
.ww-cta { border-radius: 1.2rem; padding: 2.2rem 2.4rem; margin: 2.6rem 0; }
.ww-cta.dark { background: #12263a; }
.ww-cta.dark, .ww-cta.dark h4, .ww-cta.dark p { color: #fff; }
.ww-cta.light { background: var(--white-smoke); border: 1px solid var(--alice-blue); }
.ww-cta.light, .ww-cta.light h4, .ww-cta.light p { color: #000; }
.text-rich-text.w-richtext .ww-cta h4 { margin: 0 0 .7rem; font-size: 1.55rem; line-height: 1.3; font-weight: 600; }
.text-rich-text.w-richtext .ww-cta p { margin: 0 0 1.3rem; font-size: 1.15rem; line-height: 1.6; font-weight: 400; opacity: 1; }
.text-rich-text.w-richtext .ww-cta .ww-btn { display: inline-block; background: #1f6fd0; color: #fff; border-radius: 100rem; padding: .8rem 1.5rem; font-weight: 500; text-decoration: none; }
.text-rich-text.w-richtext .ww-cta .ww-btn:hover { opacity: .9; color: #fff; }

/* FAQ */
.ww-faq { margin: 2.6rem 0 0; }
.ww-faq h2 { font-size: 1.9rem; line-height: 1.3; margin: 0 0 1rem; font-weight: 500; }
.ww-faq-item { border-top: 1px solid var(--alice-blue); padding: 1rem 0; font-size: 1.05rem; line-height: 1.65; font-weight: 400; color: #111; }
.ww-faq-item:last-child { border-bottom: 1px solid var(--alice-blue); }
.ww-faq-item strong { display: block; margin-bottom: .3rem; font-weight: 500; }

@media (max-width: 767px) {
  .ww-cta { padding: 1.6rem 1.4rem; }
  .ww-cta h4 { font-size: 1.3rem; }
}