:root{
  --brand:#2563eb;
  --brand-deep:#1e40af;
  --accent:#22e6cf;
  --ink:#0f172a;
  --ink-soft:#475569;
  --bg:#f8fafc;
  --radius:18px;
  --nav-h:64px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }

body{
  background:var(--bg);
  color:var(--ink);
  font-synthesis-weight:none;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  padding-bottom:72px; /* Platz für Sticky-Bar (Mobile) */
}
@media (min-width: 992px){ body{ padding-bottom:0; } }

a{ color:var(--brand); }
a:hover{ color:#1743a1; }

.btn-brand{
  background: linear-gradient(135deg, var(--brand), var(--brand-deep));
  border:0;
  color:#fff;
  box-shadow:0 12px 30px rgba(37,99,235,.28);
}
.btn-brand:hover{ filter:brightness(1.05); color:#fff; }
.btn-brand:active{ transform: translateY(1px); }

.btn-ghost{
  border:1px solid rgba(203,213,225,.95);
  color:var(--ink);
  background:rgba(255,255,255,.92);
  backdrop-filter: blur(6px);
}
.btn-ghost:hover{ background:#f1f5f9; }

.btn-outline-light{
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.5);
  color:#fff;
}
.btn-outline-light:hover{ background: rgba(255,255,255,.18); color:#fff; }

.shadow-soft{ box-shadow:0 10px 30px rgba(2,8,23,.08); }

.section{ padding:3.2rem 0; }
@media (min-width: 992px){ .section{ padding:4rem 0; } }

.badge-usp{
  background: rgba(226,232,240,.92);
  color:#0f172a;
  border:1px solid rgba(203,213,225,.7);
}

.card-ghost{
  background: rgba(255,255,255,.92);
  border:1px solid #e5e7eb;
  border-radius: var(--radius);
}
.card-ghost .card-body{ padding:1.25rem; }
.card-ghost .card-img-top{
  border-top-left-radius: var(--radius);
  border-top-right-radius: var(--radius);
}

.card-accent{
  border:1px solid rgba(34,230,207,.28);
  position:relative;
  overflow:hidden;
  box-shadow:0 14px 40px rgba(2,8,23,.10);
}
.card-accent::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(700px 260px at 10% 10%, rgba(34,230,207,.26), transparent 60%),
    radial-gradient(700px 260px at 90% 0%, rgba(37,99,235,.22), transparent 55%);
  pointer-events:none;
}
.card-accent > *{ position:relative; z-index:1; }

.list-check li{ padding-left:1.5rem; position:relative; }
.list-check li::before{ content:'✓'; position:absolute; left:0; color:var(--accent); font-weight:800; }

.small, .text-muted{ color:var(--ink-soft)!important; }

.kicker{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.35rem .6rem;
  border-radius:999px;
  background: rgba(37,99,235,.08);
  border:1px solid rgba(37,99,235,.18);
  color: var(--ink);
  font-size:.85rem;
}

.gradient-text{
  background: linear-gradient(90deg, #ffffff, rgba(34,230,207,.92));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

/* HERO */
.hero{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(900px 480px at 10% 20%, rgba(34,230,207,.18), transparent 60%),
    radial-gradient(1000px 520px at 90% 0%, rgba(37,99,235,.22), transparent 55%),
    #0b1020;
  color:#fff;
}
.hero > .container{ position:relative; z-index:1; }
.hero .lead{ color:#e2e8f0; }
.hero .kicker{
  background: rgba(34,230,207,.12);
  border:1px solid rgba(34,230,207,.22);
  color:#d7fff8;
}

/* HERO (mit Hintergrundbild per CSS-Variable) */
.hero--img{ background:#0b1020; }
.hero--img::before{
  content:"";
  position:absolute; inset:0;
  background: var(--hero-img) right/cover no-repeat;
}
.hero--img::after{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(90deg,
      rgba(11,16,32,.96) 0%,
      rgba(11,16,32,.78) 55%,
      rgba(11,16,32,.20) 100%),
    radial-gradient(900px 480px at 10% 20%, rgba(34,230,207,.18), transparent 60%),
    radial-gradient(1000px 520px at 90% 0%, rgba(37,99,235,.22), transparent 55%);
  pointer-events:none;
}

.hero-box{
  background: rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  border-radius: var(--radius);
  backdrop-filter: blur(10px);
}

.qr-img{
  background:#fff;
  border-radius:16px;
  border:1px solid #e5e7eb;
  padding:.5rem;
}

.app-sticky{
  position:fixed; left:0; right:0; bottom:0;
  background: rgba(255,255,255,.92);
  backdrop-filter: saturate(180%) blur(10px);
  border-top: 1px solid #e5e7eb;
  z-index: 9999;
}
.app-sticky .btn{ white-space:nowrap; }

.footer-dark{ background:#0b1020; color:#e2e8f0; }
.footer-dark a{ color:#e2e8f0; text-decoration:underline; text-underline-offset:.12em; }

/* Accessibility */
.skip-link{
  position:absolute;
  left:-9999px;
  top:auto;
  width:1px;
  height:1px;
  overflow:hidden;
}
.skip-link:focus{
  left:1rem;
  top:1rem;
  width:auto;
  height:auto;
  padding:.5rem .75rem;
  background:#fff;
  z-index:10000;
  border-radius:.5rem;
  box-shadow:0 10px 30px rgba(2,8,23,.12);
}

/* Minor polish */
.navbar .navbar-brand{ letter-spacing:.2px; }