@font-face{font-family:"Archivo Portal";font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;src:url("archivo.6ff7e807a8.woff2") format("woff2")}
@font-face{font-family:"Source Sans Portal";font-style:normal;font-display:swap;font-weight:200 900;src:url("source.3a400043a7.woff2") format("woff2")}
/* Layout: Text links, die Anfrage sitzt als Fensterflügel im Rahmen rechts; der Griff zeigt den Fortschritt, Messing ist der einzige Akzent. */
:root{
  --rahmen:#383e42;      /* RAL 7016 Anthrazitgrau, beliebte Rahmenfarbe */
  --rahmen-innen:#454c51;
  --papier:#f4f5f2;      /* nahe RAL 9016 Verkehrsweiß */
  --flaeche:#ffffff;
  --tinte:#1e2326;
  --leise:#586166;
  --linie:#d2d8d8;
  --glas:#dfeceb;        /* Glaskante, leicht grünlich */
  --messing:#8a6a2f;     /* Fenstergriff, Akzent für Text und Fokus */
  --messing-hell:#c9a35a;
  --bank:#c7c9c4;        /* Fensterbank, Muschelkalk */
  --gut:#2c6a4c;
  --hinweis:#8a4b14;
  --display:"Archivo Portal","Archivo","Arial Narrow","Helvetica Neue",Arial,sans-serif;
  --body:"Source Sans Portal","Source Sans 3","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
  --radius:4px;
  --schatten:0 24px 48px -28px rgba(20,26,30,.55);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --rahmen:#5b646a; --rahmen-innen:#4a5257; --papier:#15191b; --flaeche:#1f2528; --tinte:#eceeec; --leise:#a8b1b4;
    --linie:#343d41; --glas:#22343a; --messing:#d6b26c; --messing-hell:#e3c27f; --bank:#3a3f40; --gut:#7cc39d; --hinweis:#e0a46b;
    --schatten:0 24px 48px -28px rgba(0,0,0,.8); color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --rahmen:#5b646a; --rahmen-innen:#4a5257; --papier:#15191b; --flaeche:#1f2528; --tinte:#eceeec; --leise:#a8b1b4;
  --linie:#343d41; --glas:#22343a; --messing:#d6b26c; --messing-hell:#e3c27f; --bank:#3a3f40; --gut:#7cc39d; --hinweis:#e0a46b;
  --schatten:0 24px 48px -28px rgba(0,0,0,.8); color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--papier);color:var(--tinte);font-family:var(--body);font-size:1.125rem;line-height:1.55;font-variant-numeric:tabular-nums}
a{color:var(--messing);text-underline-offset:.18em}
a:hover{color:var(--tinte)}
:focus-visible{outline:3px solid var(--messing-hell);outline-offset:2px;border-radius:2px}
h1,h2,h3{font-family:var(--display);text-wrap:balance;margin:0;line-height:1.08;letter-spacing:-.005em}
h1{font-stretch:118%;font-weight:780;font-size:clamp(2.1rem,1.2rem + 3.6vw,3.55rem)}
h2{font-stretch:112%;font-weight:720;font-size:clamp(1.6rem,1.2rem + 1.6vw,2.3rem)}
h3{font-stretch:100%;font-weight:680;font-size:1.2rem;line-height:1.25}
p{margin:0}
.wrap{width:min(1160px,100% - 32px);margin-inline:auto}
.kennung{font-family:var(--display);font-stretch:72%;font-weight:640;text-transform:uppercase;letter-spacing:.12em;font-size:.82rem;color:var(--messing)}
.leise{color:var(--leise)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Kopf */
.kopf{border-bottom:1px solid var(--linie);background:var(--papier)}
.kopf .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:14px;flex-wrap:wrap}
.marke{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--tinte)}
.marke svg{flex:none}
.marke b{font-family:var(--display);font-stretch:120%;font-weight:800;font-size:1.25rem;letter-spacing:-.01em}
.marke span{display:block;font-size:.8rem;color:var(--leise);line-height:1.2}
.kopf nav{display:flex;gap:18px;flex-wrap:wrap;font-size:1rem}
.kopf nav a{color:var(--tinte);text-decoration:none}
.kopf nav a:hover{color:var(--messing)}
.vermittler{font-size:.92rem;background:var(--flaeche);border:1px solid var(--linie);border-left:4px solid var(--messing-hell);padding:10px 14px;border-radius:var(--radius)}

/* Start */
.start{padding-block:clamp(28px,5vw,64px) clamp(40px,6vw,80px)}
.start .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);gap:clamp(28px,5vw,64px);align-items:start}
.start .text{display:grid;gap:22px;padding-top:clamp(0px,2vw,24px)}
.start .lead{font-size:clamp(1.15rem,1rem + .5vw,1.35rem);max-width:34ch}
.fakten{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.fakten li{display:grid;grid-template-columns:28px 1fr;gap:10px;align-items:start}
.fakten svg{margin-top:3px}
.orte{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.orte span{font-size:.86rem;border:1px solid var(--linie);border-radius:999px;padding:3px 10px;background:var(--flaeche);white-space:nowrap}
.orte b{font-weight:600}
.orte a{color:var(--messing);font-weight:600}
.orte i{font-style:normal;color:var(--leise)}

/* Das Fenster */
.fenster{position:relative;background:var(--rahmen);padding:14px;border-radius:6px;box-shadow:var(--schatten),inset 0 1px 0 rgba(255,255,255,.08);margin-bottom:22px}
.fenster::after{content:"";position:absolute;left:-14px;right:-14px;bottom:-16px;height:16px;background:var(--bank);border-radius:2px;box-shadow:0 8px 14px -10px rgba(0,0,0,.5)}
.fluegel{position:relative;background:var(--rahmen-innen);padding:10px 26px 10px 10px;border-radius:3px;transform-origin:50% 100%;transition:transform 1.1s cubic-bezier(.2,.75,.2,1);box-shadow:inset 0 0 0 1px rgba(0,0,0,.18)}
.fluegel.gekippt{transform:perspective(1400px) rotateX(-7deg)}
.griff{position:absolute;right:4px;top:calc(50% - 22px);width:18px;height:44px;pointer-events:none}
.griff .rosette{position:absolute;inset:0;background:linear-gradient(180deg,var(--messing-hell),#a8853f);border-radius:5px;box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 1px 2px rgba(0,0,0,.4)}
.griff .hebel{position:absolute;left:5px;top:13px;width:8px;height:46px;border-radius:4px;background:linear-gradient(90deg,#d8b874,var(--messing-hell) 45%,#9d7a36);transform-origin:4px 4px;transform:rotate(var(--dreh,0deg));transition:transform .7s cubic-bezier(.3,.8,.2,1.2);box-shadow:0 2px 3px rgba(0,0,0,.35)}
.glas{position:relative;background:linear-gradient(160deg,var(--glas) 0%,var(--flaeche) 42%);border-radius:2px;padding:clamp(18px,3vw,30px);overflow:hidden;min-height:520px}
.glas::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(118deg,transparent 0 58%,rgba(255,255,255,.55) 58% 60.5%,transparent 60.5% 64%,rgba(255,255,255,.35) 64% 64.8%,transparent 64.8%);opacity:.6}
:root[data-theme="dark"] .glas::before{opacity:.08}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .glas::before{opacity:.08}}
.glas>*{position:relative}

/* Formular */
.schrittkopf{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:10px}
.sprossen{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:22px}
.sprossen i{height:5px;border-radius:3px;background:var(--linie);transition:background .3s}
.sprossen i.an{background:var(--messing-hell)}
fieldset{border:0;margin:0;padding:0;min-width:0}
legend{font-family:var(--display);font-stretch:108%;font-weight:720;font-size:clamp(1.3rem,1.1rem + .8vw,1.6rem);line-height:1.15;margin-bottom:6px;padding:0}
.hilfe{color:var(--leise);margin-bottom:18px;font-size:1rem}
.schritt{display:grid;gap:4px}
.js .schritt{display:none}
.js .schritt.aktiv{display:grid;animation:rein .35s ease-out}
@keyframes rein{from{opacity:.4;transform:translateY(6px)}to{opacity:1;transform:none}}
.wahl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.wahl.eins{grid-template-columns:1fr}
.karte{position:relative;display:flex;align-items:center;gap:12px;min-height:58px;padding:12px 14px;border:1.5px solid var(--linie);border-radius:var(--radius);background:var(--flaeche);cursor:pointer;line-height:1.25;transition:border-color .15s,box-shadow .15s}
.karte:hover{border-color:var(--messing-hell)}
.karte input{position:absolute;opacity:0;pointer-events:none}
.karte .punkt{flex:none;width:20px;height:20px;border-radius:50%;border:2px solid var(--leise);display:grid;place-items:center}
.karte input[type=checkbox]~.punkt{border-radius:4px}
.karte input:checked~.punkt{border-color:var(--messing);background:var(--messing)}
.karte input:checked~.punkt::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--flaeche)}
.karte input[type=checkbox]:checked~.punkt::after{width:10px;height:6px;border-radius:0;background:none;border-left:2.5px solid var(--flaeche);border-bottom:2.5px solid var(--flaeche);transform:rotate(-45deg) translate(1px,-1px)}
.karte:has(input:checked){border-color:var(--messing);box-shadow:0 0 0 1px var(--messing)}
.karte:has(input:focus-visible){outline:3px solid var(--messing-hell);outline-offset:2px}
.karte small{display:block;color:var(--leise);font-size:.88rem;margin-top:2px}
.felder{display:grid;gap:14px}
.zwei{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.feld{display:grid;gap:5px}
.feld label{font-weight:600;font-size:1rem}
.feld label i{font-style:normal;font-weight:400;color:var(--leise)}
input[type=text],input[type=tel],input[type=email],select,textarea{font:inherit;font-size:1.05rem;color:var(--tinte);background:var(--flaeche);border:1.5px solid var(--linie);border-radius:var(--radius);padding:11px 12px;width:100%;min-height:50px}
textarea{min-height:84px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--messing);outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--messing-hell) 35%,transparent)}
.fehler{color:var(--hinweis);font-size:.95rem;min-height:1.4em}
.gebiet{font-size:.98rem;padding:10px 12px;border-radius:var(--radius);background:color-mix(in srgb,var(--glas) 70%,var(--flaeche));border:1px solid var(--linie)}
.gebiet:empty{display:none}
.zusammen{font-size:.95rem;border:1px dashed var(--linie);border-radius:var(--radius);padding:10px 12px;margin-bottom:6px;color:var(--leise)}
.zusammen b{color:var(--tinte);font-weight:600}
.einwilligung{display:grid;grid-template-columns:24px 1fr;gap:10px;align-items:start;font-size:.95rem;line-height:1.45}
.einwilligung input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--messing)}
.knopfzeile{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-top:18px;flex-wrap:wrap}
.knopf{font:inherit;font-weight:650;font-size:1.05rem;border-radius:var(--radius);padding:13px 20px;min-height:50px;cursor:pointer;border:1.5px solid var(--rahmen);background:var(--rahmen);color:#fff;display:inline-flex;align-items:center;gap:10px;text-decoration:none}
.knopf:hover{background:var(--tinte);border-color:var(--tinte);color:#fff}
:root[data-theme="dark"] .knopf{background:var(--messing-hell);border-color:var(--messing-hell);color:#16191b}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .knopf{background:var(--messing-hell);border-color:var(--messing-hell);color:#16191b}}
.knopf.zart{background:transparent;color:var(--tinte);border-color:var(--linie)}
.knopf.zart:hover{border-color:var(--tinte);background:transparent;color:var(--tinte)}
.knopf[disabled]{opacity:.55;cursor:progress}
.ehrlich{font-size:.9rem;color:var(--leise);margin-top:14px}
.danke{display:none}
.danke.aktiv{display:grid;gap:14px;animation:rein .5s ease-out}
.danke h2{font-size:clamp(1.5rem,1.2rem + 1vw,2rem)}
.danke ul{margin:0;padding-left:1.1em;display:grid;gap:4px}
.vorschau{font-size:.92rem;background:color-mix(in srgb,var(--messing-hell) 18%,var(--flaeche));border-radius:var(--radius);padding:10px 12px}
.honig{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* Abschnitte */
section.band{padding-block:clamp(48px,7vw,88px);border-top:1px solid var(--linie)}
.band .kopfzeile{display:grid;gap:10px;margin-bottom:28px;max-width:62ch}
.ablauf{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;counter-reset:a}
.ablauf li{background:var(--flaeche);border:1px solid var(--linie);border-radius:var(--radius);padding:22px;display:grid;gap:8px;align-content:start;counter-increment:a}
.ablauf li::before{content:counter(a);font-family:var(--display);font-stretch:125%;font-weight:800;font-size:2.4rem;line-height:1;color:var(--messing)}
.zweispalt{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(24px,4vw,48px);align-items:start}
.tabelle{overflow-x:auto;background:var(--flaeche);border:1px solid var(--linie);border-radius:var(--radius)}
table{border-collapse:collapse;width:100%;font-size:1rem}
th,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--linie);vertical-align:top}
th{font-family:var(--display);font-stretch:85%;font-weight:650;font-size:.86rem;text-transform:uppercase;letter-spacing:.06em;color:var(--leise)}
td:last-child{white-space:nowrap;text-align:right;font-weight:600}
tr:last-child td{border-bottom:0}
.quelle{font-size:.86rem;color:var(--leise);margin-top:10px}
.rechner{background:var(--flaeche);border:1px solid var(--linie);border-radius:var(--radius);padding:22px;display:grid;gap:16px}
.rechner output{font-family:var(--display);font-stretch:110%;font-weight:760;font-size:2rem;line-height:1}
.rechner input[type=range]{width:100%;accent-color:var(--messing)}
.ergebnis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.ergebnis div{border-top:3px solid var(--linie);padding-top:8px;display:grid;gap:4px}
.ergebnis div:first-child{border-top-color:var(--messing-hell)}
.ergebnis strong{font-family:var(--display);font-stretch:105%;font-size:1.35rem;font-weight:720}
.ergebnis span{font-size:.9rem;color:var(--leise);line-height:1.3}
.regeln{margin:0;padding-left:1.1em;display:grid;gap:8px}
.gruppen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.gruppe{background:var(--flaeche);border:1px solid var(--linie);border-top:4px solid var(--rahmen);border-radius:var(--radius);padding:22px;display:grid;gap:8px;align-content:start}
.gruppe .ortsliste{font-size:.92rem;color:var(--messing);font-weight:600;line-height:1.4}
.hinweisgruppe{border-top-color:var(--messing-hell);background:color-mix(in srgb,var(--glas) 55%,var(--flaeche))}
.fragen{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 40px;margin:0}
.fragen dt{font-family:var(--display);font-stretch:100%;font-weight:680;font-size:1.12rem;margin-bottom:6px}
.fragen dd{margin:0;color:var(--tinte)}
.fragen div{border-top:1px solid var(--linie);padding-top:16px}
.fuss{background:var(--rahmen);color:#eef0ee;padding-block:48px 64px}
.fuss a{color:var(--messing-hell)}
.fuss .wrap{display:grid;gap:36px}
.recht{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:40px;font-size:.95rem;line-height:1.55}
.recht h2{font-size:1.3rem;margin-bottom:12px;color:#fff}
.recht h3{font-size:1rem;margin:16px 0 4px;color:#fff}
.recht p+p{margin-top:8px}
.fuss .klein{font-size:.85rem;color:#b9c0c2}
.leiste{position:fixed;left:12px;right:12px;bottom:12px;display:none;justify-content:center;z-index:20}
.leiste.an{display:flex}
.leiste .knopf{box-shadow:0 10px 24px -8px rgba(0,0,0,.45)}
.einwilligungsbanner{position:fixed;left:12px;right:12px;bottom:12px;z-index:30;max-width:720px;margin-inline:auto;background:var(--flaeche);color:var(--tinte);border:1px solid var(--linie);border-radius:var(--radius);box-shadow:var(--schatten);padding:18px;display:none;gap:12px}
.einwilligungsbanner.an{display:grid}
.einwilligungsbanner .knopfzeile{margin-top:0;justify-content:flex-start}

@media (max-width:1100px) and (min-width:901px){.gruppen{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){
  .start .wrap,.zweispalt,.recht{grid-template-columns:1fr}
  .ablauf{grid-template-columns:1fr}
  .gruppen,.fragen{grid-template-columns:1fr}
  .glas{min-height:0}
}
@media (max-width:520px){
  .wahl,.zwei{grid-template-columns:1fr}
  .ergebnis{grid-template-columns:1fr}
  .fluegel{padding-right:24px}
}

/* ===== Portal: Kopf, Navigation, Fuß ===== */
.kopf nav{align-items:center}
.kopf nav a[aria-current="page"]{color:var(--messing);font-weight:650}
.kopf .knopf.klein{min-height:40px;padding:8px 14px;font-size:.95rem}
.kopf nav a.knopf,.kopf nav a.knopf:hover{color:#fff}
:root[data-theme="dark"] .kopf nav a.knopf{color:#16191b}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .kopf nav a.knopf{color:#16191b}}
a.still{color:inherit;text-decoration:none}
a.still:hover{color:var(--messing)}
.knopfreihe{display:flex;flex-wrap:wrap;gap:10px}
.lead.kurzantwort{max-width:46ch}
.fussnav{display:grid;grid-template-columns:minmax(0,1.3fr) repeat(3,minmax(0,1fr));gap:32px;font-size:.95rem}
.fussnav h2{font-size:1rem;color:#fff;margin-bottom:10px;font-stretch:100%}
.fussnav ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.fussnav p{color:#d5dadb;line-height:1.5}
.fussnav p+p{margin-top:8px}
.fuss .marke b{color:#fff}
.fuss .marke span{color:#b9c0c2}

/* ===== Ratgeberseiten ===== */
.pfad{font-size:.9rem;color:var(--leise);margin-bottom:14px}
.pfad ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.pfad li+li::before{content:"›";margin-right:6px;color:var(--linie)}
.pfad a{color:var(--leise)}
.artikel{display:grid;grid-template-columns:minmax(0,1fr) 340px;grid-template-areas:"kopfbereich seite" "inhalt seite";gap:0 clamp(28px,4vw,56px);padding-block:clamp(24px,4vw,48px) clamp(40px,6vw,72px)}
.artikelkopf{grid-area:kopfbereich;min-width:0;display:grid;gap:16px;align-content:start;max-width:72ch}
.artikelkopf h1{font-size:clamp(2rem,1.3rem + 2.6vw,3rem)}
.kurz{background:var(--flaeche);border:1px solid var(--linie);border-left:5px solid var(--messing-hell);border-radius:var(--radius);padding:16px 18px;font-size:clamp(1.08rem,1rem + .3vw,1.22rem);line-height:1.5}
.kurz b{display:block;font-family:var(--display);font-stretch:72%;font-weight:650;text-transform:uppercase;letter-spacing:.12em;font-size:.78rem;color:var(--messing);margin-bottom:6px}
.stand{font-size:.9rem;color:var(--leise)}
.inhalt{grid-area:inhalt;min-width:0;max-width:72ch;padding-top:12px}
.inhalt>section{padding-top:clamp(28px,3vw,40px)}
.inhalt h2{font-size:clamp(1.45rem,1.15rem + 1.1vw,1.95rem);margin-bottom:14px;scroll-margin-top:20px}
.inhalt h3{margin:22px 0 8px}
.inhalt p+p,.inhalt p+ul,.inhalt ul+p,.inhalt p+ol,.inhalt ol+p,.inhalt .tabelle+p,.inhalt p+.tabelle,.inhalt .hinweis+p,.inhalt p+.hinweis{margin-top:14px}
.inhalt ul,.inhalt ol{margin:0;padding-left:1.2em;display:grid;gap:8px}
.inhalt ol.schritte{list-style:none;padding:0;counter-reset:s;gap:14px}
.inhalt ol.schritte li{display:grid;grid-template-columns:40px 1fr;gap:12px;counter-increment:s}
.inhalt ol.schritte li::before{content:counter(s);font-family:var(--display);font-stretch:120%;font-weight:800;font-size:1.6rem;line-height:1.1;color:var(--messing)}
.inhalt .tabelle td:last-child{white-space:normal}
.inhalt td.zahl,.inhalt th.zahl{text-align:right;white-space:nowrap}
.inhalt td.zahl{font-weight:600}
.inhalt .tabelle td:last-child:not(.zahl){text-align:left;font-weight:400}
.hinweis{background:color-mix(in srgb,var(--glas) 60%,var(--flaeche));border:1px solid var(--linie);border-radius:var(--radius);padding:14px 16px;font-size:1rem}
.hinweis b:first-child{color:var(--tinte)}
.seite{grid-area:seite;align-self:start;position:sticky;top:18px;display:grid;gap:18px;padding-top:6px}
.fenster.mini{margin:0 14px 20px}
.fenster.mini .fluegel{padding:8px 22px 8px 8px}
.fenster.mini .glas{min-height:0;padding:18px}
.fenster.mini .griff{top:calc(50% - 22px)}
.fenster.mini h2{font-size:1.25rem;margin-bottom:4px}
.fenster.mini .hilfe{margin-bottom:12px;font-size:.95rem}
.schnell{display:grid;gap:8px}
a.karte{text-decoration:none;color:var(--tinte);min-height:48px;padding:10px 12px;font-size:1rem}
a.karte .pfeil{margin-left:auto;color:var(--messing);font-weight:700}
a.karte:hover{border-color:var(--messing)}
.inhaltsverzeichnis{font-size:.95rem;border-top:1px solid var(--linie);padding-top:14px}
.inhaltsverzeichnis p{font-family:var(--display);font-stretch:72%;font-weight:650;text-transform:uppercase;letter-spacing:.12em;font-size:.78rem;color:var(--leise);margin-bottom:8px}
.inhaltsverzeichnis ol{margin:0;padding-left:1.1em;display:grid;gap:6px}
.inhaltsverzeichnis a{color:var(--tinte);text-decoration:none}
.inhaltsverzeichnis a:hover{color:var(--messing)}
.fragen.einspaltig{grid-template-columns:1fr}
.quellen{font-size:.92rem;color:var(--leise)}
.quellen ol{gap:4px}
.quellen a{word-break:break-word}
.abschluss{background:var(--rahmen);color:#eef0ee;padding-block:clamp(40px,6vw,64px)}
.abschluss .wrap{display:flex;flex-wrap:wrap;gap:20px 40px;align-items:center;justify-content:space-between}
.abschluss h2{color:#fff;max-width:26ch}
.abschluss p{color:#d5dadb;max-width:52ch;margin-top:8px}
.abschluss .knopf{background:var(--messing-hell);border-color:var(--messing-hell);color:#16191b}
.abschluss .knopf:hover{background:#fff;border-color:#fff;color:#16191b}
.karten{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.karten a{display:grid;gap:6px;align-content:start;background:var(--flaeche);border:1px solid var(--linie);border-top:4px solid var(--rahmen);border-radius:var(--radius);padding:20px;text-decoration:none;color:var(--tinte);transition:border-color .15s,transform .15s}
.karten a:hover{border-top-color:var(--messing-hell);transform:translateY(-2px)}
.karten a b{font-family:var(--display);font-stretch:100%;font-weight:680;font-size:1.15rem;line-height:1.25}
.karten a span{color:var(--leise);font-size:.98rem}
.ortstabelle td:last-child{text-align:left;font-weight:400;white-space:normal}
.ortstabelle td:nth-child(2){white-space:nowrap}
.ortsraster{display:flex;flex-wrap:wrap;gap:8px}
.ortsraster span{font-size:.95rem;border:1px solid var(--linie);border-radius:999px;padding:4px 12px;background:var(--flaeche)}
.ortsraster i{font-style:normal;color:var(--leise)}
.rechtstext{max-width:72ch;padding-block:clamp(24px,4vw,48px) clamp(48px,6vw,80px)}
.rechtstext h1{font-size:clamp(2rem,1.4rem + 2vw,2.7rem);margin-bottom:18px}
.rechtstext h2{font-size:1.35rem;margin:28px 0 8px}
.rechtstext p+p{margin-top:10px}
.einfach{min-height:60vh;display:grid;place-items:center;padding-block:48px}
.einfach .fenster{max-width:640px;width:100%}
.einfach .glas{min-height:0;display:grid;gap:14px}

@media (max-width:1100px) and (min-width:901px){.karten{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){
  .artikel{grid-template-columns:minmax(0,1fr);grid-template-areas:"kopfbereich" "seite" "inhalt"}
  .seite{position:static;padding-top:24px}
  .inhaltsverzeichnis{display:none}
  .karten,.fussnav{grid-template-columns:1fr}
  .fussnav{gap:24px}
}
@media (max-width:520px){
  .kopf .wrap{gap:10px}
  .kopf nav{width:100%;flex-wrap:nowrap;overflow-x:auto;gap:16px;padding-bottom:4px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .kopf nav a{white-space:nowrap}
  .kopf nav .knopf.klein{display:none}
  .fenster.mini{margin-inline:6px}
}
h1,h2{overflow-wrap:break-word}
@media (max-width:430px){.artikelkopf h1,.rechtstext h1{font-size:1.72rem;font-stretch:104%}.inhalt h2{font-size:1.36rem}}
@media print{.kopf nav,.seite,.leiste,.einwilligungsbanner,.abschluss{display:none!important}.artikel{grid-template-columns:1fr;grid-template-areas:"kopfbereich" "inhalt"}}