:root{--bg:#F3F6F9;--sf:#fff;--ink:#0F2440;--mu:#46586D;--ln:#D2DDE7;--bl:#1D4ED8;--bl2:#173EAD;--on:#fff;--mist:#E7EEF6;--sky:#7FB6F2;--red:#D2333F;--warn:#9F1D1D;--serif:Charter,"Bitstream Charter","Sitka Text",Cambria,Georgia,serif;--sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
@media (prefers-color-scheme:dark){:root{--bg:#0D1624;--sf:#142136;--ink:#E7EEF7;--mu:#A8B6C8;--ln:#293A54;--bl:#8DB5FF;--bl2:#B8D0FF;--on:#0D1624;--mist:#1A2A44;--warn:#FF9E9E}}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--ink);font:1.0625rem/1.65 var(--sans)}
.wrap{max-width:70rem;margin:0 auto;padding:0 1.25rem}
a{color:var(--bl);text-underline-offset:.18em;text-decoration-thickness:1px}
a:hover{color:var(--bl2);text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--bl);outline-offset:2px}
.skip{position:absolute;left:-999px;top:0}
.skip:focus{left:1rem;top:1rem;z-index:9;background:var(--sf);padding:.6rem 1rem}
/* Header: der Streifen oben ist der Querschnitt eines Mehrschicht-Tabs */
header.site{background:var(--sf);border-bottom:1px solid var(--ln)}
header.site::before{content:"";display:block;height:5px;background:linear-gradient(90deg,var(--bl) 0 46%,var(--sky) 46% 84%,var(--red) 84%)}
.hd{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.25rem 1.5rem;padding-block:.5rem}
.logo{display:flex;align-items:center;gap:.55rem;padding:.5rem 0;font:700 1.15rem/1 var(--serif);color:var(--ink);text-decoration:none}
.logo span span{color:var(--mu);font-weight:400}
.main ul{display:flex;flex-wrap:wrap;list-style:none;margin:0 -.7rem;padding:0}
.main a{display:block;padding:.75rem .7rem;color:var(--ink);text-decoration:none;font-weight:500}
.main a:hover{color:var(--bl)}
.main a[aria-current]{color:var(--bl);box-shadow:inset 0 -3px var(--bl)}
/* Inhalt */
.crumb ol{display:flex;flex-wrap:wrap;gap:.1rem .5rem;list-style:none;margin:1.25rem 0 0;padding:0;font-size:.9rem;color:var(--mu)}
.crumb li+li::before{content:"/";margin-right:.5rem;color:var(--ln)}
.crumb a{display:inline-block;padding:.35rem 0}
.art{max-width:46rem;padding-bottom:1rem}
.home{max-width:none}
.home>*:not(.hero){max-width:46rem}
h1,h2{font-family:var(--serif);font-weight:700;letter-spacing:-.01em;text-wrap:balance}
h1{font-size:clamp(2rem,1.25rem + 3vw,3.05rem);line-height:1.1;margin:.75rem 0 1rem}
h2{font-size:1.65rem;line-height:1.25;margin:2.75rem 0 .75rem;scroll-margin-top:1rem}
h3{font-size:1.18rem;line-height:1.35;margin:1.9rem 0 .5rem}
p,ul,ol{margin:0 0 1rem}
li{margin:.25rem 0}
.lead{font-size:1.2rem;line-height:1.55;color:var(--mu)}
.meta,.disc{font-size:.9rem;color:var(--mu)}
.disc{border-left:3px solid var(--ln);padding-left:.8rem}
.quick{margin:1.5rem 0;padding:1rem 1.25rem;background:var(--sf);border:1px solid var(--ln);border-left:6px solid var(--bl);border-radius:0 6px 6px 0}
.toc{margin:1.75rem 0;padding:1rem 1.25rem;border:1px solid var(--ln);border-radius:6px}
.toc-t{font-weight:700;margin:0 0 .25rem}
.toc ol{margin:0;padding-left:1.25rem}
.toc a{display:inline-block;padding:.15rem 0}
.tw{overflow-x:auto;margin:1.25rem 0 1.5rem;background:var(--sf);border:1px solid var(--ln);border-radius:6px}
table{width:100%;border-collapse:collapse;font-size:.95rem;line-height:1.5}
th,td{padding:.65rem .8rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--ln)}
thead th{background:var(--mist);font-weight:600;white-space:nowrap}
tbody tr:last-child>*{border-bottom:0}
tbody th{font-weight:600}
.aff{display:grid;gap:.5rem;margin:1.5rem 0;padding:1.1rem 1.25rem;background:var(--sf);border:1px solid var(--ln);border-radius:8px}
.aff p{margin:0}
.aff-t{font:700 1.12rem/1.3 var(--serif)}
.btn{display:inline-block;justify-self:start;margin-top:.25rem;padding:.7rem 1.1rem;background:var(--bl);color:var(--on);border-radius:6px;font-weight:600;text-decoration:none}
.btn:hover{background:var(--bl2);color:var(--on)}
.note{padding:.9rem 1.1rem;background:var(--mist);border-radius:6px}
.warn{padding:.9rem 1.1rem;border:1.5px solid var(--warn);border-radius:6px}
.warn strong{color:var(--warn)}
.steps{counter-reset:s;list-style:none;padding:0}
.steps>li{counter-increment:s;position:relative;margin:1rem 0;padding-left:2.9rem}
.steps>li::before{content:counter(s);position:absolute;left:0;top:-.05rem;display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:var(--bl);color:var(--on);font-weight:700;font-size:.95rem}
.faq details{border-bottom:1px solid var(--ln)}
.faq summary{cursor:pointer;padding:.85rem 0;font-weight:600}
.faq details>p{margin:0 0 1rem}
.links{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:0 1.5rem;list-style:none;padding:0}
.links li{margin:0}
.links a{display:block;padding:.6rem 0;border-bottom:1px solid var(--ln);font-weight:500;text-decoration:none}
.links a:hover{text-decoration:underline}
.rel{margin-top:3rem}
/* Startseite: Hero mit Tab-Querschnitt */
.hero{display:grid;gap:2rem;align-items:center;padding:2.5rem 0 .5rem}
.hero h1{margin-top:0;max-width:18ch}
.chips{display:flex;flex-wrap:wrap;gap:.6rem;list-style:none;padding:0;margin:1.5rem 0 0}
.chips li{margin:0}
.chips a{display:inline-block;padding:.7rem 1.15rem;border:2px solid var(--bl);border-radius:999px;font-weight:600;text-decoration:none}
.chips li:first-child a{background:var(--bl);color:var(--on)}
.tabart{display:none}
@media (min-width:52rem){
.hero{grid-template-columns:1fr 15rem}
.tabart{display:block;position:relative;width:14rem;aspect-ratio:4/3;margin:auto;transform:rotate(-7deg);border-radius:20px;background:linear-gradient(180deg,var(--bl) 0 40%,#F7FAFD 40% 63%,var(--sky) 63%);box-shadow:0 22px 44px -22px rgba(15,36,64,.55),inset 0 0 0 1px rgba(15,36,64,.14);overflow:hidden}
.tabart::before{content:"";position:absolute;inset:0;background:radial-gradient(rgba(255,255,255,.28) 1px,transparent 1.6px) 0 0/7px 7px}
.tabart::after{content:"";position:absolute;left:50%;top:51%;width:31%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 34% 32%,#F27880,var(--red) 62%);box-shadow:0 4px 10px rgba(80,10,20,.3)}
}
/* Filter (Alle Seiten) */
.filter{margin:1.5rem 0}
.filter label{display:block;font-weight:600;margin-bottom:.35rem}
.filter input{width:100%;max-width:28rem;padding:.75rem 1rem;font:inherit;color:var(--ink);background:var(--sf);border:1.5px solid var(--ln);border-radius:6px}
/* Footer */
footer.site{margin-top:4rem;padding:2.5rem 0 1.5rem;background:var(--sf);border-top:1px solid var(--ln);font-size:.95rem}
.fcols{display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:1.5rem}
footer h2{margin:0 0 .4rem;font:700 1rem/1.4 var(--sans);letter-spacing:0}
footer ul{list-style:none;margin:0;padding:0}
footer li{margin:0}
footer li a{display:inline-block;padding:.4rem 0}
.fine{margin:1.75rem 0 0;font-size:.85rem;color:var(--mu);max-width:60rem}
@media print{header.site,footer.site,.toc,.rel,.btn{display:none}}
dt{font-weight:700;margin-top:1rem}dd{margin:0 0 .5rem}
@media (max-width:40rem){.hd{padding-block:.25rem 0}.main{width:100%;margin:0 -1.25rem;width:calc(100% + 2.5rem)}.main ul{flex-wrap:nowrap;overflow-x:auto;margin:0;padding:0 .55rem;scrollbar-width:none}.main ul::-webkit-scrollbar{display:none}.main a{white-space:nowrap;padding:.7rem .7rem}.hero{padding-top:1.5rem}}