/* Eigenzeit – Design für Startseite, Konto und Rechtstexte. Schriften liegen lokal (kein Google Fonts). */
@import url("fonts/fonts.css");
:root{
  --paper:#F3F1EC; --surface:#FFFFFF; --ink:#15181C; --muted:#5D646D; --line:#DEDAD2;
  --lg:#2F6F6A; --lg-soft:#DCEBE8; --rf:#E0362B; --rf-ink:#0B0B0B;
  --cta:#15181C; --on-cta:#FFFFFF; --good:#1F8A4C; --bad:#C53030;
  --head:"Bricolage Grotesque",system-ui,sans-serif;
  --body:"Atkinson Hyperlegible",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --paper:#101214; --surface:#191C20; --ink:#EEF0F2; --muted:#9AA2AB; --line:#2B2F35;
  --lg-soft:#1D2D2B; --cta:#EEF0F2; --on-cta:#101214; --good:#4CC38A; --bad:#F27474; color-scheme:dark}}
:root[data-theme="dark"]{
  --paper:#101214; --surface:#191C20; --ink:#EEF0F2; --muted:#9AA2AB; --line:#2B2F35;
  --lg-soft:#1D2D2B; --cta:#EEF0F2; --on-cta:#101214; --good:#4CC38A; --bad:#F27474; color-scheme:dark}

/* Zweisprachig: Inhalte stehen doppelt im HTML, die nicht gewählte Sprache wird ausgeblendet. */
html[lang="de"] [data-l="en"], html:not([lang="de"]) [data-l="de"]{display:none!important}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.55 var(--body);-webkit-tap-highlight-color:transparent}
a{color:inherit}
h1,h2,h3{font-family:var(--head);font-weight:750;letter-spacing:-.025em;line-height:1.05;text-wrap:balance}
.wrap{max-width:1080px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.narrow{max-width:620px}
.muted{color:var(--muted)} .small{font-size:14px}
.ok{color:var(--good)} .bad{color:var(--bad)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:700 16px var(--body);text-decoration:none;border-radius:12px;padding:13px 20px;min-height:46px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer}
.btn.primary{background:var(--cta);color:var(--on-cta);border-color:var(--cta)}
.btn.sm{padding:8px 12px;min-height:38px;font-size:14px;border-radius:10px}
.btn.danger{color:var(--bad)}
.btn:disabled{opacity:.5;cursor:default}
.btn:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid var(--lg);outline-offset:3px}

nav.top{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--paper) 88%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top,0px)}
nav.top .wrap{display:flex;align-items:center;gap:14px;height:60px}
.logo{font:800 21px var(--head);letter-spacing:-.03em;text-decoration:none;display:flex;align-items:center;gap:9px}
.logo svg{width:24px;height:24px}
nav.top .links{display:flex;align-items:center;gap:16px;margin-left:auto;font-size:15px}
nav.top .links a:not(.btn){text-decoration:none;color:var(--muted)}
nav.top .links a:not(.btn):hover{color:var(--ink)}
.langbtn{font:700 13px var(--body);letter-spacing:.04em;border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:999px;padding:6px 11px;cursor:pointer;min-height:34px}
@media (max-width:720px){nav.top .links a.hide-sm{display:none}}

.card{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:12px}
.card h2{font-size:20px;margin:0}
.card p{margin:0}
input{font:16px var(--body);color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:11px 12px;width:100%;min-height:46px}
label.field{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--muted)}

footer.site{border-top:1px solid var(--line);margin-top:72px;padding-block:28px calc(28px + env(safe-area-inset-bottom,0px));font-size:14px;color:var(--muted)}
footer.site .wrap{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center}
footer.site a{color:var(--muted)}
footer.site a.cancel{color:var(--ink);font-weight:700}
footer.site .sp{margin-left:auto}

/* Rechtstexte */
.doc{display:flex;flex-direction:column;gap:14px;padding-block:28px}
.doc h1{font-size:34px;margin:8px 0 4px}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--cta);color:var(--on-cta);padding:10px 16px;border-radius:10px;font-size:15px;z-index:50}