/* kiepe-web — opmaak voor het eigen contactformulier (vervangt Ninja Forms) */
.kw-form { max-width: 560px; }
.kw-row { margin: 0 0 16px; }
/* Vaste donkere tekstkleur zodat labels altijd leesbaar zijn (niet erven van de sectie). */
.kw-form, .kw-form label { color: #20223F; }
.kw-form label { display: block; font-weight: 700; font-size: 15px; margin-bottom: 6px; }
.kw-form input::placeholder, .kw-form textarea::placeholder { color: #66687E; }
.kw-form input[type=text],
.kw-form input[type=email],
.kw-form input[type=tel],
.kw-form textarea {
  width: 100%; box-sizing: border-box; padding: 12px 14px;
  border: 1px solid rgba(0,0,0,.18); border-radius: 8px; font: inherit; font-weight: 400;
  background: rgba(255,255,255,.9); color: #17223b;
}
.kw-form textarea { resize: vertical; min-height: 120px; }
.kw-form input:focus, .kw-form textarea:focus { outline: 2px solid #caa14a; outline-offset: 1px; }
.kw-check label { font-weight: 400; font-size: 14px; display: flex; gap: 8px; align-items: flex-start; color: #20223F; }
.kw-check input { margin-top: 3px; }
.kw-submit {
  background: #17223b; color: #fff; border: 0; border-radius: 999px;
  padding: 13px 30px; font: inherit; font-weight: 600; cursor: pointer;
}
.kw-submit:hover { background: #223050; }
.kw-submit:disabled { opacity: .6; cursor: default; }
.kw-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.kw-msg { margin: 10px 0 0; font-size: 15px; }
.kw-msg.err { color: #b3261e; font-weight: 600; }
.kw-msg.ok { color: #1a7f45; font-weight: 600; }

/* Eén duo-blok rechtsonder: WhatsApp + Noodaanvraag (vervangt de losse zweefknoppen) */
.whatsapp-container{display:none !important}   /* originele losse WhatsApp-knop uit */
.kw-duo{
  position:fixed; right:18px; bottom:18px; z-index:99999;
  display:flex; flex-direction:column; gap:8px; align-items:stretch;
}
.kw-duo-btn{
  display:flex; align-items:center; gap:10px; min-width:190px;
  padding:12px 20px; border-radius:999px; color:#fff !important;
  font:700 15px/1 -apple-system,"Segoe UI",Roboto,Arial,sans-serif; text-decoration:none;
  box-shadow:0 9px 24px rgba(0,0,0,.4); transition:transform .06s ease, filter .15s ease;
}
.kw-duo-btn:hover{filter:brightness(1.07)}
.kw-duo-btn:active{transform:translateY(1px)}
.kw-duo-btn svg{flex:0 0 auto}
.kw-duo-wa{background:linear-gradient(180deg,#2bd66e,#1da851)}
.kw-duo-nood{background:linear-gradient(180deg,#f0565b,#d5343a)}
.kw-duo-nood .kw-dot{
  width:8px;height:8px;border-radius:50%;background:#fff;margin-left:auto;
  box-shadow:0 0 0 0 rgba(255,255,255,.7);animation:kwpulse 1.6s infinite;
}
@keyframes kwpulse{0%{box-shadow:0 0 0 0 rgba(255,255,255,.6)}70%{box-shadow:0 0 0 8px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
@media (max-width:520px){ .kw-duo{right:12px; bottom:12px} .kw-duo-btn{min-width:0; padding:12px 18px} }
@media print{ .kw-duo{display:none} }

/* Zichtbaar belnummer in de noodhero */
.kw-belnummer{font-size:19px;font-weight:600;color:#20223F;margin:16px 0 0}
.kw-belnummer a{color:#B2914E;text-decoration:none}
.kw-belnummer a:hover{text-decoration:underline}
.kw-112{font-size:15px;color:#4D4D57;margin:8px 0 0}

/* Noodhero vrij onder de vaste header (desktop-header 171px, mobiel 91px) */
.kw-noodhero{padding-top:190px !important}
@media (max-width:980px){ .kw-noodhero{padding-top:110px !important} }

/* Cookiebanner (Complianz) volledig uit: banner, beheer-balk en dode consent-links */
#cmplz-cookiebanner-container, .cmplz-cookiebanner,
#cmplz-manage-consent, #cmplz-manage-consent-container,
.cmplz-manage-consent, .cmplz-manage-consent-container { display:none !important; }

/* Dynamische artikelen/vacatures (beheerportaal) */
.kw-artikel-meta{color:#66687E;font-size:15px;margin:6px 0 0}
.kw-concept{display:inline-block;background:#fff4d6;color:#9a6b00;border-radius:999px;padding:2px 12px;font-size:13px;font-weight:600;margin-left:6px}
.kw-leeg{color:#66687E;font-size:17px;padding:20px 0}
.kw-vacature-intro{margin:0 0 22px}
.kw-vacature-intro p{margin:0 0 12px}
.kw-vacature-feiten{color:#B2914E;font-weight:600;font-size:15px}
.kw-vacature-gesloten{background:#EDEAE6;color:#20223F;border-radius:8px;padding:10px 14px;font-weight:600}
/* Kaartafbeeldingen: geüploade foto's in elke maat netjes 400x250 bijsnijden */
.et_pb_blog_grid .et_pb_image_container img{width:100%;height:auto;aspect-ratio:400/250;object-fit:cover}

/* Aanvraagformulier (/aanvraag/): keuzelijsten, datum/tijd, velden naast elkaar, tussenkopjes */
.kw-aanvraag { max-width: none; }
.kiepe-center-row.kw-rij-boven { align-items: flex-start; }
@media (min-width: 981px) { .kw-rij-boven > .et_pb_column_1 { padding-top: 40px; } }
/* mobiel: het formulier eerst (wie de link opent komt voor het formulier), de tekst eronder */
@media (max-width: 980px) { .kiepe-center-row.kw-rij-boven { flex-direction: column; } }
.kw-form select,
.kw-form input[type=date],
.kw-form input[type=time] {
  width: 100%; box-sizing: border-box; padding: 12px 14px; min-height: 48px;
  border: 1px solid rgba(0,0,0,.18); border-radius: 8px; font: inherit; font-weight: 400;
  background-color: rgba(255,255,255,.9); color: #17223b;
}
.kw-form select:focus { outline: 2px solid #caa14a; outline-offset: 1px; }
.kw-twee, .kw-drie { display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; }
.kw-drie { grid-template-columns: 1.4fr 1fr 1fr; }
.kw-row[hidden] { display: none; }
.kw-kop { font-size: 18px; font-weight: 700; color: #20223F; margin: 28px 0 16px; padding: 0 0 8px; border-bottom: 1px solid rgba(32,34,63,.15); }
.kw-form > .kw-kop:first-child { margin-top: 0; }
.kw-veldkop { display: block; font-weight: 700; font-size: 15px; margin-bottom: 8px; }
.kw-keuze { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.kw-form .kw-keuze label { display: flex; align-items: center; gap: 7px; font-weight: 400; margin: 0; cursor: pointer; }
@media (max-width: 600px) {
  .kw-twee { grid-template-columns: 1fr; }
  .kw-drie { grid-template-columns: 1fr 1fr; }
  .kw-drie > :first-child { grid-column: 1 / -1; }
}

/* Sollicitatieformulier: bestandsveld */
.kw-form input[type=file] { display:block; width:100%; padding:10px 0; font:inherit; font-weight:400; color:#20223F; }
.kw-form input[type=file]::file-selector-button { background:#E8E4DF; color:#20223F; border:0; border-radius:999px; padding:8px 16px; font:600 14px inherit; cursor:pointer; margin-right:10px; }

/* Vacaturekaarten: thema geeft de foto wel een vaste hoogte + object-fit, maar geen breedte.
   Staande foto's werden daardoor smal (breedte volgde de verhouding). Nu altijd het hele kader. */
.kiepe-vacature-textcontainer img { width:100% !important; height:205px !important; object-fit:cover; object-position:center; }

/* Mobiel menu: de header is position:fixed en het uitgeklapte menu zit erin, waardoor het onder de
   schermrand doorliep en niet kon scrollen. Nu: eigen scroll binnen het scherm. Duo-blok
   (WhatsApp/Noodaanvraag) verbergen zolang het menu open is (lag over de menupunten heen). */
@media (max-width: 980px) {
  header.et-l--header .et_mobile_menu {
    max-height: calc(100vh - 110px);
    max-height: calc(100dvh - 110px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
  body:has(.mobile_nav.opened) .kw-duo { display: none; }
}

/* Leesbaarheid witte tekst op foto's (desktop én mobiel): de hero's van home, /contact/ en
   /afspraak-maken/ en het contactblok in de footer hebben een verloop dat bovenaan bijna transparant
   is, waardoor de tekst wegvalt tegen de foto. Iets donkerder waas bovenaan + lichte tekstschaduw;
   verder blijft de vormgeving gelijk. */
  body.home #et-boc .et_pb_section_0, body.page-id-132 #et-boc .et_pb_section_0, body.page-id-134 #et-boc .et_pb_section_0,
  #et-boc .et_pb_section_0_tb_footer { position: relative; }
  body.home #et-boc .et_pb_section_0::before, body.page-id-132 #et-boc .et_pb_section_0::before, body.page-id-134 #et-boc .et_pb_section_0::before,
  #et-boc .et_pb_section_0_tb_footer::before {
    content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 0;
    background: linear-gradient(180deg, rgba(28,30,60,.55) 0%, rgba(28,30,60,.35) 45%, rgba(28,30,60,0) 100%);
  }
  body.home #et-boc .et_pb_section_0 > .et_pb_row, body.page-id-132 #et-boc .et_pb_section_0 > .et_pb_row, body.page-id-134 #et-boc .et_pb_section_0 > .et_pb_row,
  #et-boc .et_pb_section_0_tb_footer > .et_pb_row { position: relative; z-index: 1; }
  body.home #et-boc .et_pb_section_0 .et_pb_text_inner, body.page-id-132 #et-boc .et_pb_section_0 .et_pb_text_inner, body.page-id-134 #et-boc .et_pb_section_0 .et_pb_text_inner,
  #et-boc .et_pb_section_0_tb_footer .et_pb_text_inner { text-shadow: 0 1px 2px rgba(0,0,0,.55), 0 0 14px rgba(0,0,0,.35); }
/* De lopende tekst in die secties is in het thema grijs (#66687e !important) — grijs op een foto
   blijft onleesbaar. Daar wit van maken; koppen/knoppen behouden hun eigen kleur. */
body.home #et-boc .et_pb_section_0 .et_pb_text, body.page-id-132 #et-boc .et_pb_section_0 .et_pb_text, body.page-id-134 #et-boc .et_pb_section_0 .et_pb_text,
#et-boc .et_pb_section_0_tb_footer .et_pb_text,
body.home #et-boc .et_pb_section_0 .et_pb_text p, body.page-id-132 #et-boc .et_pb_section_0 .et_pb_text p, body.page-id-134 #et-boc .et_pb_section_0 .et_pb_text p,
#et-boc .et_pb_section_0_tb_footer .et_pb_text p { color: rgba(255,255,255,.96) !important; }
body.home #et-boc .et_pb_section_0::before, body.page-id-132 #et-boc .et_pb_section_0::before, body.page-id-134 #et-boc .et_pb_section_0::before,
#et-boc .et_pb_section_0_tb_footer::before { background: linear-gradient(180deg, rgba(28,30,60,.62) 0%, rgba(28,30,60,.42) 50%, rgba(28,30,60,.1) 100%); }
/* Bedrijfsgegevens in de footer (inject.py) en LinkedIn-link op de Over-pagina */
.kw-bedrijf{display:block;font-size:12px;line-height:1.5;color:#66687E;margin-top:4px}
.kw-profiel{margin:6px 0 0}
.kw-profiel a{font-size:14px;color:#B2914E;text-decoration:underline}

/* Omschakelknop NL/EN (tools/build-en.py): topbalk + mobiel menu */
.kiepe-topbar-section li.kw-lang a{border:1px solid rgba(255,255,255,.45);border-radius:999px;padding:2px 12px;font-weight:600}
.kiepe-topbar-section li.kw-lang a:hover{border-color:#B2914E;color:#B2914E}

/* Kopstructuur (tools/koppen.py): de paginatitel is nu structureel een h1, maar moet eruitzien
   zoals hij als h2 deed. De maten komen uit de Divi-CSS (elke h2-regel geldt ook voor
   .kw-als-h2); hier alleen wat Divi wél op h1 zet en niet op h2. */
h1.kw-als-h2 { font-style: normal; font-weight: 500; }

/* Intakeformulier persoonsbeveiliging (/intake/, site/_kiepe/kiepe-intake.js) */
.kw-intake { max-width: none; }
.kw-intake .kw-sectie { border: 0; margin: 0 0 8px; padding: 0; min-width: 0; }
.kw-intake legend.kw-kop { display: flex; align-items: center; gap: 10px; width: 100%; margin-top: 30px; }
.kw-intake .kw-sectie:first-of-type legend.kw-kop { margin-top: 6px; }
.kw-nr { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: #20223F; color: #fff; font-size: 14px; }
.kw-intro { font-size: 14.5px; line-height: 1.55; color: #44465f; margin: 0 0 16px; }
.kw-hint { display: block; font-size: 13px; color: #66687E; margin-top: 5px; font-weight: 400; }
.kw-melding { background: #fdecea; color: #b3261e; font-weight: 700; border-radius: 8px; padding: 10px 14px; margin: 0; }
.kw-checks { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 18px; }
@media (max-width: 600px) { .kw-checks { grid-template-columns: 1fr; } }
.kw-form .kw-keuze label { align-items: flex-start; line-height: 1.35; }
.kw-form .kw-keuze input { margin-top: 3px; flex: 0 0 auto; }
.kw-item { border: 1px solid rgba(32,34,63,.15); border-radius: 12px; padding: 14px 16px 2px; margin: 0 0 14px; background: rgba(255,255,255,.45); }
.kw-itemkop { display: flex; justify-content: space-between; align-items: center; margin: 0 0 12px; font-weight: 700; color: #20223F; }
.kw-weg, .kw-erbij { font: inherit; font-size: 14px; cursor: pointer; border-radius: 999px; }
.kw-weg { background: none; border: 0; color: #b3261e; text-decoration: underline; padding: 0; }
.kw-erbij { background: #E8E4DF; color: #20223F; border: 1px dashed rgba(32,34,63,.35); padding: 9px 18px; font-weight: 600; margin: 0 0 6px; }
.kw-erbij:hover { background: #ddd7cf; }
.kw-upload { display: inline-block; position: relative; margin-top: 4px; }
.kw-upload input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; }
.kw-upload span { display: inline-block; background: #E8E4DF; color: #20223F; border-radius: 999px; padding: 9px 18px; font-size: 14px; font-weight: 600; }
.kw-upload:focus-within span { outline: 2px solid #caa14a; outline-offset: 2px; }
.kw-lijst { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.kw-bestand { position: relative; width: 92px; font-size: 11px; color: #44465f; }
.kw-bestand img, .kw-bestand .kw-pdf { display: flex; align-items: center; justify-content: center; width: 92px; height: 92px; object-fit: cover; border-radius: 8px; background: #E8E4DF; font-weight: 700; color: #20223F; }
.kw-bnaam { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 3px; }
.kw-bestand button { position: absolute; top: 4px; right: 4px; width: 24px; height: 24px; border-radius: 50%; border: 0; background: rgba(32,34,63,.85); color: #fff; font-size: 16px; line-height: 1; cursor: pointer; }
.kw-form .kw-fout input, .kw-form .kw-fout select, .kw-form .kw-fout textarea { border-color: #b3261e; box-shadow: 0 0 0 1px #b3261e; }
.kw-form .kw-fout .kw-veldkop, .kw-form .kw-fout > label { color: #b3261e; }
.kw-slot { border-top: 1px solid rgba(32,34,63,.15) !important; padding-top: 18px !important; margin-top: 26px !important; }
.kw-slot .kw-hint a { color: #B2914E; text-decoration: underline; }
.kw-bedankt .kw-kop { margin-top: 0; }
.kw-bedankt p { color: #20223F; }
/* /intake/: uitleg boven, de kaart met het (lange) formulier over de volle breedte eronder */
.kiepe-center-row.kw-rij-stapel { display: flex; flex-direction: column-reverse; align-items: stretch; max-width: 920px; }
.kw-rij-stapel > .et_pb_column { width: 100% !important; margin-right: 0 !important; }
.kw-rij-stapel > .et_pb_column_1 { margin-bottom: 30px !important; }
@media (max-width: 600px) { .kw-rij-stapel > .et_pb_column_0 { padding: 26px 18px !important; } }
/* Intake als losse pagina (body.kw-alleen-formulier, gezet door kiepe-intake.js): alleen logo, taalknop, het formulier en de onderste footerregel */
body.kw-alleen-formulier .kiepe-topbar-section li:not(.kw-lang),
body.kw-alleen-formulier .kiepe-header .et_pb_menu__menu,
body.kw-alleen-formulier .kiepe-header .et_mobile_nav_menu,
body.kw-alleen-formulier .et_pb_section_0_tb_footer,
body.kw-alleen-formulier .et_pb_section_1_tb_footer,
body.kw-alleen-formulier .kw-duo-nood { display: none !important; }
.kw-taal { display: none; margin: 0 0 12px; text-align: right; }
.kw-taal a { display: inline-block; border: 1px solid rgba(32,34,63,.3); border-radius: 999px; padding: 3px 14px; font-size: 14px; font-weight: 600; color: #20223F; }
@media (max-width: 980px) { body.kw-alleen-formulier .kw-taal { display: block; } }
/* Intake: uitleg over het bewaren op dit apparaat + melding bij terugkomst */
.kw-concept-uitleg { font-size: 13.5px; color: #66687E; margin: -6px 0 16px; }
.kw-wis { background: none; border: 0; padding: 0; font: inherit; color: #B2914E; text-decoration: underline; cursor: pointer; }
.kw-concept-terug { background: #eef6f0; color: #1a6b3c; border-radius: 8px; padding: 10px 14px; font-size: 14.5px; margin: 0 0 16px; }

/* Over-pagina: foto in plaats van de YouTube-video (05-10-2026) */
.kw-over-foto{display:block;width:100%;height:auto;border-radius:12px}

/* Footer: social media in twee rijen (KSG en Ferenc), via inject.py */
.kw-social .kw-social-kop{margin:0 0 6px;padding:0;font-size:13px;font-weight:600;line-height:1.3;color:#20223F}
.kw-social ul.et_pb_social_media_follow{margin:0 0 14px}
.kw-social a.icon{position:relative}
.kw-social a.icon:before{color:#20223F!important}
.kw-social a.icon:hover:before{color:#fff!important}
.kw-social .et-social-tiktok a.icon:before{content:""!important;position:absolute;left:9px;top:9px;width:14px;height:14px;background:#20223F;-webkit-mask:url(/_kiepe/tiktok.svg) center/contain no-repeat;mask:url(/_kiepe/tiktok.svg) center/contain no-repeat}
.kw-social .et-social-tiktok a.icon:hover:before{background:#fff}

/* Logo-rij opdrachtgevers (app/lib/logos.js; beheer in het portaal onder "Logo's opdrachtgevers") */
.kw-logos{margin:0;padding:0}
.kw-logos--home{background:#fff;padding:48px 0 56px;border-top:1px solid rgba(32,34,63,.08)}
.kw-logos--contact{margin-top:28px}
.kw-logos-kop{margin:0 auto 22px;padding:0 16px;max-width:1080px;font-family:inherit;font-size:15px;font-weight:600;letter-spacing:.02em;color:#20223F;text-align:center}
.kw-logos--contact .kw-logos-kop{text-align:left;padding:0;margin-bottom:14px}
.kw-logos-band{overflow:hidden;max-width:1180px;margin:0 auto;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.kw-logos-spoor{display:flex;width:max-content}
.kw-logos-rij{display:flex;align-items:center;gap:56px;margin:0;padding:0 28px;list-style:none!important}
.kw-logos-rij li{list-style:none!important;margin:0;padding:0;flex:0 0 auto}
.kw-logos-rij li::before{display:none}
.kw-logos-rij img{display:block;height:44px;width:auto;max-width:170px;object-fit:contain;filter:grayscale(1);opacity:.6;transition:filter .3s,opacity .3s}
.kw-logos-rij a:hover img,.kw-logos-rij a:focus img,.kw-logos-rij span:hover img{filter:none;opacity:1}
.kw-logos:not(.kw-logos--loopt) .kw-logos-band{-webkit-mask-image:none;mask-image:none}
.kw-logos:not(.kw-logos--loopt) .kw-logos-spoor{width:auto;justify-content:center}
.kw-logos--contact:not(.kw-logos--loopt) .kw-logos-spoor{justify-content:flex-start}
.kw-logos:not(.kw-logos--loopt) .kw-logos-rij{flex-wrap:wrap;justify-content:center;row-gap:24px}
.kw-logos--contact .kw-logos-rij{padding-left:0;gap:36px}
.kw-logos--loopt .kw-logos-spoor{animation:kw-logos-loop var(--kw-duur,40s) linear infinite}
.kw-logos--loopt .kw-logos-band:hover .kw-logos-spoor,.kw-logos--loopt .kw-logos-band:focus-within .kw-logos-spoor{animation-play-state:paused}
@keyframes kw-logos-loop{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){
  .kw-logos--loopt .kw-logos-spoor{animation:none;width:auto;justify-content:center}
  .kw-logos--loopt .kw-logos-rij{flex-wrap:wrap;justify-content:center;row-gap:24px}
  .kw-logos--loopt .kw-logos-rij[aria-hidden]{display:none}
  .kw-logos--loopt .kw-logos-band{-webkit-mask-image:none;mask-image:none}
}
@media (max-width:767px){.kw-logos-rij{gap:36px}.kw-logos-rij img{height:34px;max-width:130px}.kw-logos--home{padding:36px 0 40px}}
/* contactpagina: donkere achtergrond, logo's wit (zoals het oude Brink's-logo op die plek) */
.kw-logos--contact .kw-logos-kop{color:#fff;font-family:"PT Serif",Georgia,serif;font-style:italic;font-size:17px;letter-spacing:0}
.kw-logos--contact .kw-logos-rij img{filter:grayscale(1) brightness(0) invert(1);opacity:.75}
.kw-logos--contact .kw-logos-rij a:hover img,.kw-logos--contact .kw-logos-rij a:focus img{filter:grayscale(1) brightness(0) invert(1);opacity:1}
/* Kopknop "Afspraak inplannen": vaste breedte 205px uit Divi; de Engelse tekst ("Schedule an appointment") is langer en liep onder de pijl
   (die staat absoluut 20px van rechts). Breedte mag meegroeien, rechts ruimte voor de pijl; NL blijft 205px. */
header.et-l--header .et_pb_menu__menu>nav>ul>li.kiepe-header-btn-after>a{width:auto!important;min-width:205px;padding-right:54px!important}
/* Stappen-slider (home, werkwijze): pijl bij "Vorige" naar links, bij "Volgende" naar rechts (het pijl-icoon wijst standaard schuin omlaag) */
.slider-navigation .prev-slide:after{transform:rotate(135deg)}
.slider-navigation .next-slide:after{transform:rotate(-45deg)}