/* ERLEDIGT. – Netlify-safe, CH */
:root{
  --bg:#0b0c10; --muted:#a3a7b7; --text:#eef0f7; --line:rgba(255,255,255,.10);
  --accent:#66e3ff; --accent2:#9b87ff; --shadow:0 20px 60px rgba(0,0,0,.45);
  --radius:18px; --radius2:24px; --max:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
  background:
    radial-gradient(1000px 600px at 15% 5%, rgba(102,227,255,.14), transparent 60%),
    radial-gradient(900px 500px at 85% 10%, rgba(155,135,255,.16), transparent 60%),
    var(--bg);
  color:var(--text);
}
a{color:inherit; text-decoration:none}
.container{max-width:var(--max); margin:0 auto; padding:0 18px}

.header{position:sticky; top:0; z-index:50; backdrop-filter: blur(10px); background: rgba(11,12,16,.65); border-bottom:1px solid var(--line);}
.header__inner{display:flex; align-items:center; justify-content:space-between; padding:12px 0; gap:12px;}
.brand{display:flex; align-items:center; gap:12px}
.brand__logo{width:64px;height:auto}
.brand__text{display:flex; flex-direction:column; gap:2px}
.brand__name{font-weight:950; letter-spacing:.2px; font-size:18px}
.brand__tag{font-size:12px; color:var(--muted); font-weight:800}
.dot{color:var(--accent)}

.nav{display:none; gap:16px}
.nav a{color:var(--muted); font-weight:800; font-size:14px}
.nav a:hover{color:var(--text)}
.header__cta{display:flex; gap:10px; align-items:center}

.btn{display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--line); padding:10px 14px; border-radius:999px; font-weight:900; font-size:14px}
.btn--primary{background: linear-gradient(135deg, rgba(102,227,255,.20), rgba(155,135,255,.22)); border-color: rgba(102,227,255,.35);}
.btn--ghost{background: rgba(255,255,255,.04)}
.btn--full{width:100%}

.hero{padding:54px 0 26px}
.hero__grid{display:grid; gap:18px}
.eyebrow{color:var(--muted); font-weight:900; margin:0}
.hero__content h1{font-size:44px; line-height:1.05; margin:8px 0 12px}
.lead{color:rgba(238,240,247,.86); font-size:18px; line-height:1.55; margin:0 0 18px}

.trust{display:flex; gap:10px; flex-wrap:wrap}
.trust__item{background: rgba(255,255,255,.04); border:1px solid var(--line); border-radius:14px; padding:10px 12px; display:flex; flex-direction:column}
.trust__item strong{font-size:14px}
.trust__item span{color:var(--muted); font-size:12px}

.section{padding:56px 0}
.section--alt{background: linear-gradient(180deg, transparent, rgba(255,255,255,.03), transparent); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.section__head{margin-bottom:18px}
.section__head h2{margin:0 0 6px; font-size:28px}
.section__head p{margin:0; color:var(--muted)}

.grid2{display:grid; gap:14px}
.grid3{display:grid; gap:14px}
.tile{background: rgba(255,255,255,.04); border:1px solid var(--line); border-radius: var(--radius); padding:16px}
.bullets{margin:0; padding-left:18px; color:var(--muted)}
.bullets li{margin:6px 0}

.checklist{list-style:none; margin:12px 0; padding:0}
.checklist li{padding-left:26px; margin:10px 0; position:relative}
.checklist li::before{content:"✓"; position:absolute; left:0; top:-1px; color:var(--accent); font-weight:900}

.pricing{display:grid; gap:14px}
.pricecard{background: rgba(255,255,255,.04); border:1px solid var(--line); border-radius: var(--radius2); padding:18px; position:relative}
.pricecard--featured{background: linear-gradient(180deg, rgba(102,227,255,.12), rgba(155,135,255,.10)); border-color: rgba(102,227,255,.28); box-shadow: var(--shadow)}
.badge{position:absolute; top:14px; right:14px; background: rgba(102,227,255,.18); border:1px solid rgba(102,227,255,.35); padding:6px 10px; border-radius:999px; font-size:12px; font-weight:900}
.price{margin:0; font-size:40px; font-weight:950}
.small{font-size:13px; color:var(--muted)}

.steps{display:grid; gap:12px}
.step{background: rgba(255,255,255,.04); border:1px solid var(--line); border-radius: var(--radius); padding:16px}
.step__nr{display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:999px; background: rgba(102,227,255,.16); border:1px solid rgba(102,227,255,.35); font-weight:950; margin-bottom:10px}

.footer{border-top:1px solid var(--line); padding:22px 0}
.footer__inner{display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap}

@media (min-width: 860px){
  .nav{display:flex}
  .hero__grid{grid-template-columns: 1.15fr .85fr}
  .grid2{grid-template-columns: 1fr 1fr}
  .grid3{grid-template-columns: repeat(3, 1fr)}
  .pricing{grid-template-columns: repeat(3, 1fr)}
}

/* Confirmation box */
.confirmbox{margin-top:12px}
.confirmbox__label{display:flex; gap:10px; align-items:flex-start; color:rgba(238,240,247,.92); line-height:1.45}
.confirmbox__label input{margin-top:4px; transform: scale(1.15)}
.btn.disabled{opacity:.45; pointer-events:none; filter: grayscale(20%);}

/* Forms */
.form{display:grid; gap:12px; margin-top:12px}
.field{display:grid; gap:6px}
.field label{font-weight:850}
.field input,.field textarea,.field select{
  width:100%; padding:12px 12px; border-radius:14px;
  border:1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.03);
  color: var(--text);
}
.field textarea{min-height:110px; resize:vertical}
.helper{color:var(--muted); font-size:12px}
hr.sep{border:0; border-top:1px solid rgba(255,255,255,.10); margin:18px 0}

}

/* Force primary button to be bright (including <button>) */
button.btn, a.btn { border:0; cursor:pointer; text-decoration:none; }
button.btn--primary, .btn--primary{
  background: linear-gradient(135deg, #3fd0c9, #2bb0e6) !important;
  color: #001014 !important;
  font-weight: 900 !important;
  box-shadow: 0 10px 28px rgba(63,208,201,.45) !important;
}
button.btn--primary:hover, .btn--primary:hover{
  filter: brightness(1.12);
  box-shadow: 0 12px 32px rgba(63,208,201,.60) !important;
}

/* Zusatzleistung price box */
.pricebox{
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  padding:14px;
  background: rgba(255,255,255,.03);
}
.pricebox__price{
  font-size: 22px;
  font-weight: 900;
  letter-spacing: .2px;
  margin-bottom: 6px;
}
.pricebox__price span{
  font-size: 30px;
}


/* === GLOBAL BUTTON STYLE (FORCE BRIGHT) === */
.btn,
.btn--primary,
.btn--ghost,
a.btn,
button,
input[type="submit"],
input[type="button"]{
  background: linear-gradient(135deg, #38efc3, #1fc8b8) !important;
  color: #0b1f1a !important;
  border: none !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  opacity: 1 !important;
}
.btn:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover{
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(56,239,195,0.35);
}
.btn.disabled,
button.disabled{
  opacity: .55 !important;
  filter: grayscale(.2);
}