/*
 * De huidige achtergrond is een samengestelde landingspagina-afbeelding:
 * linksboven staat oude tekst en rechts staat het witte taxivak.
 *
 * We gebruiken daarom alleen het schone centrale stadsdeel van die afbeelding.
 * Door de afbeelding breder te schalen en links/onder te positioneren vallen
 * het taxivak en de oude tekst buiten het zichtbare headerkader.
 */
.list-category-header {
    overflow: hidden !important;
    background: #0b3768 !important;
}

.list-category-header::before {
    content: "" !important;
    position: absolute !important;
    inset: -38% -34% -20% -8% !important;
    z-index: -2 !important;
    background-image: var(--list-header-image) !important;
    background-repeat: no-repeat !important;
    background-position: 31% 68% !important;
    background-size: 138% auto !important;
    filter: brightness(.94) saturate(1.08) contrast(1.04) !important;
    transform: none !important;
}

.list-category-header::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    background:
        linear-gradient(
            90deg,
            rgba(4, 27, 52, .62) 0%,
            rgba(7, 42, 78, .38) 48%,
            rgba(7, 42, 78, .25) 100%
        ) !important;
    pointer-events: none;
}

.list-category-header__overlay {
    display: none !important;
}

@media (max-width: 900px) {
    .list-category-header::before {
        inset: -28% -52% -16% -10% !important;
        background-position: 28% 64% !important;
        background-size: 156% auto !important;
    }
}

@media (max-width: 560px) {
    .list-category-header::before {
        inset: -20% -74% -12% -12% !important;
        background-position: 25% 61% !important;
        background-size: 184% auto !important;
    }
}