/* VFRplan – Ratgeber (Artikel und Übersicht). Setzt die Tokens aus /styles.css voraus (hell/dunkel über data-theme). */

.artikel { max-width: 74ch; padding-top: 40px; padding-bottom: 80px; }
.artikel .pfad { font-size: 14px; color: var(--muted); }
.artikel .pfad a { color: var(--muted); }
.artikel h1 { font-size: clamp(32px, 5vw, 46px); font-weight: 700; margin: 14px 0 12px; }
.artikel .stand { font-size: 14px; color: var(--muted); }
.artikel .lead { font-size: clamp(17px, 2vw, 19px); margin-top: 18px; color: var(--text); }
.artikel h2 { font-size: 27px; font-weight: 600; margin: 44px 0 12px; }
.artikel h3 { font-size: 21px; font-weight: 600; margin: 28px 0 8px; }
.artikel p + p, .artikel p + ul, .artikel ul + p, .artikel p + ol, .artikel ol + p { margin-top: 14px; }
.artikel ul, .artikel ol { padding-left: 22px; display: grid; gap: 7px; margin: 12px 0; }
.artikel .tabelle { margin: 18px 0; }
.artikel .tabelle table { min-width: 480px; }
.artikel .tabelle td.zahl, .artikel .tabelle th.zahl { text-align: right; font-variant-numeric: tabular-nums; }
.artikel .tabelle caption { text-align: left; padding: 12px 14px 4px; font-weight: 600; color: var(--ink); }
.artikel figure { margin: 22px 0; }
.artikel figure img { border-radius: 10px; border: 1px solid var(--rule); background: #fff; }
.artikel figcaption { font-size: 13.5px; color: var(--muted); margin-top: 8px; }

/* Hinweis „ersetzt keine Ausbildung“ */
.hinweis { border: 1px solid var(--warn-line); border-left: 4px solid var(--warn-strong); background: var(--warn-bg); color: var(--text);
  border-radius: 12px; padding: 14px 18px; margin: 24px 0; font-size: 15px; }
.hinweis b { color: var(--ink); }

/* Beispielrechnung */
.beispiel { border: 1px solid var(--rule-strong); border-left: 4px solid var(--brand); border-radius: 12px; background: var(--surface);
  padding: 18px 20px; margin: 22px 0; }
.beispiel h3 { margin-top: 0; }
.beispiel .rechenweg { font-variant-numeric: tabular-nums; }

/* „So hilft VFRplan“ */
.vfrplan-hilft { margin-top: 48px; border: 1px solid var(--brand); border-radius: 16px; background: var(--brand-soft); padding: 22px 24px; }
.vfrplan-hilft h2 { margin-top: 0; }
.vfrplan-hilft .acts { margin-top: 18px; }

/* Querverweise */
.weiterlesen { margin-top: 44px; padding-top: 24px; border-top: 1px solid var(--rule); }
.weiterlesen h2 { margin-top: 0; font-size: 22px; }
.weiterlesen ul { list-style: none; padding: 0; }
.weiterlesen li a { font-weight: 600; }

/* Übersicht */
.ratgeber-liste { list-style: none; padding: 0; margin: 28px 0 0; display: grid; gap: 18px;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.ratgeber-liste li { border: 1px solid var(--rule); border-radius: 14px; background: var(--surface); padding: 20px 22px; display: flex; flex-direction: column; gap: 8px; }
.ratgeber-liste h2 { font-size: 22px; font-weight: 600; margin: 0; }
.ratgeber-liste h2 a { color: var(--ink); text-decoration: none; }
.ratgeber-liste h2 a:hover { color: var(--brand-fg); text-decoration: underline; }
.ratgeber-liste p { font-size: 15px; }
.ratgeber-liste .mehr { margin-top: auto; font-weight: 600; }

@media print {
  .vfrplan-hilft, .weiterlesen, .site-foot { display: none !important; }
  .artikel { max-width: none; padding: 0; }
}