/* Gestaltung nach dokumentation/STYLEGUIDE.md. Schriften folgen selbst gehostet (DSGVO). */
:root{--primaer:#247a43;--dunkel:#313a43;--text:#51545c;--grund:#ecebe9;--karte:#fff;--fehler:#c40055;--akzent:#fac023}
*{box-sizing:border-box}
body{margin:0;background:var(--grund);color:var(--text);font:400 1rem/1.5 Roboto,system-ui,sans-serif}
.kopf{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background:var(--karte);box-shadow:0 1px 3px #0002}
.marke{font-family:Economica,system-ui,sans-serif;font-size:1.4rem;color:var(--primaer)}
main{max-width:60rem;margin:1.5rem auto;padding:0 1rem}
.karte{background:var(--karte);border-radius:12px;padding:1.5rem;box-shadow:0 1px 4px #0002}
.schmal{max-width:26rem;margin:2rem auto}
h1{font-family:Economica,system-ui,sans-serif;color:#000;font-size:2.2rem;margin:0 0 1rem}
label{display:block;margin:0 0 1rem}
input{display:block;width:100%;padding:.6rem;margin-top:.25rem;border:1px solid #9aa0a6;border-radius:6px;font:inherit}
.knopf{background:var(--dunkel);color:#fff;border:0;border-radius:32px;padding:.65rem 1.6rem;font:inherit;cursor:pointer}
.knopf:hover{color:#a9d8ff}
.link{background:none;border:0;color:var(--primaer);cursor:pointer;font:inherit;text-decoration:underline}
.fehler{color:var(--fehler);font-weight:700}
a{color:var(--primaer)}
:focus-visible{outline:3px solid var(--akzent);outline-offset:2px}
