:root{--ink:#1c2630;--ink2:#2e3b47;--muted:#4c5966;--line:#d5dbe0;--steel:#eef1f3;--zebra:#f6f8f9;--link:#1d5383;--gold:#f1b322;--gold-l:#fdf2d4;--brown:#7a4f00;--ok:#1b6b39;--no:#a12a20;
--serif:Charter,"Bitstream Charter","Sitka Text",Cambria,"Iowan Old Style",Georgia,serif;--sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font:1.0625rem/1.65 var(--sans);color:var(--ink);background:#fff}
svg{max-width:100%}
a{color:var(--link);text-underline-offset:.16em;text-decoration-thickness:1px}
a:hover{color:var(--ink)}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
h1,h2,h3{font-family:var(--serif);line-height:1.2;font-weight:700;letter-spacing:-.01em;text-wrap:balance}
h1{font-size:clamp(1.95rem,1.4rem + 2.4vw,2.85rem);margin:.4em 0 .25em}
h2{font-size:clamp(1.4rem,1.2rem + .9vw,1.8rem);margin:2.2em 0 .6em;scroll-margin-top:1rem}
h3{font-size:1.18rem;margin:1.6em 0 .4em}
p,ul,ol{margin:0 0 1em}
li{margin:.25em 0}
.wrap{max-width:72rem;margin:0 auto;padding:0 1.25rem}
.article{max-width:47.5rem}
.skip{position:absolute;left:-999px;top:0}.skip:focus{left:1rem;top:.5rem;background:#fff;padding:.5rem .8rem;z-index:9}

/* Kopf */
header.site{border-bottom:1px solid var(--line);background:#fff}
.hd{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.25rem 1.5rem;padding-top:.55rem;padding-bottom:.55rem}
.logo{display:flex;align-items:center;gap:.55rem;text-decoration:none;color:var(--ink);font:700 1.3rem/1 var(--serif)}
.logo svg{width:34px;height:34px;flex:none}
.logo b{color:var(--brown)}
.nav ul{display:flex;gap:.15rem;list-style:none;margin:0;padding:0;overflow-x:auto;scrollbar-width:none}
.nav li{margin:0}
.nav a{display:block;padding:.65rem .7rem;text-decoration:none;color:var(--ink);font-weight:600;font-size:.95rem;white-space:nowrap;border-radius:4px}
.nav a:hover{background:var(--steel)}
.nav a[aria-current]{box-shadow:inset 0 -3px 0 var(--gold)}
@media (max-width:52rem){.nav{width:calc(100% + 2.5rem);margin:0 -1.25rem;padding:0 .75rem;border-top:1px solid var(--line)}}

/* Artikel */
.bc ol{list-style:none;display:flex;flex-wrap:wrap;margin:1.25rem 0 0;padding:0;font-size:.875rem;color:var(--muted)}
.bc li{margin:0}
.bc li+li::before{content:"/";margin:0 .5rem;color:#8a96a1}
.meta{color:var(--muted);font-size:.9rem;margin-bottom:.6rem}
.disclosure{font-size:.85rem;color:var(--muted);border-left:3px solid var(--gold);padding:.15rem 0 .15rem .7rem}
.lead{font-size:1.2rem;line-height:1.55;color:var(--ink2)}
.toc{background:var(--steel);border-radius:6px;padding:1rem 1.25rem;margin:1.6rem 0 2rem}
.toc p{font-weight:700;margin:0 0 .35rem}
.toc ol{margin:0;padding-left:1.25rem}
.toc a{text-decoration:none}.toc a:hover{text-decoration:underline}

/* Tabellen */
.tbl{overflow-x:auto;margin:1.3rem 0 1.6rem;-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;font-size:.95rem;min-width:30rem}
th,td{text-align:left;vertical-align:top;padding:.6rem .7rem;border-bottom:1px solid var(--line)}
thead th{background:var(--ink);color:#fff;font-weight:600}
tbody tr:nth-child(even){background:var(--zebra)}
td .amz{white-space:nowrap}

/* Bausteine */
.box{background:var(--gold-l);border-left:5px solid var(--gold);border-radius:0 6px 6px 0;padding:1rem 1.25rem;margin:1.5rem 0}
.box p:last-child,.note p:last-child{margin:0}
.note{background:var(--steel);border-left:4px solid var(--link);padding:.85rem 1.15rem;margin:1.5rem 0}
.pc{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(15.5rem,1fr));margin:1.3rem 0 1.6rem}
.pc>div{border:1px solid var(--line);border-radius:6px;padding:1rem 1.15rem}
.pc h3{margin:0 0 .5rem;font-size:1.05rem}
.pc ul{list-style:none;padding:0;margin:0}
.pc li{position:relative;padding-left:1.35rem}
.pro li::before,.con li::before{position:absolute;left:0;font-weight:700}
.pro li::before{content:"+";color:var(--ok)}
.con li::before{content:"–";color:var(--no)}
.steps{list-style:none;padding:0;counter-reset:s}
.steps>li{counter-increment:s;position:relative;padding-left:2.6rem;margin:0 0 1rem}
.steps>li::before{content:counter(s);position:absolute;left:0;top:.1rem;width:1.75rem;height:1.75rem;border-radius:50%;background:var(--ink);color:#fff;font:700 .85rem/1.75rem var(--sans);text-align:center}
.amz{display:inline-block;background:var(--gold);color:var(--ink);font-weight:700;font-size:.92rem;line-height:1.3;text-decoration:none;padding:.5rem .8rem;border-radius:6px;margin:.1rem 0}
.amz:hover{background:#dc9e0c;color:var(--ink)}
.btn{display:inline-block;background:var(--ink);color:#fff;font-weight:700;text-decoration:none;padding:.75rem 1.15rem;border-radius:6px}
.btn:hover{background:var(--ink2);color:#fff}

/* FAQ */
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;font-weight:700;padding:.8rem 2rem .8rem 0;position:relative;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:.3rem;top:.7rem;font-size:1.3rem;line-height:1;color:var(--muted)}
.faq details[open] summary::after{content:"–"}
.faq details>div{padding:0 0 .6rem}

/* Linklisten */
.cards{list-style:none;padding:0;margin:1.2rem 0 1.6rem;display:grid;gap:1.4rem 2rem;grid-template-columns:repeat(auto-fill,minmax(16.5rem,1fr))}
.cards li{border-top:3px solid var(--ink);padding-top:.7rem;margin:0}
.cards a{font:700 1.1rem/1.3 var(--serif);color:var(--ink);text-decoration:none}
.cards a:hover{text-decoration:underline;color:var(--link)}
.cards p{margin:.35rem 0 0;color:var(--muted);font-size:.92rem;line-height:1.5}
.smap ul ul{margin:.2rem 0 .6rem;font-size:.95rem}

/* Startseite */
.hero{background:var(--steel);border-bottom:1px solid var(--line);padding:2.25rem 0 3rem}
.hero-grid{display:grid;gap:2.2rem;align-items:start}
@media (min-width:60rem){.hero-grid{grid-template-columns:1.05fr 1fr;gap:3.5rem;padding-top:1.5rem}}
.hero h1{font-size:clamp(2.5rem,1.5rem + 4vw,4.25rem);line-height:1.02;letter-spacing:-.025em;margin:0 0 .45em;max-width:11ch}
.hero .lead{max-width:34rem}
.hero-links{display:flex;flex-wrap:wrap;gap:.6rem 1.2rem;align-items:center}
.finder{background:#fff;border:2px solid var(--ink);border-radius:10px;padding:1.3rem 1.4rem 1.4rem;box-shadow:7px 7px 0 var(--gold)}
.finder h2{margin:0 0 .9rem;font-size:1.35rem}
.finder fieldset{border:0;margin:0 0 .9rem;padding:0}
.finder legend{font-weight:700;padding:0;margin-bottom:.4rem}
.finder label{display:inline-block;margin:0 .3rem .45rem 0;cursor:pointer}
.finder input{position:absolute;opacity:0;width:1px;height:1px}
.finder label span{display:inline-block;padding:.45rem .85rem;border:1.5px solid #9aa6b1;border-radius:999px;font-size:.95rem;background:#fff}
.finder label:hover span{border-color:var(--ink)}
.finder input:checked+span{background:var(--ink);border-color:var(--ink);color:#fff}
.finder input:focus-visible+span{outline:3px solid var(--gold);outline-offset:2px}
.finder-out{display:block;background:var(--gold-l);border-radius:6px;padding:.95rem 1.05rem;font-size:.95rem}
.finder-out strong{display:block;font:700 1.15rem/1.3 var(--serif);margin-bottom:.25rem}
.finder-out span{display:block;margin-bottom:.65rem}
.finder-out a{margin:.15rem .7rem .15rem 0}
.blk{padding:2.75rem 0 1rem}
.blk h2{margin-top:0}
.band{background:var(--steel);padding:2.75rem 0 1.5rem;margin-top:2rem}
.narrow{max-width:47.5rem}
.more{margin-top:3rem}

/* Fuß */
footer.site{background:var(--ink);color:#d3dae0;margin-top:4.5rem;padding:2.75rem 0 1.5rem;font-size:.92rem}
footer.site a{color:#fff;text-decoration:none}
footer.site a:hover{text-decoration:underline}
.fgrid{display:grid;gap:1.75rem;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr))}
.fh{font-weight:700;color:var(--gold);margin:0 0 .5rem}
footer.site ul{list-style:none;padding:0;margin:0}
.fine{border-top:1px solid #3b4955;margin:2.25rem 0 0;padding-top:1.1rem;color:#b9c4cd;font-size:.85rem}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media print{header.site,footer.site,.toc,.amz{display:none}}
