/* ===== OneGate Screenings Banner ===== */
/* Unteres Header-Padding (vom North-Sticky-JS inline gesetzt) unterhalb des Banners entfernen */
#masthead {
    padding-bottom: 0 !important;
}

/* Abstand zwischen Menü und Banner erhalten */
#masthead>.container {
    padding-bottom: 10px;
}

.masthead-sentinel {
    margin-bottom: 0px !important;
}

.panel-layout>.panel-grid:first-child .panel-grid-cell:first-child .panel-first-child .textwidget {
    margin-top: 1.5rem;
}

.og-screenings-banner {
    background: #009cb4;
    margin-top: 0.3rem;
    /* aus der Grafik gepickt – mit dem CI-Wert aus dem Marketing abgleichen */
}

.og-screenings-banner__link {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2.25rem;
    min-height: 50px;
    padding: 0.5rem 1rem;
    color: #fff;
    font-size: 1.125rem;
    line-height: 1.2;
    text-decoration: none;
}

/* Link-Farbe in allen Zuständen erzwingen
   (verhindert, dass Theme-Regeln wie a:visited greifen – z. B. auf dem iPhone) */
.og-screenings-banner a.og-screenings-banner__link,
.og-screenings-banner a.og-screenings-banner__link:link,
.og-screenings-banner a.og-screenings-banner__link:visited,
.og-screenings-banner a.og-screenings-banner__link:hover,
.og-screenings-banner a.og-screenings-banner__link:focus,
.og-screenings-banner a.og-screenings-banner__link:active {
    color: #fff;
    text-decoration: none;
}

.og-screenings-banner__link:focus-visible {
    outline: 2px solid #fff;
    outline-offset: -4px;
}

.og-screenings-banner__title {
    font-weight: 700;
}

.og-screenings-banner__sep {
    width: 1px;
    height: 1.2em;
    background: currentColor;
    opacity: 0.85;
}

.og-screenings-banner__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
}

.og-screenings-banner__arrow {
    width: 1.4em;
    height: auto;
    transition: transform 0.2s ease;
}

.og-screenings-banner__link:hover .og-screenings-banner__arrow,
.og-screenings-banner__link:focus-visible .og-screenings-banner__arrow {
    transform: translateX(4px);
}

/* Tablet / Smartphone */
@media (max-width: 600px) {
    .og-screenings-banner__link {
        gap: 1rem;
        min-height: 44px;
        /* Touch-Target */
        font-size: 1rem;
    }
}

/* Sehr schmale Geräte: Trenner weg, damit nichts umbricht */
@media (max-width: 360px) {
    .og-screenings-banner__sep {
        display: none;
    }

    .og-screenings-banner__link {
        gap: 0.75rem;
        font-size: 0.9375rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .og-screenings-banner__arrow {
        transition: none;
    }
}