/* === Hintergrundvideo (unverändert) === */
#bg-video{position:fixed;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;filter:brightness(.55)}
.bg-overlay{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:-1}

/* === Theme / Basics === */
:root{--neon:#00e5ff;--neon-2:#00fff0;--text:#fff;--text-dim:#cfe6ec;--card:rgba(0,0,0,.55)}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:Arial,Helvetica,sans-serif;color:var(--text);background:#000;text-align:center;overflow-x:hidden;
  line-height:1.65;padding-top:48px;text-shadow:0 0 8px rgba(0,0,0,.85)
}

/* === Navigation (fix, höher) === */
nav{position:fixed;top:0;left:0;right:0;z-index:10;background:rgba(0,0,0,.65);backdrop-filter:blur(2px);padding:6px 10px}
nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:16px;justify-content:center}
nav a{color:var(--neon);text-decoration:none;font-weight:800;font-size:1.05rem;padding:6px 10px;border-radius:8px;transition:.2s}
nav a:hover,nav a.active{color:#012;background:var(--neon);box-shadow:0 0 12px var(--neon)}

/* === Zentrier-Layout === */
.section,.text-section,.kontakt-section,.preise-section,main,section,.container,.wrapper{
  width:min(1100px,92vw);margin:48px auto;padding:0 8px;text-align:center
}
.card{background:var(--card);border-radius:14px;padding:18px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:900px){.grid3{grid-template-columns:1fr}}

/* === Typo === */
h1{font-size:clamp(2.4rem,4.5vw,3.2rem);color:var(--neon);margin-bottom:14px}
h2{font-size:clamp(1.7rem,3.3vw,2.2rem);color:var(--neon);margin:18px 0 8px}
h3{font-size:clamp(1.12rem,2.1vw,1.3rem);color:var(--neon);margin:8px 0 6px}
p{font-size:clamp(1.02rem,1.6vw,1.12rem);color:var(--text);margin:6px 0}
.subtitle{color:var(--text-dim)}
ul{list-style:disc inside}
ul.inline-center{display:inline-block;text-align:left}

/* === Logo + Hero === */
.logo{display:block;margin:120px auto 0;width:min(520px,60vw);height:auto;filter:drop-shadow(0 0 16px var(--neon))}
.hero{min-height:62vh;display:flex;align-items:center;justify-content:center;flex-direction:column;margin-top:6px}
.cta-button{display:inline-block;background:var(--neon);color:#012;font-weight:800;padding:14px 26px;border-radius:12px;text-decoration:none;transition:.25s}
.cta-button:hover{background:var(--neon-2);box-shadow:0 0 16px var(--neon-2)}

/* === PREISE: kompakte Karten/Quadrate === */
.pricing-wrap{width:min(1000px,95vw);margin:0 auto}
.pricing-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:14px;
}
.price-card{
  background:var(--card);
  border:1px solid rgba(255,255,255,.12);
  border-left:3px solid var(--neon);
  border-radius:12px;
  padding:14px;
  text-align:left;
  box-shadow:0 8px 26px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.04);
}
.price-card h3{
  margin:0 0 4px;
  font-size:clamp(1.2rem,2.4vw,1.5rem); /* etwas größer als Standard */
}
.price{
  display:block;
  font-weight:900;
  font-size:clamp(1.8rem,4.2vw,2.8rem); /* DEUTLICH größer und responsiv */
  line-height:1.1;
  color:var(--neon);
  text-shadow:0 0 10px rgba(0,229,255,.6);
  margin:2px 0 6px;
}
.price-sub{display:block;color:var(--text-dim);font-size:.95rem;margin:4px 0 8px}
.price-features{list-style:disc inside;margin:0;padding:0}
.price-features li{color:var(--text-dim);font-size:.95rem;margin:2px 0}

/* Zusatz-Karte */
.addon-card .price{font-size:clamp(1.4rem,3.2vw,2rem)}
.note{color:var(--text-dim);font-size:.98rem}

/* === (Alt) Preise-Klassen – bleiben kompatibel === */
.preise-section h1{margin-bottom:12px}
.preis-liste{list-style:none;margin:0 auto;display:grid;gap:18px;width:min(880px,95vw)}
.preis-liste li{
  background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.45));
  border-left:5px solid var(--neon);padding:16px 18px;border-radius:12px;
  box-shadow:0 8px 26px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,255,255,.06);text-align:left
}
.preis-liste strong{font-size:1.22rem;color:var(--neon)}
.preis-liste span{display:block;color:var(--text-dim);margin-top:6px}
.preis-details{margin-top:8px;padding-left:0}
.preis-details li{color:var(--text-dim);margin:2px 0}

/* === Kontaktformular – untereinander === */
.contact-form{display:flex;flex-direction:column;align-items:center;gap:12px;width:min(720px,92vw);margin:14px auto 0}
.contact-form label{font-weight:800;color:var(--text-dim);align-self:flex-start}
.contact-form input,.contact-form textarea{
  width:100%;background:#0c141a;color:#fff;border:1px solid rgba(255,255,255,.16);
  border-radius:12px;padding:12px 14px;font-size:1rem;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04),0 10px 26px rgba(0,0,0,.45);
  outline:none;transition:border-color .2s,box-shadow .2s,background .2s
}
.contact-form input:focus,.contact-form textarea:focus{border-color:#00e5ff88;box-shadow:0 0 0 2px #00e5ff55}
.contact-form textarea{min-height:170px;resize:vertical}
.contact-form button{
  width:100%;background:var(--neon);color:#012;border:none;border-radius:12px;
  padding:12px 18px;font-weight:800;cursor:pointer;transition:.2s
}
.contact-form button:hover{background:var(--neon-2);box-shadow:0 0 14px var(--neon-2)}

/* === Links / Footer === */
a{color:var(--neon);text-underline-offset:2px}
a:hover{color:var(--neon-2);text-decoration:underline}
footer{color:var(--text-dim);font-size:.95rem;margin:40px 0 24px}

/* Kopf-/Nav-Kompat */
.site-header .nav a{color:var(--neon)}
.site-header .nav a:hover,.site-header .nav a.active{background:var(--neon);color:#012;border-radius:8px;box-shadow:0 0 12px var(--neon)}
.footer-inner{color:var(--text-dim);padding:10px 0}
.spacer{height:6px}
