/* ===== Brand Colors ===== */
:root{
  color-scheme: light;
  --brand-blue:#005594;
  --brand-red:#E63946;
  --ink:#2E2E2E;
  --muted:#6B7280;
  --bg:#ffffff;
  --bg-alt:#F5F7FA;
  --line:#E6E8EB;
  --ok:#089b45;
}

html, body { background: var(--bg); color: var(--ink); }

/* Utilities */
.responsive-img { max-width: 100%; height: auto; display:block; }

/* Links */
a{ color: var(--brand-blue); }

/* Buttons */
a[role="button"], button, .btn-primary{
  background: var(--brand-red) !important;
  border-color: var(--brand-red) !important;
  color: #fff !important;
}
a[role="button"]:hover, button:hover, .btn-primary:hover{ filter: brightness(.92); }

/* Sticky Navigation */
.sticky-nav{
  position: sticky;
  top: 0;
  z-index: 1000;
  background: #fff;
  border-bottom: 1px solid var(--line);
  padding: 6px 12px;
  margin: 0;
  display:flex;
  align-items:center;
}
.sticky-nav > ul{
  list-style:none;
  display:flex;
  align-items:center;
  margin:0;
  padding:0;
}
.sticky-nav > ul:last-of-type{ margin-left:auto; }
.sticky-nav a{ text-decoration:none; color:var(--brand-blue); font-weight:600; padding:6px 10px; }

.nav-logo-img{ max-height:120px; width:auto; display:block; }
@media (max-width:768px){
  .nav-logo-img{ max-height:80px; }
  .sticky-nav a{ padding:6px 8px; }
}

/* Section alt */
.section-alt{
  background: var(--bg-alt);
  border:1px solid var(--line);
  border-radius:14px;
  padding:1.25rem;
}

/* Leistungen grid/cards */
#leistungen .grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(280px,1fr));
  gap:2rem;
}
#leistungen article{
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  padding:1.5rem;
  box-shadow:0 2px 6px rgba(0,0,0,.05);
  transition: transform .2s ease, box-shadow .2s ease;
}
#leistungen article:hover{
  transform: translateY(-6px);
  box-shadow:0 6px 18px rgba(0,0,0,.15);
}
#leistungen article h3{ margin-top:0; font-size:1.2rem; color:var(--ink); }
#leistungen article p{ margin-bottom:.5rem; color:var(--ink); }

footer a{ color: var(--brand-blue); }

/* ==== Nav-CTA "Komplettsysteme" (auf Bestellung) ==== */
.nav-cta{
  background: var(--brand-blue);
  color: #fff !important;
  font-weight: 700;
  padding: 6px 12px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--brand-blue);
  box-shadow: 0 2px 6px rgba(0,0,0,.08);
  text-decoration: none;
}
.nav-cta:hover{
  filter: brightness(.95);
  text-decoration: none;
}

/* Kleines Badge "auf Bestellung" direkt am Link */
.nav-cta::after{
  content: "auf Bestellung";
  font-size: 0.7rem;
  line-height: 1;
  background: #e6f0ff;
  color: var(--brand-blue);
  border: 1px solid var(--brand-blue);
  padding: 3px 8px;
  border-radius: 999px;
}

/* Mobile: etwas kompakter */
@media (max-width: 768px){
  .nav-cta{
    padding: 6px 10px;
  }
  .nav-cta::after{
    font-size: 0.65rem;
    padding: 2px 6px;
  }
}