:root{
  --bg:#0c1222;          /* dunkles Blau */
  --card:#121a2e;
  --text:#eaf0ff;
  --muted:#a9b2c7;
  --brand:#1ba1f3;       /* Akzent */
  --accent:#33d69f;
  --border:#26314c;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: linear-gradient(180deg, #0b1120 0%, #0f172a 100%);
  color:var(--text);
  line-height:1.6;
}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1100px;margin:0 auto;padding:24px}
.header{
  position:sticky;top:0;z-index:10;
  background:rgba(11,17,32,.7);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--border);
}
.nav{display:flex;align-items:center;gap:24px}
.nav a{color:var(--text);opacity:.9}
.nav a:hover{opacity:1}
.brand{display:flex;align-items:center;gap:12px;font-weight:700}
.brand .logo{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,var(--brand),#7cc8ff)}
.hero{
  display:grid;grid-template-columns:1.2fr .8fr;gap:32px;align-items:center;
  padding:48px 0;border-bottom:1px solid var(--border)
}
.badges{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}
.badges a img{height:44px;border-radius:8px;border:1px solid var(--border);background:#fff}
.card{
  background:var(--card);border:1px solid var(--border);border-radius:16px;padding:20px
}
.grid{display:grid;gap:16px;grid-template-columns:repeat(3,1fr)}
.section{padding:36px 0}
.kicker{color:var(--accent);font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:.8rem}
.h1{font-size:2.2rem;margin:.25rem 0 1rem}
.muted{color:var(--muted)}
.cta{display:inline-block;background:var(--brand);color:#001428;padding:10px 16px;border-radius:10px;font-weight:700;border:1px solid #1077b8}
.footer{border-top:1px solid var(--border);padding:24px 0;color:var(--muted);font-size:.95rem}
.meta a{color:var(--muted)}
hr{border:0;border-top:1px solid var(--border);margin:24px 0}
ul{padding-left:18px;margin:8px 0}
blockquote{margin:0;padding:12px 14px;border-left:3px solid var(--brand);background:rgba(27,161,243,.08);border-radius:8px}
.notice{font-size:.95rem;color:var(--muted)}
/* Responsive */
@media (max-width:980px){
  .hero{grid-template-columns:1fr}
  .grid{grid-template-columns:1fr}
}