:root { --navy:#191D53; --orange:#D75F28; --blass:#EAF3FD; --text:#2B3C5A; }
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; font-size:clamp(16px, 1.7vw, 28px); }
body { margin:0; font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; background:var(--blass); color:var(--text); font-size:1rem; line-height:1.5; }
a { color:var(--navy); }
.rahmen { max-width:28.75rem; margin:0 auto; min-height:100vh; background:var(--blass); }
.held { background:#fff; color:var(--navy); padding:1.75rem 1.25rem 1.375rem; text-align:center; border-bottom:0.25rem solid var(--navy); }
.logo { display:block; width:15rem; max-width:78%; height:auto; margin:0.125rem auto 1.125rem; }
.held h1 { font-size:1.625rem; line-height:1.2; margin:0 0 0.5rem; }
.held p { margin:0; color:var(--text); }
.teil { padding:1.125rem 1.25rem 0.25rem; }
.teil h2 { margin:0 0 0.5rem; font-size:1.125rem; color:var(--navy); }
.liste { list-style:none; padding:0; margin:0; }
.liste li { padding:0.4375rem 0 0.4375rem 1.625rem; position:relative; border-bottom:0.0625rem solid #d5e3f5; }
.liste li:last-child { border-bottom:none; }
.liste li::before { content:"✈"; position:absolute; left:0; color:var(--orange); }
.karte { margin:0.875rem 0.875rem 1.125rem; background:#fff; border-radius:0.875rem; padding:1.125rem 1rem 1rem; box-shadow:0 0.125rem 0.5rem rgba(25,29,83,.10); }
.karte h2 { margin:0 0 0.25rem; font-size:1.1875rem; color:var(--navy); }
.karte p { margin:0 0 0.75rem; font-size:0.9375rem; }
label.feldname { display:block; font-size:0.875rem; font-weight:600; margin:0.625rem 0 0.25rem; }
input[type=text], input[type=email], input[type=password], input[type=date] { width:100%; border:0.0938rem solid #b9c9de; border-radius:0.5625rem; padding:0.6875rem 0.75rem; font:inherit; font-size:1rem; color:#222; background:#fff; }
input:focus-visible, button:focus-visible, a:focus-visible { outline:0.1875rem solid var(--orange); outline-offset:0.125rem; }
.haken { display:flex; gap:0.625rem; align-items:flex-start; margin:0.875rem 0 0.25rem; font-size:0.875rem; line-height:1.4; }
.haken input { flex:0 0 1.5rem; width:1.5rem; height:1.5rem; margin:0; accent-color:var(--navy); }
.knopf { display:block; width:100%; margin-top:0.875rem; background:var(--orange); color:#fff; border:none; border-radius:0.625rem; padding:0.875rem; font:inherit; font-size:1.0625rem; font-weight:700; text-align:center; text-decoration:none; cursor:pointer; }
.knopf.zweit { background:#fff; color:var(--navy); border:0.125rem solid var(--navy); }
.fehler { background:#fde8e4; color:#8b1c1c; border-radius:0.5625rem; padding:0.625rem 0.75rem; font-size:0.9375rem; margin:0 0 0.375rem; }
.falle { position:absolute; left:-9999px; width:0.0625rem; height:0.0625rem; overflow:hidden; }
.fuss { text-align:center; font-size:0.8125rem; padding:0.25rem 1rem 1.375rem; color:#5d6f8c; }
.danke { padding:2.75rem 1.375rem 1.625rem; text-align:center; }
.rund { width:4.5rem; height:4.5rem; border-radius:50%; background:var(--navy); color:#fff; font-size:2.25rem; line-height:4.5rem; margin:0 auto 1rem; }
.danke h1 { font-size:1.5rem; margin:0 0 0.625rem; color:var(--navy); }
.kachel { margin:0 0.875rem 0.75rem; background:#fff; border-radius:0.75rem; padding:0.8125rem 0.9375rem; font-size:0.9375rem; box-shadow:0 0.125rem 0.5rem rgba(25,29,83,.08); }
.kachel b { color:var(--navy); }
.klein { text-align:center; font-size:0.8125rem; color:#5d6f8c; margin:0 0 1.125rem; }
.lesetext { padding:1.375rem 1.25rem; } .lesetext h1 { font-size:1.5rem; color:var(--navy); margin:0 0 0.75rem; } .lesetext h2 { font-size:1.0625rem; color:var(--navy); margin:1.25rem 0 0.375rem; }
/* Tablet und breiter: zwei Spalten */
@media (min-width:760px) {
  .rahmen.start { max-width:70rem; display:grid; grid-template-columns:1fr 1fr; align-items:start; background:var(--blass); }
  .rahmen.start .links { background:#fff; min-height:100vh; border-right:0.25rem solid var(--navy); }
  .rahmen.start .held { border-bottom:none; text-align:left; padding-top:2.5rem; }
  .rahmen.start .logo { margin-left:0; }
  .rahmen.start .rechts { padding-top:1.625rem; }
}
/* Pflege */
body.pflege { background:#0d1b2a; color:#dbe6f1; font-size:15px; }
.pflege .breit { max-width:980px; margin:0 auto; padding:18px 16px 40px; }
.pflege h1 { font-size:19px; margin:0; } .pflege h2 { margin:24px 0 10px; font-size:13px; letter-spacing:.05em; color:#8fbff1; text-transform:uppercase; }
.pflege .oben { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.pflege .zwei { display:flex; gap:26px; flex-wrap:wrap; } .pflege .zwei > div { flex:1; min-width:260px; }
.pflege label { display:block; font-size:13px; color:#7f94a8; margin:10px 0 3px; }
.pflege input[type=text], .pflege input[type=email], .pflege input[type=password], .pflege input[type=date] { background:#13263a; border-color:#2d4660; color:#dbe6f1; padding:9px 10px; }
.pflege table { width:100%; border-collapse:collapse; } .pflege .rollen { overflow-x:auto; }
.pflege td, .pflege th { text-align:left; padding:8px 6px; border-bottom:1px solid #22364c; vertical-align:middle; white-space:nowrap; }
.pflege th { color:#7f94a8; font-weight:500; font-size:12px; }
.pflege .kn { display:inline-block; background:none; border:1px solid #2d9cdb; color:#2d9cdb; border-radius:6px; padding:7px 11px; font:inherit; font-size:14px; cursor:pointer; text-decoration:none; }
.pflege .kn.rot { border-color:#e0685a; color:#e0685a; }
.pflege .ja { color:#5ad08a; } .pflege .offen { color:#f0a500; }
.pflege .meldung { background:#143a2a; color:#9be3bd; border-radius:8px; padding:9px 12px; margin:14px 0 0; }
.pflege .schalter { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:10px 0; border-bottom:1px solid #22364c; }
.pflege .schalter small { color:#7f94a8; display:block; }
.pflege .schieber { width:58px; height:32px; border-radius:16px; border:none; position:relative; cursor:pointer; background:#5ad08a; }
.pflege .schieber::after { content:""; position:absolute; top:4px; right:4px; width:24px; height:24px; border-radius:50%; background:#fff; }
.pflege .schieber.aus { background:#56687a; } .pflege .schieber.aus::after { right:auto; left:4px; }
.pflege .anm { max-width:300px; margin:12vh auto 0; }
.pflege .reihe { display:flex; gap:10px; flex-wrap:wrap; align-items:flex-end; margin-top:16px; }
.pflege .fehler { margin-top:12px; }