/* Ruhiges, einheitliches B2B-Erscheinungsbild */
:root {
  --dark: #071522;
  --ink: #102033;
  --muted: #5d6c7f;
  --line: #dce4ec;
  --blue: #1266e3;
  --cyan: #25c8dd;
  --lime: #b7ef36;
  --soft: #f4f7fa;
  --radius: 16px;
  --shadow: 0 16px 45px rgba(7, 21, 34, .08);
}

html { scroll-padding-top: 92px; }
body { color: var(--ink); background: #fff; font-family: Inter, "Segoe UI", Arial, sans-serif; line-height: 1.6; }
section { padding-block: 88px; }
h1, h2, h3 { letter-spacing: -.025em; }
h2 { max-width: 850px; }
.muted, .intro { color: var(--muted); }

/* Primäraktionen sind dunkel; Limette bleibt ein gezielter Akzent. */
.btn,
.btn.main {
  min-height: 48px;
  padding-inline: 18px;
  border: 1px solid var(--dark);
  border-radius: 8px;
  background: var(--dark);
  color: #fff;
  box-shadow: none;
  font-weight: 800;
  transition: background .18s ease, border-color .18s ease, transform .18s ease;
}
.btn:hover { border-color: var(--blue); background: var(--blue); transform: translateY(-1px); }
.hero .btn.main { border-color: var(--lime); background: var(--lime); color: var(--dark); }
.hero .btn.ghost { border-color: rgba(255,255,255,.45); background: transparent; color: #fff; }
.hero .btn.ghost:hover { border-color: #fff; background: rgba(255,255,255,.1); }

/* Keine dekorativen Daueranimationen oder starken Leuchteffekte. */
.hero,
.hero::before,
.hero::after,
.member,
.card { animation: none !important; }
.hero::before { mix-blend-mode: normal !important; }

/* Einheitliche Flächen und Karten. */
.card,
.fact,
.proof,
.partner-group,
.step,
.member,
.event,
.audience-card {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: none;
}
.card:hover,
.member:hover {
  border-color: #c5d2df;
  box-shadow: var(--shadow);
  transform: translateY(-2px);
}

.eyebrow,
.kicker {
  color: var(--blue);
  font-size: .75rem;
  font-weight: 850;
  letter-spacing: .13em;
}
.hero .kicker { color: var(--lime); }

/* Startseite: seriöse Trennung der Zielgruppen. */
.audiences { background: #fff; }
.audience-grid { gap: 20px; }
.audience-card { padding: 34px; }
.audience-card.business {
  background: var(--dark);
  color: #fff;
}
.audience-card.private {
  background: var(--soft);
  color: var(--ink);
}
.audience-label {
  border-radius: 6px;
  background: transparent;
  color: var(--blue);
  padding: 0;
}
.audience-card.business .audience-label { color: var(--lime); }
.audience-card .btn { margin-top: 24px; }
.audience-card.business .btn { border-color: var(--lime); background: var(--lime); color: var(--dark); }
.audience-card.private .btn { border-color: var(--dark); background: var(--dark); color: #fff; }

/* Leistungs- und Faktenkarten erhalten nur einen kleinen Farbakzent. */
#leistungen .card {
  border: 1px solid var(--line) !important;
  border-top: 4px solid var(--blue) !important;
  border-radius: var(--radius) !important;
  background: #fff !important;
  box-shadow: none !important;
}
#leistungen .card:nth-child(2) { border-top-color: #769f22 !important; }
#leistungen .card:nth-child(3) { border-top-color: #178ea0 !important; }
#leistungen .card:nth-child(4) { border-top-color: #6556a7 !important; }
#leistungen .card::before,
#leistungen .card::after { display: none !important; }
.ticker { gap: 0; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow); overflow: hidden; }
.ticker > div { border: 0; border-right: 1px solid var(--line); border-radius: 0; box-shadow: none; }
.ticker > div:last-child { border-right: 0; }

/* Ruhigere dunkle Bereiche und Kontaktboxen. */
.dark,
.dark-section { background: var(--dark); }
.box { border-radius: var(--radius); background: var(--dark); box-shadow: var(--shadow); }
.form-field input,
.form-field select,
.form-field textarea { border-radius: 7px; }

/* Team und Recruiting: weniger dekorative Bewegung. */
.member { transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.portrait { background: var(--dark); }
.hero-image { border-radius: var(--radius); box-shadow: var(--shadow); }
.partner { border-radius: 7px; }
.partner.hot { background: var(--dark); }
.partner.partner-logo {
  display: inline-flex;
  min-width: 132px;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  padding: 9px 16px;
  border: 1px solid var(--line);
  background: #fff;
}
.partner-logo img {
  display: block;
  width: 92px;
  height: auto;
}
.partner-logo-energruen img { width: 128px; }

.case-study { background: #fff; }
.case-study-grid { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(280px,.75fr); gap: 54px; align-items: center; }
.case-metric { padding: 34px; border: 1px solid var(--line); border-left: 5px solid var(--blue); border-radius: var(--radius); background: var(--soft); }
.case-partner-logo { display: block; width: 100px; height: auto; margin: 0 0 24px; mix-blend-mode: multiply; }
.case-metric strong { display: block; color: var(--dark); font-size: clamp(3rem,7vw,5.8rem); line-height: .95; letter-spacing: -.06em; }
.case-metric span { display: block; margin-top: 15px; color: var(--ink); font-size: 1.15rem; font-weight: 850; }
.case-metric small { display: block; margin-top: 7px; color: var(--muted); }

@media (max-width: 900px) {
  section { padding-block: 72px; }
  .ticker { display: grid; grid-template-columns: 1fr 1fr; }
  .ticker > div:nth-child(even) { border-right: 0; }
  .ticker > div { border-bottom: 1px solid var(--line); }
  .case-study-grid { grid-template-columns: 1fr; gap: 28px; }
}

@media (max-width: 620px) {
  section { padding-block: 64px; }
  .audience-card { padding: 26px 22px; }
  .ticker { grid-template-columns: 1fr; }
  .ticker > div { border-right: 0; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}
