/* ===========================================================
   STERAC – projekteigene Overrides (werden nach style.css geladen)
   =========================================================== */

/* Hauptnavigation (Desktop >=959px):
   "Ansprechpartner" (statt kurzem "News") auf Ebene 1 macht das Menue breiter.
   Damit es bei jeder Desktop-Breite in EINE Zeile passt (kein Umbruch von
   "Digitalisierung & IT", kein Abschneiden von "Ueber Uns"), skalieren
   Schrift + Abstaende fluid mit der Viewportbreite: auf breiten Screens
   ~18px wie Live, auf schmaleren kompakter. Rechtes Padding (Pfeil) bleibt.
   Submenues unberuehrt (Selektor greift nur direkte Kinder von >ul). */
@media (min-width: 959px) {
    nav#mainNavi > ul > li > a {
        white-space: nowrap;
        font-size: clamp(14px, 1.35vw, 18px);
        padding-left: clamp(10px, 1.4vw, 22px);
    }
    nav#mainNavi > ul > li {
        margin-left: clamp(2px, 0.4vw, 7px);
        margin-right: clamp(2px, 0.4vw, 7px);
    }
}

/* Schmale Desktops (960–1139 px): mit „Ansprechpartner" auf Ebene 1 lief das Menue sonst rechts aus dem
   Fenster („Über Uns" angeschnitten). Kompakter setzen; Punkte ohne Untermenue brauchen keinen Pfeil-Abstand. */
@media (min-width: 960px) and (max-width: 1139.98px) {
    nav#mainNavi > ul > li > a {
        font-size: clamp(13px, 1.3vw, 14.8px);
        padding-left: clamp(10px, 1.2vw, 13px);
    }
    nav#mainNavi > ul > li {
        margin-left: 2px;
        margin-right: 2px;
    }
    nav#mainNavi > ul > li:not(.hasSub) {
        transform: none;
    }
    nav#mainNavi > ul > li:not(.hasSub) > a {
        padding-right: 6px;
    }
}

/* Seiten-Icons: 4. Punkt (Zauberstab) zur Kampagnen-Landingpage „Magische Performance" */
.side-icons .magic {
    width: 52px;
    height: 49px;
    background: url('../Images/side-icon-magic.svg') no-repeat;
}

/* Untermenue des letzten Hauptpunkts („Über Uns") rechtsbuendig aufklappen, sonst ragt es aus dem Fenster */
@media (min-width: 960px) {
    nav#mainNavi > ul > li.hasSub:last-child > ul {
        left: auto;
        right: 0;
    }
}