:root{
  --bg:#0A0D14;--ink:#EAF2F5;--muted:#8FA3AE;--neon:#3DF2C0;--card:#111621;--line:#1F2735;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font:400 17px/1.65 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  background-image:radial-gradient(60% 50% at 50% 0%,rgba(61,242,192,.12),transparent 70%);
  background-repeat:no-repeat;
}
a{color:var(--neon)}
:focus-visible{outline:2px solid var(--neon);outline-offset:3px}

/* Startseite */
.start{max-width:900px;margin:0 auto;padding:clamp(48px,12vh,120px) 20px 60px;text-align:center}
.start h1{
  font:700 clamp(44px,13vw,110px)/1 ui-sans-serif,system-ui,sans-serif;letter-spacing:-.03em;margin:0;
  color:var(--neon);text-shadow:0 0 18px rgba(61,242,192,.55),0 0 60px rgba(61,242,192,.25)
}
.sub{color:var(--muted);margin:18px 0 0;font-size:clamp(15px,2.6vw,19px)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:clamp(40px,8vh,72px)}
.grid a{
  display:block;text-decoration:none;color:var(--ink);background:var(--card);
  border:1px solid var(--neon);border-radius:16px;padding:30px 20px;
  box-shadow:0 0 12px rgba(61,242,192,.18),inset 0 0 18px rgba(61,242,192,.05);
  transition:transform .2s,box-shadow .2s
}
.grid a:hover,.grid a:focus-visible{
  transform:translateY(-3px);
  box-shadow:0 0 22px rgba(61,242,192,.45),inset 0 0 24px rgba(61,242,192,.08)
}
.grid b{display:block;font-size:21px;font-weight:600;letter-spacing:-.01em}
.grid span{display:block;color:var(--muted);font-size:15px;margin-top:6px}

/* Unterseiten */
.page{max-width:760px;margin:0 auto;padding:28px 20px 70px}
.back{display:inline-block;text-decoration:none;color:var(--muted);font-size:15px;margin-bottom:26px}
.back:hover{color:var(--neon)}
.page h1{font-size:clamp(30px,6vw,44px);margin:0 0 10px;letter-spacing:-.02em}
.page h2{font-size:24px;margin:34px 0 8px;letter-spacing:-.01em}
.page h3{font-size:19px;margin:22px 0 6px}
.page p{margin:0 0 14px}
.lead{color:var(--muted);font-size:19px;margin-bottom:26px}
.box{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px 22px;margin:18px 0}
.box.neon{border-color:var(--neon);box-shadow:0 0 12px rgba(61,242,192,.15)}
.soon{color:var(--muted)}
.list{list-style:none;padding:0;margin:0}
.list li{border-bottom:1px solid var(--line);padding:14px 0}
.list li:last-child{border:0}
.list b{display:block}
.list span{color:var(--muted);font-size:15px}
footer{border-top:1px solid var(--line);margin-top:50px;padding:22px 20px 40px;text-align:center;color:var(--muted);font-size:14px}
footer a{color:var(--muted);text-decoration:none;margin:0 10px}
footer a:hover{color:var(--neon)}

@media (max-width:640px){
  .grid{grid-template-columns:1fr}
  .grid a{padding:22px 18px;text-align:left}
}
@media (prefers-reduced-motion:reduce){
  .grid a{transition:none}
  .grid a:hover{transform:none}
}