:root{
  --bg:#0b0d10;
  --panel:#0f1417;
  --muted:#cbd5d9;
  --accent:#a855f7; /* helles Violet für dunkles Design */
  --accent-soft:#7c3aed; /* tieferes Violet für Verläufe */
  --glass: rgba(255,255,255,0.03);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial;
  background: radial-gradient(1200px 400px at 10% 10%, rgba(168,85,247,0.10), transparent),
		radial-gradient(900px 300px at 90% 90%, rgba(124,58,237,0.07), transparent),
		var(--bg);
  color:var(--muted);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:32px;
}
.card{
  width:100%;
  max-width:980px;
  background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
  border:1px solid rgba(255,255,255,0.04);
  border-radius:14px;
  padding:36px;
  box-shadow: 0 6px 30px rgba(2,6,23,0.6);
  backdrop-filter: blur(6px);
  display:grid;
  grid-template-columns: 1fr 360px;
  gap:28px;
}
header.brand{
  display:flex;
  gap:16px;
  align-items:center;
}
.logo{
  background:linear-gradient(135deg, rgba(168,85,247,0.18), rgba(124,58,237,0.10));
  color:var(--accent);
  border:1px solid rgba(168,85,247,0.24);
}
h1{margin:0;font-size:28px;color:#fff}
a{color:var(--muted)}
p.lead{margin-top:10px;margin-bottom:18px;line-height:1.5;color:var(--muted)}
.lang-switch{display:flex;gap:8px;margin-top:12px}
.btn{
  background:transparent;border:1px solid rgba(255,255,255,0.06);padding:8px 12px;border-radius:10px;
  cursor:pointer;font-weight:600;font-size:13px;
  transition:all .18s ease;
}
.btn:hover{transform:translateY(-3px);box-shadow:0 6px 18px rgba(2,6,23,0.6)}
.btn.primary{
  background:linear-gradient(90deg, rgba(168,85,247,0.18), rgba(124,58,237,0.10));
  border-color:rgba(168,85,247,0.32);
  color:var(--accent);
}
.content{
  padding-right:6px;
}
.meta-card{
  background:var(--panel);padding:20px;border-radius:10px;border:1px solid rgba(255,255,255,0.03);
  display:flex;flex-direction:column;gap:12px;height:100%;
}
.meta-card small{color:rgba(203,213,217,0.6)}
.countdown{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, "Roboto Mono", monospace;letter-spacing:1px;font-weight:700}
.socials{display:flex;gap:8px;flex-wrap:wrap}
.social{padding:8px 10px;border-radius:8px;border:1px solid rgba(255,255,255,0.03);font-weight:600;font-size:13px}
footer.note{margin-top:18px;color:rgba(203,213,217,0.55);font-size:13px}
/* language panes */
.lang-pane{display:none}
.lang-pane.active{display:block}
/* responsive */
@media (max-width:880px){
  .card{grid-template-columns:1fr;}
  .meta-card{order:2}
}
h2{
  text-shadow:0 0 18px rgba(168,85,247,0.25);
}
a[style*="var(--accent)"]{
  text-shadow:0 0 14px rgba(168,85,247,0.22);
}
/* subtle floating animation */
.float{animation:float 6s ease-in-out infinite}
@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-6px)}100%{transform:translateY(0)}}