@import url('https://fonts.googleapis.com/css2?family=Noto+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap');
:root {
    --cl-dark:    #1D2851;
    --cl-navy:    #161e3e;
    --cl-card:    #242c62;
    --cl-gold:    #D29E27;
    --cl-red:     #BC1919;
    --cl-white:   #FFFFFF;
    --cl-overlay: rgba(18, 24, 56, 0.97);
}
/* FONT & TEKST */
/* Standaard bodytekst: Noto Serif Regular 14px / 18px */
p, .card-body p, .asset p, .jump-info-description p,
.jump-info-body p, small, .small,
a.asset-title {
    font-family: 'Noto Serif', Georgia, serif !important;
    font-weight: 400 !important;
    font-size: 14px !important;
    line-height: 18px !important;
}
body {
    font-family: 'Noto Serif', Georgia, serif !important;
    color: #FFFFFF !important;
    padding-top: 0 !important;
    background-color: var(--cl-dark) !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 100vh !important;
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'Flama Ultracondensed Bold', 'Barlow Condensed', sans-serif !important;
    color: var(--cl-gold) !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: -0.005em !important;
}
/* Heading groottes — conform brandbook */
h1 { font-size: clamp(32px, 4vw, 56px) !important; line-height: 1.1 !important; text-align: center !important; }

/* Featured-hero: geen ruimte boven de hero video */
.featured-hero { margin-top: -5rem !important; }
/* Featured-hero CTA: inline color override winnen
   De knop heeft style="color:#1B264F !important" — animation-trick als fallback */
.featured-hero .featured-hero__cta,
.featured-hero .featured-hero__cta--primary { color: var(--cl-white) !important; }
@keyframes willemii-cta-white { from, to { color: #FFFFFF !important; } }
.featured-hero .featured-hero__cta { animation: willemii-cta-white 1ms forwards; }

/* Featured-hero: grote display-stijl alleen hier */
.featured-hero h1,
.featured-hero__title {
    font-size: clamp(40px, 6vw, 96px) !important;
    line-height: 1 !important;
    text-align: left !important;
    text-shadow: 2px 7px 28px rgba(0,0,0,0.63) !important;
    white-space: nowrap !important;
}
.featured-hero__copy { text-align: left !important; }
.featured-hero__badges { justify-content: flex-start !important; }
.featured-hero__lead { text-align: left !important; }
/* Watch-pagina titel: nooit breder dan de player */
h1.jump-live-title {
    font-size: clamp(24px, 3.5vw, 48px) !important;
    white-space: normal !important;
    text-align: left !important;
    text-shadow: none !important;
    max-width: 100% !important;
    overflow-wrap: break-word !important;
}
h2 { font-size: 64px !important; line-height: 1 !important; }
h3 { font-size: 48px !important; line-height: 1 !important; }
h4 { font-size: 40px !important; line-height: 1 !important; }
@media (max-width: 991.98px) {
    .featured-hero h1, .featured-hero__title { font-size: clamp(32px, 6vw, 72px) !important; }
    h2 { font-size: 40px !important; }
    h3 { font-size: 32px !important; }
    h4 { font-size: 24px !important; }
}
/* Paragraphs — Noto Serif conform brandbook */
p, li, td, th, label { font-family: 'Noto Serif', Georgia, serif !important; }
p { font-size: 16px !important; line-height: 20px !important; }
/* FOOTER ALTIJD ONDERIN */
header.navbar-header { flex: none !important; }
footer { margin-top: auto !important; flex-shrink: 0 !important; }
body > iframe { position: fixed !important; width: 0 !important; height: 0 !important; overflow: hidden !important; pointer-events: none !important; }
body > div.ow-adhesive-bottom { position: fixed !important; bottom: 0 !important; left: 0 !important; right: 0 !important; z-index: 9000 !important; }
body > div.cmpwrapper, body > div.modal, body > noscript { flex: none !important; }
/* NAVBAR */
.navbar-header { position: relative !important; z-index: 2100 !important; height: 0 !important; overflow: visible !important; flex: none !important; }
.navbar-header nav, .navbar-header .navbar {
    position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; width: 100% !important;
    height: 100px !important; min-height: 100px !important; margin: 0 !important;
    background: transparent !important; border: 0 !important;
    box-shadow: none !important; overflow: visible !important;
}
.navbar-header .navbar > .container {
    position: relative !important; height: 72px !important;
    display: flex !important; align-items: center !important; justify-content: flex-end !important;
    gap: 12px !important; padding: 0 18px !important; overflow: visible !important; max-width: 100% !important;
}
.navbar-header * { color: var(--cl-white) !important; }
/* TAAL DROPDOWN */
.navbar-header .dropdown-menu {
    background-color: var(--cl-navy) !important;
    border: 1px solid rgba(210,158,39,0.4) !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.5) !important;
    margin-top: 4px !important; min-width: 130px !important; z-index: 3100 !important;
}
.navbar-header .dropdown-menu .dropdown-item {
    color: var(--cl-white) !important; background: transparent !important;
    padding: 8px 16px !important; font-family: 'Flama Ultra Condensed', 'Barlow Condensed', sans-serif !important;
    font-weight: 700 !important; font-size: 13px !important;
    letter-spacing: 1px !important; text-transform: uppercase !important;
}
.navbar-header .dropdown-menu .dropdown-item:hover {
    background: rgba(210,158,39,0.15) !important; color: var(--cl-gold) !important;
}
/* ZOEKKNOP */
.navbar-header button svg path { fill: var(--cl-white) !important; }
.navbar-header button svg rect { fill: transparent !important; }
/* HERO */
.intro-hero-carousel-section { padding-top: 0 !important; }
.navbar-header + *:not(.intro-hero-carousel-section) { padding-top: 80px !important; }
/* LOGO */
.navbar-header .navbar-brand { margin: 0 !important; padding: 0 !important; }
.navbar-header .navbar-brand img { width: auto !important; max-height: 84px !important; }
@media (min-width: 992px) {
    .navbar-header .navbar-brand {
        position: absolute !important; left: 50% !important; top: 50% !important;
        transform: translate(-50%, -50%) !important; z-index: 2 !important;
    }
}
@media (max-width: 991.98px) {
    .navbar-header .navbar-brand {
        position: absolute !important;
        left: 50% !important;
        transform: translateX(-60%) !important;
    }
    .navbar-header .navbar-brand img {
        max-height: 36px !important;
        width: auto !important;
    }
}
/* NAV */
.navbar-header ul.navbar-nav { margin: 0 !important; padding: 0 !important; background: transparent !important; align-items: center !important; }
.navbar-header .navbar-collapse {
    display: flex !important; flex-basis: auto !important;
    align-items: center !important; justify-content: flex-end !important;
    margin-left: auto !important; height: 72px !important; overflow: visible !important;
}
.navbar-header .navbar-collapse:not(.show):not(.collapsing) .navbar-nav.mb-2 { display: none !important; }
.navbar-header .navbar-nav.ms-auto {
    display: flex !important; align-items: center !important;
    flex-direction: row !important; flex-wrap: nowrap !important; gap: 10px !important; overflow: visible !important;
}
/* AUTH KNOPPEN */
.navbar-header a#authModalLogin.nav-link,
.navbar-header a#authModalRegistration.nav-link {
    margin: 0 !important; padding: 10px 20px !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    border-radius: 0 !important; font-family: 'Flama Ultra Condensed', 'Barlow Condensed', sans-serif !important;
    font-weight: 800 !important; font-size: 13px !important; font-style: normal !important;
    letter-spacing: 1.5px !important; text-decoration: none !important;
    text-transform: uppercase !important; min-height: 40px !important; white-space: nowrap !important;
}
.navbar-header a#authModalLogin.nav-link {
    background: transparent !important; border: 2px solid var(--cl-gold) !important; color: var(--cl-gold) !important;
}
.navbar-header a#authModalLogin.nav-link:hover { background: var(--cl-gold) !important; color: var(--cl-white) !important; }
.navbar-header a#authModalRegistration.nav-link {
    background: var(--cl-gold) !important; border: 2px solid var(--cl-gold) !important; color: var(--cl-white) !important;
}
.navbar-header a#authModalRegistration.nav-link:hover { opacity: 0.85 !important; }
/* MOBIEL */
@media (max-width: 991.98px) {
    .navbar-header .navbar > .container { padding: 0 12px 0 70px !important; flex-wrap: nowrap !important; }
    .navbar-header .navbar-nav.ms-auto { flex-direction: row !important; flex-wrap: nowrap !important; gap: 6px !important; }
    .navbar-header .navbar-nav.ms-auto button { display: none !important; }
    .navbar-header button.d-md-none { display: none !important; }
    .navbar-header a#authModalLogin.nav-link,
    .navbar-header a#authModalRegistration.nav-link { padding: 8px 10px !important; font-size: 11px !important; }
}
/* HAMBURGER */
.navbar-header .navbar-toggler {
    position: fixed !important; left: 16px !important; top: 10px !important;
    transform: none !important; z-index: 3000 !important;
    width: 44px !important; height: 44px !important; padding: 0 !important;
    border: 0 !important; background: transparent !important; border-radius: 0 !important;
    box-shadow: none !important; display: inline-flex !important; align-items: center !important; justify-content: center !important;
}
.navbar-header .navbar-toggler:focus { box-shadow: none !important; outline: none !important; }
.navbar-header .navbar-toggler .navbar-toggler-icon {
    width: 24px !important; height: 18px !important;
    background-image: none !important; position: relative !important; display: block !important;
}
.navbar-header .navbar-toggler .navbar-toggler-icon::before {
    content: "" !important; position: absolute !important; left: 0 !important; top: 1px !important;
    width: 24px !important; height: 2px !important;
    background: var(--cl-gold) !important; border-radius: 1px !important;
    box-shadow: 0 7px 0 var(--cl-gold), 0 14px 0 var(--cl-gold) !important;
    transition: all 0.25s ease !important;
}
.navbar-header .navbar-toggler .navbar-toggler-icon::after { content: none !important; }
.navbar-header .navbar-toggler[aria-expanded="true"] {
    top: 10px !important; left: 16px !important;
}
.navbar-header .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::before {
    box-shadow: none !important; top: 8px !important; transform: rotate(45deg) !important;
}
.navbar-header .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::after {
    content: "" !important; position: absolute !important; left: 0 !important; top: 8px !important;
    width: 24px !important; height: 2px !important;
    background: var(--cl-gold) !important; border-radius: 1px !important; transform: rotate(-45deg) !important;
}
/* FULLSCREEN OVERLAY */
.navbar-header .navbar-collapse.show,
.navbar-header .navbar-collapse.collapsing {
    position: fixed !important; inset: 0 !important;
    width: 100vw !important; height: 100vh !important; z-index: 2000 !important;
    display: flex !important; align-items: flex-start !important; justify-content: space-between !important;
    padding: 100px 60px 60px !important;
    background: var(--cl-overlay) !important; backdrop-filter: blur(4px) !important;
}
.navbar-header .navbar-collapse.show .navbar-nav.mb-2,
.navbar-header .navbar-collapse.collapsing .navbar-nav.mb-2 {
    display: flex !important; flex-direction: column !important; gap: 4px !important; align-items: flex-start !important;
}
.navbar-header .navbar-collapse.show .navbar-nav.mb-2 .nav-link,
.navbar-header .navbar-collapse.collapsing .navbar-nav.mb-2 .nav-link {
    background: transparent !important; border: 0 !important; color: var(--cl-white) !important;
    font-family: 'Flama Ultracondensed Bold', 'Barlow Condensed', sans-serif !important; font-weight: 900 !important; font-style: italic !important;
    font-size: 36px !important; letter-spacing: 0.02em !important;
    line-height: 1.0 !important; padding: 2px 0 !important; text-transform: uppercase !important;
}
.navbar-header .navbar-collapse.show .navbar-nav.mb-2 .nav-link:hover { color: var(--cl-gold) !important; }
/* ms-auto nav (gebruikersknop): altijd zichtbaar op mobiel, ook als hamburger gesloten.
   position: fixed laat het element uit de overflow:hidden van .navbar-collapse ontsnappen. */
@media (max-width: 991.98px) {
    .navbar-header .navbar-nav.ms-auto {
        position: fixed !important; top: 10px !important; right: 16px !important;
        display: flex !important; align-items: center !important; gap: 10px !important;
        z-index: 2600 !important; flex-direction: row !important; flex-wrap: nowrap !important;
    }
}
@media (max-width: 991.98px) {
    .navbar-header .navbar-collapse.show,
    .navbar-header .navbar-collapse.collapsing { padding: 100px 28px 40px !important; }
    .navbar-header .navbar-collapse.show .navbar-nav.mb-2 .nav-link { font-size: 30px !important; }
}
/* SHARE ICONEN */
a.btn-link[href*="facebook.com"] i,
a.btn-link[href*="whatsapp.com"] i,
a.btn-link[href*="twitter.com"] i,
a.btn-link[href*="x.com"] i { color: var(--cl-white) !important; }
/* CARDS */
.card { background-color: var(--cl-card) !important; border: none !important; }
.card, .card * { color: var(--cl-white) !important; }
.card-header { background-color: transparent !important; border: none !important; }
/* Kaart-headings: niet de brandbook-groottes overnemen */
.card h1, .card h2, .card h3, .card h4, .card h5, .card h6,
.jump-upcoming-card h1, .jump-upcoming-card h2, .jump-upcoming-card h3, .jump-upcoming-card h4 {
    font-size: 1.1rem !important;
    line-height: 1.3 !important;
}
.card-body,
.card-footer,
.asset {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
/* Verberg lege witte card-header (bg-white variant) */
.card-header.text-center.border-0.bg-white { display: none !important; }
p.asset-description { display: none !important; }
/* KNOPPEN */
.btn {
    font-family: 'Flama Ultra Condensed', 'Barlow Condensed', sans-serif !important;
    font-weight: 800 !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
}
.btn-primary, a.btn-primary {
    background: var(--cl-red) !important;
    border-color: var(--cl-red) !important;
    color: var(--cl-white) !important;
    border-radius: 0 !important;
    font-family: 'Flama Ultra Condensed', 'Barlow Condensed', sans-serif !important;
    font-weight: 800 !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
}
/* HERO CTA "Bekijk nu" — goud ingevuld */
.btn.btn-lg {
    background-color: var(--cl-gold) !important;
    border: 2px solid var(--cl-gold) !important;
    color: var(--cl-white) !important;
    border-radius: 0 !important;
}
.btn.btn-lg:hover {
    background-color: #b8871f !important;
    border-color: #b8871f !important;
    color: var(--cl-white) !important;
}
/* FOOTER */
footer { background: transparent !important; }
footer, footer * { color: rgba(255,255,255,0.6) !important; }
footer .card, footer .card-body { background: transparent !important; }
footer .card-body .row.mb-5 { justify-content: center !important; }
footer .card-body .row.mb-5 .col-12.col-md-4 { display: flex !important; justify-content: center !important; }
footer .card-body .row.mb-5 .col-12.col-md-4 > .row { justify-content: center !important; width: auto !important; }
footer .card-body .row.mb-5 .col-12.col-md-4 > .row > .col-8 { display: none !important; }
footer .card-body .row.mb-5 .col-12.col-md-4 > .row > .col-4 { flex: 0 0 auto !important; width: auto !important; text-align: center !important; }
footer small, footer p:not(:has(a)) { display: none !important; }
/* OMSCHRIJVINGEN ONDER KAARTEN VERBERGEN */
p.asset-description { display: none !important; }
/* SLIDER PIJLTJES */
.glide div[data-glide-el="controls"] {
    position: absolute;
    inset: 0;
    pointer-events: none;
}
.glide div[data-glide-el="controls"] .slider-btn {
    pointer-events: auto;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--cl-gold) !important;
    background: rgba(18, 24, 60, 0.70) !important;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    color: var(--cl-gold) !important;
    font-size: 1.4rem;
    font-weight: 700;
    border-radius: 4px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.4);
    transition: all 0.2s ease;
}
.glide div[data-glide-el="controls"] .slider-btn-prev {
    position: absolute;
    left: -24px;
    top: 50%;
    transform: translateY(-50%);
}
.glide div[data-glide-el="controls"] .slider-btn-next {
    position: absolute;
    right: -24px;
    top: 50%;
    transform: translateY(-50%);
}
.glide div[data-glide-el="controls"] .slider-btn:hover {
    background: var(--cl-gold) !important;
    color: var(--cl-white) !important;
    transform: translateY(-50%) scale(1.08);
}
/* Info & delen toggle + like-knop: witte achtergrond, donkere tekst */
.jump-info-toggle,
.jump-info-toggle span,
.jump-info-toggle i,
.jump-reaction-btn,
.jump-reaction-btn span,
.jump-reaction-btn i {
    color: var(--cl-dark) !important;
}

/* "Info & delen" en "Deze video delen:" — Noto Serif, niet Flama */
.jump-info-toggle,
.jump-info-toggle span,
h2.jump-info-heading,
span.jump-info-heading,
.jump-info-heading {
    font-family: 'Noto Serif', Georgia, serif !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    font-weight: 400 !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
}

/* Mobiel: share-row blijft binnen het scherm */
@media (max-width: 991.98px) {
    .jump-info-share-row {
        overflow: hidden !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    .jump-info-card {
        overflow: hidden !important;
    }
}

/* Deel-knoppen: blauw icoon op witte achtergrond */
.jump-share-btn {
    background-color: #ffffff !important;
    color: var(--cl-dark) !important;
    border: 1px solid rgba(29,40,81,0.20) !important;
}
.jump-share-btn i { color: var(--cl-dark) !important; }
.jump-share-btn:hover {
    background-color: var(--cl-dark) !important;
    color: #ffffff !important;
    border-color: var(--cl-dark) !important;
}
.jump-share-btn:hover i { color: #ffffff !important; }

/* JW Player: Chromecast-knop goud via CSS custom properties van google-cast-launcher */
#video-wrapper .jw-icon-cast google-cast-launcher,
#video-wrapper .jw-icon-cast google-cast-launcher.jw-off,
#video-wrapper .jw-icon-cast google-cast-launcher.jw-reset {
    --disconnected-color: #D29E27;
    --connected-color: #D29E27;
}
#video-wrapper .jw-icon-cast .jw-svg-icon { fill: #D29E27 !important; color: #D29E27 !important; }

/* WATCH PAGINA */
.watch-live-v2 { background-color: var(--cl-dark) !important; }
.jump-theater { background-color: var(--cl-navy) !important; }
.jump-info-card { background-color: var(--cl-card) !important; }
.jump-info-description,
.jump-info-description-wrap,
.jump-info-description *,
.jump-info-empty,
.jump-theater-muted { color: var(--cl-white) !important; }
/* Card-titels (p.fw-bold): zelfde font als headings */
.card p.fw-bold, .asset p.fw-bold, p.fw-bold.mb-0 {
    font-family: 'Flama Ultracondensed Bold', 'Barlow Condensed', sans-serif !important;
    text-transform: uppercase !important;
    letter-spacing: -0.005em !important;
}
/* COOKIEBANNER — boven de body::before gradient (z-index 2099) uitstijgen.
   .cc-window heeft cc-static class → position: static → z-index werkt niet.
   Fix: .cc-grower een stacking context geven zodat hij boven de gradient valt. */
.cc-grower {
    position: relative !important;
    z-index: 10000 !important;
}

/* TRACKING IFRAMES */
body > iframe { position: fixed !important; width: 0 !important; height: 0 !important; overflow: hidden !important; pointer-events: none !important; }

/* PROFIEL / INSTELLINGEN / AANKOPEN PAGINA
   .section.py-5 = settings, section.py-5 (HTML-element) = my-purchases e.a. */
.section.py-5,
section.py-5 {
    background-color: var(--cl-dark) !important;
    color: var(--cl-white) !important;
}
.section.py-5 h1,
section.py-5 h1 { margin-top: 2rem !important; }
/* Card-header krijgt subtiel donkerder tint */
.section.py-5 .card-header,
section.py-5 .card-header {
    background-color: rgba(255,255,255,0.06) !important;
    border-color: rgba(210,158,39,0.25) !important;
}
/* Inputs en textareas: donker veld, lichte tekst */
.section.py-5 .form-control,
section.py-5 .form-control {
    background-color: rgba(255,255,255,0.08) !important;
    border-color: rgba(210,158,39,0.30) !important;
    color: var(--cl-white) !important;
}
.section.py-5 .form-control:disabled,
.section.py-5 .form-control[readonly],
section.py-5 .form-control:disabled,
section.py-5 .form-control[readonly] {
    background-color: rgba(255,255,255,0.04) !important;
    color: rgba(255,255,255,0.45) !important;
}
/* Labels en helptext */
.section.py-5 label,
.section.py-5 .form-check-label,
.section.py-5 small,
.section.py-5 .text-muted,
section.py-5 label,
section.py-5 .form-check-label,
section.py-5 small,
section.py-5 .text-muted {
    color: rgba(255,255,255,0.65) !important;
}
/* Tabel */
.section.py-5 .table,
.section.py-5 .table th,
.section.py-5 .table td,
section.py-5 .table,
section.py-5 .table th,
section.py-5 .table td {
    color: var(--cl-white) !important;
    border-color: rgba(255,255,255,0.10) !important;
}
/* Outline knoppen (Lidmaatschap intrekken) */
.section.py-5 .btn-outline-secondary,
section.py-5 .btn-outline-secondary {
    color: rgba(255,255,255,0.75) !important;
    border-color: rgba(255,255,255,0.30) !important;
}
.section.py-5 .btn-outline-secondary:hover,
section.py-5 .btn-outline-secondary:hover {
    background-color: rgba(255,255,255,0.10) !important;
    color: var(--cl-white) !important;
}
/* Account verwijderen knop: rood blijft */
.section.py-5 .btn-danger,
section.py-5 .btn-danger { color: #fff !important; }
/* Checkbox: zichtbaar op donkere achtergrond */
.section.py-5 .form-check-input,
section.py-5 .form-check-input {
    background-color: rgba(255,255,255,0.10) !important;
    border-color: rgba(210,158,39,0.50) !important;
}
.section.py-5 .form-check-input:checked,
section.py-5 .form-check-input:checked {
    background-color: var(--cl-gold) !important;
    border-color: var(--cl-gold) !important;
}

/* Alert-box op watch-pagina: platform achtergrond ipv Bootstrap licht */
.alert.alert-light {
    background-color: var(--cl-card) !important;
    border-color: rgba(210,158,39,0.25) !important;
    color: var(--cl-white) !important;
}

/* Zoekicoontje: goud (SVG path heeft hardcoded fill="black", dus direct targeten) */
.navbar-header button.btn-link { color: var(--cl-gold) !important; }
.navbar-header button.btn-link svg path { fill: var(--cl-gold) !important; }

/* Notificatie-bel verbergen */
#navbarNotificationsLink { display: none !important; }

/* "Add missing information" verbergen */
a.dropdown-item[href="/first-logon-survey"] { display: none !important; }

/* Rode notificatiedot verbergen */
.nav-link .position-absolute.bg-danger.rounded-circle { display: none !important; }

/* Gebruikersnaam-knop: gouden achtergrond + donkere tekst */
.nav-link.dropdown-toggle.bg-body.rounded.border {
    background-color: var(--cl-gold) !important;
    color: var(--cl-white) !important;
    border-color: var(--cl-gold) !important;
    font-weight: 700 !important;
}
.nav-link.dropdown-toggle.bg-body.rounded.border:hover {
    background-color: #b8891e !important;
    color: var(--cl-white) !important;
}

/* Gebruikers-dropdown: rechts uitlijnen zodat hij niet buiten beeld valt */
.navbar-header .nav-item.dropdown .dropdown-menu,
.nav-item.dropdown.position-relative .dropdown-menu {
    right: 0 !important;
    left: auto !important;
    transform: none !important;
}

/* Inloggen-link als knop */
a.nav-link[href="/login"] {
    background-color: var(--cl-gold) !important;
    color: var(--cl-white) !important;
    border-radius: 4px !important;
    padding: 6px 18px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    transition: background 0.2s ease !important;
}
a.nav-link[href="/login"]:hover {
    background-color: #b8891e !important;
    color: var(--cl-white) !important;
}

/* Mobiel: vervang tekst door user-icoon */
@media (max-width: 991.98px) {
    a.nav-link[href="/login"] {
        font-size: 0 !important;
        width: 40px !important;
        height: 40px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    a.nav-link[href="/login"]::before {
        content: "\f007";
        font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome" !important;
        font-weight: 900 !important;
        font-size: 17px !important;
        color: var(--cl-white) !important;
    }
}

/* ===== UX/UI VERBETERINGEN ===== */

/* Geen horizontale scroll */
body { overflow-x: hidden !important; }

/* Watermerk achtergrond desktop: JUMP-instellingen hersteld (cover + repeat) */
/* Mobiel fix staat in de @media blok hieronder */

/* Navbar leesbaarheid: vaste top-gradient over alle pagina's */
body::before {
    content: '' !important;
    position: fixed !important;
    top: 0 !important; left: 0 !important; right: 0 !important;
    height: 140px !important;
    background: linear-gradient(to bottom, rgba(18,24,56,0.72) 0%, transparent 100%) !important;
    z-index: 2099 !important;
    pointer-events: none !important;
}

/* Bootstrap .h1–.h6 utility classes: zelfde font als heading-elementen */
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'Flama Ultracondensed Bold', 'Barlow Condensed', sans-serif !important;
    color: var(--cl-gold) !important;
    text-transform: uppercase !important;
    letter-spacing: -0.005em !important;
}

/* Upcoming cards: border-radius consistent met andere cards */
.jump-upcoming-card,
.jump-upcoming-card .jump-upcoming-card__image-container {
    border-radius: 10px !important;
    overflow: hidden !important;
}

/* Card p.fw-bold: leesbare grootte voor Flama condensed */
.card p.fw-bold, .asset p.fw-bold, p.fw-bold.mb-0 {
    font-size: 18px !important;
    line-height: 1.3 !important;
}

/* Upcoming card titel: iets groter */
.jump-upcoming-card h4,
.jump-upcoming-card__title {
    font-size: 20px !important;
    line-height: 1.2 !important;
}

/* Card hover: subtiele lift voor betere interactiviteit */
/* Alleen op .asset:hover — .glide__slide:hover weghalen voorkomt dubbele lift (8px) */
.glide__slide { transition: transform 0.2s ease !important; }
.asset { transition: transform 0.2s ease, box-shadow 0.2s ease !important; }
.asset:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 32px rgba(0,0,0,0.45) !important;
}
/* Geen donkerblauw vlak op hover: JUMP kan .card:hover een achtergrond meegeven */
.glide__slide .asset:hover,
.glide__slide .card:hover {
    background-color: transparent !important;
}

/* Subtiele visuele scheiding tussen secties */
section.tags-overview + section,
section.live-event-date + section {
    border-top: 1px solid rgba(210,158,39,0.10) !important;
}

/* MOBIEL */
@media (max-width: 575.98px) {
    /* Hero titel: niet buiten beeld op klein scherm */
    .featured-hero h1,
    .featured-hero__title {
        font-size: clamp(28px, 10vw, 48px) !important;
        white-space: normal !important;
        line-height: 0.92 !important;
    }

    /* Sectie-padding compacter op mobiel */
    .tags-overview, .live-event-date {
        padding-top: 24px !important;
        padding-bottom: 24px !important;
    }

    /* Auth knoppen: iets groter tap-target */
    .navbar-header a#authModalLogin.nav-link,
    .navbar-header a#authModalRegistration.nav-link {
        padding: 10px 12px !important;
        font-size: 12px !important;
    }

    /* Shorts: 9:16 behouden, slide-container iets groter */
    .glide__slide:has(img[style*="9/16"]) img {
        aspect-ratio: 9 / 16 !important;
        width: 100% !important;
        height: auto !important;
    }

    /* Achtergrond mobiel: cover vult het scherm, scroll ipv fixed (iOS-fix) */
    body {
        background-size: cover !important;
        background-repeat: no-repeat !important;
        background-position: center center !important;
        background-attachment: scroll !important;
    }

    /* Watch pagina: countdown niet afgekapt op mobiel.
       JUMP zet min-height: 500px op .video-player via style.css.
       .jump-player-wrap clipt op 203px (16:9) waardoor de centered countdown
       (≈ 250px van boven) onzichtbaar wordt.
       Fix: overflow visible + transparante achtergrond op de player-kaart. */
    .jump-player-wrap {
        overflow: visible !important;
    }
    #video-wrapper,
    .video-player {
        background-color: transparent !important;
        min-height: 0 !important;
    }
}

/* Carrousel met class "geentekst": titel en omschrijving verbergen */
.geentekst .featured-hero__title,
.geentekst .featured-hero__lead,
.geentekst .asset .card-title,
.geentekst .asset .card-text,
.geentekst .asset p.fw-bold,
.geentekst .asset p:not(.badge) { display: none !important; }

/* =========================================================
   FOOTER – LOGO CENTREREN, "POWERED BY JUMP"-TEKST VERBERGEN
========================================================= */
footer .card-body .row.mb-5 {
    justify-content: center !important;
}
footer .card-body .row.mb-5 .col-12.col-md-4 {
    display: flex !important;
    justify-content: center !important;
}
footer .card-body .row.mb-5 .col-12.col-md-4 > .row {
    justify-content: center !important;
    width: auto !important;
}
footer .card-body .row.mb-5 .col-12.col-md-4 > .row > .col-8 {
    display: none !important;
}
footer .card-body .row.mb-5 .col-12.col-md-4 > .row > .col-4 {
    flex: 0 0 auto !important;
    width: auto !important;
    text-align: center !important;
}