/*
Theme Name: Coodware child
Description: Child theme voor Fort 24-7 (gebouwd op Coodware/Flatsome)
Author: Coodware
Template: coodware-flat
Version: 3.1.1790609843
*/

/* Pagina-specifieke stijlen (per paginagroep) */
@import url("assets/css/zorg.css?v=1790609608");
@import url("assets/css/voorwie.css?v=1790609608");
@import url("assets/css/info.css?v=1790609608");
@import url("assets/css/contact.css?v=1790609608");

/* ---------- Merkfonts (branding) ----------
   De snit bepaalt de dikte, CSS maakt niets extra vet: overal font-weight: normal.
   - Titels, knoppen, navigatie: Figtree ExtraBold (vaste snit).
   - Labels/kickers: Instrument Sans SemiBold (instantie 600 van het variabele font).
   Bestanden staan in assets/fonts (zelf gehost). Flatsome's Customizer-typografie
   (Figtree 800) wordt hieronder overschreven. */
@font-face { font-family: "Figtree ExtraBold"; font-style: normal; font-weight: 800; font-display: swap; src: url("assets/fonts/figtree-extrabold-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Figtree ExtraBold"; font-style: normal; font-weight: 800; font-display: swap; src: url("assets/fonts/figtree-extrabold-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Instrument Sans SemiBold"; font-style: normal; font-weight: 600; font-stretch: 100%; font-display: swap; src: url("/wp-content/fonts/instrument-sans/pxiTypc9vsFDm051Uf6KVwgkfoSxQ0GsQv8ToedPibnr0She1YmV.woff2") format("woff2"), url("assets/fonts/instrument-sans-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Instrument Sans SemiBold"; font-style: normal; font-weight: 600; font-stretch: 100%; font-display: swap; src: url("/wp-content/fonts/instrument-sans/pxiTypc9vsFDm051Uf6KVwgkfoSxQ0GsQv8ToedPibnr0SZe1Q.woff2") format("woff2"), url("assets/fonts/instrument-sans-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }


/* ==========================================================================
   Fort 24-7 — design system
   Kleuren, fonts, buttons, container en header staan zoveel mogelijk in
   Flatsome > Theme Options. Deze stylesheet bevat alleen wat Flatsome niet
   zelf kan: de huisstijl-details en herbruikbare componentklassen die je in
   de UX Builder via "Class" op een section/row/col/element zet.
   ========================================================================== */

:root {
	--f-font-title: "Figtree ExtraBold", "Figtree", sans-serif;
	--f-font-label: "Instrument Sans SemiBold", "Instrument Sans", sans-serif;
	--f-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3.5 12h15.5M13 5.5l6.5 6.5-6.5 6.5' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	--f-purple: #25123c;
	--f-purple-2: #3d2458;
	--f-teal: #00cebd;
	--f-teal-light: #d7f7f4;
	--f-cream: #fffbf3;
	--f-sand: #fbf1e3;
	--f-border: #eadfcd;
	--f-brown: #321b17;
	--f-muted: #6b5580;
	--f-lilac: #bfb2d1;
	--f-orange: #ff4b00;
	--f-gradient: linear-gradient(90deg, #ff491c 0%, #fe6713 40%, #fc9d05 80%, #fcb000 100%);
	--f-radius: 20px;
	--f-radius-sm: 14px;
	--f-shadow: 0 6px 24px rgba(37, 18, 60, .08);
}

/* ---------- Basis typografie ---------- */
body { color: #000; font-size: 16px; line-height: 1.5; }
p { margin-bottom: 1.25em; }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5 { color: var(--f-purple); letter-spacing: 0; }
h1, .h1 { font-size: 64px; line-height: 1.1; }
h2, .h2 { font-size: 48px; line-height: 1.2; margin-bottom: .5em; }
h3, .h3 { font-size: 24px; line-height: 1.3; margin-bottom: .6em; }
h4, .h4 { font-size: 20px; line-height: 1.4; margin-bottom: .7em; }
h5, .h5 { font-size: 18px; line-height: 1.4; }
.lead { font-size: 18px; }
.text-brown, .text-brown h2, .text-brown h3 { color: var(--f-brown); }
.text-muted { color: var(--f-muted); }
.eyebrow { font-family: var(--f-font-label); font-weight: normal; font-size: 15px; line-height: 1.2; letter-spacing: .02em; text-transform: uppercase; color: var(--f-teal); margin-bottom: 12px; display: block; }
.dark h1, .dark h2, .dark h3, .dark h4, .dark p { color: #fff; }

/* ---------- Buttons ---------- */
.button { font-family: var(--f-font-title); font-weight: normal; text-transform: none; letter-spacing: 0; border-radius: 30px; font-size: 16px; line-height: 23px; min-height: 0; padding: 12px 29px; margin: 0 16px 16px 0; border: 1px solid transparent; }
.button span { line-height: inherit; }
.button.is-outline { border-width: 1px; line-height: 23px; padding: 12px 29px; }
.button.is-small { padding: 7px 20px; font-size: 16px; }
.button.primary:not(.is-outline) { color: var(--f-purple); }
.button.primary:not(.is-outline):hover { background-color: #00b8a9; color: var(--f-purple); box-shadow: none; }
.button.secondary.is-outline, .button.is-outline.secondary { color: var(--f-purple); border-color: var(--f-purple); }
.button.secondary.is-outline:hover { background-color: var(--f-purple); color: #fff; }
.button.white.is-outline { color: #fff; border-color: #fff; }
.button.white.is-outline:hover { background: #fff; color: var(--f-purple); }
/* "Chip" knop (bv. "Vanaf 14 jaar") */
.button.is-chip { padding: 8px 18px; pointer-events: none; }
/* Feitlabel (bv. "Vanaf 14 jaar"): informatie, geen knop — icoon in lichte cirkel + tekst, niet klikbaar */
.fact-tag { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 16px; font-family: var(--f-font-label); font-weight: normal; font-size: 16px; line-height: 22px; color: var(--f-purple); }
.fact-tag i { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: var(--f-teal-light); color: var(--f-purple); font-size: 15px; }
.btn-row .fact-tag + .link-plain { margin-left: 8px; padding-left: 24px; border-left: 1px solid var(--f-border); }

/* Tekstlinks met pijl */
.link-arrow, a.link-arrow { font-family: var(--f-font-title); font-weight: normal; font-size: 18px; color: var(--f-teal); display: inline-block; }
/* Pijl als vorm (SVG-masker in de tekstkleur): het →-teken zit niet in de merkfonts en zou
   anders uit een systeemfont komen. Ook bruikbaar als klasse has-arrow op een link. */
.link-arrow::after, .has-arrow::after { content: ""; display: inline-block; width: .9em; height: .9em; margin-left: .35em; vertical-align: -.1em; background: currentColor; -webkit-mask: var(--f-arrow) center / contain no-repeat; mask: var(--f-arrow) center / contain no-repeat; }
.link-arrow:hover { color: var(--f-purple); }
.link-arrow.is-dark { color: var(--f-purple); text-decoration: underline; text-underline-offset: 3px; }
.link-plain { font-family: var(--f-font-title); font-weight: normal; font-size: 18px; color: var(--f-purple); }

/* ---------- Secties ---------- */
.section.bg-cream, .bg-cream { background-color: var(--f-cream); }
.section-intro { max-width: 560px; }
.section-intro h2 { margin-bottom: 24px; }
.section-intro p { margin-bottom: 0; }

/* Oranje gradient-band ("Vooruit. Nooit achterom.") */
.section.bg-gradient, .bg-gradient { background: var(--f-gradient); }

/* Decoratieve F-vormen rechts in secties */
.deco-f { position: relative; overflow: hidden; }
.deco-f::after { content: ""; position: absolute; pointer-events: none; z-index: 0; right: -60px; top: 50%; width: 460px; height: 620px; transform: translateY(-50%); background: url(assets/img/deco-f.svg) no-repeat right center / contain; }
.deco-f.deco-f--top::after { top: -300px; transform: none; }
.deco-f.deco-f--bottom::after { top: auto; bottom: -120px; transform: none; }
.deco-f > .section-content { position: relative; z-index: 1; }

/* ---------- Kaarten ---------- */
.card { background: var(--f-cream); border-radius: var(--f-radius-sm); box-shadow: var(--f-shadow); height: 100%; display: flex; flex-direction: column; overflow: hidden; }
.card--white { background: #fff; }
.card--bordered { background: #fff; border: 1px solid var(--f-border); box-shadow: none; }
.card__img img { width: 100%; aspect-ratio: 271 / 171; object-fit: cover; display: block; }
.card__body { padding: 24px 24px 28px; display: flex; flex-direction: column; flex: 1; }
.card__body h3 { margin-bottom: 16px; }
.card__body p { font-size: 16px; }
.card__body .link-arrow { margin-top: auto; }
.col.card-col > .col-inner { height: 100%; }

/* Info-card (lichte kaart met titel + tekst) */
.info-card { background: var(--f-cream); border-radius: var(--f-radius); box-shadow: var(--f-shadow); padding: 36px 28px; height: 100%; }
.info-card h4 { margin-bottom: 16px; }
.info-card p:last-child { margin-bottom: 0; }

/* Keurmerken */
.keurmerk { background: #fff; border: 1px solid var(--f-border); border-radius: var(--f-radius-sm); padding: 20px 16px; min-height: 118px; height: 100%; display: flex; flex-direction: column; justify-content: center; }
.keurmerk strong { font-family: var(--f-font-title); font-weight: normal; font-size: 18px; color: var(--f-purple); display: block; margin-bottom: 4px; }
.keurmerk span { color: var(--f-muted); font-size: 15px; line-height: 1.5; }

/* ---------- Features / lijsten ---------- */
.feature h4 { margin-bottom: 12px; }
.feature p { margin-bottom: 0; }
.feature .feature__icon { width: 32px; height: 32px; margin-bottom: 12px; }
.step h3 { margin-bottom: 16px; font-size: 23px; }
.step p { color: var(--f-brown); margin-bottom: 0; }

/* ---------- Hero ---------- */
.hero { overflow: hidden; }
.hero .banner-bg .overlay, .hero-overlay .overlay { background: linear-gradient(120deg, rgba(37,18,60,.97) 0%, rgba(37,18,60,.55) 45%, rgba(37,18,60,0) 75%) !important; }
.hero h1 { color: #fff; margin-bottom: 24px; }
.hero .hero__kicker { font-family: var(--f-font-title); font-weight: normal; font-size: 24px; color: #fff; margin-bottom: 12px; display: block; }
.hero p { color: #fff; max-width: 560px; }
.hero .hero__person img { display: block; }

/* ---------- Trust bar ---------- */
.trustbar { background: #fff; border-radius: var(--f-radius); box-shadow: var(--f-shadow); padding: 32px 36px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.trustbar__item { display: flex; align-items: center; gap: 10px; font-family: var(--f-font-title); font-weight: normal; font-size: 24px; line-height: 1.2; color: var(--f-brown); white-space: nowrap; }
.trustbar__item img { width: 44px; height: 44px; object-fit: contain; }
.trustbar__sep { width: 1px; height: 44px; background: rgba(37,18,60,.15); flex: none; }

/* ---------- Beschikbaarheid ---------- */
.availability { background: #fff; border: 1px solid var(--f-border); border-radius: var(--f-radius); padding: 37px 41px; }
.availability h2 { font-size: 48px; line-height: 1.25; margin-bottom: 12px; }
.availability p { color: var(--f-purple-2); margin-bottom: 12px; }
.availability .updated { color: var(--f-muted); font-size: 16px; }
.loc-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--f-border); }
.loc-row:first-child { padding-top: 0; }
.loc-row strong { font-family: var(--f-font-label); font-weight: normal; font-size: 17px; color: var(--f-purple); display: block; }
.loc-row span.addr { color: var(--f-muted); font-size: 16px; }
.status { display: inline-flex; align-items: center; gap: 8px; border-radius: 999px; padding: 9px 16px; font-family: var(--f-font-label); font-weight: normal; font-size: 16px; line-height: 1.5; color: var(--f-purple); white-space: nowrap; background: var(--f-teal-light); border: 1px solid var(--f-teal); }
.status::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--f-teal); }
.status--wait { background: var(--f-sand); border-color: var(--f-border); }
.status--wait::before { background: var(--f-orange); }
.status--full { background: #fde8e8; border-color: #f3b5b5; }
.status--full::before { background: #d33; }
.availability .link-arrow { font-family: var(--f-font-label); font-weight: normal; font-size: 17px; margin-top: 18px; }

/* ---------- Logo's ---------- */
.logo-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 28px 24px; align-items: center; justify-items: center; }
.logo-grid img { max-height: 78px; width: auto; max-width: 100%; }

/* ---------- Testimonial ---------- */
.quote-card { background: var(--f-cream); border-radius: var(--f-radius); padding: 40px; height: 100%; }
.quote-card .quote-card__mark { width: 35px; margin-bottom: 40px; }
.quote-card h4 { color: var(--f-brown); }
.quote-card .quote-card__by { font-family: var(--f-font-title); font-weight: normal; font-size: 20px; color: var(--f-brown); margin: 24px 0 0; }
.testimonial-slider .flickity-page-dots { text-align: left; bottom: -44px; }
.testimonial-slider .flickity-page-dots .dot { width: 20px; height: 20px; opacity: 1; background: var(--f-cream); border: 0; margin: 0 10px 0 0; }
.testimonial-slider .flickity-page-dots .dot.is-selected { width: 30px; border-radius: 10px; background: var(--f-teal); }
.img-rounded img, .img-rounded .img-inner { border-radius: var(--f-radius); }

/* ---------- CTA ---------- */
.cta { background-color: var(--f-orange); overflow: hidden; }
.cta h2 { color: #fff; }
.cta p { color: #fff; }
.cta .cta__note { font-size: 18px; margin-top: 8px; margin-bottom: 0; }
.cta .cta__note a { color: #fff; text-decoration: underline; }

/* ---------- Tekstpagina's (privacy, klachten, vacatures) ---------- */
.page-header h1 { margin-bottom: 16px; }
.legal-content h2 { font-size: 24px; line-height: 1.3; margin: 40px 0 12px; }
.legal-content h3 { font-size: 20px; margin: 28px 0 10px; }
.legal-content p, .legal-content li { font-size: 16px; line-height: 1.6; }
.legal-content a { color: var(--f-purple); text-decoration: underline; text-underline-offset: 2px; }
.legal-content a:hover { color: var(--f-teal); }
.legal-content ul { margin-left: 1.2em; }

/* ---------- Zoekresultaten ---------- */
.search-results .page-title, .search-results .archive-page-header { text-align: left; }
.search-results #main .large-10 { max-width: 800px; flex-basis: 800px; }
.search-results article .article-inner { text-align: left; padding: 28px 0; border-bottom: 1px solid var(--f-border); }
.search-results article .entry-header-text { padding: 0; text-align: left; }
.search-results article .entry-title { font-size: 26px; margin-bottom: 8px; }
.search-results article .entry-divider { display: none; }
.search-results article .entry-content { padding: 0; }
.search-results article .more-link { border: 0; padding: 0; margin: 8px 0 0; color: var(--f-teal); background: none; }
.search-results .blog-wrapper hr, .search-results article + hr { display: none; }
/* Zoeken (lightbox): live-resultaten als witte kaart onder het zoekveld (Flatsome: transparant op donker) */
.mfp-content .live-search-results { margin-top: 10px; background: #fff; border-radius: 14px; box-shadow: 0 18px 44px rgba(37, 18, 60, .28); overflow: hidden; }
.mfp-content .live-search-results .autocomplete-suggestions { max-height: min(60vh, 480px); overflow-y: auto; background: #fff; }
.mfp-content .autocomplete-suggestion { gap: 14px; padding: 12px 20px; border-bottom: 1px solid var(--f-border); background: #fff; color: var(--f-purple); font-family: "Instrument Sans", sans-serif; font-size: 17px; line-height: 1.35; cursor: pointer; transition: background-color .15s; }
.mfp-content .autocomplete-suggestion:last-child { border-bottom: 0; }
.mfp-content .autocomplete-suggestion .search-name { color: var(--f-purple); margin: 0; padding: 0; }
.mfp-content .autocomplete-suggestion .search-name strong { font-family: var(--f-font-label); font-weight: normal; color: var(--f-purple); }
.mfp-content .autocomplete-suggestion img { width: 40px; height: 40px; margin: 0; object-fit: cover; flex: none; }
.mfp-content .autocomplete-suggestion:hover, .mfp-content .autocomplete-suggestion.autocomplete-selected { background: var(--f-cream); }

/* Titels en navigatie: merkfont, normaal gewicht (overschrijft Flatsome's Customizer-typografie) */
html h1, html h2, html h3, html h4, html h5, html h6, html .heading-font, html .banner h1, html .banner h2,
html .nav > li > a, html .mobile-sidebar-levels-2 .nav > li > ul > li > a, html .off-canvas-center .nav-sidebar.nav-vertical > li > a { font-family: var(--f-font-title); font-weight: normal; }
html .alt-font { font-family: var(--f-font-label); font-weight: normal !important; }

/* ---------- Header (aanvullend op Flatsome header builder) ---------- */
.header-top { border: 0; }
.header-top .nav > li > a { font-family: "Instrument Sans", sans-serif; font-weight: 400; font-size: 14px; color: #000; }
.header-top .social-icons a { color: var(--f-purple); }
.header-main .nav > li > a { font-family: var(--f-font-title); font-weight: normal; font-size: 16px; color: #000; }
.header-main .nav > li > a:hover { color: var(--f-purple); }
.header-main .header-nav-main > li.active > a, .header-main .header-nav-main > li.current-menu-ancestor > a, .header-main .header-nav-main > li.current-menu-parent > a { color: var(--f-teal); }
.nav-dropdown > li.active > a, .nav-dropdown > li.current-menu-item > a { color: var(--f-teal); }
.page-id-53 .header-main .header-button-1 .button { border-color: var(--f-teal); color: var(--f-teal); }
.page-id-52 .header-main .header-button-2 .button { box-shadow: inset 0 0 0 2px rgba(37,18,60,.15); }
.header-main .nav > li.has-dropdown > a .icon-angle-down { font-size: 17px; width: 24px; margin-left: 4px; text-align: center; opacity: 1; }
@media (min-width: 850px) {
	.header-main .header-nav-main > li { margin: 0 11px; }
	.header-main .header-nav-main > li:last-child { margin-right: 32px; }
	.header-main .header-button { margin-left: 0 !important; }
	.header-main .header-button-1 { margin-left: 21px !important; }
	.header-main .header-button-2 { margin-left: 17px !important; }
	.header-top .nav > li { margin: 0 0 0 26px; }
	.header-top .nav > li.header-search-lightbox { margin-left: 26px; }
	.header-top .html_topbar_right, .header-top .social-icons { margin-left: 18px; }
}
.header-top .social-icons a.icon { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; }
.header-top .social-icons a.icon i { font-size: 16px; line-height: 1; }
.header-top .nav > li > a:hover, .header-top .header-search-lightbox a:hover { color: var(--f-purple); }
.header-top .social-icons.follow-icons { gap: 10px; }
.header-main .header-button .button { margin: 0; font-size: 16px; padding: 7px 20px; line-height: 22px; min-height: 0; }
.header-main .header-button-1 .button { border: 1px solid var(--f-purple); color: var(--f-purple); background: transparent; }
.header-main .header-button-1 .button:hover { background: var(--f-purple); color: #fff; }
.nav-dropdown { border-radius: 14px; padding: 15px 0 12px; min-width: 250px; box-shadow: 0 10px 30px rgba(37,18,60,.12); border: 0; }
.header-main .header-nav-main > li > .nav-dropdown { left: 0; } /* linkerrand vak = linkerrand menu-item */
.header-main .nav-dropdown.nav-dropdown-default > li > a { padding-left: 10px; padding-right: 10px; } /* tekst 20px van de rand */
.nav-dropdown > li > a, .nav-dropdown-default > li > a { font-family: "Instrument Sans", sans-serif; font-weight: 400; font-size: 18px; line-height: 1.4; color: #000; padding: 6px 12px; margin: 0 10px; border: 0 !important; border-radius: 8px; }
.nav-dropdown > li > a:hover { color: var(--f-purple); background: var(--f-cream); }
.header-main .header-nav-main > li.has-dropdown:hover > a, .header-main .header-nav-main > li.has-dropdown.current-dropdown > a { color: var(--f-teal); }
.header-main .header-nav-main > li.has-dropdown:hover > a .icon-angle-down, .header-main .header-nav-main > li.current-dropdown > a .icon-angle-down { transform: rotate(180deg); }
.header-main .nav > li.has-dropdown > a .icon-angle-down { transition: transform .2s; }

/* Zoeken als tekstlink in de top bar */
.header-top .header-search-lightbox a { font-family: "Instrument Sans", sans-serif; font-size: 14px; color: #000; }
.header-top .header-search-lightbox a .icon-search { display: none; }
.header-top .header-search-lightbox a::after { content: "Zoeken"; }
/* Social iconen: volgorde Instagram, LinkedIn, Facebook */
.social-icons.follow-icons { display: inline-flex; align-items: center; gap: 12px; }
.social-icons .instagram { order: 1; } .social-icons .linkedin { order: 2; } .social-icons .facebook { order: 3; }
.social-icons a.icon { margin: 0 !important; padding: 0; font-size: 20px; }

/* Mobiel menu (off-canvas) — zelfde volgorde als de desktopnavigatie, subpagina's klappen uit
   (accordeon, WP-menu "Mobiel menu"); daaronder Crisis + Aanmelden naast elkaar; onderaan de
   secundaire links (menu-items met klasse menu-secondary: Nieuws, Locaties) en social-iconen. */
.off-canvas-right .mfp-content, .off-canvas-left .mfp-content { width: 100%; max-width: 100%; }
.off-canvas .sidebar-menu { background: var(--f-cream); padding-top: 0; }
.off-canvas-left.mfp-ready .mfp-content, .off-canvas-right.mfp-ready .mfp-content { background: var(--f-cream); }
.off-canvas .sidebar-menu-top-content { padding: 16px 20px; height: 72px; border-bottom: 1px solid var(--f-border); margin: 0 0 8px; background: #fff; display: flex; align-items: center; }
.off-canvas .sidebar-menu-top-content img { width: 113px; height: auto; display: block; }
.off-canvas .mfp-close, .mfp-wrap.off-canvas .mfp-close { color: var(--f-purple) !important; opacity: 1 !important; top: 22px !important; right: 18px !important; mix-blend-mode: normal; }
.off-canvas .mfp-close svg { stroke: var(--f-purple); }
.off-canvas .nav.nav-sidebar { display: flex; flex-flow: row wrap; align-items: center; padding: 0 24px 40px; }
.off-canvas .nav-sidebar.nav-vertical > li.menu-item.active, .off-canvas .nav-sidebar.nav-vertical > li.menu-item:hover { background: transparent; }
.off-canvas .nav-sidebar > li { width: 100%; position: relative; border: 0 !important; border-bottom: 1px solid var(--f-border) !important; }
.off-canvas .nav-sidebar > li > a { font-family: var(--f-font-title); font-weight: normal; font-size: 18px; line-height: 24px; color: var(--f-purple); text-transform: none; padding: 16px 48px 16px 0; }
.off-canvas .nav-sidebar > li.current-menu-item > a, .off-canvas .nav-sidebar > li.current-menu-ancestor > a { color: var(--f-teal); }
/* Uitklappijl: groot tikvlak rechts, draait bij openen */
.off-canvas .nav-sidebar > li > .toggle { position: absolute; top: 6px; right: -12px; width: 44px; height: 44px; min-height: 0; margin: 0; padding: 0; display: flex; align-items: center; justify-content: center; color: var(--f-purple); opacity: 1; box-shadow: none; }
.off-canvas .nav-sidebar > li > .toggle i { font-size: 18px; } /* Flatsome draait de knop zelf bij openen */
/* Subpagina's: ingesprongen met een teal lijn */
.off-canvas .nav-sidebar > li > .sub-menu, .off-canvas .nav-sidebar > li > .children { width: 100%; margin: -6px 0 16px 2px !important; padding: 0 0 0 16px !important; border-left: 2px solid var(--f-teal); }
.off-canvas .nav-sidebar li li:last-child { padding-bottom: 0; margin-bottom: 0; }
.off-canvas .nav-sidebar li li { border: 0 !important; }
.off-canvas .nav-sidebar li li > a { font-family: "Instrument Sans", sans-serif; font-weight: normal; font-size: 16px; line-height: 22px; color: var(--f-purple); text-transform: none; padding: 8px 0; }
.off-canvas .nav-sidebar li li.current-menu-item > a { color: var(--f-teal); }
/* Knoppen naast elkaar */
.off-canvas .nav-sidebar > li.header-button-1, .off-canvas .nav-sidebar > li.header-button-2 { order: 2; width: calc(50% - 6px); margin-top: 28px; padding: 0 !important; border: 0 !important; }
.off-canvas .nav-sidebar > li.header-button-1 { margin-right: 12px; }
.off-canvas .nav-sidebar .header-button { padding: 0; width: 100%; margin: 0; }
.off-canvas .nav-sidebar .header-button .button { width: 100%; margin: 0; height: 46px; line-height: 44px; padding: 0 12px; }
/* Secundair: Nieuws · Locaties + social */
.off-canvas .nav-sidebar > li.menu-secondary { order: 3; width: auto; margin: 32px 24px 0 0; border: 0 !important; }
.off-canvas .nav-sidebar > li.menu-secondary > a { font-family: "Instrument Sans", sans-serif; font-size: 16px; line-height: 22px; color: var(--f-purple); padding: 0; text-decoration: underline; text-decoration-color: var(--f-border); text-underline-offset: 4px; }
.off-canvas .nav-sidebar > li.header-social-icons { order: 4; width: auto; margin: 32px 0 0 auto; padding: 0 !important; border: 0 !important; }
.off-canvas .nav-sidebar > li.header-social-icons .social-icons { gap: 14px; }
.off-canvas .nav-sidebar > li.header-social-icons a.icon { color: var(--f-purple); font-size: 20px; }

/* ---------- Footer ---------- */
.site-footer, .footer-wrapper { background: var(--f-purple); }
.fort-footer { color: #fff; }
.fort-footer h5 { font-family: var(--f-font-title); font-weight: normal; font-size: 16px; color: #fff; margin-bottom: 24px; }
.fort-footer p, .fort-footer li, .fort-footer a { color: #fff; font-size: 16px; line-height: 1.5; }
.fort-footer ul { list-style: none; margin: 0; }
.fort-footer ul li { margin: 0 0 16px; padding: 0; }
.fort-footer a:hover { color: var(--f-teal); }
.fort-footer .footer-logos { display: grid; grid-template-columns: 90px 154px; gap: 10px 17px; align-items: center; }
.fort-footer .footer-bottom { border-top: 1px solid rgba(255,255,255,.9); padding-top: 30px; display: flex; justify-content: space-between; align-items: center; }
.fort-footer .footer-bottom .legal a { font-size: 14px; margin-right: 24px; text-decoration: underline; text-underline-offset: 2px; }
.fort-footer .footer-bottom .legal a:first-child { text-decoration: none; }
.fort-footer .social-icons a { color: #fff; }
.absolute-footer { display: none; }

/* ---------- Layout helpers ---------- */
/* 5 kolommen (stappenplan, keurmerken) */
@media (min-width: 850px) {
	.row-5 > .col { flex-basis: 20%; max-width: 20%; }
}
.steps .step { padding-bottom: 0; }
.keurmerken > .col { padding-bottom: 16px; }
.text-brown-p p { color: var(--f-brown); }

/* Decoratieve F: gesplitst over twee secties */
.deco-f::after { right: -67px; }
.deco-f.deco-split-top::after { top: auto; bottom: -319px; transform: none; }
.deco-f.deco-split-bottom::after { top: -301px; transform: none; }
.deco-f.deco-f--top::after { top: -10px; }

.legal-content .legal-version em { font-style: normal; }

/* Bannerlagen met verticale positie 0 (Flatsome y0) op desktop 1px lager */
@media screen and (min-width: 850px) {
	.lg-y0 { top: 1px; }
}

/* Hero */
.hero .section-bg .overlay, .hero .bg-overlay { display: none; }
.hero-overlay .section-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(117deg, rgba(37,18,60,.97) 0%, rgba(37,18,60,.62) 38%, rgba(37,18,60,0) 70%); }
.hero .section-content { position: relative; z-index: 1; }
.hero__row > .col { padding-bottom: 0; }
.hero__text p { font-size: 16px; line-height: 1.5; margin-bottom: 16px; }
.hero__text .button { margin-bottom: 0; }
.hero--home .hero__person .img { margin: 35px -29px 0 96px; width: auto !important; }
/* Home-hero op desktop: hero + header samen nooit hoger dan het scherm (100vh).
   --f-hdr = hoogte van de desktopheader, uit de Customizer (functions.php; 118 = top bar 30 + header 88).
   Tekst: de ruimte boven/onder (197/176px, = col-padding in de UX Builder) krimpt naar verhouding mee.
   Beeld: schaalt op hoogte, rechts verankerd (35px = col-marge, 1.23359 = banner-hoogte 123.359%). */
@media (min-width: 850px) {
	.hero--home { --hero-max: max(380px, calc(100vh - var(--f-hdr, 118px) - var(--wp-admin--admin-bar--height, 0px))); }
	@supports (height: 100svh) {
		.hero--home { --hero-max: max(380px, calc(100svh - var(--f-hdr, 118px) - var(--wp-admin--admin-bar--height, 0px))); }
	}
	.hero--home .hero__text { display: flex; flex-direction: column; max-height: var(--hero-max); }
	.hero--home .hero__text::before { content: ""; flex: 0 1 197px; min-height: 24px; }
	.hero--home .hero__text::after { content: ""; flex: 0 1 176px; min-height: 24px; }
	.hero--home .hero__text > .col-inner { flex: none; padding-top: 0 !important; padding-bottom: 0 !important; }
	.hero--home .hero__person > .col-inner { margin: 35px -29px 0 auto !important; max-width: min(calc(100% - 67px), calc((var(--hero-max) - 35px) / 1.23359)) !important; }
}
.hero__person .img-inner img { width: 100%; height: auto; }
/* Home-hero op mobiel: header (72px) + hero = zichtbare schermhoogte (100svh). De foto staat
   onderaan en schuift bij weinig ruimte onder de knoppen door (max. 64px, tekst ligt erboven);
   is het nog krapper, dan schaalt de foto mee (min. 220px hoog) zodat het gezicht zichtbaar blijft. */
@media (max-width: 549px) {
	.hero--home { --hero-h: calc(100vh - 72px - var(--wp-admin--admin-bar--height, 0px)); }
	@supports (height: 100svh) {
		.hero--home { --hero-h: calc(100svh - 72px - var(--wp-admin--admin-bar--height, 0px)); }
	}
	.hero--home > .section-content { align-self: stretch; }
	.hero--home > .section-content > .row { display: grid; grid-template-columns: 100%; grid-template-rows: auto minmax(156px, 1fr); /* 156 + 64 overlap = foto min. 220px */ min-height: var(--hero-h); }
	.hero--home .hero__text { z-index: 2; }
	.hero--home .hero__person { position: relative; z-index: 1; align-self: stretch; margin-top: -64px; display: flex; justify-content: flex-end; align-items: flex-end; container-type: size; }
	.hero--home .hero__person > .col-inner { flex: none; margin: 0 -29px 0 0 !important; width: min(calc(100% - 67px), 100cqh / 1.23359); max-width: none !important; }
}

.btn-row { display: flex; flex-wrap: wrap; align-items: center; gap: 0 16px; }
.btn-row .button { margin-right: 0; }
.btn-row .link-plain { margin: 0 0 16px 16px; }
.after-steps { margin-top: 36px; margin-bottom: 0; }
.availability-section.deco-f::after { top: auto; bottom: -380px; transform: none; }
/* Home: de F onder "Waar is plek?" is de voortzetting van die erboven (zelfde positie t.o.v. de sectiegrens) */
.home .deco-f.deco-f--top::after { top: -240px; }
/* Hero binnenpagina's */
.hero--inner h1 { font-size: 56px; line-height: 1.1; }
.hero--inner .section-bg { background-color: #25123c; overflow: hidden; }
.hero--inner .hero__text p { max-width: 631px; }
/* Features met icoon */
.feature__icon.img { width: auto !important; margin-bottom: 8px; }
.feature__icon img { height: 40px !important; width: auto !important; }
.features-icons > .col { padding-bottom: 50px; }
@media (min-width: 850px) { .feature--right { padding-left: 58px !important; } }
.features-4 { margin-top: 40px; }
.features-4 .feature h4 { min-height: 56px; }
.heading-black h2 { color: #000; }
.list-title { font-size: 20px; margin: 20px 0 8px; }
.info-cards > .col { padding-bottom: 30px; }
/* Feiten-lijst ("Leeftijd", ...) */
.facts h4 { margin-bottom: 16px; }
.facts p { margin-bottom: 20px; }
.link-plain { display: inline-block; vertical-align: middle; margin: 0 0 16px 16px; }
.button.is-chip + .link-plain, .button + .link-plain { margin-left: 16px; }

/* Relatie-sectie */
.relation .features-2 { margin-top: 32px; }
.relation .features-2 > .col { padding-bottom: 24px; }
.relation .feature h4 { font-size: 20px; margin-bottom: 16px; }
.relation__img .img { margin-left: 15px; margin-right: -5px; }

/* Logo's */
.logo-row { margin-top: 20px; margin-bottom: 40px; }
.logo-row > .col { padding-bottom: 24px; display: flex; align-items: center; justify-content: center; }
.logo-row .img { margin: 0 auto; }

/* Testimonials */
.testimonial-slide > .col { padding-bottom: 0; }
.testimonial-img .img { margin-left: -84px; margin-top: -80px; width: calc(100% + 84px) !important; position: relative; z-index: 2; pointer-events: none; }
.testimonial-slide .quote-card { position: relative; z-index: 1; }
.testimonial-slider { margin-top: 35px; padding-bottom: 60px; }
.testimonial-slider .flickity-viewport { overflow: visible; }

/* CTA */
.cta__row > .col { padding-bottom: 0; }
.cta__img .img { margin: 0 -60px 0 -280px; width: auto !important; }
.cta__text .button { margin-bottom: 24px; }
.cta__text h2 { margin-bottom: 24px; }
.cta__text p:not(.cta__note) { max-width: 564px; }

/* Footer grid */
@media (min-width: 850px) {
	.footer-grid > .col:nth-child(1) { flex-basis: 331px; max-width: 331px; }
	.footer-grid > .col:nth-child(2), .footer-grid > .col:nth-child(3), .footer-grid > .col:nth-child(4) { flex-basis: 207px; max-width: 207px; }
	.footer-grid > .col:nth-child(5) { flex: 1 1 0; max-width: none; min-width: 0; }
	.footer-logos { margin-left: -13px !important; width: 261px; flex-wrap: nowrap; }
	.footer-grid > .col:nth-child(2), .footer-grid > .col:nth-child(3), .footer-grid > .col:nth-child(4) { padding-right: 0; }
}
.footer-logos > .col:first-child { flex: 0 0 90px; max-width: 90px; }
.footer-logos > .col:last-child { flex: 0 0 154px; max-width: 154px; margin-left: 0; }
.footer-logos .img { margin-bottom: 10px; }
.footer-logos > .col:first-child .img { margin-left: auto; margin-right: auto; }
.footer-bottom-row { margin-top: 0; }
.footer-bottom-row > .col { padding-bottom: 0; }
.section.fort-footer { padding-bottom: 50px !important; }
.fort-footer .copyright { display: block; margin-bottom: 8px; font-size: 14px; }

/* ---------- Kleine desktop / liggende tablet (850–1279px) ---------- */
@media (min-width: 850px) and (max-width: 1279px) {
	#logo { width: 170px !important; }
	.header-main .header-nav-main > li { margin: 0 6px; }
	.header-main .header-nav-main > li:last-child { margin-right: 14px; }
	.header-main .nav > li > a { font-size: 15px; }
	.header-main .header-button-1 { margin-left: 10px !important; }
	.header-main .header-button-2 { margin-left: 10px !important; }
	.header-main .header-button .button { padding: 7px 14px; }
	.header-main .nav > li.has-dropdown > a .icon-angle-down { width: 16px; margin-left: 2px; }
	.trustbar { padding: 26px 24px; gap: 10px; }
	.trustbar__item { font-size: 18px; gap: 8px; }
	.trustbar__item img { width: 34px; height: 34px; }
	.deco-f::after { display: none; }
	.availability h2 { font-size: 38px; }
	.footer-grid > .col:nth-child(1) { flex-basis: 25%; max-width: 25%; }
	.footer-grid > .col:nth-child(2), .footer-grid > .col:nth-child(3), .footer-grid > .col:nth-child(4) { flex-basis: 25%; max-width: 25%; }
	.footer-grid > .col:nth-child(5) { flex: 0 0 100%; max-width: 100%; }
	.footer-logos { margin-left: 0 !important; }
}
/* ---------- Tablet ---------- */
@media (max-width: 849px) {
	h1, .h1 { font-size: 44px; }
	h2, .h2 { font-size: 34px; }
	.trustbar { flex-wrap: wrap; justify-content: flex-start; }
	.trustbar__sep { display: none; }
	.trustbar__item { flex: 0 0 calc(50% - 8px); font-size: 20px; }
	.logo-grid { grid-template-columns: repeat(3, 1fr); }
	.deco-f::after { display: none; }
	.availability h2 { font-size: 32px; }
}

/* ---------- Mobiel ---------- */
@media (max-width: 549px) {
	body { font-size: 16px; }
	h1, .h1 { font-size: 32px; line-height: 1.1; }
	h2, .h2 { font-size: 26px; line-height: 1.2; }
	h3, .h3 { font-size: 19px; }
	h4, .h4 { font-size: 17px; }
	.hero .hero__kicker { font-size: 18px; }
	.button { width: 100%; margin-right: 0; font-size: 15px; padding: 12px 20px; }
	.button.is-chip { width: auto; }
	.link-arrow, a.link-arrow { font-size: 16px; }
	.trustbar { flex-direction: column; align-items: flex-start; padding: 28px 30px; gap: 0; }
	.trustbar__item { font-size: 20px; padding: 14px 0; border-bottom: 1px solid rgba(37,18,60,.12); width: 100%; flex: none; }
	.trustbar__item:last-child { border-bottom: 0; }
	.trustbar__item img { width: 35px; height: 35px; }
	.availability { padding: 28px 24px; }
	.availability h2 { font-size: 22px; }
	.loc-row { flex-direction: column; align-items: flex-start; border-bottom: 0; padding: 0 0 20px; }
	.logo-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }
	.quote-card { padding: 24px; }
	.deco-f::after { display: none; }
	.fort-footer .footer-bottom { flex-direction: column; align-items: flex-start; gap: 12px; }
	.fort-footer p, .fort-footer li, .fort-footer a { color: var(--f-lilac); }
	.section.fort-footer { padding-top: 48px !important; padding-bottom: 32px !important; }
	.fort-footer .footer-mark img { width: 27px; height: auto; display: block; }
	.fort-footer .footer-grid > .col { padding-bottom: 18px; }
	.fort-footer .footer-grid > .col.footer-col-logo { padding-bottom: 28px; }
	.fort-footer h5 { font-family: var(--f-font-label); font-weight: normal; font-size: 15px; line-height: 18px; margin-bottom: 10px; }
	.fort-footer ul li { margin-bottom: 10px; line-height: 20px; }
	.fort-footer ul li a, .fort-footer ul li { line-height: 20px !important; }
	.fort-footer .footer-bottom { padding-top: 28px; gap: 8px; }
	.fort-footer .copyright { font-size: 14px; line-height: 17px; margin: 0; }
	.fort-footer .footer-bottom .legal a { font-size: 14px; line-height: 17px; margin: 0; text-decoration: none; }
	.fort-footer .footer-bottom .legal { display: flex; flex-wrap: wrap; gap: 8px 20px; }
	.fort-footer .footer-bottom .legal a { white-space: nowrap; }
	/* Kaarten zonder foto op mobiel */
	.card .card__img { display: none; }
	.card { box-shadow: 0 2px 12px rgba(37,18,60,.06); }
	.card__body { padding: 20px; }
	.card__body h3 { margin-bottom: 20px; }
	.cards-row > .col { padding-bottom: 20px; }
	/* Keurmerken compact */
	.keurmerk { min-height: 0; padding: 10px; border-radius: 10px; }
	.keurmerk strong { font-family: var(--f-font-label); font-weight: normal; font-size: 15px; color: #000; margin-bottom: 2px; }
	.keurmerk span { font-size: 15px; }
	.testimonial-img { display: none; }
	.step { padding-bottom: 24px !important; }
	.step h3 { font-size: 17px; margin-bottom: 8px; }
	.logo-slider { margin: 10px 0 30px; }
	.logo-slider .logo-row { margin: 0; width: 100%; display: flex !important; flex-wrap: wrap; }
	.logo-slider .logo-row > .col { flex: 0 0 50% !important; max-width: 50% !important; padding: 0 10px 22px; }
	.logo-slider .logo-row { align-items: center; }
	.logo-slider .flickity-page-dots { position: relative; bottom: auto; margin-top: 4px; }
	.logo-slider .flickity-page-dots .dot { width: 16px; height: 16px; background: var(--f-border); border: 0; opacity: 1; margin: 0 20px; }
	.logo-slider .flickity-page-dots .dot.is-selected { background: var(--f-teal); }
	.relation .features-2 > .col { padding-bottom: 8px; }
	/* Hero binnenpagina: beeld boven, tekst op wit */
	.hero--inner { padding-top: 220px !important; background-color: #fff !important; }
	.hero--inner .section-bg img.bg { object-position: 62% 50%; }
	.hero--inner .hero__text .button { width: 100%; }
	.hero--inner .section-bg { height: 220px !important; bottom: auto !important; }
	.hero--inner .section-bg .bg { background-size: cover !important; background-position: 62% 50% !important; }
	.hero--inner .hero__kicker { font-family: var(--f-font-label); font-weight: normal; font-size: 15px; letter-spacing: .02em; text-transform: uppercase; color: var(--f-teal); margin: 8px 0 8px; }
	.hero--inner h1 { color: var(--f-purple); font-size: 28px; }
	.hero--inner.dark p, .hero--inner p { color: #000; }
	.feature--icon > .col-inner { display: grid; grid-template-columns: auto 1fr; column-gap: 12px; align-items: center; }
	.feature--icon > .col-inner > * { grid-column: 1 / -1; }
	.feature--icon .feature__icon, .feature--icon h4 { grid-column: auto !important; margin: 0; }
	.feature--icon .feature__icon img { height: 34px !important; }
	.feature--icon h4 { margin: 0; }
	.feature--icon p { margin-top: 8px; }
	.features-icons > .col { padding-bottom: 28px; }
	.features-4 .feature h4 { min-height: 0; }
	.info-card { padding: 16px 12px; border-radius: 10px; }
	.info-cards > .col { padding-bottom: 16px; }
}
/* Mobiel: zijmarge 24px zoals in het mobiele design */
@media (max-width: 549px) {
	.section-content > .row, .slider-wrapper .flickity-slider > .row, .slider-wrapper .slider > .row { padding-left: 9px; padding-right: 9px; }
	.section-content > .row.row-small { padding-left: 14px; padding-right: 14px; }
	.section-content > .row.row-collapse { width: auto; margin-left: 24px !important; margin-right: 24px !important; padding-left: 0; padding-right: 0; }
	.header-main .container, .header-top .container { padding-left: 20px; padding-right: 20px; }
	.logo-slider .flickity-slider > .row, .logo-slider .slider > .row { padding-left: 0; padding-right: 0; }
}
@media (max-width: 849px) {
	#logo { width: 113px !important; }
	.hero--home .hero__text .button { margin-bottom: 10px; }
	#header .header-main { height: 72px; } /* ook tablet (550–849): Flatsome zet daar de desktophoogte */
}
/* Logo op desktop iets kleiner (55px hoog); sticky: 50px (fx.css) */
@media (min-width: 850px) {
	#header #logo img { max-height: 55px; }
}
/* Smalle desktop (850–959): navigatie blijft op één regel (ook in de 70px sticky header) */
@media (min-width: 850px) and (max-width: 959px) {
	.header-main .header-nav-main > li { margin: 0 3px; }
	.header-main .header-nav-main > li:last-child { margin-right: 8px; }
	.header-main .nav > li > a { font-size: 14px; }
	.header-main .header-nav-main > li.has-dropdown > a .icon-angle-down { width: 16px; margin-left: 2px; }
	.header-main .header-button .button { padding: 7px 14px; font-size: 14px; }
	.header-main .header-button-1 { margin-left: 6px !important; }
	.header-main .header-button-2 { margin-left: 6px !important; }
}

/* Titels: h1 altijd line-height 1.1 (ook een h1 die er als h2 uitziet) */
h1.h2 { line-height: 1.1; }
