/* Der braune Balken wurde schmaler gemacht */
.card-header {
  padding: 0.7rem 1.8rem; /* Vorher 1.4rem */
}

/* Das Logo lässt sich nun überlappen */
.card-header-logo-box {
  position: relative;
  z-index: 100;
  margin-bottom: -45px; /* Zieht das Logo nach unten über den Rand */
  /* ... restliche Styles ... */
}

/* Anpassung für die Desktop-Ansicht */
@media (min-width: 900px) {
  .card-header {
    padding: clamp(0.5rem, 0.8vw, 0.8rem) clamp(1.4rem, 2vw, 2.2rem);
  }
  .card-header-logo-box {
    margin-bottom: clamp(-55px, -4vw, -36px);
  }
}