/* Wissensseiten: Ergänzungen zu /legal.css (dieselben Bausteine wie /umstieg-von-revio/). */
.lede{color:#c2d2e8;font-size:17.5px;margin:0 0 28px}
.krumen{font-size:13.5px;color:var(--faint);margin:0 0 18px}
.krumen ol{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px}
.krumen li{margin:0;font-size:13.5px;color:var(--faint)}
.krumen li+li::before{content:"›";margin-right:6px}
.krumen a{color:var(--muted)}
.bereiche{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0}
@media(max-width:700px){.bereiche{grid-template-columns:1fr}}
.bereich{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px}
.bereich h3{margin:0 0 6px;font-size:16px}
.bereich p{margin:0;font-size:14.5px}
.bereich .ziel{display:block;color:var(--cyan);font-size:12.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;margin-bottom:6px}
a.bereich{display:block;color:inherit}
a.bereich:hover{text-decoration:none;border-color:var(--cyan)}
a.bereich:hover h3{color:#fff}
.schritte{list-style:none;padding:0;margin:18px 0;counter-reset:s;display:grid;gap:12px}
.schritte li{counter-increment:s;position:relative;margin:0;padding:16px 18px 16px 64px;background:var(--surface);border:1px solid var(--line);border-radius:14px}
.schritte li::before{content:counter(s,decimal-leading-zero);position:absolute;left:18px;top:14px;font-size:24px;font-weight:800;letter-spacing:-.04em;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.schritte b{color:var(--ink)}
.muster{width:100%;border-collapse:collapse;margin:18px 0;font-size:14.5px}
.muster th,.muster td{text-align:left;vertical-align:top;padding:10px;border-bottom:1px solid var(--line);color:#cdd9e8;line-height:1.55}
.muster th{color:var(--muted);font-size:12.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.muster td:first-child{color:var(--ink);font-weight:600}
@media(max-width:700px){
  .muster thead{display:none}
  .muster tr{display:block;border-bottom:1px solid var(--line);padding:8px 0}
  .muster td{display:block;border:0;padding:3px 0}
}
details{border:1px solid var(--line);border-radius:12px;padding:14px 16px;background:var(--surface);margin:10px 0}
summary{cursor:pointer;font-weight:700;color:var(--ink);font-size:15.5px}
details p{margin:10px 0 0}
.aktionen{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0 0}
.knopf{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:15px;padding:12px 20px;border-radius:12px;border:1px solid var(--line);color:var(--ink)}
.knopf.primaer{color:#04121f;background:var(--cyan);border-color:transparent}
.knopf:hover{text-decoration:none;color:#fff;border-color:var(--cyan)}
.knopf.primaer:hover{color:#04121f;background:#7dd3fc}
a:focus-visible,summary:focus-visible{outline:2px solid var(--cyan);outline-offset:2px;border-radius:4px}
.kopfnav{display:flex;gap:20px;font-size:14.5px;font-weight:500}
.kopfnav a{color:var(--muted)}
.kopfnav a:hover,.kopfnav a[aria-current]{color:#fff;text-decoration:none}
@media(max-width:420px){.kopfnav{gap:14px;font-size:14px}}
h1 + .stand{margin:0 0 16px}
.begriffe{margin:14px 0}
.begriffe dt{font-weight:700;color:var(--ink);font-size:16px;margin:18px 0 4px}
.begriffe dt .syn{font-weight:400;color:var(--muted);font-size:14px}
.begriffe dd{margin:0;color:#cdd9e8;font-size:15.5px}
[id]{scroll-margin-top:84px}
.verantwortung{color:var(--faint);font-size:14px;margin:-8px 0 22px}