/* Blue Marlins - opmaak van de website (het Divi-thema), geladen door de plugin op het hoofdadres.
   De inhoud blijft in Divi staan; dit bestand regelt hoe de bouwstenen eruitzien.
   Klassen die je in Divi op een sectie of module kunt zetten (Geavanceerd > CSS-klasse):
     bm-kop        paginakop met foto en titel            bm-band      donkere band met korte punten (modules: bm-punt)
     bm-info       inhoud met zijkolom (kolommen: bm-hoofd / bm-zij, blokken in de zijkolom: bm-paneel)
     bm-licht      sectie met lichte achtergrond          bm-smal      tekst op leesbreedte
   Letters: koppen in Archivo (smal, schuin, zoals het logo), tekst in Interstate. */

:root {
  --bm-nacht: #010051; --bm-navy: #001a5e; --bm-marlin: #194996; --bm-bad: #0c71c3; --bm-plons: #2aacef;
  --bm-lijn: #e2231a; --bm-krijt: #f2f5fa; --bm-inkt: #111a33; --bm-grijs: #56627c; --bm-rand: #d5ddea;
  --bm-kop: "Archivo", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --bm-tekst: "interstate", "Helvetica Neue", Arial, sans-serif;
  --bm-schuin: 14px;                 /* hoeveel de schuine kanten van knoppen en panelen inspringen */
  --bm-baan: repeating-linear-gradient(90deg, var(--bm-lijn) 0 22px, #fff 22px 30px, var(--bm-bad) 30px 52px, #fff 52px 60px);
}
@view-transition { navigation: auto; }

/* ---------- Basis ---------- */
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--bm-kophoogte, 120px) + 80px); }
#main-content { overflow-x: clip; background: #fff; }
#et-main-area, #page-container { background: #fff; }
body, body #page-container, body input, body textarea, body select { font-family: var(--bm-tekst); }
body { color: var(--bm-inkt); background: #fff; font-size: 18px; font-weight: 400; line-height: 1.65; -webkit-font-smoothing: antialiased; }
#page-container p, #page-container li, #page-container td, #page-container .et_pb_text_inner { font-weight: 400; line-height: 1.65; }
#page-container .et_pb_text_inner > p, #page-container .et_pb_text_inner > ul, #page-container .et_pb_text_inner > ol { max-width: 72ch; }
#page-container .et_pb_text_inner p { padding-bottom: .9em; }
#page-container .et_pb_text_inner p:last-child { padding-bottom: 0; }
#page-container .et_pb_text_inner strong, #page-container .et_pb_text_inner b { font-weight: 700; }
#page-container #main-content a:not(.et_pb_button):not(.more-link) { color: var(--bm-bad); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
#page-container #main-content a:not(.et_pb_button):hover { color: var(--bm-navy); }
::selection { background: var(--bm-plons); color: var(--bm-nacht); }
:focus-visible { outline: 3px solid var(--bm-plons); outline-offset: 3px; }

#page-container h1, #page-container h2, #page-container h3, #page-container .et_pb_toggle_title, #page-container .et_pb_tabs_controls a {
  font-family: var(--bm-kop) !important; font-stretch: 72%; font-style: italic; font-weight: 800 !important; text-transform: uppercase; letter-spacing: 0; word-spacing: .1em; color: var(--bm-navy); text-wrap: balance; padding-bottom: 0;
}
#page-container h1 { font-size: clamp(44px, 7vw, 104px) !important; line-height: .9 !important; }
#page-container h2 { font-size: clamp(30px, 3.4vw, 46px) !important; line-height: 1 !important; margin: 0 0 .5em; }
#page-container h3 { font-size: clamp(23px, 2.2vw, 30px) !important; line-height: 1.05 !important; font-stretch: 80%; margin: 0 0 .45em; }
#page-container h4, #page-container h5, #page-container h6 { font-family: var(--bm-tekst) !important; font-weight: 700 !important; font-size: 19px !important; line-height: 1.3 !important; color: var(--bm-navy); text-transform: none; padding-bottom: .35em; }
#page-container .et_pb_text_inner * + h2 { margin-top: 1.5em; }
#page-container .et_pb_text_inner * + h3, #page-container .et_pb_text_inner * + h4 { margin-top: 1.2em; }

/* Opsommingen: het schuine blokje uit het logo als opsommingsteken */
#page-container #main-content .et_pb_text_inner > ul, #page-container #main-content .et_pb_toggle_content ul, #page-container #main-content .et_pb_tab_content ul, #page-container #main-content .et_pb_text_inner > ul ul { list-style: none; padding: 0 0 .9em; }
#page-container #main-content .et_pb_text_inner > ul li, #page-container #main-content .et_pb_toggle_content ul li, #page-container #main-content .et_pb_tab_content ul li { position: relative; padding-left: 1.5em; margin-bottom: .35em; font-weight: 400; }
#page-container #main-content .et_pb_text_inner > ul li::before, #page-container #main-content .et_pb_toggle_content ul li::before, #page-container #main-content .et_pb_tab_content ul li::before { content: ""; position: absolute; left: 0; top: .55em; width: .8em; height: .42em; background: var(--bm-plons); transform: skewX(-22deg); }
#page-container #main-content .et_pb_text_inner ol { padding: 0 0 .9em 1.4em; }
#page-container #main-content .et_pb_text_inner ol > li { padding-left: .3em; margin-bottom: .35em; }
#page-container #main-content .et_pb_text_inner ol > li::marker { font-family: var(--bm-kop); font-style: italic; font-weight: 800; color: var(--bm-bad); }

/* Secties: rust en ritme */
#page-container #main-content .et_pb_section { padding-block: clamp(44px, 6vw, 84px); }
#page-container #main-content .et_pb_row { width: min(1180px, 100% - 44px); max-width: none; padding-block: 0; }
#page-container #main-content .et_pb_row + .et_pb_row { margin-top: clamp(28px, 4vw, 48px); }
#page-container #main-content .et_pb_section.bm-licht { background: var(--bm-krijt); }
#page-container .et_pb_module { margin-bottom: 26px; }
#page-container .et_pb_column > .et_pb_module:last-child { margin-bottom: 0; }
#page-container .et_pb_image img, #page-container .et_pb_video_box, #page-container .et_pb_video iframe { border-radius: 0; }
#page-container .et_pb_divider::before { border-top-color: var(--bm-rand) !important; }

/* ---------- Knoppen: schuin afgesneden, zoals de vormen in het logo ---------- */
html body #page-container .et_pb_button, html body #page-container .et_pb_contact_submit, html body #page-container input[type=submit].et_pb_button {
  font-family: var(--bm-kop) !important; font-stretch: 82%; font-style: italic; font-weight: 800 !important; font-size: 17px !important; line-height: 1.2 !important; letter-spacing: .02em; text-transform: uppercase;
  color: #fff !important; background: var(--bm-bad) !important; border: 0 !important; border-radius: 0 !important; padding: 15px 30px 14px !important;
  clip-path: polygon(var(--bm-schuin) 0, 100% 0, calc(100% - var(--bm-schuin)) 100%, 0 100%); transition: background-color .15s ease; box-shadow: none !important;
}
html body #page-container .et_pb_button::after, html body #page-container .et_pb_button::before { display: none !important; }
html body #page-container .et_pb_button:hover, html body #page-container .et_pb_contact_submit:hover { background: var(--bm-navy) !important; padding: 15px 30px 14px !important; }
#page-container .et_pb_button_module_wrapper { margin-bottom: 12px; }
#page-container .et_pb_button_module_wrapper + .et_pb_button_module_wrapper .et_pb_button { background: var(--bm-navy) !important; }
#page-container .et_pb_button_module_wrapper + .et_pb_button_module_wrapper .et_pb_button:hover { background: var(--bm-bad) !important; }

/* ---------- Kop van de site ---------- */
#top-header { background: var(--bm-nacht) !important; }
#top-header .container { padding-top: 0; width: min(1280px, 100% - 44px); max-width: none; }
#et-secondary-nav { display: flex; gap: 2px; justify-content: flex-end; align-items: stretch; }
#et-secondary-nav > li { margin: 0; }
#et-secondary-nav > li > a { display: block; padding: 11px 12px 10px !important; font-size: 14px; font-weight: 500; letter-spacing: 0; opacity: .86; transition: opacity .12s; }
#et-secondary-nav > li > a:hover { opacity: 1; }
#et-secondary-nav > li.menu-item-49740 > a { opacity: 1; background: #fff; color: var(--bm-navy) !important; font-family: var(--bm-kop); font-stretch: 82%; font-style: italic; font-weight: 800; text-transform: uppercase; font-size: 15px; padding-inline: 20px !important; clip-path: polygon(10px 0, 100% 0, calc(100% - 10px) 100%, 0 100%); }
#et-secondary-nav > li.menu-item-49740 > a:hover { background: var(--bm-plons); }
#main-header, #main-header.et-fixed-header { background: var(--bm-navy) !important; box-shadow: none !important; }
#main-header .container { width: min(1280px, 100% - 44px); max-width: none; }
html body #main-header #top-menu > li { padding-right: 26px; }
html body #main-header #top-menu > li:last-child { padding-right: 0; }
html body #main-header #top-menu > li > a { font-family: var(--bm-kop) !important; font-stretch: 84%; font-style: italic; font-weight: 800 !important; font-size: 19px !important; text-transform: uppercase; letter-spacing: .01em; color: #fff !important; opacity: 1 !important; }
html body #main-header #top-menu > li > a:hover, html body #main-header #top-menu > li.current-menu-item > a, html body #main-header #top-menu > li.current-menu-ancestor > a { color: var(--bm-plons) !important; }
#top-menu li ul.sub-menu { background: #fff !important; border-top: 0; padding: 8px 0; width: 290px; box-shadow: 0 18px 40px rgba(1, 0, 81, .22); }
#top-menu li ul.sub-menu li { padding: 0; display: block; }
html body #main-header #top-menu li ul.sub-menu li a { width: auto; display: block; padding: 9px 22px; font-family: var(--bm-tekst) !important; font-size: 16px !important; font-weight: 500 !important; font-style: normal; text-transform: none; color: var(--bm-navy) !important; opacity: 1 !important; background: none !important; }
html body #main-header #top-menu li ul.sub-menu li a:hover { background: var(--bm-krijt) !important; color: var(--bm-bad) !important; }
#top-menu li ul.sub-menu ul.sub-menu { top: -8px; left: 290px; }
#top-menu li ul.sub-menu .menu-item-has-children > a:first-child::after { right: 14px; top: 9px; color: var(--bm-bad); }
/* Het logo hangt over de kop heen, zoals een vlag boven het bad */
#main-header { z-index: 100001; }
#main-header .container { position: relative; }
#main-header .logo_container { position: absolute; left: 0 !important; top: 0; height: 100%; width: 170px !important; margin: 0 !important; padding: 0 !important; transform: none; text-align: left; }
#main-header .logo_container .logo_helper { display: none; }
#main-header #logo { position: absolute; left: 0; top: -38px; height: 128px; max-height: none !important; width: auto; max-width: none; filter: drop-shadow(0 8px 12px rgba(1, 0, 81, .4)); transition: height .2s ease, top .2s ease; }
#main-header.et-fixed-header #logo { height: 96px; top: -30px; }
#et-top-navigation { padding-left: 0 !important; }

/* ---------- Paginakop ---------- */
#page-container #main-content .et_pb_section.bm-kop {
  position: relative; display: flex; align-items: flex-end; min-height: clamp(330px, 44vw, 560px); padding: 0 0 calc(4vw + 30px) !important; margin: 0;
  background-size: cover; background-position: center 30%; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 4vw), 0 100%); isolation: isolate;
}
#page-container .bm-kop::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(100deg, rgba(1, 0, 81, .94) 0%, rgba(0, 26, 94, .82) 34%, rgba(0, 26, 94, .25) 68%, rgba(0, 26, 94, 0) 100%), linear-gradient(0deg, rgba(1, 0, 81, .55), rgba(1, 0, 81, 0) 45%); }
#page-container .bm-kop::after { content: ""; position: absolute; left: -2%; width: 104%; bottom: calc(2vw - 4px); height: 8px; background: var(--bm-baan); transform: rotate(-2.2906deg); transform-origin: center; }
#page-container .bm-kop .et_pb_row { margin-bottom: 0; }
#page-container .bm-kop .et_pb_module { margin: 0; background: none !important; padding: 0 !important; }
#page-container .bm-kop h1 { color: #fff; max-width: min(100%, 980px); overflow-wrap: normal; word-break: normal; hyphens: manual; view-transition-name: bm-titel; }
#page-container .bm-kop .bm-kruimel { font-size: 15px; font-weight: 500; padding: 0 0 12px; color: rgba(255, 255, 255, .6); max-width: none; }
#page-container #main-content .bm-kop .bm-kruimel a { color: #fff; text-decoration: none; border-bottom: 1.5px solid var(--bm-plons); padding-bottom: 1px; }
#page-container #main-content .bm-kop .bm-kruimel a:hover { color: var(--bm-plons); }
#page-container .bm-kop .bm-kruimel span { margin: 0 6px; }
#page-container #main-content .bm-kop + .et_pb_section { padding-top: clamp(30px, 4vw, 56px); }

/* ---------- Donkere band met korte punten ---------- */
#page-container #main-content .et_pb_section.bm-band { position: relative; isolation: isolate; background-color: var(--bm-navy); background-size: cover; background-position: center; color: #fff; }
#page-container .bm-band::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(100deg, rgba(1, 0, 81, .96), rgba(0, 26, 94, .86) 55%, rgba(12, 113, 195, .62)); }
#page-container .bm-band h2, #page-container .bm-band h3, #page-container .bm-band p { color: #fff; }
#page-container .bm-band .et_pb_column { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 14px 18px; }
#page-container .bm-band .et_pb_column > .et_pb_module { margin: 0; }
#page-container .bm-band .bm-band-kop { grid-column: 1 / -1; margin-bottom: 8px; }
#page-container .bm-band .bm-band-kop h2 { font-size: clamp(26px, 2.8vw, 38px) !important; max-width: 26ch; }
#page-container .bm-band .bm-punt { background: rgba(255, 255, 255, .1); border-left: 6px solid var(--bm-plons); padding: 20px 22px !important; transform: skewX(-8deg); }
#page-container .bm-band .bm-punt .et_pb_text_inner { transform: skewX(8deg); font-family: var(--bm-kop); font-stretch: 86%; font-weight: 700; font-size: 21px; line-height: 1.2; color: #fff; }
#page-container .bm-band .bm-punt p { font-weight: 700; line-height: 1.2; padding: 0; }

/* ---------- Lijst met doorverwijzingen: rijen als de banen van het bad ---------- */
#page-container #main-content ul.bm-banen { list-style: none; padding: 0; margin: 0; max-width: none; border-top: 2px solid var(--bm-navy); }
#page-container #main-content ul.bm-banen > li { padding: 0; margin: 0; border-bottom: 2px solid var(--bm-navy); }
#page-container #main-content ul.bm-banen > li::before { display: none; }
#page-container #main-content ul.bm-banen > li > a { display: grid; grid-template-columns: minmax(200px, 30%) 1fr auto; gap: 8px 32px; align-items: center; padding: 24px 6px 22px 0; text-decoration: none; color: var(--bm-inkt); transition: background-color .15s ease, padding-left .15s ease; }
#page-container #main-content ul.bm-banen a, #page-container #main-content ul.bm-banen a * { text-decoration: none !important; }
#page-container #main-content ul.bm-banen > li > a::after { content: ""; width: 15px; height: 15px; border-right: 4px solid var(--bm-bad); border-top: 4px solid var(--bm-bad); transform: rotate(45deg); margin-right: 8px; }
#page-container #main-content ul.bm-banen > li > a:hover { background: var(--bm-krijt); padding-left: 16px; color: var(--bm-inkt); }
#page-container #main-content ul.bm-banen strong { font-family: var(--bm-kop); font-stretch: 76%; font-style: italic; font-weight: 800; font-size: clamp(26px, 2.8vw, 38px); line-height: 1; text-transform: uppercase; color: var(--bm-navy); word-spacing: .08em; }
#page-container #main-content ul.bm-banen strong small { display: block; margin-top: 6px; font-family: var(--bm-tekst); font-stretch: 100%; font-style: normal; font-weight: 500; font-size: 15px; text-transform: none; color: var(--bm-bad); word-spacing: 0; }
#page-container #main-content ul.bm-banen span { font-size: 17px; line-height: 1.5; max-width: 60ch; color: var(--bm-inkt); }
#page-container #main-content ul.bm-banen > li > a:hover strong { color: var(--bm-bad); }

/* Grote kop op de startpagina: met inleiding en knoppen */
#page-container #main-content .et_pb_section.bm-kop.bm-kop-groot { min-height: clamp(520px, 62vw, 760px); }
#page-container .bm-kop.bm-kop-groot h1 { max-width: 12ch; }
#page-container .bm-kop .bm-kop-inleiding { color: #fff; font-size: clamp(18px, 1.5vw, 21px); line-height: 1.55; max-width: 56ch; padding-top: 22px !important; }
#page-container .bm-kop .bm-kop-inleiding p { color: #fff; }
#page-container .bm-kop .et_pb_button_module_wrapper { display: inline-block; margin: 26px 10px 0 0 !important; }
#page-container .bm-kop .et_pb_button_module_wrapper + .et_pb_button_module_wrapper .et_pb_button { background: #fff !important; color: var(--bm-navy) !important; }
#page-container .bm-kop .et_pb_button_module_wrapper + .et_pb_button_module_wrapper .et_pb_button:hover { background: var(--bm-plons) !important; }

/* Foto's met een afgesneden hoek (klasse bm-foto op een afbeelding) en drie-op-een-rij met tekst eronder */
#page-container .bm-foto img, #page-container .bm-foto .et_pb_image_wrap { display: block; width: 100%; }
#page-container .bm-foto img { aspect-ratio: 4 / 3; object-fit: cover; clip-path: polygon(0 0, calc(100% - 30px) 0, 100% 30px, 100% 100%, 0 100%); }
#page-container .bm-foto { margin-bottom: 18px !important; }
#page-container .bm-bad-foto img { aspect-ratio: 16 / 10; }
#page-container .bm-klein p { font-size: 16px; line-height: 1.5; color: var(--bm-grijs); }
#page-container .bm-band .et_pb_column.bm-vrij { display: block; }
#page-container .bm-band .bm-vrij .et_pb_module { margin-bottom: 22px; }
#page-container .bm-band .et_pb_button_module_wrapper { display: inline-block; margin: 0 10px 10px 0 !important; }
#page-container .bm-band .et_pb_button { background: #fff !important; color: var(--bm-navy) !important; }
#page-container .bm-band .et_pb_button:hover { background: var(--bm-plons) !important; }
#page-container .bm-band .et_pb_button_module_wrapper + .et_pb_button_module_wrapper .et_pb_button { background: var(--bm-bad) !important; color: #fff !important; }

/* ---------- Inhoud met zijkolom ---------- */
#page-container .bm-info > .et_pb_row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 360px); gap: clamp(28px, 5vw, 72px); align-items: start; }
#page-container .bm-info > .et_pb_row > .et_pb_column { width: auto !important; margin: 0 !important; float: none; }
#page-container .bm-info > .et_pb_row::after { display: none; }
#page-container .bm-info .bm-hoofd .et_pb_row_inner { padding: 0; }
#page-container .bm-info .bm-hoofd .et_pb_video { max-width: 640px; width: 100% !important; }
#page-container .bm-intro { font-size: 1.22em; line-height: 1.5; font-weight: 500 !important; color: var(--bm-navy); max-width: 62ch; }
#page-container .bm-zij { position: sticky; top: calc(var(--bm-kophoogte, 120px) + 76px); }
#page-container .bm-zij .et_pb_module { margin: 0; }
#page-container .bm-zij .bm-paneel { background: var(--bm-navy) !important; color: #fff; padding: 26px 26px 24px !important; margin-top: 18px; clip-path: polygon(0 0, calc(100% - 26px) 0, 100% 26px, 100% 100%, 0 100%); font-size: 16px; }
#page-container .bm-zij > .bm-paneel:first-child { margin-top: 0; }
#page-container .bm-zij .bm-paneel h3 { color: #fff; margin-bottom: .6em; font-size: 24px !important; overflow-wrap: normal; }
#page-container .bm-zij .bm-paneel .sptp-member-avatar-img { max-width: 190px; }
#page-container .bm-zij .bm-paneel p, #page-container .bm-zij .bm-paneel li, #page-container .bm-zij .bm-paneel span { color: #fff; line-height: 1.5; }
#page-container .bm-zij .bm-paneel strong { color: var(--bm-plons); }
#page-container #main-content .bm-zij .bm-paneel a:not(.et_pb_button) { color: #fff; text-decoration-color: var(--bm-plons); }
#page-container .bm-zij .bm-paneel-knop { margin: 0; text-align: left; }
#page-container .bm-zij .bm-paneel-knop .et_pb_button { display: block; clip-path: none; background: var(--bm-bad) !important; padding: 14px 26px 13px !important; }
#page-container .bm-zij .bm-paneel-knop .et_pb_button:hover { background: var(--bm-plons) !important; color: var(--bm-nacht) !important; }

/* Uitklapblokken: rijen als banen in het bad */
#page-container .et_pb_toggle, #page-container .et_pb_accordion .et_pb_toggle { background: none !important; border: 0 !important; border-top: 2px solid var(--bm-navy) !important; padding: 0 !important; margin: 0 !important; }
#page-container .et_pb_toggle + :not(.et_pb_toggle) { margin-top: 36px; }
#page-container .et_pb_toggle:has(+ :not(.et_pb_toggle)), #page-container .et_pb_toggle:last-child { border-bottom: 2px solid var(--bm-navy) !important; }
#page-container .et_pb_toggle .et_pb_toggle_title { position: relative; cursor: pointer; padding: 18px 54px 16px 0 !important; font-size: 22px !important; line-height: 1.1 !important; font-stretch: 82%; color: var(--bm-navy) !important; }
#page-container .et_pb_toggle .et_pb_toggle_title::before { content: "" !important; position: absolute; right: 6px; left: auto; top: 50%; width: 16px; height: 16px; margin-top: -11px; border-right: 4px solid var(--bm-bad); border-bottom: 4px solid var(--bm-bad); transform: rotate(45deg); transition: transform .2s ease; background: none; }
#page-container .et_pb_toggle.et_pb_toggle_open .et_pb_toggle_title::before { transform: rotate(225deg); margin-top: -3px; }
#page-container .et_pb_toggle:hover .et_pb_toggle_title { color: var(--bm-bad) !important; }
#page-container .et_pb_toggle .et_pb_toggle_content { padding: 0 0 22px !important; max-width: 72ch; }

/* Tabbladen */
#page-container .et_pb_tabs { border: 0; }
#page-container .et_pb_tabs_controls { background: none; border-bottom: 2px solid var(--bm-navy); display: flex; flex-wrap: wrap; gap: 4px; }
#page-container .et_pb_tabs_controls::after { display: none; }
#page-container .et_pb_tabs_controls li { border: 0 !important; background: var(--bm-krijt) !important; float: none; height: auto; }
#page-container .et_pb_tabs_controls li a { padding: 12px 18px 10px; font-size: 18px; color: var(--bm-navy) !important; font-stretch: 84%; }
#page-container .et_pb_tabs_controls li.et_pb_tab_active { background: var(--bm-navy) !important; }
#page-container .et_pb_tabs_controls li.et_pb_tab_active a { color: #fff !important; }
#page-container .et_pb_all_tabs { background: none; }
#page-container .et_pb_tab { padding: 22px 0 0; }

/* Tabellen */
#page-container #main-content table { border: 0; border-collapse: collapse; width: 100%; font-size: 16px; margin-bottom: 1em; }
#page-container #main-content table th, #page-container #main-content table thead td, #page-container #main-content table tr:first-child td { background: var(--bm-navy); color: #fff; font-weight: 700; text-align: left; border: 0; padding: 10px 14px; }
#page-container #main-content table td { border: 0; border-bottom: 1px solid var(--bm-rand); padding: 10px 14px; max-width: none; }

/* Formulieren */
#page-container .et_pb_contact_form .input, #page-container .et_pb_contact_form textarea, #page-container .et_pb_contact_form select { background: #fff; border: 2px solid var(--bm-rand); border-radius: 0; font-size: 17px; color: var(--bm-inkt); padding: 14px 16px; }
#page-container .et_pb_contact_form .input:focus { border-color: var(--bm-bad); }

/* Nieuws */
#page-container .et_pb_blog_grid .et_pb_post { border: 0 !important; background: none; padding: 0 0 8px; box-shadow: none; }
#page-container .et_pb_blog_grid .et_pb_post .et_pb_image_container, #page-container .et_pb_blog_grid .et_pb_post .entry-featured-image-url { margin: 0 0 16px; }
#page-container .et_pb_blog_grid .et_pb_post img { border: 0 !important; aspect-ratio: 3 / 2; object-fit: cover; width: 100%; clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 0 100%); }
#page-container .et_pb_blog_grid .et_pb_post .entry-title { font-size: 25px !important; font-stretch: 80%; margin: 0 0 6px; }
#page-container #main-content .et_pb_blog_grid .et_pb_post .entry-title a { color: var(--bm-navy); text-decoration: none; }
#page-container #main-content .et_pb_blog_grid .et_pb_post .entry-title a:hover { color: var(--bm-bad); }
#page-container .et_pb_blog_grid .post-meta { font-size: 14px; font-weight: 500; color: var(--bm-grijs) !important; padding-bottom: 8px; }
#page-container .et_pb_blog_grid .post-content { font-size: 16px; }
#page-container .et_pb_blog_grid .post-content p { font-size: 16px; line-height: 1.55; }
#page-container #main-content .et_pb_blog_grid .more-link { font-weight: 700; color: var(--bm-bad); text-transform: none; text-decoration: underline; text-underline-offset: 3px; }

/* Mensen (WP Team): rustige kaartjes in plaats van grote koppen */
#page-container .sptp-member { background: none !important; border: 0 !important; box-shadow: none !important; padding: 0 0 8px !important; text-align: left !important; height: auto !important; }
#page-container .sptp-member .sptp-member-avatar-img img { width: 100%; aspect-ratio: 1; object-fit: cover; clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%); border-radius: 0 !important; }
#page-container .sptp-member .sptp-member-name { margin: 10px 0 0 !important; padding: 0 !important; }
#page-container .sptp-member .sptp-name, #page-container .sptp-member .sptp-name a { font-family: var(--bm-kop) !important; font-stretch: 82% !important; font-style: italic !important; font-weight: 800 !important; font-size: 20px !important; line-height: 1.1 !important; text-transform: uppercase; color: var(--bm-navy) !important; text-decoration: none !important; margin: 0 !important; word-spacing: .06em; }
#page-container .sptp-member .sptp-member-profession { margin: 2px 0 0 !important; padding: 0 !important; text-align: left !important; }
#page-container .sptp-member .sptp-member-name, #page-container .sptp-member [class*="sptp-member-"] { text-align: left !important; justify-content: flex-start !important; }
#page-container .sptp-special-tag, #page-container .sptp-special-tag * { color: #fff !important; }
#page-container .sptp-member .sptp-profession-text, #page-container .sptp-member .sptp-member-profession * { font-family: var(--bm-tekst) !important; font-size: 15px !important; font-weight: 400 !important; line-height: 1.35 !important; color: var(--bm-grijs) !important; text-transform: none !important; font-style: normal !important; padding: 0 !important; margin: 0 !important; }
#page-container .sptp-member .sptp-member-location, #page-container .sptp-member [class*="sptp-member-"] span { font-size: 14px !important; color: var(--bm-grijs) !important; }
#page-container .bm-paneel .sptp-member .sptp-name, #page-container .bm-paneel .sptp-member .sptp-name a { color: #fff !important; }
#page-container .bm-paneel .sptp-member .sptp-profession-text, #page-container .bm-paneel .sptp-member [class*="sptp-member-"] *, #page-container .bm-paneel .sptp-member [class*="sptp-member-"] { color: rgba(255, 255, 255, .8) !important; }
#page-container .sptp-special-tag span { font-family: var(--bm-kop) !important; font-stretch: 84%; font-style: italic; font-weight: 800 !important; text-transform: uppercase; background: var(--bm-lijn) !important; color: #fff !important; border-radius: 0 !important; }

/* Veelgestelde vragen (Helpie): zelfde rijen als de uitklapblokken */
#page-container .helpie-faq .collection-title { margin: 0 0 14px; }
#page-container .helpie-faq.accordions .accordion ul { list-style: none; padding: 0; margin: 0; }
#page-container .helpie-faq.accordions .accordion .accordion__item { border: 0; border-top: 2px solid var(--bm-navy); margin: 0; padding: 0; background: none; }
#page-container .helpie-faq.accordions .accordion .accordion__item:last-child { border-bottom: 2px solid var(--bm-navy); }
#page-container .helpie-faq.accordions .accordion .accordion__header { background: none !important; padding: 18px 54px 16px 0; border: 0; }
#page-container .helpie-faq.accordions .accordion .accordion__header .accordion__title { font-family: var(--bm-kop); font-stretch: 82%; font-style: italic; font-weight: 800; font-size: 22px; line-height: 1.1; text-transform: uppercase; color: var(--bm-navy); word-spacing: .06em; }
#page-container .helpie-faq.accordions .accordion .accordion__header:hover .accordion__title { color: var(--bm-bad); }
#page-container .helpie-faq.accordions .accordion .accordion__header::before, #page-container .helpie-faq.accordions .accordion .accordion__header::after { background: var(--bm-bad) !important; right: 8px; }
#page-container .helpie-faq.accordions .accordion .accordion__body { background: none !important; padding: 0 0 22px; border: 0; max-width: 72ch; }
#page-container .helpie-faq.accordions .accordion .accordion__body p { color: var(--bm-inkt); font-size: 18px; }

/* ---------- Voet ---------- */
#main-footer { background: var(--bm-nacht) !important; position: relative; }
#main-footer::before { content: ""; display: block; height: 8px; background: var(--bm-baan); }
#main-footer .container { width: min(1180px, 100% - 44px); max-width: none; }
#footer-widgets { padding: clamp(40px, 6vw, 72px) 0 20px; }
#footer-widgets .footer-widget { margin-bottom: 28px; }
#main-footer .footer-widget h4, #main-footer .footer-widget .title { font-family: var(--bm-kop) !important; font-stretch: 80%; font-style: italic; font-weight: 800 !important; text-transform: uppercase; font-size: 22px !important; color: #fff !important; padding-bottom: 12px; }
#main-footer .footer-widget, #main-footer .footer-widget p, #main-footer .footer-widget li, #main-footer .footer-widget a { color: rgba(255, 255, 255, .86); font-size: 16px; font-weight: 400; line-height: 1.6; }
#main-footer .footer-widget li { padding: 0 !important; margin-bottom: 4px; }
#main-footer .footer-widget li::before { display: none !important; }
#main-footer .footer-widget a:hover { color: var(--bm-plons); }
#footer-bottom { background: rgba(0, 0, 0, .25) !important; }

/* ---------- Balk "Op deze pagina" op lange programmapagina's ---------- */
.bm-spring { position: sticky; top: var(--bm-kophoogte, 120px); z-index: 50; display: flex; align-items: center; gap: 18px; background: #fff; border-bottom: 2px solid var(--bm-navy); padding: 0 max(22px, calc((100% - 1180px) / 2)); margin-top: clamp(20px, 3vw, 40px); }
.bm-spring > span { flex: none; font-size: 14px; font-weight: 500; color: var(--bm-grijs); }
.bm-spring ul { display: flex; gap: 4px; margin: 0; padding: 0; list-style: none; overflow-x: auto; scrollbar-width: none; }
.bm-spring ul::-webkit-scrollbar { display: none; }
.bm-spring li { flex: none; }
#page-container #main-content .bm-spring a { display: block; text-decoration: none !important; padding: 15px 12px 12px; font-family: var(--bm-kop); font-stretch: 84%; font-style: italic; font-weight: 800; font-size: 16px; text-transform: uppercase; color: var(--bm-navy); text-decoration: none; border-bottom: 4px solid transparent; white-space: nowrap; }
#page-container #main-content .bm-spring a:hover { color: var(--bm-bad); }
#page-container #main-content .bm-spring a.actief { color: var(--bm-bad); border-bottom-color: var(--bm-bad); }
/* Hoe ver je op de pagina bent: een baanlijn die meegroeit (alleen in browsers die dat kunnen) */
@supports (animation-timeline: scroll()) {
  .bm-spring::after { content: ""; position: absolute; left: 0; bottom: -6px; height: 4px; width: 100%; background: var(--bm-baan); transform-origin: 0 50%; animation: bm-groei linear both; animation-timeline: scroll(root block); }
  @keyframes bm-groei { from { transform: scaleX(0); } to { transform: scaleX(1); } }
}
#page-container #main-content .bm-spring + .et_pb_section { padding-top: clamp(30px, 4vw, 52px); }

/* ---------- Telefoon en tablet ---------- */
@media (max-width: 980px) {
  body { font-size: 17px; }
  #page-container .bm-info > .et_pb_row { grid-template-columns: minmax(0, 1fr); }
  #page-container .bm-zij { position: static; }
  #page-container #main-content ul.bm-banen > li > a { grid-template-columns: 1fr auto; }
  #page-container #main-content ul.bm-banen span { grid-column: 1; grid-row: 2; }
  #page-container #main-content ul.bm-banen a, #page-container #main-content ul.bm-banen a * { text-decoration: none !important; }
#page-container #main-content ul.bm-banen > li > a::after { grid-row: 1 / span 2; grid-column: 2; }
  .bm-spring > span { display: none; }
  #main-header #logo, #main-header.et-fixed-header #logo { height: 58px !important; top: 50% !important; margin-top: -29px; }
  #main-header .logo_container { width: 90px !important; top: 0 !important; height: 100% !important; }
  #page-container #main-content .et_pb_section.bm-kop.bm-kop-groot { min-height: 0; padding-top: 56px !important; }
  #page-container .bm-kop .et_pb_button_module_wrapper { display: block; margin: 14px 0 0 !important; }
  #page-container .bm-kop .et_pb_button_module_wrapper:first-of-type { margin-top: 24px !important; }
  #main-header .et_mobile_menu { background: var(--bm-navy) !important; border-top: 0; }
  #main-footer .footer-widget h4, #main-footer .footer-widget .title { display: block; }
  #main-footer .footer-widget .fwidget { display: block; float: none; width: 100%; margin-bottom: 8px; }
  #page-container .bm-kop::before { background: linear-gradient(0deg, rgba(1, 0, 81, .92) 0%, rgba(0, 26, 94, .7) 55%, rgba(0, 26, 94, .2) 100%); }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } @view-transition { navigation: none; } * { transition: none !important; } }

/* ---------- Ondertitel in de paginakop: staat in de h1 (goed voor Google), oogt als gewone regel ---------- */
#page-container .bm-kop h1 span { display: block; margin-top: 14px; font-family: var(--bm-tekst); font-stretch: 100%; font-style: normal; font-weight: 500; font-size: clamp(18px, 1.7vw, 23px); line-height: 1.35; letter-spacing: 0; word-spacing: 0; text-transform: none; color: rgba(255, 255, 255, .88); max-width: 46ch; text-wrap: pretty; }
#page-container .bm-kop.bm-kop-groot h1 span { max-width: 30ch; }

/* ---------- "In het kort": de feiten van een programma naast de inleiding ---------- */
#page-container .bm-kort-blok { border-top: 8px solid transparent; border-image: var(--bm-baan) 8; padding-top: 22px !important; }
#page-container .bm-kort-blok h2 { font-size: clamp(22px, 2vw, 28px) !important; padding-bottom: 6px; }
#page-container #main-content dl.bm-kort { margin: 0; display: grid; grid-template-columns: minmax(96px, auto) 1fr; }
#page-container #main-content dl.bm-kort dt, #page-container #main-content dl.bm-kort dd { margin: 0; padding: 11px 0 10px; border-bottom: 1px solid var(--bm-rand); font-size: 16.5px; line-height: 1.4; }
#page-container #main-content dl.bm-kort dt { font-weight: 700; color: var(--bm-navy); padding-right: 20px; }
#page-container #main-content dl.bm-kort dd { color: var(--bm-inkt); }
#page-container #main-content dl.bm-kort dt:last-of-type, #page-container #main-content dl.bm-kort dd:last-of-type { border-bottom: 0; }

/* ---------- Afsluiter onderaan een pagina ---------- */
#page-container #main-content .et_pb_section.bm-slot { background-image: none; padding-block: clamp(44px, 6vw, 80px); }
#page-container .bm-slot .bm-band-kop p { color: #fff; font-size: 19px; max-width: 54ch; padding-top: 10px; }
#page-container .bm-slot .et_pb_button_module_wrapper { display: inline-block; margin: 22px 10px 0 0 !important; }
#page-container .bm-slot .et_pb_button_module_wrapper + .et_pb_button_module_wrapper .et_pb_button { background: #fff !important; color: var(--bm-navy) !important; }
#page-container .bm-slot .et_pb_button_module_wrapper + .et_pb_button_module_wrapper .et_pb_button:hover { background: var(--bm-plons) !important; }

/* ---------- Stappen (alleen waar de volgorde ertoe doet, zoals bij lid worden) ---------- */
#page-container #main-content ol.bm-stappen { list-style: none; counter-reset: stap; padding: 0; margin: 8px 0 0; max-width: 62ch; }
#page-container #main-content ol.bm-stappen > li { counter-increment: stap; position: relative; padding: 18px 0 16px 64px; border-top: 2px solid var(--bm-navy); }
#page-container #main-content ol.bm-stappen > li:last-child { border-bottom: 2px solid var(--bm-navy); }
#page-container #main-content ol.bm-stappen > li::before { content: counter(stap); position: absolute; left: 0; top: 10px; font-family: var(--bm-kop); font-stretch: 72%; font-style: italic; font-weight: 800; font-size: 46px; line-height: 1; color: var(--bm-bad); }
#page-container #main-content ol.bm-stappen > li strong { display: block; font-size: 20px; color: var(--bm-navy); }
#page-container #main-content ol.bm-stappen > li p { padding: 4px 0 0; }

/* ---------- Logo's van erkenningen ---------- */
#page-container .et_pb_image.bm-logo { display: inline-block; width: min(46%, 220px); margin: 18px 4% 0 0 !important; vertical-align: middle; }