.columns {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

/* Haupt-Logo: oben links, auf Höhe der Navigation, vergrössert.
   Ragt bewusst ein wenig über den grauen Balken in die schwarze
   Menüleiste hinein, ohne die Menüpunkte zu überdecken (die sind
   zentriert und liegen weiter rechts). */
.navigation-bar {
    position: relative;
}

/* Platz reservieren, damit "Argovia Stars" nicht unter das
   (aus dem Textfluss genommene) Logo rutscht. */
.cd-club-logo-and-name {
    padding-left: 190px;
}

.cd-club-logo-link {
    position: absolute;
    left: 30px;
    bottom: -105px; /* Bezug: unterer Rand des grauen Balkens -> kontrolliertes Herausragen */
    z-index: 50; /* über grauem/schwarzem Balken, unter der fixierten Scroll-Navigation (30000) */
    background-color: #fff;
    padding: 10px 16px;
    border-radius: 6px;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.25);
}

.cd-club-logo {
    height: 100px; /* Standard: 50px */
}

/* Auf kleinen Bildschirmen gibt es keine Menüleiste (cd-hide-small):
   Logo wieder normal im Balken einreihen */
@media (max-width: 992px) {
    .cd-club-logo-and-name {
        padding-left: 0;
    }

    .cd-club-logo-link {
        position: static;
        background: none;
        padding: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .cd-club-logo {
        height: 50px;
    }
}

.cd-menu-level-1 ul li:first-child {
    margin-left: 210px; /* Platz für Logo */
}