/* Darstellungsschicht. Keine Sachdaten, keine Fremdschriften, keine fremden Netze. */
*,*::before,*::after{box-sizing:border-box}
:root{
  --papier:#F2F1EC; --flaeche:#FBFAF6; --tinte:#1A1D1B; --weich:#55605A;
  --linie:#C3C6BD; --akzent:#1F5D4C; --warn:#8A4B1F;
  --text:system-ui,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
@media (prefers-color-scheme:dark){
  :root{--papier:#141715;--flaeche:#1C201D;--tinte:#ECEFE9;--weich:#A5AFA8;
        --linie:#333A35;--akzent:#5FBFA1;--warn:#D98B4A}
}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--papier);color:var(--tinte);font:17px/1.62 var(--text)}
.rand{width:min(68rem,100% - 2.5rem);margin-inline:auto}
a{color:inherit;text-underline-offset:.18em}
:focus-visible{outline:3px solid var(--akzent);outline-offset:2px}
.sprung{position:absolute;left:-9999px}
.sprung:focus{position:static;display:inline-block;padding:.5rem}

.kopf{border-bottom:1px solid var(--linie);background:var(--flaeche)}
.kopfzeile{display:flex;flex-wrap:wrap;gap:.8rem 2rem;align-items:baseline;padding:1rem 0}
.wortmarke{font-family:var(--mono);letter-spacing:.16em;font-size:1rem;text-decoration:none;
  border-bottom:2px solid var(--akzent);padding-bottom:2px}
nav ul{display:flex;flex-wrap:wrap;gap:1.3rem;margin:0;padding:0;list-style:none;
  font-family:var(--mono);font-size:.82rem}
nav a{text-decoration:none;opacity:.8}
nav a:hover,nav a[aria-current=page]{opacity:1;border-bottom:1px solid var(--akzent)}

.banner{background:var(--warn);color:#fff;font-family:var(--mono);font-size:.8rem;
  padding:.6rem 0}
.banner-test{background:var(--flaeche);color:var(--tinte);
  border-bottom:2px solid var(--akzent);font-size:.82rem}
.aufschlag{padding:3rem 0 2.5rem}
h1{font-size:clamp(1.9rem,5vw,3rem);line-height:1.14;margin:0 0 .8rem;max-width:22ch;font-weight:650}
h2{font-size:1.4rem;margin:2.4rem 0 .8rem;font-weight:650}
h3{font-size:1.08rem;margin:0 0 .3rem;font-weight:650}
p,li{max-width:70ch}
.lead{font-size:1.12rem;color:var(--weich);max-width:58ch}
main{padding:1rem 0 3rem}
section{margin-bottom:2.6rem}

.raster{display:grid;gap:1.4rem 2rem;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr))}
.feld{border-top:2px solid var(--linie);padding-top:.7rem}
.feld p{font-size:.96rem;margin:.2rem 0 0;color:var(--weich)}
.mono{font-family:var(--mono);font-size:.75rem;color:var(--weich)}

table{border-collapse:collapse;width:100%;font-size:.95rem;margin:.6rem 0}
th,td{text-align:left;vertical-align:top;padding:.55rem .8rem .55rem 0;border-bottom:1px solid var(--linie)}
th{font-family:var(--mono);font-size:.74rem;font-weight:600;color:var(--weich)}
.tabelle-scroll{overflow-x:auto}

.kasten{background:var(--flaeche);border:1px solid var(--linie);padding:1rem 1.2rem;max-width:70ch}
.kasten p:last-child{margin-bottom:0}
.knopf{display:inline-block;background:var(--akzent);color:var(--papier);text-decoration:none;
  font-family:var(--mono);font-size:.85rem;padding:.7rem 1.2rem;border:0;cursor:pointer}
.knopf:hover{filter:brightness(1.08)}

form{max-width:42rem}
.fg{margin-bottom:1rem}
label{display:block;font-family:var(--mono);font-size:.76rem;color:var(--weich);margin-bottom:.25rem}
input,select,textarea{width:100%;padding:.6rem .7rem;font:inherit;font-size:.95rem;
  background:var(--flaeche);color:var(--tinte);border:1px solid var(--linie)}
textarea{min-height:9rem}
.pflicht{color:var(--warn)}
.falle{position:absolute;left:-9999px}
#rueckmeldung{margin-top:1rem}

.fuss{border-top:2px solid var(--linie);padding:1.4rem 0 3rem;font-size:.86rem;color:var(--weich);background:var(--flaeche)}
.fuss ul{display:flex;flex-wrap:wrap;gap:1.2rem;list-style:none;margin:0 0 .6rem;padding:0;font-family:var(--mono);font-size:.78rem}
@media print{nav,.knopf,.banner{display:none}body{background:#fff}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}