/* ============================================================
   Webweek Theme Settings — gegenereerd door de plugin
   Pas dit bestand NIET handmatig aan; gebruik het CMS.
   ============================================================ */

:root {
    --body_background:       #ffffff;
        --bodyFont:    "Inter Tight", sans-serif;    --headingFont: "Archivo", sans-serif;    --body_font_size:        1.6rem;
    --body_line_height:      2.85rem;
    --body_font_weight:      400;
    --body_font_color:       #575e75;
    --heading_color: #0f1a3a;
    --body_link_color:       #f7a82a;
    --body_link_hover_color: #000000;

    --containerWidth:    1480px; --containerWidth_25:500px;
    --containerWidth_50: 900px; --containerWidth_75:1050px;
    --containerWidth_85: 1100px; --containerWidth_125:1550px;

    --primary:#2d4b9c; --primary_textcolor:#c2c5cd;
    --primary_headingcolor:#ffffff; --primary_linkcolor:#f7a82a;
    --secondary:#f4b942; --secondary_textcolor:#0f1a3a;
    --secondary_headingcolor:#0f1a3a; --secondary_linkcolor:#000000;
    --default:#7d8394; --default_textcolor:#ffffff;
    --default_headingcolor:#ffffff; --default_linkcolor:#ffffff;

    --heading_margin:30px; --heading_font_weight:900;
    --heading1_size:11rem; --heading1_line_height:0.85;
            --heading2_size:6.5rem; --heading2_line_height:1.0;
            --heading3_size:4.0rem; --heading3_line_height:1.25;
            --heading4_size:3.0rem; --heading4_line_height:1.25;
            --heading5_size:2.5rem; --heading5_line_height:1.25;
            --heading6_size:2.0rem; --heading6_line_height:1.25;
        
        --button_font_family:var(--bodyFont); --button_radius:30px; --button_font_weight:700; --button_font_size:1.5rem;
    --button_height:60px; --button_padding:0 30px;
    --button_primary:#2d4b9c; --button_primary_text:#ffffff;
    --button_primary_hover:#020f44; --button_primary_hover_text:#ffffff;
        --btn_primary_border:0px solid #2d4b9c; --btn_primary_hover_border:0px solid #2d4b9c;
    --button_secondary:#f4b942; --button_secondary_text:#0f1a3a;
    --button_secondary_hover:#d79121; --button_secondary_hover_text:#ffffff;
        --btn_secondary_border:0px solid #f4b942; --btn_secondary_hover_border:0px solid #f4b942;
    --button_default:#27314e; --button_default_text:#ffffff;
    --button_default_hover:#ffffff; --button_default_hover_text:#7d8394;
        --btn_default_border:1px solid #7d8394; --btn_default_hover_border:1px solid #ffffff;

    --image_border_radius:15px;

    --nav_bg:#ffffff; --nav_height:80px;
    --nav_link:#0f1a3a; --nav_link_hover:#2d4b9c; --nav_link_active:#2d4b9c;
    --nav_font_size:1.5rem; --nav_font_weight:600;
    --nav_link_padding:16px;    --nav_dd_bg:#ffffff; --nav_dd_link:#1a1a1a;
    --nav_dd_link_active:#2271b1;
    --nav_dd_hover_bg:#f5f7fa; --nav_dd_hover_link:#2271b1;
    --nav_dd_radius:6px;

    --topbar_bg:#0f1a3a; --topbar_text:#ffffff;
    --topbar_link:#ffffff; --topbar_link_hover:#cccccc;
    --topbar_height:46px; --topbar_font_size:1.3rem;

    --mob_nav_bg:#f8f9fc;
    --mob_nav_link:#0f1a3a;
    --mob_nav_hover:#0f1a3a;
    --mob_nav_hover_bg:#e8edf7;

    --input_height:50px; --input_font_size:1.5rem;
    --input_font_weight:400; --input_padding_h:15px;
    --input_border_width:1px; --input_border_color:#e0e2e8;
    --input_border_color_focus:#2271b1; --input_border_radius:12px;
    --input_background:#f8f9fc; --input_color:#0f1a3a;
    --input_placeholder_color:#a5aab7; --textarea_height:140px;
}

/* ── Body & links ─────────────────────────────────────────── */
body{background:var(--body_background);font-family:var(--bodyFont);font-size:var(--body_font_size);line-height:var(--body_line_height);font-weight:var(--body_font_weight);color:var(--body_font_color);}
a{color:var(--body_link_color);text-decoration:none;}
a:hover{color:var(--body_link_hover_color);text-decoration:none;}

/* ── Headings ─────────────────────────────────────────────── */
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{font-family:var(--headingFont);font-weight:var(--heading_font_weight);margin-top:0;margin-bottom:var(--heading_margin);color:var(--heading_color);}
h1,.h1{font-size:var(--heading1_size);line-height:var(--heading1_line_height);font-weight:var(--heading1_font_weight,var(--heading_font_weight));letter-spacing:var(--heading1_letter_spacing,-0.02em);text-wrap:balance;}
h2,.h2{font-size:var(--heading2_size);line-height:var(--heading2_line_height);font-weight:var(--heading2_font_weight,var(--heading_font_weight));letter-spacing:var(--heading2_letter_spacing,-0.01em);}
h3,.h3{font-size:var(--heading3_size);line-height:var(--heading3_line_height);font-weight:var(--heading3_font_weight,var(--heading_font_weight));letter-spacing:var(--heading3_letter_spacing,0);}
h4,.h4{font-size:var(--heading4_size);line-height:var(--heading4_line_height);font-weight:var(--heading4_font_weight,var(--heading_font_weight));letter-spacing:var(--heading4_letter_spacing,0);}
h5,.h5{font-size:var(--heading5_size);line-height:var(--heading5_line_height);font-weight:var(--heading5_font_weight,var(--heading_font_weight));letter-spacing:var(--heading5_letter_spacing,0);}
h6,.h6{font-size:var(--heading6_size);line-height:var(--heading6_line_height);font-weight:var(--heading6_font_weight,var(--heading_font_weight));letter-spacing:var(--heading6_letter_spacing,0);}

/* ── Achtergrond-klassen ──────────────────────────────────── */
.background_primary{background:#2d4b9c;color:#c2c5cd;}
.background_primary h1,.background_primary h2,.background_primary h3,.background_primary h4,.background_primary h5,.background_primary h6{color:#ffffff;}
.background_primary a:not(.btn){color:#f7a82a;}
.background_primary a:not(.btn):hover{color:#000000;}
.background_primary .btn.btn-primary{background:#133182;color:#c2c5cd;}
.background_primary .btn.btn-primary:hover{background:#001869;}
.background_secondary{background:#f4b942;color:#0f1a3a;}
.background_secondary h1,.background_secondary h2,.background_secondary h3,.background_secondary h4,.background_secondary h5,.background_secondary h6{color:#0f1a3a;}
.background_secondary a:not(.btn){color:#000000;}
.background_secondary a:not(.btn):hover{color:#000000;}
.background_secondary .btn.btn-secondary{background:#da9f28;color:#0f1a3a;}
.background_secondary .btn.btn-secondary:hover{background:#c1860f;}
.background_default{background:#7d8394;color:#ffffff;}
.background_default h1,.background_default h2,.background_default h3,.background_default h4,.background_default h5,.background_default h6{color:#ffffff;}
.background_default a:not(.btn){color:#ffffff;}
.background_default a:not(.btn):hover{color:#000000;}
.background_default .btn.btn-default{background:#63697a;color:#ffffff;}
.background_default .btn.btn-default:hover{background:#4a5061;}
.background_white{background:#fff;color:#555c74;}
.background_white h1,.background_white h2,.background_white h3,.background_white h4,.background_white h5,.background_white h6{color:#0f1a3a;}
.background_white a:not(.btn){color:#2d4b9c;}
.background_white a:not(.btn):hover{color:#f7a82a;}
.background_black{background:#000;color:#ffffff;}
.background_black h1,.background_black h2,.background_black h3,.background_black h4,.background_black h5,.background_black h6{color:#ffffff;}
.background_black a:not(.btn){color:#ffffff;}
.background_black a:not(.btn):hover{color:#cccccc;}
.background_extra_0{background:#0f1a3a;color:#c2c5cd;}
.background_extra_0 h1,.background_extra_0 h2,.background_extra_0 h3,.background_extra_0 h4,.background_extra_0 h5,.background_extra_0 h6{color:#ffffff!important;}
.background_extra_0 a:not(.btn){color:#ffffff;}
.background_extra_0 a:not(.btn):hover{color:#f4b942;}
.btn.btn-extra-0{background:#0f1a3a;color:#c2c5cd;border-radius:var(--button_radius);font-weight:var(--button_font_weight);}
.btn.btn-extra-0:hover{background:#000020;}
.background_extra_1{background:#f8f9fc;color:#555c74;}
.background_extra_1 h1,.background_extra_1 h2,.background_extra_1 h3,.background_extra_1 h4,.background_extra_1 h5,.background_extra_1 h6{color:#0f1a3a!important;}
.background_extra_1 a:not(.btn){color:#2d4b9c;}
.background_extra_1 a:not(.btn):hover{color:#f7a82a;}
.btn.btn-extra-1{background:#f8f9fc;color:#555c74;border-radius:var(--button_radius);font-weight:var(--button_font_weight);}
.btn.btn-extra-1:hover{background:#dedfe2;}

/* ── Buttons ──────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;padding:var(--button_padding);height:var(--button_height);border-radius:var(--button_radius);font-family:var(--button_font_family,var(--bodyFont));font-weight:var(--button_font_weight);font-size:var(--button_font_size);text-decoration:none;cursor:pointer;transition:background 0.2s,color 0.2s,border-color 0.2s;line-height:1;box-sizing:border-box;}
.btn.btn-primary{background:var(--button_primary);color:var(--button_primary_text);border:var(--btn_primary_border);}
.btn.btn-secondary{background:var(--button_secondary);color:var(--button_secondary_text);border:var(--btn_secondary_border);}
.btn.btn-default{background:var(--button_default);color:var(--button_default_text);border:var(--btn_default_border);}
.btn.btn-white{background:#fff;color:#000;border:0;}.btn.btn-black{background:#000;color:#fff;border:0;}
.btn.btn-primary:hover{background:var(--button_primary_hover);color:var(--button_primary_hover_text);border:var(--btn_primary_hover_border);}
.btn.btn-secondary:hover{background:var(--button_secondary_hover);color:var(--button_secondary_hover_text);border:var(--btn_secondary_hover_border);}
.btn.btn-default:hover{background:var(--button_default_hover);color:var(--button_default_hover_text);border:var(--btn_default_hover_border);}
.btn.no_after::after{display:none !important;}

/* ── Topbar ───────────────────────────────────────────────── */
.topbar{background:var(--topbar_bg);color:var(--topbar_text);min-height:var(--topbar_height);font-size:var(--topbar_font_size);display:flex;align-items:center;}
.topbar a{color:var(--topbar_link);text-decoration:none;transition:color 0.2s;}
.topbar a:hover{color:var(--topbar_link_hover);}
/* Topbar page builder altijd 100% breed */
.topbar #mpb-builder-frontend,.topbar .mpb-builder-frontend{width:100% !important;max-width:100% !important;}

/* Mobiel menu — bottom content fixed onderaan */
.mobile_navigation .ww-mob-bottom{
    flex-shrink:0;
    padding:14px 16px;
    border-top:1px solid #d9dadd;
    background:#ebecef;
    color:var(--mob-link);
}

/* ── Header ───────────────────────────────────────────────── */
header.header{position:relative;z-index:100;width:100%;}
header.header.is-sticky{position:fixed;top:0;left:0;right:0;z-index:999;transition:transform 0.3s cubic-bezier(0.4,0,0.2,1);will-change:transform;}
/* Verborgen staat (mode: verschijnen bij omhoog scrollen) */
header.header.is-sticky.ww-nav-hidden{transform:translateY(-100%);}

/* ── Navigation ───────────────────────────────────────────── */
.navigation{background:var(--nav_bg);height:var(--nav_height);display:flex;align-items:center;transition:background 0.35s ease,height 0.35s ease,box-shadow 0.35s ease;width:100%;position:relative;will-change:height,background;}
.navigation .container-fluid,.navigation .container{display:flex;align-items:center;width:100%;}

/* Brand / logo */
.navigation .brand,
.navigation .brand.d-inline-block{
    flex-shrink:0;margin-right:20px;
    display:flex !important;align-items:center;
}
.navigation .brand a{display:flex;align-items:center;text-decoration:none;}
.navigation .brand img{display:block;height:auto;max-width:none;}

/* Nav-wrapper — overschrijft Bootstrap d-inline-block
   KEY FIX: de inner .d-none.d-xl-inline-block wrapper moet ook flex + justify-content krijgen */
.navigation .the_nav,
.navigation .the_nav.d-inline-block{
    flex:1;
    display:flex !important;
    align-items:center;
    justify-content:center;
    font-family:var(--bodyFont);
}
/* Overschrijf de Bootstrap .d-none.d-xl-inline-block inner wrapper */
.navigation .the_nav > div,
.navigation .the_nav > .d-none,
.navigation .the_nav > .d-xl-inline-block,
.navigation .the_nav > [class*="d-none"],
.navigation .the_nav > [class*="d-xl"]{
    display:flex !important;
    flex:1;
    width:100%;
    justify-content:center;
    align-items:center;
}
.navigation .the_nav ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;}
.navigation .the_nav ul li{position:relative;}
.navigation .the_nav ul li a:not(.btn) {
    color:var(--nav_link);
    font-size:var(--nav_font_size);
    font-weight:var(--nav_font_weight);
    padding:0 var(--nav_link_padding);
    display:flex;align-items:center;gap:5px;
    text-decoration:none;
    white-space:nowrap;
    height:var(--nav_height);
    line-height:1;
    transition:color 0.2s;
    position:relative;
    z-index:1;
}
/* Megamenu links binnen nav: WINNEN via hogere specificiteit (.megamenu-dropdown ervoor) */
.navigation .the_nav .megamenu-dropdown li a:not(.btn),
.navigation .the_nav .megamenu-dropdown a.megamenu-col-title,
.navigation .the_nav .megamenu-dropdown a.nav-item-heading{
    height:auto;
    line-height:1.4;
    white-space:normal;
    padding:0;
    display:block;
    font-size:initial;
}
.navigation .the_nav .megamenu-dropdown .megamenu-grid li a,
.navigation .the_nav .megamenu-dropdown .megamenu-sub-list li a{
    color:#c7cbd4;
}
.navigation .the_nav .megamenu-dropdown .megamenu-grid li a:hover,
.navigation .the_nav .megamenu-dropdown .megamenu-sub-list li a:hover{
    color:#ffffff;
}
.navigation .the_nav .megamenu-dropdown a.megamenu-col-title,
.navigation .the_nav .megamenu-dropdown .nav-item-heading{
    color:#f4b942;
    font-weight:600;
}
.navigation .the_nav .megamenu-dropdown a.megamenu-col-title:hover,
.navigation .the_nav .megamenu-dropdown a.nav-item-heading:hover{
    color:#f4b942;
}
.navigation .the_nav ul li a:not(.btn):not(.megamenu-col-title):not(.nav-item-heading):not(.megamenu-sub-list a):hover{color:var(--nav_link_hover);}

/* Actieve menu-item kleur */
.navigation .the_nav ul li.current-menu-item>a,
.navigation .the_nav ul li.current_page_item>a,
.navigation .the_nav ul li.current-menu-ancestor>a,
.navigation .the_nav ul li.current-menu-parent>a{color:var(--nav_link_active);}

/* ── Dropdown arrow ───────────────────────────────────────── */
.navigation .the_nav ul li.menu-item-has-children>a>.ww-dd-arrow{
    display:inline-flex;align-items:center;justify-content:center;
    width:12px;height:12px;margin-left:4px;flex-shrink:0;
    position:relative;
    transition:transform 0.25s ease;
}
.navigation .the_nav ul li.menu-item-has-children>a>.ww-dd-arrow::before,
.navigation .the_nav ul li.menu-item-has-children>a>.ww-dd-arrow::after{
    content:'';position:absolute;bottom:2px;
    width:7px;height:2px;background:currentColor;border-radius:1px;
    transition:transform 0.25s ease,bottom 0.25s ease;
}
.navigation .the_nav ul li.menu-item-has-children>a>.ww-dd-arrow::before{left:0;transform:rotate(45deg);transform-origin:right center;}
.navigation .the_nav ul li.menu-item-has-children>a>.ww-dd-arrow::after{right:0;transform:rotate(-45deg);transform-origin:left center;}

/* ── Dropdown menu ────────────────────────────────────────── */
.navigation .the_nav ul li ul.sub-menu{
    display:block;
    visibility:hidden;
    position:absolute;top:100%;left:0;
    min-width:220px;        background:var(--nav_dd_bg);
    border-radius:var(--nav_dd_radius);
    padding:6px 0;
    z-index:9999;
    box-shadow:0 8px 32px rgba(0,0,0,0.13);    opacity:0;
    transform:translateY(-8px);
    transition:opacity 0.2s ease, transform 0.2s ease, visibility 0s linear 0.2s;
    pointer-events:none;
}
/* Brug: voorkomt dat dropdown sluit als muis tussen link en menu beweegt */
.navigation .the_nav ul li.menu-item-has-children::after{
    content:'';position:absolute;
    top:calc(100% - 6px);left:0;right:0;height:10px;
    z-index:9998;
}
.navigation .the_nav ul li ul.sub-menu li a{
    height:auto !important;
    padding:11px 20px !important;
    color:var(--nav_dd_link);
    font-size:calc(var(--nav_font_size) * 0.9);
    white-space:nowrap;
    display:block !important;
}
.navigation .the_nav ul li ul.sub-menu li a:hover{background:var(--nav_dd_hover_bg);color:var(--nav_dd_hover_link);}
.navigation .the_nav ul li ul.sub-menu li.current-menu-item>a,
.navigation .the_nav ul li ul.sub-menu li.current_page_item>a{color:var(--nav_dd_link_active);}
.navigation .the_nav ul li ul.sub-menu li{position:relative;}
.navigation .the_nav ul li ul.sub-menu li ul.sub-menu{top:0;left:100%;}

/* Hover trigger — toon met animatie */
.navigation .the_nav ul li.menu-item-has-children:hover>ul.sub-menu{
    visibility:visible;
    opacity:1;
    transform:translateY(0);
    transition:opacity 0.2s ease, transform 0.2s ease, visibility 0s linear 0s;
    pointer-events:auto;
}

/* Mobiele breakpoint — hamburger zichtbaarheid & nav collapse */
@media(min-width:1200px){
    .navbar-toggler.collapse_mobile_menu{display:none !important;}
}
@media(max-width:1199px){
    .navigation .the_nav > .d-none,
    .navigation .the_nav > [class*="d-xl"]{display:none !important;}
}

/* ── Megamenu ─────────────────────────────────────────────── */
/* li met class 'megamenu' → position:static zodat dropdown nav-breed is */
li.megamenu{position:static !important;}
.megamenu-dropdown{
    position:absolute;
    top:100%;
    left:0;
    right:0;
    width:100%;
    background:#0f1a3a;
    z-index:9999;
    display:none;
    opacity:0;
    transform:translateY(30px);
    pointer-events:none;
    transition:opacity 0.25s ease, transform 0.25s ease;
    box-shadow:0 8px 32px rgba(0,0,0,0.13);    border-top:2px solid #ffffff;
}
/* Overlay — z-index LAGER dan dropdown (9999), JS past z-index aan t.o.v. header */
.megamenu-overlay{
    position:fixed;
    inset:0;
    z-index:9998;
    display:none;
    background:#000000;
    opacity:0.4;
    pointer-events:none;
}
/* .active class: fade in van onderaf */
.megamenu-dropdown.active{
    display:block;
    animation:ww-mega-in 0.25s ease forwards;
    pointer-events:auto;
}
@keyframes ww-mega-in{
    from{opacity:0;transform:translateY(30px);}
    to{opacity:1;transform:translateY(0);}
}
/* Sluitanimatie: .closing houdt dropdown display:block terwijl die wegfadet */
.megamenu-dropdown.closing{
    display:block;
    pointer-events:none;
    animation:ww-mega-out 0.22s ease forwards;
}
@keyframes ww-mega-out{
    from{opacity:1;transform:translateY(0);}
    to{opacity:0;transform:translateY(20px);}
}
.megamenu-overlay{transition:opacity 0.25s ease;}
.megamenu-overlay.active{
    display:block;
    pointer-events:auto;
    animation:ww-overlay-in 0.25s ease forwards;
}
@keyframes ww-overlay-in{
    from{opacity:0;}
    to{opacity:0.4;}
}
/* Grid */
.megamenu-dropdown > .container,
.megamenu-dropdown > .container-fluid{padding-top:28px;padding-bottom:28px;}
.megamenu-grid{display:flex;gap:40px;align-items:flex-start;flex-wrap:wrap;width:100%;}
.megamenu-col{flex:1 1 0;min-width:100px;display:flex;flex-direction:column;}
/* Sub-list vult de resterende hoogte */
.megamenu-sub-list{flex:1;}
/* img-stretch: ALLEEN bij 100% hoogte instelling — vult de kolomhoogte */
.nav-item-img.img-stretch{
    flex:1;
    align-self:stretch;
    min-height:60px;
    object-fit:cover;
}
.megamenu-col > a.megamenu-col-title:has(.img-stretch){
    flex:1;
    display:flex;
    flex-direction:column;
}
/* Kolom-titel */
.megamenu-col > a,
.megamenu-col > a.megamenu-col-title{
    display:block;width:100%;height:auto;
    line-height:1.4;padding:0 0 8px;margin:0 0 10px;
    font-size:1.5rem;font-weight:600;
    color:#f4b942;
    text-decoration:none;background:none;transition:color 0.2s;
    white-space:normal;
}
/* Koptekst classes op col-title a */
.megamenu-col > a.h1,.megamenu-col > a.megamenu-col-title.h1{font-size:var(--heading1_size);margin-bottom:30px;}
.megamenu-col > a.h2,.megamenu-col > a.megamenu-col-title.h2{font-size:var(--heading2_size);margin-bottom:30px;}
.megamenu-col > a.h3,.megamenu-col > a.megamenu-col-title.h3{font-size:var(--heading3_size);margin-bottom:30px;}
.megamenu-col > a.h4,.megamenu-col > a.megamenu-col-title.h4{font-size:var(--heading4_size);margin-bottom:30px;}
.megamenu-col > a.h5,.megamenu-col > a.megamenu-col-title.h5{font-size:var(--heading5_size);margin-bottom:30px;}
.megamenu-col > a.h6,.megamenu-col > a.megamenu-col-title.h6{font-size:var(--heading6_size);margin-bottom:30px;}
.megamenu-col > a.megamenu-col-title:hover{color:#f4b942;}
/* Kopteksten (Type=Koptekst) in megamenu krijgen ook de titelkleur */
.megamenu-grid .nav-item-heading,.megamenu-sub-list .nav-item-heading{color:#f4b942;}
.megamenu-grid a.nav-item-heading:hover,.megamenu-sub-list a.nav-item-heading:hover{color:#f4b942;}
/* Alle li's en a's in de grid — display:block, normale hoogte, geen nav-styles */
.megamenu-grid li,.megamenu-sub-list li{
    display:block;width:100%;height:auto;
    line-height:1.4;margin:0;padding:0;
    border:none;background:none;float:none;
}
.megamenu-sub-list{list-style:none;margin:0;padding:0;}
.megamenu-grid li a,.megamenu-sub-list li a{
    display:block;width:100%;height:auto;
    line-height:1.4;padding:5px 0;
    color:#c7cbd4;font-size:calc(1.5rem * 0.9);
    font-weight:normal;text-decoration:none;
    background:none;border:none;transition:color 0.25s ease, padding-left 0.25s ease, background 0.25s ease;
    white-space:normal;
}
.megamenu-grid li a:hover,.megamenu-sub-list li a:hover{
    color:#ffffff;padding-left:5px;
}
/* Koptekst li in megamenu: margin + font-size via thema-variabelen */
.megamenu-grid li.h2 a, .megamenu-sub-list li.h2 a{ font-size:var(--heading2_size, 2rem); font-weight:600; }
.megamenu-grid li.h3 a, .megamenu-sub-list li.h3 a{ font-size:var(--heading3_size, 1.75rem); font-weight:600; }
.megamenu-grid li.h4 a, .megamenu-sub-list li.h4 a{ font-size:var(--heading4_size, 1.5rem); font-weight:600; }
.megamenu-grid li.h5 a, .megamenu-sub-list li.h5 a{ font-size:var(--heading5_size, 1.25rem); font-weight:600; }
.megamenu-grid li.h6 a, .megamenu-sub-list li.h6 a{ font-size:var(--heading6_size, 1.1rem); font-weight:600; }
/* Fallback: heading class direct op de <a> */
.megamenu-grid li a.h2,.megamenu-sub-list li a.h2{ font-size:var(--heading2_size, 2rem); font-weight:600; }
.megamenu-grid li a.h3,.megamenu-sub-list li a.h3{ font-size:var(--heading3_size, 1.75rem); font-weight:600; }
.megamenu-grid li a.h4,.megamenu-sub-list li a.h4{ font-size:var(--heading4_size, 1.5rem); font-weight:600; }
.megamenu-grid li a.h5,.megamenu-sub-list li a.h5{ font-size:var(--heading5_size, 1.25rem); font-weight:600; }
.megamenu-grid li a.h6,.megamenu-sub-list li a.h6{ font-size:var(--heading6_size, 1.1rem); font-weight:600; }
.megamenu-grid li.h2,.megamenu-grid li.h3,.megamenu-grid li.h4,
.megamenu-grid li.h5,.megamenu-grid li.h6,
.megamenu-sub-list li.h2,.megamenu-sub-list li.h3,.megamenu-sub-list li.h4,
.megamenu-sub-list li.h5,.megamenu-sub-list li.h6{margin:0 0 30px;}
/* Verbergen op mobiel */
@media(max-width:1199px){
    .megamenu-dropdown{display:none;}
}
/* ── Nav extra content ────────────────────────────────────── */
/* Responsief verbergen van losse nav-items via CSS custom property */
@media (max-width: 9999px) {
    .ww-nav-item--bp { display: inline-flex; }
}
/* Elk item met --ww-item-bp verbergt onder dat breekpunt */
.ww-nav-item--bp[style*="--ww-item-bp"] {
    display: inline-flex;
}
/* We use a JS approach for per-item breakpoints — see frontend script */

/* Extra menu in nav-extra — zelfde stijl als .the_nav */
.ww-nav-extra .ww-extra-menu{
    display:flex;
    align-items:center;
    list-style:none;
    margin:0;
    padding:0;
    gap:0;
}
.ww-nav-extra .ww-extra-menu li{
    display:flex;
    align-items:center;
}
.ww-nav-extra .ww-extra-menu li a{
    display:flex;
    align-items:center;
    height:var(--nav_height, 80px);
    padding:0 var(--nav_link_padding, 16px);
    color:var(--nav_link, #1a1a1a);
    font-size:calc(var(--body_font_size) * 0.95);
    font-weight:500;
    text-decoration:none;
    transition:color 0.2s ease;
    white-space:nowrap;
}
.ww-nav-extra .ww-extra-menu li a:hover{
    color:var(--nav_link_hover, #2271b1);
}
.ww-nav-extra .ww-extra-menu li.current-menu-item > a,
.ww-nav-extra .ww-extra-menu li.current_page_item > a{
    color:var(--nav_link_active, var(--nav_link_hover));
}

.ww-nav-extra{
    display:flex;
    align-items:center;
    font-family:var(--bodyFont);
    font-size:var(--nav_font_size);
    flex-shrink:0;
    }
.ww-nav-extra a{color:var(--nav_link);text-decoration:none;transition:color 0.25s;}
.ww-nav-extra a:hover{color:var(--nav_link_hover);}
/* Geen margins op content in de nav — anders klopt de verticale uitlijning niet */
.ww-nav-extra p,
.ww-nav-extra h1,.ww-nav-extra h2,.ww-nav-extra h3,
.ww-nav-extra h4,.ww-nav-extra h5,.ww-nav-extra h6,
.ww-nav-extra ul,.ww-nav-extra ol,.ww-nav-extra li,
.ww-nav-extra div,.ww-nav-extra span{
    margin-bottom:0;
    margin-top:0;
}
/* Per-item zichtbaarheid wordt geregeld via JS (data-hide-bp / data-show-from).
   Geen globale media query op .ww-nav-extra — dat zou alle items tegelijk verbergen. */

/* ── Responsive nav hoogte ────────────────────────────────── */
@media(max-width:991px){
    :root{--nav_height:80px;}
}
@media(max-width:1199px){
    :root{--nav_height:65px;}
}

/* ── Padding breakpoints navigatielinks ───────────────────── */

/* ── Sticky nav ───────────────────────────────────────────── */

/* ── Logo breedte ─────────────────────────────────────────── */
.navigation .brand img{width:200px;height:auto;}@media(max-width:768px){.navigation .brand img{width:170px;height:auto;}}

/* ── Kleur utility classes ─────────────────────────────────── */
/* Tekstkleur */
.color-primary   { color: var(--primary); }
.color-secondary { color: var(--secondary); }
.color-default   { color: var(--default); }
/* Achtergrondkleur */
.bg-primary   { background: var(--primary);   color: var(--primary_textcolor); }
.bg-secondary { background: var(--secondary); color: var(--secondary_textcolor); }
.bg-default   { background: var(--default);   color: var(--default_textcolor); }
.color-extra-1   { color: #0f1a3a; }
.bg-extra-1      { background: #0f1a3a; color: #c2c5cd; }
.color-extra-2   { color: #f8f9fc; }
.bg-extra-2      { background: #f8f9fc; color: #555c74; }


/* ── Openingstijden live status widget ────────────────────── */
.ot-live-wrap{display:inline-flex;flex-direction:column;gap:3px;}
.ot-status{display:flex;align-items:center;gap:7px;font-weight:600;}
.ot-next{font-size:0.9em;opacity:0.85;padding-left:19px;}
.ot-dot{display:inline-block;width:10px;height:10px;border-radius:50%;flex-shrink:0;}
.ot-dot.open{background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,0.2);}
.ot-dot.closed{background:#ef4444;box-shadow:0 0 0 3px rgba(239,68,68,0.2);}

/* ── Navigatie custom CSS ─────────────────────────────────── */

/* ── Tekst-selectie ───────────────────────────────────────── */
::selection{background:#2d4b9c;color:#f4b942;}
::-moz-selection{background:#2d4b9c;color:#f4b942;}

/* ── Socials ──────────────────────────────────────────────── */
.socials{display:flex;flex-wrap:wrap;gap:11px;}
.socials.socials-vertical{flex-direction:column;align-items:flex-start;}
.socials.socials-horizontal{flex-direction:row;align-items:center;}
.socials a.social-item{
    display:inline-flex;align-items:center;
    text-decoration:none;
    transition:background 0.2s,color 0.2s;
}
/* Icoon-cirkel */
.socials a.social-item .social-icon{
    display:inline-flex;align-items:center;justify-content:center;
    background:var(--primary);
    width:55px;height:55px;
    border-radius:50px;
    flex-shrink:0;
    transition:background 0.2s;
}
.socials a.social-item .social-icon svg{width:25px;height:25px;display:block;}
.socials a.social-item .social-icon svg path{fill:#ffffff;}
.socials a.social-item .social-icon img{width:25px;height:25px;display:block;}
.socials a.social-item:hover .social-icon,
.socials a.social-item:focus .social-icon{background:var(--default);}
.socials a.social-item:hover .social-icon svg path,
.socials a.social-item:focus .social-icon svg path{fill:#ffffff;}
/* Tekst naast icoon (aantallen + label) */
.socials.socials-with-numbers a.social-item{gap:10px;}
.socials .social-meta{display:flex;flex-direction:column;line-height:1.25;}
.socials .social-number{font-weight:600;font-size:0.95em;color:inherit;}
.socials .social-word{font-weight:400;font-size:0.82em;opacity:0.8;color:inherit;}
.socials .social-label{font-size:0.75em;padding:0 8px;color:#ffffff;}
@media(max-width:768px){
    .socials a.social-item .social-icon svg,
    .socials a.social-item .social-icon img{width:21px;height:21px;}
}

/* ── Hamburger toggle ─────────────────────────────────────── */
.navbar-toggler.collapse_mobile_menu{
    cursor:pointer;
    margin-left:15px;
    width:46px;
    height:46px;
    border-radius:30px;
    background:#f7a82a;
    display:flex;align-items:center;justify-content:center;
    border:none;padding:0;flex-shrink:0;
    transition:opacity 0.2s;
    position:relative;
}
.navbar-toggler.collapse_mobile_menu:hover{opacity:0.85;}
.navbar-toggler.collapse_mobile_menu .inner{
    width:28px;
    display:flex;flex-direction:column;gap:5px;
}
/* 3 streepjes — 4e span verbergen */
.navbar-toggler.collapse_mobile_menu .inner span:nth-child(4){display:none;}
.navbar-toggler.collapse_mobile_menu .inner span{
    display:block;height:2px;
    background:#0f1a3a;
    border-radius:2px;
    transition:transform 0.3s ease, opacity 0.3s ease;
    transform-origin:center;
}
/* Close animatie (X) als .is-active */
.navbar-toggler.collapse_mobile_menu.is-active .inner span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.navbar-toggler.collapse_mobile_menu.is-active .inner span:nth-child(2){opacity:0;transform:scaleX(0);}
.navbar-toggler.collapse_mobile_menu.is-active .inner span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ── Mobiel menu overlay ──────────────────────────────────── */
.ww-mob-overlay{
    display:none;
    position:fixed;inset:0;
    background:#000000;
    opacity:0;z-index:99998;
    transition:opacity 0.32s ease;
}
.ww-mob-overlay.active{display:block;opacity:0.6;}

/* ── Mobiel menu (.mobile_navigation) — volledige structuur ─ */
.mobile_navigation{
    opacity:0;
    pointer-events:none;
    z-index:99999;
    position:fixed;
    top:0;bottom:0;
    right:0;left:auto;    width:85%;
    max-width:520px;
    transform:translateX(100%);
    transition:transform 0.32s cubic-bezier(0.4,0,0.2,1), opacity 0.32s ease;
    --mob-bg:#f8f9fc;
    --mob-link:#0f1a3a;
    --mob-hover:#0f1a3a;
    --mob-hover-bg:#e8edf7;
}
.mobile_navigation.active{
    opacity:1;
    pointer-events:auto;
    transform:translateX(0);
}
/* Nav wrap */
.mobile_navigation .nav-wrap{
    font-family:inherit;
    background:var(--mob-bg);
    overflow:hidden;
    position:relative;
    height:100%;
    display:flex;
    flex-direction:column;
}
.mobile_navigation .nav-viewport{overflow:hidden;position:relative;flex:1;}
.mobile_navigation .nav-track{display:flex;transition:transform 0.32s cubic-bezier(0.4,0,0.2,1);will-change:transform;height:100%;width:100%;max-width:100%;}
.mobile_navigation .nav-panel{width:100%;min-width:100%;max-width:100%;flex-shrink:0;overflow-y:auto;overflow-x:hidden;box-sizing:border-box;}
/* Header balk */
.mobile_navigation .nav-header{
    display:flex;align-items:center;gap:10px;
    padding:14px 16px;
    border-bottom:1px solid #e5e5e5;
    background:#ffffff;
    min-height:52px;
    flex-shrink:0;
}
.mobile_navigation .nav-back{
    display:flex;align-items:center;gap:6px;
    background:none;border:none;cursor:pointer;
    font-size:15px;font-weight:500;font-family:inherit;
    color:var(--mob-link);
    padding:4px 6px 4px 2px;border-radius:8px;
    flex-shrink:0;
    transition:color 0.15s,background 0.15s;
}
.mobile_navigation .nav-back:hover{color:var(--mob-hover);background:var(--mob-hover-bg);}
.mobile_navigation .nav-back svg{flex-shrink:0;}
.mobile_navigation .nav-title{font-size:15px;font-weight:500;color:#2d4b9c;flex:1;}
/* Sluitknop — via margin-left:auto altijd rechts in de flex-row, nooit overlappend */
.mobile_navigation .ww-mob-close{
    margin-left:auto;
    flex-shrink:0;
    background:none;border:none;cursor:pointer;
    width:32px;height:32px;
    display:flex;align-items:center;justify-content:center;
    border-radius:50%;
    color:#0f1a3a;
    transition:background 0.15s;
}
.mobile_navigation .ww-mob-close:hover{background:rgba(0,0,0,0.1);}
/* Bottom content blok */
.mobile_navigation .ww-mob-bottom{
    flex-shrink:0;
    padding:14px 16px;
    border-top:1px solid #d9dadd;
    background:#ebecef;
    color:var(--mob-link);
}
.mobile_navigation .ww-mob-bottom a{color:var(--mob-hover);}
/* Nav lijst */
.mobile_navigation .nav-list{list-style:none;margin:0;padding:8px 0;}
.mobile_navigation .nav-list .nav-item{
    display:flex;align-items:center;justify-content:space-between;
    padding:0 16px;min-height:48px;
    border-bottom:1px solid #dedfe2;
    transition:background 0.12s;
}
.mobile_navigation .nav-list .nav-item > span{min-width:0;flex:1 1 auto;}
.mobile_navigation .nav-list .nav-item:last-child{border-bottom:none;}
.mobile_navigation .nav-list .nav-item:hover{background:var(--mob-hover-bg);}
.mobile_navigation .nav-list .nav-item .item-label{
    font-size:15px;color:var(--mob-link);
    text-decoration:none;flex:1 1 auto;min-width:0;padding:12px 0;
    overflow-wrap:break-word;word-break:break-word;white-space:normal;line-height:1.35;
    overflow:visible;text-overflow:clip;
}
.mobile_navigation .nav-list .nav-item:hover .item-label{color:var(--mob-hover);}
.mobile_navigation .nav-list .nav-item .item-chevron{
    color:var(--mob-link);
    display:flex;align-items:center;flex-shrink:0;cursor:pointer;margin-left:8px;
    align-self:center;padding:12px 0;
}

/* ── Vaste WhatsApp knop ──────────────────────────────────── */

/* ── Containers ───────────────────────────────────────────── */
.container,.container-default{max-width:var(--containerWidth);margin-right:auto;margin-left:auto;padding-right:var(--bs-gutter-x,.75rem);padding-left:var(--bs-gutter-x,.75rem);}
.container-25{max-width:var(--containerWidth_25);margin:0 auto;}
.container-50{max-width:var(--containerWidth_50);margin:0 auto;}
.container-75{max-width:var(--containerWidth_75);margin:0 auto;}
.container-85{max-width:var(--containerWidth_85);margin:0 auto;}
.container-125{max-width:var(--containerWidth_125);margin:0 auto;}
.container-fluid{padding-left:50px;padding-right:50px;width:100%;}
.container,.container-right,.container-fluid,.container-full,.container-fullwidth{.container_inner{width:100%;}}
.container-left,.container-right{padding-left:0;padding-right:0;}
@media(min-width:576px){.container-left{margin-left:0;margin-right:calc(50vw - 270px);}.container-right{margin-right:0;margin-left:calc(50vw - 270px);}}
@media(min-width:768px){.container-left{margin-left:0;margin-right:calc(50vw - 360px);}.container-right{margin-right:0;margin-left:calc(50vw - 360px);}}
@media(min-width:992px){.container-left{margin-left:0;margin-right:calc(50vw - 480px);}.container-right{margin-right:0;margin-left:calc(50vw - 480px);}}
@media(min-width:1200px){.container-left{margin-left:0;margin-right:calc(50vw - (var(--containerWidth) / 2));}.container-right{margin-right:0;margin-left:calc(50vw - (var(--containerWidth) / 2));}}
@media(max-width:1350px){.container-fluid{padding-left:30px;padding-right:30px;}}
@media(max-width:1300px){:root{--containerWidth:1175px;--containerWidth_125:1200px;}}
@media(max-width:1199px){:root{--containerWidth:1100px;--containerWidth_125:1125px;}}
@media(max-width:1100px){.container,.container-default,.container-25,.container-50,.container-75,.container-85,.container-125,.container-fluid{width:100%;padding-left:55px;padding-right:55px;box-sizing:border-box;}}
@media(max-width:991px){.container,.container-default,.container-25,.container-50,.container-75,.container-85,.container-125,.container-fluid{width:100%;padding-left:45px;padding-right:45px;box-sizing:border-box;}}
@media(max-width:768px){
    .container,.container-default,.container-25,.container-50,.container-75,.container-85,.container-125,.container-fluid,.container-left,.container-right{width:100%;max-width:100%;padding-left:25px;padding-right:25px;box-sizing:border-box;}
    .container-left,.container-right{padding-left:25px;max-width:100%;padding-right:0!important;}
}

/* ── Inputs & formulieren ─────────────────────────────────── */
input[type="text"],input[type="email"],input[type="tel"],input[type="url"],
input[type="number"],input[type="password"],input[type="search"],
input[type="date"],select{
    height:var(--input_height);
    font-size:var(--input_font_size);
    font-weight:var(--input_font_weight);
    padding:0 var(--input_padding_h);
    border:var(--input_border_width) solid var(--input_border_color);
    border-radius:var(--input_border_radius);
    background:var(--input_background);
    color:var(--input_color);
    width:100%;box-sizing:border-box;
    transition:border-color 0.15s,box-shadow 0.15s;
}
textarea{
    height:var(--textarea_height);
    font-family:var(--bodyFont, inherit) !important;
    font-size:var(--input_font_size);
    font-weight:var(--input_font_weight);
    padding:14px var(--input_padding_h);
    border:var(--input_border_width) solid var(--input_border_color);
    border-radius:var(--input_border_radius);
    background:var(--input_background);
    color:var(--input_color);
    width:100%;box-sizing:border-box;resize:vertical;
    transition:border-color 0.15s,box-shadow 0.15s;
}
input:focus,select:focus,textarea:focus{
    border-color:var(--input_border_color_focus);
    outline:none;
    box-shadow:0 0 0 3px #bbffff40;
}
input::placeholder,textarea::placeholder{color:var(--input_placeholder_color);}

/* img border-radius verwijderd — gebruik eigen CSS */

/* ── Responsive — tablet ──────────────────────────────────── */
@media(max-width:991px){
    :root{
        --body_font_size:1.8rem;
        --body_line_height:3.2rem;
        --heading_margin:30px;--heading_font_weight:900;
        --heading1_size:7rem;--heading1_line_height:1.0;
                        --heading2_size:3.5rem;--heading2_line_height:1.0;
                        --heading3_size:2.5rem;--heading3_line_height:1.25;
                        --heading4_size:2.5rem;--heading4_line_height:1.25;
                        --heading5_size:2.0rem;--heading5_line_height:1.25;
                        --heading6_size:1.8rem;--heading6_line_height:1.25;
                    }
}

/* ── Responsive — mobiel ──────────────────────────────────── */
@media(max-width:768px){
    :root{
        --body_font_size:1.6rem;
        --body_line_height:2.6rem;
        --heading_margin:25px;--heading_font_weight:900;
        --heading1_size:3.4rem;--heading1_line_height:1.0;
                        --heading2_size:3.0rem;--heading2_line_height:1.0;
                        --heading3_size:2.4rem;--heading3_line_height:1.25;
                        --heading4_size:2.0rem;--heading4_line_height:1.25;
                        --heading5_size:1.8rem;--heading5_line_height:1.25;
                        --heading6_size:1.6rem;--heading6_line_height:1.25;
                    }
    .btn{height:50px;padding:0 20px;font-size:1.5rem;}
    input[type="text"],input[type="email"],input[type="tel"],input[type="url"],
    input[type="number"],input[type="password"],input[type="search"],
    input[type="date"],select{height:48px;font-size:1.6rem;}
    textarea{height:110px;font-size:1.6rem;}
}

/* ── Custom CSS voor buttons (ALLERLAATSTE = hoogste prioriteit) ─── */
