/* Gemeinsamer Stil der Zugang-Seiten (Anmeldung, Registrierung,
   Passwort setzen, Kauf-Hinweis). Eine Datei statt vierfach inline —
   eine Änderung, alle Seiten ziehen mit. Palette wie module/head6.html:
   grüne Marke, kühles Papier — synchron mit der App und dem Logo. */
:root{
  color-scheme:light;
  --gruen:#1E3D30; --gruen-hover:#2A5343; --gold:#3A6B54; --rot:#B3261E; --ok:#1E7A4A;
  --creme:#F2F6F3; --creme-tief:#E6EDE8; --weiss:#FFFFFF; --feld:#FFFFFF;
  --grau:#5B6A62; --linie:#D2DCD6; --linie2:#E4EBE6;
  --warn-bg:#FDECEA; --warn-linie:#F1C3BD;
  --ok-bg:#EAF6EF; --ok-linie:#BFE3CE;
  --gold-bg:#E8F1EB;
  --schatten-1:0 1px 1px rgba(16,40,30,.04);
  --schatten-2:0 1px 2px rgba(16,40,30,.07);
  --r1:3px; --r2:4px; --r3:5px; --t:.16s ease;
}
@media (prefers-color-scheme:dark){
  :root{
    color-scheme:dark;
    --gruen:#D9E9DF; --gruen-hover:#C4DCCD;
    --creme:#0C110E; --creme-tief:#29362E; --weiss:#1F2A24; --feld:#2C3A32;
    --grau:#A4B5AA; --linie:#6F8479; --linie2:#45564C;
    --gold:#7FB496; --rot:#F0897A; --ok:#7FCE9C;
    --warn-bg:#452A26; --warn-linie:#6B3A33;
    --ok-bg:#21402F; --ok-linie:#2F5741;
    --gold-bg:#213426;
    --schatten-1:0 1px 2px rgba(0,0,0,.3);
    --schatten-2:0 1px 3px rgba(0,0,0,.4);
  }
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:'SourceSans3',-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  background:var(--creme);color:var(--gruen);line-height:1.5;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;display:flex;flex-direction:column;
}
.oben{border-top:3px solid var(--gruen)}
.huelle{width:100%;max-width:430px;margin:0 auto;padding:56px 20px 40px;flex:1}

.marke{margin-bottom:32px}
/* Bildmarke (grünes Zeichen, wie App-Kopf & Favicon) über dem Schriftzug —
   einmal hier, damit alle Zugang-Seiten sie ohne Markup-Änderung tragen. */
.marke::before{
  content:"";display:block;width:46px;height:46px;margin-bottom:14px;
  background:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiByb2xlPSJpbWciIGFyaWEtbGFiZWw9IlZJVEFQRU9QTEUiPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0idnBiZyIgeDE9IjAiIHkxPSIwIiB4Mj0iMCIgeTI9IjEiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iIzM1NkI1QSIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iIzFGNDAzNSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHdpZHRoPSI1MTIiIGhlaWdodD0iNTEyIiByeD0iMTE4IiBmaWxsPSJ1cmwoI3ZwYmcpIi8+PHBhdGggZD0iTTE1MCAxNTIgTDI1NiAzNjYgTDM2MiAxNTIiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI0Y2RjNFQyIgc3Ryb2tlLXdpZHRoPSI1NCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+PGNpcmNsZSBjeD0iMjU2IiBjeT0iNDA1IiByPSIyNiIgZmlsbD0iIzhGRDNBRSIvPjwvc3ZnPg==) center/contain no-repeat;
}
.marke .wort{
  font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold)
}
.marke .titel{font-size:25px;font-weight:600;letter-spacing:-.01em;margin-top:2px}
.marke .unter{font-size:14px;color:var(--grau);margin-top:4px}

.karte{
  background:var(--weiss);border:1px solid var(--linie);border-radius:var(--r2);
  box-shadow:var(--schatten-2);padding:26px 24px
}
.karte h2{
  font-size:15px;font-weight:600;padding-bottom:9px;margin-bottom:20px;
  border-bottom:2px solid var(--gruen)
}
.karte p.intro{font-size:14px;color:var(--grau);margin-bottom:18px}
.feld{margin-bottom:16px}
.feld label{display:block;font-size:13px;font-weight:600;margin-bottom:5px}
.feld .hint{font-weight:400;color:var(--grau)}
.feld input{
  width:100%;font-family:inherit;font-size:15px;padding:9px 11px;
  background:var(--feld);color:var(--gruen);
  border:1px solid var(--linie);border-radius:var(--r1);
  transition:border-color var(--t)
}
.feld input:focus{outline:none;border-color:var(--gruen);box-shadow:0 0 0 3px var(--gold-bg)}

button,.knopf{
  display:block;width:100%;font-family:inherit;font-size:15px;font-weight:600;
  padding:10px;margin-top:6px;cursor:pointer;text-align:center;text-decoration:none;
  background:var(--gruen);color:var(--creme);
  border:1px solid var(--gruen);border-radius:var(--r1);
  transition:background var(--t)
}
button:hover:not(:disabled),.knopf:hover{background:var(--gruen-hover);border-color:var(--gruen-hover)}
button:disabled{opacity:.55;cursor:default}
.knopf.stiller{background:transparent;color:var(--gruen);border-color:var(--linie)}
.knopf.stiller:hover{background:var(--creme-tief);border-color:var(--gruen)}

.meldung{
  display:none;margin-top:16px;padding:10px 12px;font-size:14px;
  background:var(--warn-bg);border:1px solid var(--warn-linie);
  border-left:3px solid var(--rot);border-radius:var(--r1)
}
.meldung.sichtbar{display:block}
.meldung.gut{background:var(--ok-bg);border-color:var(--ok-linie);border-left-color:var(--ok)}

.fuss-zeile{margin-top:14px;padding-top:14px;border-top:1px solid var(--linie);
  font-size:13px;color:var(--grau);line-height:1.5}
.fuss-zeile a{color:var(--gruen);font-weight:600}
.fuss-zeile b{color:var(--gruen)}

.hinweis{
  margin-top:24px;padding:12px 14px;font-size:13px;color:var(--grau);
  background:var(--creme-tief);border:1px solid var(--linie2);
  border-left:3px solid var(--gold);border-radius:var(--r1)
}
.hinweis b{color:var(--gruen)}
.kundennr{font-size:16px;font-weight:700;color:var(--gruen);letter-spacing:.02em}

/* Pflicht-Zustimmung bei der Registrierung */
.art13{font-size:12px;color:var(--grau);line-height:1.45;margin:2px 0 14px}
.art13 a{color:var(--gruen);font-weight:600}
.check-zeile{display:flex;gap:9px;align-items:flex-start;margin-bottom:12px;
  font-size:13px;color:var(--grau);line-height:1.45;cursor:pointer}
.check-zeile input[type=checkbox]{width:17px;height:17px;margin-top:1px;flex:none;
  accent-color:var(--gruen);cursor:pointer}
.check-zeile a{color:var(--gruen);font-weight:600}
footer{font-size:12px;color:var(--grau);text-align:center;padding:0 20px 28px;line-height:1.8}
footer a{color:var(--gruen);font-weight:600}