:root{
  --bg:#0b0b0e;
  --card:#16161d;
  --text:#e9e9ee;
  --muted:#b7b7c9;
  --brand:#7c5cff;
  --brand-2:#23d5ab;
  --outline:rgba(124,92,255,.3);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.6}
a{color:var(--text);text-decoration:none}
.container{max-width:1100px;margin:0 auto;padding:64px 20px}
.nav{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:14px 20px;background:rgba(11,11,14,.65);backdrop-filter:saturate(180%) blur(16px);border-bottom:1px solid rgba(255,255,255,.06)}
.brand{display:flex;gap:10px;align-items:center;font-weight:700}
.brand-mark{width:36px;height:36px;object-fit:contain;display:inline-block;border-radius:0;filter:drop-shadow(0 0 6px rgba(124,92,255,.25));}
.nav nav{display:flex;gap:18px;align-items:center}
.nav .cta{padding:10px 14px;border:1px solid var(--outline);border-radius:10px}
.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:32px;align-items:center;padding:72px 20px;background:radial-gradient(1000px 400px at 10% -10%, rgba(124,92,255,.25), transparent),linear-gradient(180deg, rgba(255,255,255,.03), transparent)}
.hero-logo{display:block;width:min(40vw,380px);height:auto;opacity:.95;margin-bottom:8px}
.sub{color:var(--muted);max-width:600px}
.hero__actions{display:flex;gap:12px;margin:18px 0 8px}
.btn{display:inline-block;padding:12px 18px;border-radius:12px;border:1px solid rgba(255,255,255,.08);background:var(--card)}
.btn.primary{background:linear-gradient(90deg,var(--brand),var(--brand-2));color:#0b0b0e;font-weight:700;border:0}
.btn.secondary{background:#1c1c25}
.btn.ghost{background:transparent;border-color:rgba(255,255,255,.18)}
.trust{display:flex;gap:18px;list-style:none;padding:0;margin:14px 0 0;color:var(--muted);flex-wrap:wrap}
.hero__visual{position:relative;height:320px;border-radius:16px;background:linear-gradient(180deg,#15151c,#0e0e12);border:1px solid rgba(255,255,255,.06);overflow:hidden;display:flex;align-items:center;justify-content:center}
#waveCanvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:.9}
.glow{position:absolute;inset:-40% -20% auto -20%;height:140%;background:radial-gradient(closest-side, rgba(124,92,255,.35), transparent 60%)}
.wave{position:absolute;inset:auto 0 0 0;height:140px;background:repeating-linear-gradient(90deg, rgba(255,255,255,.07) 0 2px, transparent 2px 8px);filter:blur(2px)}
h2{font-size:28px;margin:0 0 24px}
.features .grid3,.demos .grid3,.pricing .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.features article,.card,.price-card{background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:18px}
.card h4{margin:0 0 10px}
.note{color:var(--muted);margin-top:10px}
.price{font-size:32px;margin:6px 0 12px;background:linear-gradient(90deg,var(--brand),var(--brand-2));-webkit-background-clip:text;background-clip:text;color:transparent}
.price-card.highlight{outline:2px solid var(--outline);position:relative}
.price-card.highlight::after{content:"Beliebteste Option";position:absolute;top:-10px;right:12px;background:var(--brand);color:#0b0b0e;padding:4px 8px;border-radius:8px;font-weight:700;font-size:12px}
.tiny{color:var(--muted);font-size:12px}
.process .steps{counter-reset:step;display:grid;gap:10px}
.process .steps li{list-style:none;padding:14px;border-radius:12px;background:var(--card);border:1px solid rgba(255,255,255,.06)}
.faq details{background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:12px;margin-bottom:10px}
.contact form{display:grid;gap:12px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
input,select,textarea{width:100%;padding:12px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#0f0f14;color:var(--text)}
label{display:grid;gap:8px}
.checkbox{display:flex;gap:8px;align-items:flex-start}
.field fieldset{border:0;padding:0;margin:0}
.field-packages legend{font-size:14px;margin-bottom:8px;color:var(--text);font-weight:600}
.option-pills{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.option-pills input.pkg{position:absolute;opacity:0;pointer-events:none}
.option-pills label{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:#0f0f14;color:var(--text);font-size:12px;cursor:pointer;transition:.15s ease;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.option-pills label:hover{border-color:var(--brand);box-shadow:0 8px 22px rgba(0,0,0,.35)}
.option-pills .pill-title{font-weight:600}
.option-pills .pill-note{color:var(--muted);font-size:11px}
.option-pills input.pkg:checked + label{border-color:var(--brand);outline:2px solid var(--outline)}
.footer .cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:20px;border-top:1px solid rgba(255,255,255,.06);padding:32px 0 64px}
.footnav{list-style:none;padding:0;margin:0;display:grid;gap:8px}
/* Impressum */
.imp-fab{position:fixed;right:16px;bottom:16px;z-index:3000;padding:10px 14px;font-weight:700;border-radius:999px;background:linear-gradient(90deg,var(--brand),var(--brand-2));color:#0b0b0e;border:none;cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.impressum-modal[hidden]{display:none}
.impressum-modal{position:fixed;inset:0;z-index:4000;background:rgba(0,0,0,.6);display:grid;place-items:center;padding:20px}
.imp-card{width:min(520px,92vw);background:var(--card);color:var(--text);border:1px solid rgba(255,255,255,.08);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.5);padding:18px 18px 22px;position:relative}
.imp-card h3{margin:0 0 8px;font-size:20px}
.imp-card p{margin:0}
.imp-card .muted{ color: var(--muted); font-size:.95em }
.imp-close{position:absolute;top:8px;right:10px;background:transparent;color:var(--text);border:none;font-size:24px;cursor:pointer}
@media (max-width: 900px){
  .hero{grid-template-columns:1fr}
  .features .grid3,.demos .grid3,.pricing .grid3{grid-template-columns:1fr}
  .grid2{grid-template-columns:1fr}
  .option-pills{grid-template-columns:1fr}
  .footer .cols{grid-template-columns:1fr}
}


/* Price old→new styling */
.price .old{ text-decoration: line-through; opacity:.9; margin-right:8px; font-size:.7em; background:none !important; -webkit-background-clip:initial; background-clip:initial; color:#ffffff !important; -webkit-text-fill-color:#ffffff; }
.price-card.highlight.offer::after{ content:"Eröffnungsangebot"; }


/* Footer symbol logo */
.footer-mark{height:20px;width:20px;object-fit:contain;opacity:.9;display:block;filter:drop-shadow(0 0 3px rgba(124,92,255,.20));}

/* Checkbox inline text & alignment */
.checkbox{display:flex;gap:10px;align-items:center}
.checkbox input{flex:0 0 auto;margin:0;accent-color:var(--brand)}
.checkbox span{line-height:1.4}


/* Checkbox fix: input width & spacing */
.checkbox input[type="checkbox"]{
  width:auto !important;
  margin:0 8px 0 0 !important;
  flex:0 0 auto;
  accent-color: var(--brand);
}
/* Ensure the label itself behaves as flex and no giant gaps */
label.checkbox{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
}

.footer-wordmark{height:18px;width:auto;opacity:.9;display:block;filter:drop-shadow(0 0 3px rgba(124,92,255,.20));}