{"id":1442,"date":"2024-12-12T10:39:05","date_gmt":"2024-12-12T09:39:05","guid":{"rendered":"https:\/\/inr.institute\/?page_id=1442"},"modified":"2026-08-22T10:12:45","modified_gmt":"2026-08-22T08:12:45","slug":"training-and-development-for-businesses","status":"publish","type":"page","link":"https:\/\/inr.institute\/en\/","title":{"rendered":"Home"},"content":{"rendered":"\n<!-- ============================================================================\n     INR DYNAMICS \u00b7 HERO-SECTIE (met INR Scan + aanmeldknop open training)\n     E\u00e9n bestand. Plak dit volledig in EEN Elementor HTML-widget.\n     Alles gescoped onder .inr-dynamics en afgedwongen met !important.\n\n     De tweede knop (\"Ervaar INR in e&eacute;n dag\") staat naast \"Doe de INR\n     Scan\" en heeft een opvallende glow. Klik erop en het aanmeldpaneel klapt\n     onder de knoppen open: datumkeuze met aantal vrije plekken per dag, en het\n     aanmeldformulier.\n\n     De aanmelding wordt nu rechtstreeks naar de eigen INR Dashboard-plugin\n     gestuurd (endpoint \/wp-json\/inr-dashboard\/v1\/lead-binnen, type\n     'opening_training'). Geen Elementor-formulier meer nodig op de pagina.\n\n     DATA + PLEKKEN AANPASSEN: zoek op  var DATA =  onderaan het script.\n\n     TAALAFHANKELIJK VERBERGEN: zowel de \"Doe de INR Scan\"-knop als de\n     aanmeldknop (\"Ervaar INR in een dag\") zijn verborgen op de Engelse site\n     via class \"hide-on-en\". BELANGRIJK: de verbergregels targeten NIET de\n     globale body.lang-en, maar een class lang-en die de widget zelf op zijn\n     eigen root zet (zie het script). Een regel die met \"body\" begint reikt\n     buiten de widget en brak de TranslatePress-editor (het blok was dan niet\n     meer aanklikbaar om te vertalen). Door alles binnen .inr-dynamics te\n     houden blijft de sectie gewoon vertaalbaar.\n\n     LET OP \u2014 GEEN eigen font\/preconnect meer in dit blok.\n     De header is de enige font-bron van de site en staat op elke pagina\n     boven deze hero in de DOM. Deze hero gebruikt dat font.\n     Voeg hier dus GEEN <link rel=\"preconnect\"> of font-stylesheet toe.\n\n     NB: de LCP-fix verderop (.lcp-class op badge\/h1\/lead) BLIJFT staan. Die\n     hoort bij de hero zelf en staat los van het font: hij zorgt dat de grote\n     h1 meteen als \"painted\" geldt zonder op JS te wachten, wat de LCP drukt.\n     ============================================================================ -->\n<style>\n\/* ---------- ELEMENTOR-ONTWAPENING + ROOT ---------- *\/\n.inr-dynamics{\n  --accent:#292558; --accent-2:#5B4FA8; --ink:#0E0B1C; --grijs:#6B6480; --bg:#F5F4FA;\n  --fluent:#2875FB; --sync:#FD7634; --pulse:#FD4C5C; --echo:#5AC380; --core:#7448FD;\n  --lucht:#9A8FE0; --rood:#D11A2A; --radius:24px; --maxw:1200px;\n  position:relative !important; width:100% !important; max-width:100% !important;\n  margin:0 !important; padding:0 !important; box-sizing:border-box !important;\n  color:var(--ink) !important; background:#FFFFFF !important; line-height:1.5 !important;\n  overflow-x:clip !important; text-align:left !important;\n  -webkit-font-smoothing:antialiased !important;\n}\n.inr-dynamics, .inr-dynamics *, .inr-dynamics *::before, .inr-dynamics *::after{\n  box-sizing:border-box !important;\n  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif !important;\n}\n.inr-dynamics h1,.inr-dynamics h3,.inr-dynamics p,.inr-dynamics span,.inr-dynamics div,.inr-dynamics a,.inr-dynamics label,.inr-dynamics input,.inr-dynamics button{margin:0;padding:0;}\n.inr-dynamics a{text-decoration:none !important;color:inherit !important;}\n\/* ---------- ATMOSFEER (zachte indigo-blobs) ---------- *\/\n.inr-dynamics .atmos{position:absolute !important;inset:0 !important;z-index:0 !important;overflow:hidden !important;pointer-events:none !important;background:transparent !important;}\n.inr-dynamics .blob{position:absolute !important;border-radius:50% !important;filter:blur(120px) !important;opacity:.28 !important;animation:inrd-drift 28s ease-in-out infinite !important;}\n.inr-dynamics .blob.a{width:580px;height:580px;background:rgba(41,37,88,.30);top:-180px;left:-160px;}\n.inr-dynamics .blob.b{width:520px;height:520px;background:rgba(91,79,168,.24);top:34%;right:-200px;animation-delay:-10s;}\n.inr-dynamics .blob.c{width:660px;height:660px;background:rgba(116,72,253,.14);bottom:-260px;left:24%;animation-delay:-18s;}\n@keyframes inrd-drift{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(48px,-36px) scale(1.08);}}\n\/* ---------- LAYOUT ---------- *\/\n.inr-dynamics .wrap{position:relative !important;z-index:1 !important;width:100% !important;max-width:var(--maxw) !important;margin:0 auto !important;padding:0 clamp(28px,5vw,40px) !important;}\n\/* ---------- REVEAL ---------- *\/\n.inr-dynamics .rev{opacity:0;transform:translateY(38px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);}\n.inr-dynamics .rev.in{opacity:1 !important;transform:none !important;}\n.inr-dynamics .d1{transition-delay:.07s;}.inr-dynamics .d2{transition-delay:.14s;}.inr-dynamics .d3{transition-delay:.21s;}\n\/* ---------- LCP-FIX: hero-tekst direct zichtbaar (telt mee als geverfd) ----------\n   De badge, h1 en lead krijgen de class .lcp en starten NIET onzichtbaar.\n   Zo hoeft de browser niet te wachten op IntersectionObserver\/JS voordat het\n   grootste element (de h1) als \"painted\" geldt. Dat drukt de LCP fors.\n   De reveal-beweging blijft behouden voor alles eronder (knoppen, hint, paneel). *\/\n.inr-dynamics .lcp{opacity:1 !important;transform:none !important;transition:none !important;}\n\/* ---------- GRADIENT-TEKST ---------- *\/\n.inr-dynamics .grad{background:linear-gradient(115deg,var(--accent),var(--accent-2)) !important;-webkit-background-clip:text !important;background-clip:text !important;color:transparent !important;-webkit-text-fill-color:transparent !important;}\n\/* ---------- HERO ---------- *\/\n.inr-dynamics .hero{min-height:90vh !important;display:flex !important;flex-direction:column !important;justify-content:center !important;padding:140px clamp(24px,5vw,40px) 90px !important;}\n.inr-dynamics .hero .badge{display:inline-flex !important;align-items:center !important;gap:9px !important;align-self:flex-start !important;\n  font-size:13px !important;font-weight:600 !important;color:var(--accent) !important;background:rgba(41,37,88,.08) !important;\n  padding:8px 16px !important;border-radius:99px !important;margin-bottom:26px !important;}\n.inr-dynamics .hero .badge .stip{width:8px !important;height:8px !important;border-radius:50% !important;background:var(--accent) !important;box-shadow:0 0 0 4px rgba(41,37,88,.15) !important;}\n.inr-dynamics .hero h1{font-weight:600 !important;font-size:clamp(44px,7.4vw,90px) !important;line-height:1.02 !important;letter-spacing:-.038em !important;\n  max-width:17ch !important;color:var(--ink) !important;margin-bottom:30px !important;}\n.inr-dynamics .hero .lead{font-size:clamp(18px,2.3vw,23px) !important;font-weight:300 !important;color:var(--grijs) !important;max-width:56ch !important;line-height:1.5 !important;margin-bottom:42px !important;}\n.inr-dynamics .hero .lead strong{font-weight:600 !important;color:var(--ink) !important;}\n.inr-dynamics .hero .acties{display:flex !important;align-items:center !important;gap:16px !important;flex-wrap:wrap !important;}\n.inr-dynamics .hero .cta{display:inline-flex !important;align-items:center !important;gap:11px !important;background:var(--accent) !important;color:#fff !important;\n  font-weight:600 !important;font-size:15px !important;padding:16px 32px !important;border-radius:99px !important;\n  transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s !important;}\n.inr-dynamics .hero .cta:hover{transform:translateY(-3px) !important;box-shadow:0 22px 50px -22px rgba(41,37,88,.6) !important;}\n.inr-dynamics .hero .cta svg{width:17px !important;height:17px !important;}\n\/* ---------- TAALAFHANKELIJK VERBERGEN (EN): INR Scan-knop ----------\n   Zelfde mechanisme als de cta-glow: lang-en op de widget-root (NIET body),\n   hogere specificiteit dan de display:inline-flex !important hierboven. *\/\n.inr-dynamics.lang-en .hero .cta.hide-on-en{display:none !important;}\n\n\/* ---------- AANMELDKNOP: levende call-to-action (naast INR Scan) ---------- *\/\n.inr-dynamics .hero .cta-glow{position:relative !important;display:inline-flex !important;align-items:center !important;gap:11px !important;\n  color:#fff !important;font-weight:600 !important;font-size:15px !important;padding:16px 32px !important;border:none !important;border-radius:99px !important;cursor:pointer !important;\n  isolation:isolate !important;overflow:hidden !important;\n  \/* bewegende gradient die doorheen schuift *\/\n  background:linear-gradient(115deg,#292558,#5B4FA8,#7448FD,#5B4FA8,#292558) !important;\n  background-size:300% 100% !important;\n  animation:inr-schuif 6s ease-in-out infinite, inr-adem 2.8s ease-in-out infinite !important;\n  transition:transform .35s cubic-bezier(.2,.7,.2,1) !important;}\n.inr-dynamics .hero .cta-glow:hover{transform:translateY(-3px) !important;}\n\/* lichtveeg die periodiek overheen trekt (binnen de pill geclipt) *\/\n.inr-dynamics .hero .cta-glow::after{content:'' !important;position:absolute !important;top:0 !important;bottom:0 !important;width:40% !important;left:-60% !important;z-index:1 !important;\n  background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent) !important;\n  transform:skewX(-18deg) !important;animation:inr-veeg 4.2s ease-in-out infinite !important;pointer-events:none !important;}\n\/* content boven de lichtveeg *\/\n.inr-dynamics .hero .cta-glow > *{position:relative !important;z-index:2 !important;}\n.inr-dynamics .hero .cta-glow svg{width:18px !important;height:18px !important;stroke:currentColor !important;fill:none !important;stroke-width:2.2 !important;stroke-linecap:round !important;stroke-linejoin:round !important;display:block !important;}\n.inr-dynamics .hero .cta-glow .vonk{fill:#fff !important;stroke:none !important;animation:inr-flikker 3.4s ease-in-out infinite !important;}\n.inr-dynamics .hero .cta-glow .pijl{transition:transform .4s cubic-bezier(.2,.7,.2,1) !important;}\n.inr-dynamics .hero .cta-glow .gratis-pill{display:inline-flex !important;align-items:center !important;\n  font-size:11px !important;font-weight:700 !important;letter-spacing:.06em !important;text-transform:uppercase !important;\n  color:#fff !important;background:rgba(255,255,255,.22) !important;border:1px solid rgba(255,255,255,.45) !important;\n  padding:3px 9px !important;border-radius:99px !important;line-height:1 !important;-webkit-backdrop-filter:blur(4px) !important;backdrop-filter:blur(4px) !important;}\n.inr-dynamics.open .hero .cta-glow .pijl{transform:rotate(90deg) !important;}\n\/* ---------- TAALAFHANKELIJK VERBERGEN (EN) ----------\n   De cta-glow knop wordt verborgen op de Engelse site. De class lang-en wordt\n   door de widget zelf op .inr-dynamics gezet (zie script), NIET op body. Zo\n   blijft de selector binnen de widget en breekt hij de TranslatePress-editor\n   niet. Hogere specificiteit dan de display:inline-flex !important hierboven,\n   dus het verbergen wint. *\/\n.inr-dynamics.lang-en .hero .cta-glow.hide-on-en{display:none !important;}\n@keyframes inr-schuif{0%,100%{background-position:0% 50%;}50%{background-position:100% 50%;}}\n@keyframes inr-adem{\n  0%,100%{box-shadow:0 0 18px -2px rgba(116,72,253,.5), 0 12px 34px -10px rgba(91,79,168,.85);}\n  50%{box-shadow:0 0 34px 4px rgba(116,72,253,.85), 0 12px 38px -8px rgba(91,79,168,.95);}\n}\n@keyframes inr-veeg{\n  0%{left:-60%;}\n  55%{left:120%;}\n  100%{left:120%;}\n}\n@keyframes inr-flikker{0%,100%{opacity:1;}50%{opacity:.55;}}\n\n.inr-dynamics .hero .hint{margin-top:58px !important;display:flex !important;align-items:center !important;gap:12px !important;font-size:13px !important;color:var(--grijs) !important;letter-spacing:.04em !important;}\n.inr-dynamics .hero .hint .lijn{width:46px !important;height:1px !important;background:linear-gradient(90deg,var(--grijs),transparent) !important;}\n\n\/* ---------- INKLAPBAAR AANMELDPANEEL ---------- *\/\n.inr-dynamics .paneel-houder{max-height:0 !important;overflow:hidden !important;opacity:0 !important;\n  transition:max-height .6s cubic-bezier(.2,.7,.2,1),opacity .5s ease,margin-top .5s ease !important;margin-top:0 !important;}\n.inr-dynamics.open .paneel-houder{max-height:1600px !important;opacity:1 !important;margin-top:32px !important;}\n.inr-dynamics .kaart{position:relative !important;background:#fff !important;max-width:620px !important;\n  border:1px solid rgba(41,37,88,.12) !important;border-radius:var(--radius) !important;padding:clamp(26px,4vw,38px) !important;min-width:0 !important;\n  box-shadow:0 30px 70px -42px rgba(41,37,88,.45) !important;overflow:hidden !important;}\n.inr-dynamics .kaart::before{content:'' !important;position:absolute !important;top:-120px !important;right:-90px !important;width:320px !important;height:320px !important;\n  border-radius:50% !important;background:radial-gradient(circle,rgba(91,79,168,.16),transparent 70%) !important;filter:blur(40px) !important;pointer-events:none !important;}\n.inr-dynamics .kaart > *{position:relative !important;z-index:1 !important;}\n.inr-dynamics .keyebrow{font-size:12px !important;font-weight:600 !important;letter-spacing:.16em !important;text-transform:uppercase !important;color:var(--accent) !important;margin-bottom:8px !important;}\n.inr-dynamics .ktitel{font-weight:600 !important;font-size:clamp(20px,3vw,24px) !important;letter-spacing:-.02em !important;color:var(--ink) !important;margin-bottom:6px !important;line-height:1.2 !important;}\n.inr-dynamics .ksub{font-size:14.5px !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.55 !important;margin-bottom:18px !important;}\n.inr-dynamics .ksub strong{font-weight:600 !important;color:var(--ink) !important;}\n.inr-dynamics .gratis-banner{display:flex !important;align-items:flex-start !important;gap:11px !important;\n  background:rgba(41,37,88,.06) !important;border:1px solid rgba(41,37,88,.14) !important;border-radius:14px !important;\n  padding:14px 16px !important;margin-bottom:22px !important;font-size:13.5px !important;line-height:1.5 !important;color:var(--grijs) !important;font-weight:300 !important;}\n.inr-dynamics .gratis-banner strong{font-weight:600 !important;color:var(--accent) !important;}\n.inr-dynamics .gratis-banner svg{flex:none !important;width:18px !important;height:18px !important;margin-top:1px !important;\n  stroke:#fff !important;background:var(--accent) !important;border-radius:50% !important;padding:3px !important;\n  fill:none !important;stroke-width:3 !important;stroke-linecap:round !important;stroke-linejoin:round !important;}\n\/* datumkeuze *\/\n.inr-dynamics .data-lijst{display:flex !important;flex-direction:column !important;gap:9px !important;margin-bottom:22px !important;}\n.inr-dynamics .datum{display:flex !important;align-items:center !important;gap:14px !important;width:100% !important;text-align:left !important;cursor:pointer !important;\n  background:#fff !important;border:1px solid rgba(41,37,88,.14) !important;border-radius:14px !important;padding:15px 17px !important;\n  transition:border-color .3s ease,box-shadow .3s ease,transform .3s ease !important;}\n.inr-dynamics .datum:hover{border-color:var(--accent) !important;transform:translateY(-1px) !important;}\n.inr-dynamics .datum.sel{border-color:var(--accent) !important;box-shadow:0 0 0 3px rgba(41,37,88,.12) !important;background:rgba(41,37,88,.03) !important;}\n.inr-dynamics .datum .radio{flex:none !important;width:20px !important;height:20px !important;border-radius:50% !important;border:2px solid rgba(41,37,88,.3) !important;position:relative !important;transition:border-color .3s ease !important;}\n.inr-dynamics .datum.sel .radio{border-color:var(--accent) !important;}\n.inr-dynamics .datum.sel .radio::after{content:'' !important;position:absolute !important;inset:3px !important;border-radius:50% !important;background:var(--accent) !important;}\n.inr-dynamics .datum .dinfo{flex:1 1 auto !important;min-width:0 !important;}\n.inr-dynamics .datum .ddatum{display:block !important;font-size:16px !important;font-weight:600 !important;color:var(--ink) !important;letter-spacing:-.01em !important;}\n.inr-dynamics .datum .dmeta{display:block !important;font-size:13px !important;font-weight:300 !important;color:var(--grijs) !important;margin-top:1px !important;}\n.inr-dynamics .datum .drechts{flex:none !important;display:flex !important;flex-direction:column !important;align-items:flex-end !important;gap:5px !important;}\n.inr-dynamics .datum .dvolgend{font-size:11px !important;font-weight:600 !important;letter-spacing:.05em !important;text-transform:uppercase !important;\n  color:var(--accent) !important;background:rgba(41,37,88,.09) !important;padding:4px 10px !important;border-radius:99px !important;white-space:nowrap !important;}\n\/* plekken-badge: altijd rood *\/\n.inr-dynamics .datum .dplek{display:inline-flex !important;align-items:center !important;gap:6px !important;font-size:12px !important;font-weight:600 !important;white-space:nowrap !important;\n  color:var(--rood) !important;background:rgba(209,26,42,.1) !important;padding:4px 10px !important;border-radius:99px !important;}\n.inr-dynamics .datum .dplek .punt{width:6px !important;height:6px !important;border-radius:50% !important;background:var(--rood) !important;display:inline-block !important;animation:inr-knip 1.6s ease-in-out infinite !important;}\n@keyframes inr-knip{0%,100%{opacity:1;}50%{opacity:.3;}}\n\/* velden *\/\n.inr-dynamics .veld{margin-bottom:12px !important;}\n.inr-dynamics .veld label{display:block !important;font-size:13px !important;font-weight:500 !important;color:var(--ink) !important;margin-bottom:6px !important;}\n.inr-dynamics .veld input{width:100% !important;padding:14px 16px !important;border:1px solid rgba(41,37,88,.16) !important;border-radius:12px !important;\n  font-size:15px !important;font-weight:400 !important;color:var(--ink) !important;background:#fff !important;outline:none !important;line-height:1.4 !important;\n  transition:border-color .2s ease,box-shadow .2s ease !important;}\n.inr-dynamics .veld input:focus{border-color:var(--accent) !important;box-shadow:0 0 0 4px rgba(41,37,88,.1) !important;}\n.inr-dynamics .fout{color:#c0392b !important;font-size:13px !important;margin-top:4px !important;display:none !important;font-weight:400 !important;}\n.inr-dynamics .fout.show{display:block !important;}\n.inr-dynamics .kbtn{width:100% !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;gap:10px !important;\n  background:var(--accent) !important;color:#fff !important;font-weight:600 !important;font-size:15px !important;padding:17px 28px !important;border:none !important;\n  border-radius:12px !important;cursor:pointer !important;margin-top:10px !important;transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s !important;}\n.inr-dynamics .kbtn:hover{transform:translateY(-2px) !important;box-shadow:0 18px 40px -20px rgba(41,37,88,.6) !important;}\n.inr-dynamics .kbtn:disabled{opacity:.55 !important;cursor:wait !important;transform:none !important;}\n.inr-dynamics .kbtn svg{width:17px !important;height:17px !important;stroke:currentColor !important;fill:none !important;stroke-width:2.2 !important;stroke-linecap:round !important;stroke-linejoin:round !important;}\n.inr-dynamics .belofte{margin-top:16px !important;display:flex !important;align-items:flex-start !important;gap:9px !important;font-size:12.5px !important;line-height:1.5 !important;color:var(--grijs) !important;}\n.inr-dynamics .belofte svg{width:14px !important;height:14px !important;flex:none !important;margin-top:2px !important;stroke:var(--accent) !important;fill:none !important;stroke-width:2 !important;stroke-linecap:round !important;stroke-linejoin:round !important;}\n\/* bevestiging *\/\n.inr-dynamics .klaar{text-align:center !important;padding:14px 0 !important;animation:inrd-fade .6s cubic-bezier(.2,.7,.2,1) both !important;}\n.inr-dynamics .klaar .vink{width:64px !important;height:64px !important;border-radius:50% !important;background:rgba(41,37,88,.1) !important;color:var(--accent) !important;\n  display:flex !important;align-items:center !important;justify-content:center !important;margin:0 auto 22px !important;}\n.inr-dynamics .klaar .vink svg{width:30px !important;height:30px !important;stroke:currentColor !important;fill:none !important;stroke-width:2.4 !important;stroke-linecap:round !important;stroke-linejoin:round !important;}\n.inr-dynamics .klaar h3{font-weight:600 !important;font-size:24px !important;letter-spacing:-.02em !important;color:var(--ink) !important;margin-bottom:10px !important;}\n.inr-dynamics .klaar p{font-size:15px !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.6 !important;max-width:38ch !important;margin:0 auto !important;}\n.inr-dynamics .klaar .kdatum{display:inline-block !important;margin-top:18px !important;font-size:14px !important;font-weight:600 !important;color:var(--accent) !important;\n  background:rgba(41,37,88,.08) !important;padding:9px 18px !important;border-radius:99px !important;}\n@keyframes inrd-fade{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:none;}}\n\/* honeypot: voor mensen volledig onzichtbaar, alleen bots vullen 'm in *\/\n.inr-dynamics .inr-hp{position:absolute !important;left:-9999px !important;top:auto !important;width:1px !important;height:1px !important;overflow:hidden !important;}\n@media(max-width:820px){\n  .inr-dynamics{padding-left:22px !important;padding-right:22px !important;}\n  .inr-dynamics .wrap,.inr-dynamics .hero{padding-left:0 !important;padding-right:0 !important;}\n  .inr-dynamics .hero{min-height:auto !important;padding:120px 0 70px !important;}\n  .inr-dynamics .hero h1{font-size:clamp(34px,9vw,52px) !important;}\n  .inr-dynamics .hero .lead{font-size:18px !important;}\n  .inr-dynamics .blob.a{width:320px;height:320px;top:-90px;left:-100px;}\n  .inr-dynamics .blob.b{width:300px;height:300px;right:-140px;}\n  .inr-dynamics .blob.c{width:340px;height:340px;left:-60px;bottom:-160px;}\n}\n@media(max-width:560px){\n  .inr-dynamics .datum{flex-wrap:wrap !important;align-items:flex-start !important;}\n  .inr-dynamics .datum .dinfo{flex:1 1 calc(100% - 34px) !important;}\n  .inr-dynamics .datum .drechts{flex-direction:row !important;flex-wrap:wrap !important;align-items:center !important;justify-content:flex-start !important;\n    width:100% !important;margin-top:8px !important;padding-left:34px !important;gap:8px !important;}\n  .inr-dynamics .datum .dplek,.inr-dynamics .datum .dvolgend{margin:0 !important;}\n}\n@media(prefers-reduced-motion:reduce){\n  .inr-dynamics .rev{opacity:1 !important;transform:none !important;transition:none !important;}\n  .inr-dynamics .blob{animation:none !important;}\n  .inr-dynamics .hero .cta-glow{animation:none !important;}\n  .inr-dynamics .hero .cta-glow::after{animation:none !important;display:none !important;}\n  .inr-dynamics .hero .cta-glow .vonk{animation:none !important;}\n  .inr-dynamics .datum .dplek .punt{animation:none !important;}\n}\n<\/style>\n<div class=\"inr-dynamics\" id=\"inrDyn\">\n  <div class=\"atmos\"><div class=\"blob a\"><\/div><div class=\"blob b\"><\/div><div class=\"blob c\"><\/div><\/div>\n  <section class=\"hero wrap\">\n    <h1 class=\"lcp\">Elke vraag in je organisatie komt uiteindelijk samen op \u00e9\u00e9n plek: de <span class=\"grad\">mens<\/span>.<\/h1>\n    <p class=\"lead lcp\">Of het nu gaat om je omzet, je leiders, je cultuur, je teams of de groei van mensen zelf. Onder al die vragen ligt hetzelfde patroon. <strong>INR maakt dat zichtbaar en laat ontwikkeling overal tegelijk op gang komen.<\/strong><\/p>\n    <div class=\"acties rev d3\">\n      <a class=\"cta hide-on-en\" href=\"#inrscan\">Doe de INR Scan <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\"><path d=\"M5 12h14M13 6l6 6-6 6\"><\/path><\/svg><\/a>\n      <button type=\"button\" class=\"cta-glow hide-on-en\" id=\"inrTrigger\" aria-expanded=\"false\">\n        <svg class=\"vonk\" viewBox=\"0 0 24 24\"><path d=\"M13 2 4 14h7l-1 8 9-12h-7l1-8z\"><\/path><\/svg>\n        Ervaar INR in \u00e9\u00e9n dag\n        <span class=\"gratis-pill\">Gratis<\/span>\n        <svg class=\"pijl\" viewBox=\"0 0 24 24\"><path d=\"M9 6l6 6-6 6\"><\/path><\/svg>\n      <\/button>\n    <\/div>\n\n    <div class=\"paneel-houder\" id=\"inrPaneel\">\n      <div class=\"kaart\" id=\"inrKaart\"><!-- inhoud via JS --><\/div>\n    <\/div>\n\n    <div class=\"hint rev d3\"><span class=\"lijn\"><\/span>Scroll en zie wat dit voor jouw organisatie betekent<\/div>\n  <\/section>\n  <!-- Honeypot-veld: blijft leeg bij echte mensen. -->\n  <input type=\"text\" class=\"inr-hp\" id=\"inrHp\" tabindex=\"-1\" autocomplete=\"off\" aria-hidden=\"true\">\n<\/div>\n<!-- ===================== EINDE .inr-dynamics ===================== -->\n<script>\n(function(){\n'use strict';\n\n  \/* Het ontvangstpunt in de eigen INR Dashboard-plugin. *\/\n  var INR_ENDPOINT = '\/wp-json\/inr-dashboard\/v1\/lead-binnen';\n  var INR_FORM = 'opening_training';\n  \/* Tijdstip waarop het formulier laadde (voor het anti-bot tijdslot). *\/\n  var INR_GELADEN = Math.floor(Date.now() \/ 1000);\n\n  \/* ====  DATA + PLEKKEN AANPASSEN  ==== *\/\n  var DATA = [\n    { datum:'2026-09-07', plekken:0  },\n    { datum:'2027-01-11', plekken:5  },\n    { datum:'2027-05-03', plekken:6  },\n    { datum:'2027-09-03', plekken:13 }\n  ];\n\n  var MAANDEN = ['januari','februari','maart','april','mei','juni','juli','augustus','september','oktober','november','december'];\n  var DAGEN = ['zondag','maandag','dinsdag','woensdag','donderdag','vrijdag','zaterdag'];\n\n  function start(){\n    var root=document.getElementById('inrDyn');\n    if(!root) return;\n\n    \/* Taalvlag: zet lang-en op de widget-root zelf (NIET op body) wanneer de\n       URL het \/en\/-pad bevat. Zo blijft de verbergregel binnen .inr-dynamics\n       en breekt hij de TranslatePress-editor niet. *\/\n    if(\/\\\/en\\\/\/.test(window.location.pathname)) root.classList.add('lang-en');\n\n    \/\/ reveal (alleen voor elementen met .rev; de hero-tekst .lcp is al zichtbaar)\n    var els=root.querySelectorAll('.rev');\n    if(!('IntersectionObserver' in window)){ els.forEach(function(e){e.classList.add('in');}); }\n    else{\n      var io=new IntersectionObserver(function(es){es.forEach(function(e){if(e.isIntersecting){e.target.classList.add('in');io.unobserve(e.target);}});},{threshold:.12,rootMargin:'0px 0px -8% 0px'});\n      els.forEach(function(e){io.observe(e);});\n    }\n\n    \/\/ open\/dicht\n    var trigger=document.getElementById('inrTrigger');\n    trigger.onclick=function(){\n      var open=root.classList.toggle('open');\n      trigger.setAttribute('aria-expanded', open ? 'true' : 'false');\n    };\n\n    var kaart=document.getElementById('inrKaart');\n    var vandaag=new Date(); vandaag.setHours(0,0,0,0);\n    var komend=DATA\n      .map(function(d){ return { datum:new Date(d.datum+'T00:00:00'), plekken:d.plekken }; })\n      .filter(function(d){ return d.datum.getTime() >= vandaag.getTime(); })\n      .sort(function(a,b){ return a.datum - b.datum; });\n    var gekozen=0;\n\n    function datumLabel(d){ return DAGEN[d.getDay()]+' '+d.getDate()+' '+MAANDEN[d.getMonth()]+' '+d.getFullYear(); }\n    function datumKort(d){ return d.getDate()+' '+MAANDEN[d.getMonth()]+' '+d.getFullYear(); }\n    function plekTekst(n){ return n===1 ? 'Nog 1 plek' : 'Nog '+n+' plekken'; }\n\n    function veldenHtml(metDatum){\n      return ''+\n        '<div class=\"veld\"><label for=\"inrNaam\">Naam<\/label><input type=\"text\" id=\"inrNaam\" placeholder=\"Voor- en achternaam\" autocomplete=\"name\"><\/div>'+\n        '<div class=\"veld\"><label for=\"inrMail\">E-mailadres<\/label><input type=\"email\" id=\"inrMail\" placeholder=\"jij@bedrijf.nl\" autocomplete=\"email\"><\/div>'+\n        '<div class=\"fout\" id=\"inrFout\">Vul je naam en een geldig e-mailadres in.<\/div>'+\n        '<button type=\"button\" class=\"kbtn\" id=\"inrAanmeld\">'+(metDatum?'Aanmelden voor deze dag':'Houd mij op de hoogte')+' <svg viewBox=\"0 0 24 24\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg><\/button>'+\n        '<div class=\"belofte\"><svg viewBox=\"0 0 24 24\"><path d=\"M20 6L9 17l-5-5\"\/><\/svg><span>We gebruiken je gegevens alleen voor deze aanmelding en nemen contact op om je deelname te bevestigen.<\/span><\/div>';\n    }\n\n    if(!komend.length){\n      kaart.innerHTML =\n        '<div class=\"keyebrow\">Open training<\/div>'+\n        '<div class=\"ktitel\">Nieuwe data volgen binnenkort.<\/div>'+\n        '<div class=\"ksub\">Er staat op dit moment geen open training gepland. Laat je gegevens achter en we laten het je weten zodra de nieuwe data bekend zijn.<\/div>'+\n        veldenHtml(false);\n      koppelFormulier(kaart, null);\n      return;\n    }\n\n    function teken(){\n      var lijst='';\n      komend.forEach(function(d,i){\n        lijst +=\n          '<button type=\"button\" class=\"datum'+(i===gekozen?' sel':'')+'\" data-i=\"'+i+'\">'+\n            '<span class=\"radio\"><\/span>'+\n            '<span class=\"dinfo\">'+\n              '<span class=\"ddatum\">'+datumLabel(d.datum)+'<\/span>'+\n              '<span class=\"dmeta\">Eendaagse open training &middot; INR Model<\/span>'+\n            '<\/span>'+\n            '<span class=\"drechts\">'+\n              (i===0 ? '<span class=\"dvolgend\">Eerstvolgend<\/span>' : '')+\n              '<span class=\"dplek\"><span class=\"punt\"><\/span>'+plekTekst(d.plekken)+'<\/span>'+\n            '<\/span>'+\n          '<\/button>';\n      });\n      kaart.innerHTML =\n        '<div class=\"keyebrow\">Meld je aan<\/div>'+\n        '<div class=\"ktitel\">Kies jouw trainingsdag.<\/div>'+\n        '<div class=\"ksub\">Een volledige dag kennismaken met het INR Model. <strong>Kosteloos, zonder verplichtingen.<\/strong> Let op: het aantal plekken per dag is beperkt.<\/div>'+\n        '<div class=\"gratis-banner\"><svg viewBox=\"0 0 24 24\"><path d=\"M20 6L9 17l-5-5\"\/><\/svg><span><strong>Gratis deelname.<\/strong> Je betaalt niets, we vragen alleen je gegevens om je plek te bevestigen.<\/span><\/div>'+\n        '<div class=\"data-lijst\">'+lijst+'<\/div>'+\n        veldenHtml(true);\n      kaart.querySelectorAll('.datum').forEach(function(b){\n        b.onclick=function(){ gekozen=+b.dataset.i; teken(); };\n      });\n      koppelFormulier(kaart, function(){ return komend[gekozen]; });\n    }\n\n    function koppelFormulier(container, keuzeFn){\n      var naam=container.querySelector('#inrNaam');\n      var mail=container.querySelector('#inrMail');\n      var fout=container.querySelector('#inrFout');\n      var btn=container.querySelector('#inrAanmeld');\n      if(!btn) return;\n      btn.onclick=function(){\n        var nv=(naam&&naam.value||'').trim();\n        var mv=(mail&&mail.value||'').trim();\n        var mailOk=\/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$\/.test(mv);\n        if(nv.length<2 || !mailOk){ fout.classList.add('show'); return; }\n        fout.classList.remove('show');\n        btn.disabled=true; btn.textContent='Een moment...';\n        var keuze = keuzeFn ? keuzeFn() : null;\n        verzendNaarPlugin(nv, mv, keuze, function(res){\n          if(res.ok){ toonKlaar(nv, keuze); }\n          else { fout.textContent=res.error || 'Er ging iets mis. Probeer het zo nog eens.'; fout.classList.add('show'); btn.disabled=false; btn.textContent='Probeer opnieuw'; }\n        });\n      };\n      [naam,mail].forEach(function(f){ if(f) f.addEventListener('keypress',function(e){ if(e.key==='Enter') btn.click(); }); });\n    }\n\n    function veiligeTekst(s){ var d=document.createElement('div'); d.textContent=s; return d.innerHTML; }\n\n    function toonKlaar(naam, keuze){\n      var regel = keuze ? '<div class=\"kdatum\">'+datumKort(keuze.datum)+'<\/div>' : '';\n      var tekst = keuze\n        ? 'Je aanmelding voor de open training is bij ons binnen. We bevestigen je deelname per e-mail en sturen alle praktische details ruim van tevoren.'\n        : 'We hebben je gegevens ontvangen en laten het je weten zodra de nieuwe data bekend zijn.';\n      kaart.innerHTML =\n        '<div class=\"klaar\">'+\n          '<div class=\"vink\"><svg viewBox=\"0 0 24 24\"><path d=\"M20 6L9 17l-5-5\"\/><\/svg><\/div>'+\n          '<h3>Bedankt, '+veiligeTekst(naam.split(' ')[0])+'.<\/h3>'+\n          '<p>'+tekst+'<\/p>'+\n          regel+\n        '<\/div>';\n    }\n\n    \/* ====  Verzending naar de eigen INR Dashboard-plugin ====\n       Naam\/e-mail als kernvelden; gekozen datum, soort aanmelding en vrije\n       plekken als nette aparte velden, zodat ze los in de inbox verschijnen. *\/\n    function verzendNaarPlugin(naam, email, keuze, klaar){\n      var datum = keuze ? keuze.datum : null;\n      var datumTekst = datum\n        ? (DAGEN[datum.getDay()]+' '+datum.getDate()+' '+MAANDEN[datum.getMonth()]+' '+datum.getFullYear())\n        : '';\n\n      var velden = {};\n      velden['Soort'] = keuze ? 'Aanmelding voor trainingsdag' : 'Op de hoogte houden (geen datum gepland)';\n      if(keuze){\n        velden['Gekozen datum'] = datumTekst;\n        velden['Vrije plekken bij aanmelding'] = String(keuze.plekken);\n      }\n\n      var payload = {\n        form: INR_FORM,\n        naam: naam,\n        email: email,\n        velden: velden,\n        bron: window.location.href,\n        ts: INR_GELADEN,\n        website: (document.getElementById('inrHp') ? document.getElementById('inrHp').value : '')\n      };\n\n      var xhr=new XMLHttpRequest();\n      xhr.open('POST', INR_ENDPOINT, true);\n      xhr.setRequestHeader('Content-Type', 'application\/json');\n      xhr.timeout=15000;\n      xhr.onreadystatechange=function(){\n        if(xhr.readyState!==4) return;\n        if(xhr.status>=200 && xhr.status<300){\n          var ok=true;\n          try { var r=JSON.parse(xhr.responseText); ok=(r && r.ok!==false); } catch(e){}\n          klaar(ok ? { ok:true } : { ok:false });\n        } else {\n          klaar({ ok:false });\n        }\n      };\n      xhr.ontimeout=function(){ klaar({ ok:false }); };\n      xhr.onerror=function(){ klaar({ ok:false }); };\n      xhr.send(JSON.stringify(payload));\n    }\n\n    teken();\n  }\n\n  if(document.readyState==='loading'){document.addEventListener('DOMContentLoaded',start);}else{start();}\n})();\n<\/script>\n\n\n\n<div style=\"max-width:980px;margin-left:auto;margin-right:auto;width:100%;\">\n  <div class=\"inr-video-facade\" data-vimeo=\"1183530206\" role=\"button\" tabindex=\"0\" aria-label=\"Video afspelen\"><\/div>\n<\/div>\n<style>\n  .inr-video-facade {\n    position: relative;\n    display: block;\n    width: 100%;\n    height: 0;\n    padding-bottom: 56.25%;\n    cursor: pointer;\n    background: #000;\n    overflow: hidden;\n    box-sizing: border-box;\n    border-radius: 28px;\n  }\n  .inr-video-facade * { box-sizing: border-box; }\n\n  .inr-video-facade .inr-play {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    width: 80px;\n    height: 80px;\n    opacity: .9;\n    transition: opacity .2s ease, transform .2s ease;\n    pointer-events: none;\n    z-index: 2;\n  }\n  .inr-video-facade:hover .inr-play,\n  .inr-video-facade:focus .inr-play {\n    opacity: 1;\n    transform: translate(-50%, -50%) scale(1.05);\n  }\n  .inr-video-facade:focus { outline: none; }\n  .inr-video-facade:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }\n\n  .inr-video-facade iframe {\n    position: absolute;\n    inset: 0;\n    width: 100%;\n    height: 100%;\n    border: 0;\n  }\n<\/style>\n<script>\n(function () {\n  function initFacades() {\n    var facades = document.querySelectorAll('.inr-video-facade:not([data-init])');\n    for (var i = 0; i < facades.length; i++) {\n      (function (f) {\n        f.setAttribute('data-init', '1');\n        var NS = 'http:\/\/www.w3.org\/2000\/svg';\n        var svg = document.createElementNS(NS, 'svg');\n        svg.setAttribute('viewBox', '0 0 80 80');\n        svg.setAttribute('class', 'inr-play');\n        var circle = document.createElementNS(NS, 'circle');\n        circle.setAttribute('cx', '40'); circle.setAttribute('cy', '40');\n        circle.setAttribute('r', '38'); circle.setAttribute('fill', 'none');\n        circle.setAttribute('stroke', '#fff'); circle.setAttribute('stroke-width', '2');\n        var tri = document.createElementNS(NS, 'path');\n        tri.setAttribute('d', 'M33 28 L54 40 L33 52 Z'); tri.setAttribute('fill', '#fff');\n        svg.appendChild(circle); svg.appendChild(tri);\n        f.appendChild(svg);\n        function load() {\n          if (f.querySelector('iframe')) return;\n          var id = f.getAttribute('data-vimeo');\n          var iframe = document.createElement('iframe');\n          iframe.src = 'https:\/\/player.vimeo.com\/video\/' + id +\n            '?autoplay=1&color&dnt=true&title=0&portrait=0&byline=0';\n          iframe.allow = 'autoplay; fullscreen; picture-in-picture';\n          iframe.setAttribute('allowfullscreen', '');\n          f.innerHTML = '';\n          f.appendChild(iframe);\n        }\n        f.addEventListener('click', load);\n        f.addEventListener('keydown', function (e) {\n          if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); load(); }\n        });\n      })(facades[i]);\n    }\n  }\n  if (document.readyState === 'loading') {\n    document.addEventListener('DOMContentLoaded', initFacades);\n  } else {\n    initFacades();\n  }\n})();\n<\/script>\n\n\n\n<!-- ============================================================================\n     INR STATS \u00b7 LOSSE STRIP MET OPTELLENDE CIJFERS\n     E\u00e9n bestand. Plak dit volledig in EEN Custom HTML-widget.\n     Leeft los tussen bestaande blokken. Alles gescoped onder .inr-stats\n     en afgedwongen met !important zodat de stijl niet wordt overruled.\n     Cijfers tellen op zodra de strip in beeld komt (\u00e9\u00e9n keer per load).\n\n     LET OP \u2014 GEEN eigen font\/preconnect in dit blok.\n     Het Inter-font wordt sitebreed door de header geladen. Niet toevoegen.\n\n     CRAWLBAAR \/ LLM-FIX (deze versie):\n     1. De EINDWAARDE staat als zichtbare tekst in de HTML (200+, 9,2, 10.000+),\n        niet als '0'. Crawlers en LLM's lezen de ruwe HTML v\u00f3\u00f3r JavaScript draait.\n     2. De schaal-labels van de meter (1, 9,2, 10) stonden eerst als tekst in de\n        HTML. Een crawler plakte die aan elkaar tot het betekenisloze getal\n        \"19210\". aria-hidden bleek NIET genoeg: dat verbergt alleen voor\n        schermlezers, crawlers lezen de tekst gewoon.\n        Definitieve fix: de schaal-cijfers staan nu in CSS ::before content\n        (pseudo-elementen). Die komen NIET mee in tekst-extractie door crawlers,\n        maar zijn visueel exact hetzelfde. aria-hidden blijft staan zodat ook\n        schermlezers ze overslaan (puur decoratief).\n     3. De meter houdt een onzichtbaar sr-only tekstlabel dat \"9,2 op een\n        schaal van 10\" expliciet maakt, zodat de betekenis voor een crawler\n        juist klopt in plaats van als los getal rond te zweven.\n     De eindwaarde in de tekst moet exact matchen met data-target.\n     ============================================================================ -->\n\n<style>\n\/* ---------- ROOT ---------- *\/\n.inr-stats{\n  --ink:#0A0A0B; --grijs:#6A6A72; --lijn:rgba(10,10,11,.12); --maxw:1180px;\n  position:relative !important; width:100% !important; max-width:100% !important;\n  margin:0 !important; padding:0 !important; box-sizing:border-box !important;\n  color:var(--ink) !important; background:#FFFFFF !important; line-height:1.5 !important;\n  overflow-x:hidden !important; text-align:left !important;\n  -webkit-font-smoothing:antialiased !important;\n}\n.inr-stats, .inr-stats *, .inr-stats *::before, .inr-stats *::after{\n  box-sizing:border-box !important;\n  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif !important;\n}\n.inr-stats div,.inr-stats span,.inr-stats svg{margin:0;padding:0;}\n\n\/* Visueel verbergen maar leesbaar houden voor crawlers\/schermlezers.\n   Voor de onzichtbare betekenis-labels van de meter. *\/\n.inr-stats .sr-only{\n  position:absolute !important; width:1px !important; height:1px !important;\n  padding:0 !important; margin:-1px !important; overflow:hidden !important;\n  clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important;\n}\n\n.inr-stats .wrap{position:relative !important;z-index:1 !important;width:100% !important;max-width:var(--maxw) !important;margin:0 auto !important;padding:clamp(56px,8vw,90px) clamp(24px,5vw,40px) !important;}\n.inr-stats .rij{display:grid !important;grid-template-columns:repeat(3,1fr) !important;}\n.inr-stats .cel{text-align:center !important;padding:clamp(16px,2vw,28px) clamp(20px,3vw,36px) !important;border-right:1px solid var(--lijn) !important;\n  display:flex !important;flex-direction:column !important;align-items:center !important;justify-content:flex-start !important;}\n.inr-stats .cel:last-child{border-right:0 !important;}\n\n\/* het getal *\/\n.inr-stats .getal{display:inline-flex !important;align-items:baseline !important;justify-content:center !important;\n  font-weight:700 !important;font-size:clamp(48px,8vw,86px) !important;letter-spacing:-.045em !important;line-height:1 !important;color:var(--ink) !important;}\n.inr-stats .getal .num{font-variant-numeric:tabular-nums !important;}\n.inr-stats .getal .plus{font-size:.42em !important;font-weight:600 !important;margin-left:.12em !important;letter-spacing:-.02em !important;}\n\n\/* label *\/\n.inr-stats .label{font-size:clamp(15px,1.7vw,18px) !important;font-weight:400 !important;color:var(--grijs) !important;line-height:1.4 !important;margin-top:18px !important;max-width:20ch !important;}\n\n\/* tevredenheidsmeter (schaal 1 tot 10) *\/\n.inr-stats .meter{width:clamp(150px,80%,200px) !important;margin-top:18px !important;}\n.inr-stats .meter .baan{position:relative !important;width:100% !important;height:6px !important;border-radius:99px !important;background:rgba(10,10,11,.1) !important;overflow:hidden !important;}\n.inr-stats .meter .vul{position:absolute !important;left:0 !important;top:0 !important;bottom:0 !important;width:0% !important;border-radius:99px !important;background:var(--ink) !important;transition:width 1.4s cubic-bezier(.2,.7,.2,1);}\n.inr-stats .meter .schaal{display:flex !important;justify-content:space-between !important;margin-top:9px !important;font-size:12px !important;font-weight:500 !important;color:var(--grijs) !important;letter-spacing:.02em !important;}\n.inr-stats .meter .schaal .op{color:var(--ink) !important;font-weight:600 !important;}\n\n\/* CRAWL-FIX: schaal-cijfers als CSS-content i.p.v. HTML-tekst.\n   Pseudo-elementen komen niet mee in tekst-extractie door crawlers\/LLM's,\n   dus \"1\", \"9,2\" en \"10\" kunnen nooit meer aan elkaar plakken tot \"19210\".\n   Visueel exact identiek aan de oude situatie. *\/\n.inr-stats .meter .schaal .s-min::before{content:\"1\";}\n.inr-stats .meter .schaal .s-score::before{content:\"9,2\";}\n.inr-stats .meter .schaal .s-max::before{content:\"10\";}\n\n\/* reveal van de hele strip *\/\n.inr-stats .rev{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);}\n.inr-stats .rev.in{opacity:1 !important;transform:none !important;}\n.inr-stats .d1{transition-delay:.05s;}.inr-stats .d2{transition-delay:.15s;}.inr-stats .d3{transition-delay:.25s;}\n\n@media(max-width:760px){\n  .inr-stats{padding-left:22px !important;padding-right:22px !important;}\n  .inr-stats .wrap{padding-left:0 !important;padding-right:0 !important;}\n  .inr-stats .rij{grid-template-columns:1fr !important;gap:0 !important;}\n  .inr-stats .cel{border-right:0 !important;border-bottom:1px solid var(--lijn) !important;padding-top:36px !important;padding-bottom:36px !important;}\n  .inr-stats .cel:last-child{border-bottom:0 !important;}\n}\n@media(prefers-reduced-motion:reduce){\n  .inr-stats .rev{opacity:1 !important;transform:none !important;transition:none !important;}\n  .inr-stats .meter .vul{transition:none !important;}\n}\n<\/style>\n\n<div class=\"inr-stats\">\n  <div class=\"wrap\">\n    <div class=\"rij\">\n\n      <div class=\"cel rev d1\">\n        <div class=\"getal\">\n          <span class=\"num\" data-target=\"200\" data-decimals=\"0\">200<\/span><span class=\"plus\">+<\/span>\n        <\/div>\n        <div class=\"label\">Tevreden klanten<\/div>\n      <\/div>\n\n      <div class=\"cel rev d2\">\n        <div class=\"getal\">\n          <span class=\"num\" data-target=\"9.2\" data-decimals=\"1\">9,2<\/span>\n        <\/div>\n        <div class=\"label\">Klanttevredenheid<\/div>\n        <!-- Onzichtbaar betekenis-label: maakt voor crawlers\/schermlezers\n             expliciet dat 9,2 een score op een schaal van 10 is. -->\n        <span class=\"sr-only\">Klanttevredenheid: 9,2 op een schaal van 10.<\/span>\n        <div class=\"meter\" data-rating=\"9.2\">\n          <div class=\"baan\"><span class=\"vul\"><\/span><\/div>\n          <!-- De schaal-cijfers zijn puur decoratief en staan in CSS ::before\n               (zie .s-min\/.s-score\/.s-max hierboven). De spans zelf zijn LEEG,\n               dus een crawler kan hier niets meer lezen of aan elkaar plakken.\n               aria-hidden blijft staan voor schermlezers. -->\n          <div class=\"schaal\" aria-hidden=\"true\"><span class=\"s-min\"><\/span><span class=\"op s-score\"><\/span><span class=\"s-max\"><\/span><\/div>\n        <\/div>\n      <\/div>\n\n      <div class=\"cel rev d3\">\n        <div class=\"getal\">\n          <span class=\"num\" data-target=\"10000\" data-decimals=\"0\" data-thousands=\"1\">10.000<\/span><span class=\"plus\">+<\/span>\n        <\/div>\n        <div class=\"label\">deelnemers die wij hebben ondersteund<\/div>\n      <\/div>\n\n    <\/div>\n  <\/div>\n<\/div>\n\n<script>\n(function(){\n  function start(){\n    var root=document.querySelector('.inr-stats');\n    if(!root)return;\n    var reduce=window.matchMedia&&window.matchMedia('(prefers-reduced-motion:reduce)').matches;\n\n    \/\/ ---- meter referentie ----\n    var meter=root.querySelector('.meter');\n\n    \/\/ ---- helpers ----\n    function format(v,dec,thousands){\n      var s=v.toFixed(dec);\n      if(dec>0)s=s.replace('.',','); \/\/ NL komma\n      if(thousands){\n        var parts=s.split(',');\n        parts[0]=parts[0].replace(\/\\B(?=(\\d{3})+(?!\\d))\/g,'.'); \/\/ NL duizendpunt\n        s=parts.join(',');\n      }\n      return s;\n    }\n    function easeOut(t){return 1-Math.pow(1-t,3);}\n\n    function telOp(el){\n      var target=parseFloat(el.getAttribute('data-target'));\n      var dec=parseInt(el.getAttribute('data-decimals')||'0',10);\n      var thou=el.getAttribute('data-thousands')==='1';\n      \/\/ Bij gereduceerde beweging: laat de al-aanwezige eindwaarde in de HTML\n      \/\/ gewoon staan. Niets doen, zodat we de tekst niet onnodig herschrijven.\n      if(reduce){el.textContent=format(target,dec,thou);return;}\n      \/\/ Animatie mag: zet het getal even op nul en tel dan op naar de eindwaarde.\n      \/\/ De eindwaarde stond al in de HTML (voor crawlers); dit overschrijft die\n      \/\/ alleen tijdelijk voor de visuele count-up en eindigt weer exact op target.\n      el.textContent=format(0,dec,thou);\n      var dur=1500, t0=null;\n      function frame(ts){\n        if(t0===null)t0=ts;\n        var p=Math.min((ts-t0)\/dur,1);\n        var v=target*easeOut(p);\n        el.textContent=format(v,dec,thou);\n        if(p<1)requestAnimationFrame(frame);\n        else el.textContent=format(target,dec,thou);\n      }\n      requestAnimationFrame(frame);\n    }\n    function vulMeter(){\n      if(!meter)return;\n      var rating=parseFloat(meter.getAttribute('data-rating'))||0; \/\/ van 10\n      var pct=Math.max(0,Math.min(100,rating*10));\n      var vul=meter.querySelector('.vul');\n      if(reduce){vul.style.setProperty('transition','none','important');vul.style.setProperty('width',pct+'%','important');return;}\n      \/\/ korte tik vertraging zodat de vulbeweging na de reveal start\n      setTimeout(function(){vul.style.setProperty('width',pct+'%','important');},150);\n    }\n\n    function animeer(){\n      root.querySelectorAll('.num').forEach(telOp);\n      vulMeter();\n    }\n\n    \/\/ ---- in beeld? dan reveal + animatie, \u00e9\u00e9n keer ----\n    var gedaan=false;\n    function trigger(){\n      if(gedaan)return; gedaan=true;\n      root.querySelectorAll('.rev').forEach(function(e){e.classList.add('in');});\n      animeer();\n    }\n    if(!('IntersectionObserver' in window)){trigger();return;}\n    var io=new IntersectionObserver(function(es){\n      es.forEach(function(e){if(e.isIntersecting){trigger();io.disconnect();}});\n    },{threshold:.35});\n    io.observe(root);\n  }\n  if(document.readyState==='loading'){document.addEventListener('DOMContentLoaded',start);}else{start();}\n})();\n<\/script>\n\n\n\n\n\n<!-- ============================================================================\n     INR HOME \u00b7 GEBUNDELD MIDDENBLOK\n     E\u00e9n bestand. Plak dit volledig in \u00c9\u00c9N Elementor HTML-widget.\n     Vervangt vijf plugin-secties: programma-opbrengsten, Ready Set Success,\n     voordelen van training, Gebouwd op INR, en de Ecosysteem-waaier.\n     Alles gescoped onder .inr-home en afgedwongen met !important.\n     Basis is neutraal zwart\/wit. Alleen het Ecosysteem draagt de merkkleuren.\n     ============================================================================ -->\n\n<style>\n\/* ---------- 1. ELEMENTOR-ONTWAPENING + ROOT ---------- *\/\n.inr-home{\n  --ink:#0A0A0B; --grijs:#6A6A72; --lijn:rgba(10,10,11,.10); --bg:#F4F4F6;\n  --fluent:#2875FB; --sync:#FD7634; --pulse:#FD4C5C; --echo:#5AC380; --core:#7448FD; --dyn:#292558;\n  --radius:24px; --maxw:1180px;\n  position:relative !important; width:100% !important; max-width:100% !important;\n  margin:0 !important; padding:0 !important; box-sizing:border-box !important;\n  color:var(--ink) !important; background:#FFFFFF !important; line-height:1.5 !important;\n  overflow-x:hidden !important; text-align:left !important;\n  -webkit-font-smoothing:antialiased !important;\n}\n.inr-home, .inr-home *, .inr-home *::before, .inr-home *::after{\n  box-sizing:border-box !important;\n  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif !important;\n}\n.inr-home h2,.inr-home h3,.inr-home h4,.inr-home p,\n.inr-home span,.inr-home div,.inr-home a{margin:0;padding:0;}\n.inr-home a{text-decoration:none !important;color:inherit !important;}\n\n\/* ---------- 2. ATMOSFEER (zeer subtiel, neutraal) ---------- *\/\n.inr-home .atmos{position:absolute !important;inset:0 !important;z-index:0 !important;overflow:hidden !important;pointer-events:none !important;background:transparent !important;}\n.inr-home .blob{position:absolute !important;border-radius:50% !important;filter:blur(130px) !important;opacity:.06 !important;}\n.inr-home .blob.a{width:560px;height:560px;background:#0A0A0B;top:-160px;left:-140px;}\n.inr-home .blob.b{width:520px;height:520px;background:#0A0A0B;top:55%;right:-200px;}\n\n\/* ---------- 3. LAYOUT-PRIMITIEVEN ---------- *\/\n.inr-home .wrap{position:relative !important;z-index:1 !important;width:100% !important;max-width:var(--maxw) !important;margin:0 auto !important;padding:0 clamp(24px,5vw,40px) !important;}\n.inr-home .sec{position:relative !important;z-index:1 !important;padding:clamp(80px,11vw,128px) 0 !important;}\n\n\/* ---------- 4. TYPO-HELPERS ---------- *\/\n.inr-home .eyebrow{font-size:12px !important;font-weight:600 !important;letter-spacing:.02em !important;text-transform:uppercase !important;color:var(--grijs) !important;}\n.inr-home .kop h2{font-weight:600 !important;font-size:clamp(30px,4.6vw,52px) !important;letter-spacing:-.03em !important;line-height:1.06 !important;color:var(--ink) !important;}\n.inr-home .kop p{font-size:clamp(17px,2vw,19px) !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.6 !important;max-width:62ch !important;}\n\n\/* ---------- 5. REVEAL ---------- *\/\n.inr-home .rev{opacity:0;transform:translateY(34px);transition:opacity .85s cubic-bezier(.2,.7,.2,1),transform .85s cubic-bezier(.2,.7,.2,1);}\n.inr-home .rev.in{opacity:1 !important;transform:none !important;}\n.inr-home .d1{transition-delay:.06s;}.inr-home .d2{transition-delay:.13s;}.inr-home .d3{transition-delay:.2s;}\n.inr-home .d4{transition-delay:.27s;}.inr-home .d5{transition-delay:.34s;}.inr-home .d6{transition-delay:.41s;}\n\n\/* ---------- responsive basis + gutter op buitenste element ---------- *\/\n@media(max-width:820px){\n  .inr-home{padding-left:22px !important;padding-right:22px !important;}\n  .inr-home .wrap{padding-left:0 !important;padding-right:0 !important;}\n  .inr-home .full .wrap{padding-left:22px !important;padding-right:22px !important;}\n  .inr-home .sec.full{margin-left:-22px !important;margin-right:-22px !important;padding-left:22px !important;padding-right:22px !important;}\n  .inr-home .blob{opacity:.05 !important;}\n}\n@media(prefers-reduced-motion:reduce){\n  .inr-home .rev{opacity:1 !important;transform:none !important;transition:none !important;}\n}\n<\/style>\n\n<div class=\"inr-home\">\n<div class=\"atmos\"><div class=\"blob a\"><\/div><div class=\"blob b\"><\/div><\/div>\n\n<!-- ========================= 1. WAT ONZE PROGRAMMA'S OPLEVEREN ========================= -->\n<!-- Eerste opbrengst-sectie. Behandeling: groot genummerd, asymmetrische rij.\n     Onderscheidt zich van de tweede opbrengst-sectie door de outcome-as-statement vorm. -->\n<style>\n.inr-home .opl-grid{display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:1px !important;background:var(--lijn) !important;border:1px solid var(--lijn) !important;border-radius:var(--radius) !important;overflow:hidden !important;margin-top:56px !important;}\n.inr-home .opl-cel{background:#fff !important;padding:clamp(32px,4vw,46px) clamp(28px,3vw,40px) !important;display:flex !important;flex-direction:column !important;transition:background .4s ease !important;}\n.inr-home .opl-cel:hover{background:#FAFAFB !important;}\n.inr-home .opl-cel .ico{width:40px !important;height:40px !important;color:var(--ink) !important;margin-bottom:auto !important;}\n.inr-home .opl-cel .ico svg{width:40px !important;height:40px !important;}\n.inr-home .opl-cel h3{font-weight:600 !important;font-size:clamp(22px,2.6vw,27px) !important;letter-spacing:-.022em !important;line-height:1.12 !important;color:var(--ink) !important;margin:30px 0 14px !important;}\n.inr-home .opl-cel p{font-size:15px !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.62 !important;}\n@media(max-width:820px){.inr-home .opl-grid{grid-template-columns:1fr !important;}}\n<\/style>\n<section class=\"sec wrap\">\n  <div class=\"kop rev\" style=\"max-width:760px !important;\">\n    <span class=\"eyebrow\" style=\"display:block !important;margin-bottom:18px !important;\">Wat onze programma&#8217;s opleveren<\/span>\n    <h2>Wij verbeteren geen gedrag. <br>Wij veranderen hoe een organisatie functioneert.<\/h2>\n    <p style=\"margin-top:20px !important;\">Wanneer het erop aankomt, kijken we met de INR-lens naar wat er werkelijk speelt. Niet naar de symptomen aan de oppervlakte, maar naar de laag eronder.<\/p>\n  <\/div>\n  <div class=\"opl-grid\">\n    <div class=\"opl-cel rev d1\">\n      <div class=\"ico\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\"><path d=\"M12 3v6M12 15v6M3 12h6M15 12h6\"><\/path><path d=\"M12 9v6M9 12h6\"><\/path><\/svg><\/div>\n      <h3>Richting die standhoudt<\/h3>\n      <p>Besluiten zijn helder, acties zijn voorspelbaar, ook wanneer de omstandigheden veranderen. Dat is organisatiekracht met INR.<\/p>\n    <\/div>\n    <div class=\"opl-cel rev d2\">\n      <div class=\"ico\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\"><path d=\"M4 18c4-9 12-9 16 0\"><\/path><circle cx=\"12\" cy=\"8\" r=\"1.4\" fill=\"currentColor\" stroke=\"none\"><\/circle><\/svg><\/div>\n      <h3>Helderheid over wat echt telt<\/h3>\n      <p>Geen ruis over randzaken, geen energieverlies aan onduidelijkheid. Mensen weten wat belangrijk is en handelen daar consequent naar.<\/p>\n    <\/div>\n    <div class=\"opl-cel rev d3\">\n      <div class=\"ico\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\"><circle cx=\"9\" cy=\"8\" r=\"3\"><\/circle><circle cx=\"17\" cy=\"9\" r=\"2.4\"><\/circle><path d=\"M3 19c0-3 2.5-5 6-5s6 2 6 5M16 14c2.6 0 5 1.8 5 5\"><\/path><\/svg><\/div>\n      <h3>Samenwerking die vanzelf gaat<\/h3>\n      <p>Gesprekken worden directer, spanning blijft niet onder de oppervlakte. Mensen werken samen zonder zichzelf te verliezen. We zetten de INR-lens op.<\/p>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- ========================= 2. READY. SET. SUCCESS! (scroll-inkleur) ========================= -->\n<!-- Het tekst-inkleur effect uit het origineel, nu volledig in CSS via scroll-progressie.\n     Geen GSAP. Woorden gaan van licht naar inkt terwijl de sectie door beeld scrolt. -->\n<style>\n.inr-home .rss{display:grid !important;grid-template-columns:1.25fr 1fr !important;gap:clamp(40px,6vw,90px) !important;align-items:center !important;}\n.inr-home .rss .rss-tekst h2{font-weight:700 !important;font-size:clamp(30px,4.4vw,50px) !important;letter-spacing:-.03em !important;line-height:1.05 !important;color:var(--ink) !important;margin-bottom:28px !important;}\n.inr-home .rss .verf{font-weight:300 !important;font-size:clamp(20px,2.6vw,30px) !important;line-height:1.5 !important;letter-spacing:-.01em !important;}\n.inr-home .rss .verf .w{color:var(--ink) !important;opacity:.16 !important;transition:opacity .3s linear !important;}\n.inr-home .rss .verf .w.on{opacity:1 !important;}\n.inr-home .rss .rss-beeld{display:flex !important;align-items:center !important;justify-content:center !important;}\n.inr-home .rss .bars{display:flex !important;align-items:flex-end !important;gap:clamp(10px,1.6vw,18px) !important;height:clamp(150px,22vw,230px) !important;}\n.inr-home .rss .bars i{display:block !important;width:clamp(26px,3.4vw,42px) !important;background:var(--ink) !important;border-radius:7px 7px 3px 3px !important;transform-origin:bottom !important;transform:scaleY(0) !important;transition:transform .9s cubic-bezier(.2,.7,.2,1) !important;}\n.inr-home .rss.in .bars i{transform:scaleY(1) !important;}\n.inr-home .rss .bars i:nth-child(1){height:34%;transition-delay:.05s;}\n.inr-home .rss .bars i:nth-child(2){height:52%;transition-delay:.15s;}\n.inr-home .rss .bars i:nth-child(3){height:70%;transition-delay:.25s;}\n.inr-home .rss .bars i:nth-child(4){height:88%;transition-delay:.35s;position:relative !important;}\n.inr-home .rss .bars i:nth-child(5){height:100%;transition-delay:.45s;}\n.inr-home .rss .dot{position:absolute !important;top:-22px !important;left:50% !important;transform:translateX(-50%) scale(0) !important;width:clamp(18px,2.4vw,26px) !important;height:clamp(18px,2.4vw,26px) !important;border-radius:50% !important;background:var(--ink) !important;transition:transform .6s cubic-bezier(.2,.7,.2,1) .6s !important;}\n.inr-home .rss.in .dot{transform:translateX(-50%) scale(1) !important;}\n@media(max-width:820px){.inr-home .rss{grid-template-columns:1fr !important;gap:48px !important;}.inr-home .rss .rss-beeld{order:-1 !important;}}\n<\/style>\n<section class=\"sec wrap\">\n  <div class=\"rss rev\" id=\"inrRss\">\n    <div class=\"rss-tekst\">\n      <h2>Ready. Set. Success!<\/h2>\n      <p class=\"verf\" id=\"inrVerf\">Bedrijven die investeren in training en ontwikkeling blijven concurrerend en bouwen een sterker team op. Daarom richten onze programma&#8217;s zich op praktische vaardigheden en persoonlijke groei, waardoor medewerkers beter voorbereid zijn op toekomstige uitdagingen. Allemaal mogelijk gemaakt door INR.<\/p>\n    <\/div>\n    <div class=\"rss-beeld\">\n      <div class=\"bars\">\n        <i><\/i><i><\/i><i><\/i><i><span class=\"dot\"><\/span><\/i><i><\/i>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- ========================= 3. VOORDELEN VAN TRAINING EN ONTWIKKELING ========================= -->\n<!-- Tweede opbrengst-sectie. Andere behandeling dan de eerste: donkere band, lijn-iconen,\n     zodat het ritme niet herhaalt. Dit is het eerste donkere accent op de pagina. -->\n<style>\n.inr-home .vrd{background:var(--ink) !important;color:#fff !important;}\n.inr-home .vrd .kop h2{color:#fff !important;}\n.inr-home .vrd .kop .eyebrow{color:rgba(255,255,255,.5) !important;}\n.inr-home .vrd .kop p{color:rgba(255,255,255,.68) !important;}\n.inr-home .vrd-grid{display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:22px !important;margin-top:56px !important;}\n.inr-home .vrd-kaart{background:rgba(255,255,255,.04) !important;border:1px solid rgba(255,255,255,.1) !important;border-radius:var(--radius) !important;padding:clamp(30px,3.4vw,40px) !important;transition:background .4s ease,transform .4s cubic-bezier(.2,.7,.2,1) !important;}\n.inr-home .vrd-kaart:hover{background:rgba(255,255,255,.07) !important;transform:translateY(-5px) !important;}\n.inr-home .vrd-kaart .ico{width:44px !important;height:44px !important;color:#fff !important;margin-bottom:24px !important;}\n.inr-home .vrd-kaart .ico svg{width:44px !important;height:44px !important;}\n.inr-home .vrd-kaart h3{font-weight:600 !important;font-size:clamp(21px,2.4vw,25px) !important;letter-spacing:-.018em !important;color:#fff !important;margin-bottom:12px !important;}\n.inr-home .vrd-kaart p{font-size:15px !important;font-weight:300 !important;color:rgba(255,255,255,.66) !important;line-height:1.64 !important;}\n@media(max-width:820px){.inr-home .vrd-grid{grid-template-columns:1fr !important;}}\n<\/style>\n<section class=\"sec full vrd\">\n  <div class=\"wrap\">\n    <div class=\"kop rev\" style=\"max-width:720px !important;\">\n      <span class=\"eyebrow\" style=\"display:block !important;margin-bottom:18px !important;\">Voordelen van training en ontwikkeling<\/span>\n      <h2>Leerpaden die echt resultaat realiseren. Gebouwd op INR.<\/h2>\n    <\/div>\n    <div class=\"vrd-grid\">\n      <div class=\"vrd-kaart rev d1\">\n        <div class=\"ico\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\"><rect x=\"3\" y=\"3\" width=\"8\" height=\"8\" rx=\"2\"><\/rect><rect x=\"13\" y=\"13\" width=\"8\" height=\"8\" rx=\"2\"><\/rect><path d=\"M9 9l4 4M15 9l-2 2M9 15l2-2\"><\/path><\/svg><\/div>\n        <h3>Versterking<\/h3>\n        <p>Versterk de samenwerking binnen teams. Leer elkaar echt begrijpen, voorkom miscommunicatie en werk met meer vertrouwen samen. Met programma&#8217;s zoals INR Sync.<\/p>\n      <\/div>\n      <div class=\"vrd-kaart rev d2\">\n        <div class=\"ico\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\"><path d=\"M4 18h16M7 18V9M12 18V5M17 18v-6\"><\/path><\/svg><\/div>\n        <h3>Productiviteit<\/h3>\n        <p>Verhoog de productiviteit en effici\u00ebntie. Ontdek wat mensen echt motiveert, benut talenten beter en bereik meer met minder moeite. Dat maakt het INR Model mogelijk.<\/p>\n      <\/div>\n      <div class=\"vrd-kaart rev d3\">\n        <div class=\"ico\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\"><circle cx=\"12\" cy=\"12\" r=\"3.5\"><\/circle><path d=\"M12 2v3M12 19v3M2 12h3M19 12h3M5 5l2 2M17 17l2 2M19 5l-2 2M5 19l2-2\"><\/path><\/svg><\/div>\n        <h3>Innovatie<\/h3>\n        <p>Bevorder innovatie en probleemoplossend denken. Stimuleer frisse idee\u00ebn, denk buiten de gebaande paden en pak uitdagingen met nieuwe energie aan.<\/p>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- ========================= 4. GEBOUWD OP INR (zes neutrale kaarten) ========================= -->\n<style>\n.inr-home .geb-grid{display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:20px !important;margin-top:56px !important;}\n.inr-home .geb-kaart{background:#fff !important;border:1px solid var(--lijn) !important;border-radius:var(--radius) !important;padding:clamp(30px,3vw,38px) !important;\n  transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s,border-color .4s !important;}\n.inr-home .geb-kaart:hover{transform:translateY(-6px) !important;border-color:rgba(10,10,11,.2) !important;box-shadow:0 24px 50px -30px rgba(10,10,11,.25) !important;}\n.inr-home .geb-kaart .rol{font-size:12px !important;font-weight:600 !important;letter-spacing:.02em !important;text-transform:uppercase !important;color:var(--grijs) !important;margin-bottom:14px !important;display:block !important;}\n.inr-home .geb-kaart h3{font-weight:600 !important;font-size:clamp(21px,2.4vw,26px) !important;letter-spacing:-.02em !important;color:var(--ink) !important;margin-bottom:10px !important;}\n.inr-home .geb-kaart p{font-size:14.5px !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.6 !important;}\n@media(max-width:980px){.inr-home .geb-grid{grid-template-columns:repeat(2,1fr) !important;}}\n@media(max-width:640px){.inr-home .geb-grid{grid-template-columns:1fr !important;}}\n<\/style>\n<section class=\"sec wrap\">\n  <div class=\"kop rev\" style=\"max-width:680px !important;\">\n    <span class=\"eyebrow\" style=\"display:block !important;margin-bottom:18px !important;\">Gebouwd op INR<\/span>\n    <h2>Voor elke vraag. Doelgericht. Effectief.<\/h2>\n  <\/div>\n  <div class=\"geb-grid\">\n    <div class=\"geb-kaart rev d1\"><span class=\"rol\">Leiderschap<\/span><h3>Leiderschap<\/h3><p>Meer resultaat uit je mensen met INR Fluent.<\/p><\/div>\n    <div class=\"geb-kaart rev d2\"><span class=\"rol\">Commercie<\/span><h3>Commercieel<\/h3><p>Doeltreffende commerci\u00eble training met INR Pulse.<\/p><\/div>\n    <div class=\"geb-kaart rev d3\"><span class=\"rol\">Cultuur<\/span><h3>Team &amp; Cultuur<\/h3><p>Duurzame cultuur en effectiviteit met INR Sync.<\/p><\/div>\n    <div class=\"geb-kaart rev d4\"><span class=\"rol\">Klantbeleving<\/span><h3>Customer experience<\/h3><p>Vergroot het rendement met INR.<\/p><\/div>\n    <div class=\"geb-kaart rev d5\"><span class=\"rol\">Organisatiebreed<\/span><h3>Sales Enablement<\/h3><p>Sales interventie in de organisatie. Organisatiebrede impact met INR Dynamics.<\/p><\/div>\n    <div class=\"geb-kaart rev d6\"><span class=\"rol\">Kern<\/span><h3>Organisatie enablement<\/h3><p>Interventie in de kern van de bedrijfsvoering met onze unieke INR premium diensten.<\/p><\/div>\n  <\/div>\n<\/section>\n\n<!-- ========================= 5. INR ECOSYSTEEM (de gekleurde waaier, kleurhoogtepunt) ========================= -->\n<style>\n.inr-home .eco{background:var(--bg) !important;}\n.inr-home .eco-grid{display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:20px !important;margin-top:56px !important;}\n.inr-home .eco-kaart{position:relative !important;border-radius:28px !important;padding:clamp(34px,3.6vw,44px) !important;min-height:clamp(230px,26vw,300px) !important;display:flex !important;flex-direction:column !important;justify-content:flex-start !important;overflow:hidden !important;\n  color:var(--ink) !important;background:rgba(255,255,255,.78) !important;-webkit-backdrop-filter:blur(18px) !important;backdrop-filter:blur(18px) !important;\n  border:1px solid var(--cb) !important;box-shadow:0 10px 40px -30px rgba(10,10,11,.2) !important;\n  transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s,border-color .45s !important;}\n\/* subtiele gekleurde glow-blob binnen de kaart *\/\n.inr-home .eco-kaart::before{content:'' !important;position:absolute !important;width:300px !important;height:300px !important;border-radius:50% !important;\n  background:var(--c) !important;filter:blur(70px) !important;opacity:.26 !important;top:-90px !important;right:-70px !important;\n  transition:opacity .45s ease,transform .45s cubic-bezier(.2,.7,.2,1) !important;pointer-events:none !important;}\n.inr-home .eco-kaart:hover{transform:translateY(-8px) !important;border-color:var(--cs) !important;box-shadow:0 30px 60px -34px var(--cs) !important;}\n.inr-home .eco-kaart:hover::before{opacity:.4 !important;transform:scale(1.12) !important;}\n.inr-home .eco-kaart > *{position:relative !important;z-index:1 !important;}\n.inr-home .eco-kaart.laag{justify-content:flex-end !important;}\n.inr-home .eco-kaart.laag::before{top:auto !important;bottom:-90px !important;left:-70px !important;right:auto !important;}\n.inr-home.inr-home .eco-kaart .merknaam{font-weight:700 !important;font-size:clamp(26px,3vw,34px) !important;letter-spacing:-.025em !important;margin-bottom:14px !important;color:var(--c) !important;}\n.inr-home.inr-home .eco-kaart p{font-size:clamp(15px,1.7vw,17px) !important;font-weight:300 !important;line-height:1.55 !important;color:var(--grijs) !important;}\n.inr-home.inr-home .eco-kaart .pijl{margin-top:auto !important;padding-top:22px !important;display:inline-flex !important;align-items:center !important;gap:8px !important;font-size:14px !important;font-weight:600 !important;color:var(--c) !important;opacity:0 !important;transform:translateX(-6px) !important;transition:opacity .4s ease,transform .4s cubic-bezier(.2,.7,.2,1) !important;}\n.inr-home .eco-kaart.laag .pijl{margin-top:18px !important;}\n.inr-home .eco-kaart:hover .pijl{opacity:1 !important;transform:none !important;}\n.inr-home .eco-kaart .pijl svg{width:15px !important;height:15px !important;}\n\/* het ankerblok blijft donker als visueel rustpunt, maar zachter *\/\n.inr-home .eco-kaart.dark{background:var(--ink) !important;border-color:rgba(255,255,255,.12) !important;text-align:center !important;align-items:center !important;justify-content:center !important;color:#fff !important;}\n.inr-home .eco-kaart.dark::before{background:#fff !important;opacity:.08 !important;top:50% !important;left:50% !important;right:auto !important;transform:translate(-50%,-50%) !important;width:360px !important;height:360px !important;}\n.inr-home .eco-kaart.dark:hover::before{opacity:.13 !important;transform:translate(-50%,-50%) scale(1.1) !important;}\n.inr-home.inr-home .eco-kaart.dark .merknaam{color:#fff !important;margin-bottom:14px !important;}\n.inr-home.inr-home .eco-kaart.dark p{color:rgba(255,255,255,.7) !important;}\n@media(max-width:980px){.inr-home .eco-grid{grid-template-columns:repeat(2,1fr) !important;}}\n@media(max-width:560px){.inr-home .eco-grid{grid-template-columns:1fr !important;}}\n<\/style>\n<section class=\"sec full eco\">\n  <div class=\"wrap\">\n    <div class=\"kop rev\" style=\"max-width:680px !important;\">\n      <span class=\"eyebrow\" style=\"display:block !important;margin-bottom:18px !important;\">Het INR Ecosysteem<\/span>\n      <h2>Van menselijk gedrag naar organisatieontwikkeling.<\/h2>\n      <p style=\"margin-top:20px !important;\">Vijf toepassingen van het INR Model. E\u00e9n taal, vijf richtingen, afgestemd op waar de vraag werkelijk zit.<\/p>\n    <\/div>\n    <div class=\"eco-grid\">\n      <a class=\"eco-kaart rev d1\" style=\"--c:var(--echo) !important;--cs:rgba(90,195,128,.5) !important;--cb:rgba(90,195,128,.22) !important;\" href=\"https:\/\/inr.institute\/inr\/inr-dynamics\/inr-echo\/\">\n        <div class=\"merknaam\" style=\"color:#5AC380 !important;\">INR Echo<\/div><p>Cultuur ontstaat uit gedrag. Maak zichtbaar wat er onder jullie organisatie speelt.<\/p>\n        <span class=\"pijl\">Ontdek Echo <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\"><path d=\"M5 12h14M13 6l6 6-6 6\"><\/path><\/svg><\/span>\n      <\/a>\n      <a class=\"eco-kaart rev d2\" style=\"--c:var(--sync) !important;--cs:rgba(253,118,52,.5) !important;--cb:rgba(253,118,52,.22) !important;\" href=\"https:\/\/inr.institute\/inr\/inr-dynamics\/inr-sync\/\">\n        <div class=\"merknaam\" style=\"color:#FD7634 !important;\">INR Sync<\/div><p>Teams bewegen als de logica klopt. Samenwerking begrijpen vanuit menselijk gedrag.<\/p>\n        <span class=\"pijl\">Ontdek Sync <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\"><path d=\"M5 12h14M13 6l6 6-6 6\"><\/path><\/svg><\/span>\n      <\/a>\n      <a class=\"eco-kaart rev d3\" style=\"--c:var(--pulse) !important;--cs:rgba(253,76,92,.5) !important;--cb:rgba(253,76,92,.22) !important;\" href=\"https:\/\/inr.institute\/inr\/inr-dynamics\/inr-pulse\/\">\n        <div class=\"merknaam\" style=\"color:#FD4C5C !important;\">INR Pulse<\/div><p>Commerci\u00eble groei begint bij gedrag. Verkoop vanuit inzicht in wat mensen werkelijk beweegt.<\/p>\n        <span class=\"pijl\">Ontdek Pulse <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\"><path d=\"M5 12h14M13 6l6 6-6 6\"><\/path><\/svg><\/span>\n      <\/a>\n      <a class=\"eco-kaart rev d4\" style=\"--c:var(--fluent) !important;--cs:rgba(40,117,251,.5) !important;--cb:rgba(40,117,251,.22) !important;\" href=\"https:\/\/inr.institute\/inr\/inr-dynamics\/inr-fluent\/\">\n        <div class=\"merknaam\" style=\"color:#2875FB !important;\">INR Fluent<\/div><p>Leiderschap dat mensen laat groeien. Niet sturen op gedrag, maar op wat gedrag veroorzaakt.<\/p>\n        <span class=\"pijl\">Ontdek Fluent <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\"><path d=\"M5 12h14M13 6l6 6-6 6\"><\/path><\/svg><\/span>\n      <\/a>\n      <a class=\"eco-kaart rev d5\" style=\"--c:var(--core) !important;--cs:rgba(116,72,253,.5) !important;--cb:rgba(116,72,253,.22) !important;\" href=\"https:\/\/inr.institute\/inr\/inr-dynamics\/inr-core\/\">\n        <div class=\"merknaam\" style=\"color:#7448FD !important;\">INR Core<\/div><p>Begrijp waarom je doet wat je doet. Persoonlijke ontwikkeling vanuit de logica van gedrag.<\/p>\n        <span class=\"pijl\">Ontdek Core <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\"><path d=\"M5 12h14M13 6l6 6-6 6\"><\/path><\/svg><\/span>\n      <\/a>\n      <a class=\"eco-kaart dark rev d6\" href=\"https:\/\/inr.institute\/inr\/inr-dynamics\/\">\n        <div><div class=\"merknaam\" style=\"color:#FFFFFF !important;\">INR Ecosysteem<\/div><p>Van menselijk gedrag naar organisatieontwikkeling. Vijf toepassingen van het INR Model.<\/p><\/div>\n      <\/a>\n    <\/div>\n  <\/div>\n<\/section>\n\n<\/div>\n<!-- ========================= EINDE .inr-home ========================= -->\n\n<script>\n(function(){\n  function start(){\n    var root=document.querySelector('.inr-home');\n    if(!root)return;\n\n    \/\/ reveal-on-scroll\n    var els=root.querySelectorAll('.rev');\n    if(!('IntersectionObserver' in window)){els.forEach(function(e){e.classList.add('in');});}\n    else{\n      var io=new IntersectionObserver(function(es){es.forEach(function(e){if(e.isIntersecting){e.target.classList.add('in');io.unobserve(e.target);}});},{threshold:.12,rootMargin:'0px 0px -8% 0px'});\n      els.forEach(function(e){io.observe(e);});\n    }\n\n    \/\/ Ready Set Success: woorden inkleuren op scroll-progressie\n    var verf=document.getElementById('inrVerf');\n    if(verf){\n      var tekst=verf.textContent.trim();\n      verf.textContent='';\n      var woorden=tekst.split(\/\\s+\/);\n      var spans=[];\n      woorden.forEach(function(w,i){\n        var s=document.createElement('span');\n        s.className='w';\n        s.textContent=w+(i<woorden.length-1?' ':'');\n        verf.appendChild(s);\n        spans.push(s);\n      });\n      var ticking=false;\n      function paint(){\n        ticking=false;\n        var r=verf.getBoundingClientRect();\n        var vh=window.innerHeight||document.documentElement.clientHeight;\n        \/\/ voortgang: 0 als blok net onderin verschijnt, 1 als het ruim boven midden staat\n        var start=vh*0.85, end=vh*0.35;\n        var p=(start-r.top)\/(start-end);\n        if(p<0)p=0; if(p>1)p=1;\n        var n=Math.round(p*spans.length);\n        for(var i=0;i<spans.length;i++){\n          if(i<n)spans[i].classList.add('on');\n          else spans[i].classList.remove('on');\n        }\n      }\n      function onScroll(){if(!ticking){ticking=true;requestAnimationFrame(paint);}}\n      window.addEventListener('scroll',onScroll,{passive:true});\n      window.addEventListener('resize',onScroll,{passive:true});\n      paint();\n    }\n  }\n  if(document.readyState==='loading'){document.addEventListener('DOMContentLoaded',start);}else{start();}\n})();\n<\/script>\n\n\n\n<!-- ============================================================================\n     INR INSTITUTE \u00b7 KLANTLOGO'S (\"Klanten waar we trots op zijn\")\n     Plak dit volledig in EEN Custom HTML-widget.\n     Alles gescoped onder .inr-klanten en afgedwongen met !important.\n\n     LET OP \u2014 GEEN eigen font\/preconnect meer in dit blok.\n     Deze widget leeft altijd ONDER een hoofd-element dat het Inter-font\n     al lokaal inlaadt. Deze widget gebruikt dat font.\n     Voeg hier dus GEEN <link rel=\"preconnect\"> of font-stylesheet toe.\n\n     WIJZIGINGEN:\n     1. Vier kapotte alt-attributen hersteld (Gemeente Haarlem, Trengo,\n        Eurofiber, Volvo). Daar stond per ongeluk geen geldige alt meer.\n     2. Alle logo's hebben nu width + height (intrinsieke verhouding), zodat\n        de browser hun ruimte vooraf reserveert en er niets kan verspringen.\n        De CSS houdt width:auto EN height:auto aan, dus de verhouding blijft\n        altijd correct, ook als een opgegeven maat licht afwijkt.\n     ============================================================================ -->\n\n<style>\n.inr-klanten{\n  --ink:#0A0A0B; --paneel:#0E0E10; --rand:rgba(255,255,255,.08);\n  --logo:rgba(255,255,255,.42); --logo-hover:rgba(255,255,255,.92);\n  --tekst:#FFFFFF; --sub:rgba(255,255,255,.55);\n  position:relative !important; width:100% !important; max-width:100% !important;\n  margin:0 !important; padding:0 !important; box-sizing:border-box !important;\n  background:var(--ink) !important; -webkit-font-smoothing:antialiased !important;\n}\n.inr-klanten, .inr-klanten *, .inr-klanten *::before, .inr-klanten *::after{\n  box-sizing:border-box !important;\n  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif !important;\n}\n.inr-klanten div,.inr-klanten p,.inr-klanten h2,.inr-klanten span{margin:0;padding:0;}\n\n\/* ---------- WRAP ---------- *\/\n.inr-klanten .kwrap{position:relative !important;width:100% !important;\n  padding:clamp(48px,7vw,104px) clamp(20px,5vw,80px) !important;\n  max-width:1480px !important;margin:0 auto !important;}\n\n\/* ---------- RASTER ---------- *\/\n.inr-klanten .raster{position:relative !important;display:grid !important;\n  grid-template-columns:repeat(4,1fr) !important;\n  border-top:1px solid var(--rand) !important;border-left:1px solid var(--rand) !important;}\n.inr-klanten .cel{position:relative !important;\n  border-right:1px solid var(--rand) !important;border-bottom:1px solid var(--rand) !important;\n  min-height:clamp(120px,15vw,176px) !important;\n  display:flex !important;align-items:center !important;justify-content:center !important;\n  padding:clamp(20px,3vw,40px) !important;overflow:hidden !important;\n  opacity:0 !important;transform:translateY(14px) !important;\n  transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1),background .4s ease !important;}\n.inr-klanten .cel.in{opacity:1 !important;transform:none !important;}\n.inr-klanten .cel:hover{background:rgba(255,255,255,.03) !important;}\n\n\/* titelcel *\/\n.inr-klanten .cel.titel{align-items:flex-start !important;justify-content:flex-start !important;\n  flex-direction:column !important;gap:14px !important;}\n.inr-klanten .eyebrow{font-size:12px !important;font-weight:500 !important;letter-spacing:.16em !important;\n  text-transform:uppercase !important;color:var(--sub) !important;}\n.inr-klanten .titel h2{font-size:clamp(22px,2.3vw,30px) !important;font-weight:600 !important;\n  line-height:1.12 !important;letter-spacing:-.02em !important;color:var(--tekst) !important;}\n\n\/* logo's monochroom afgedwongen *\/\n.inr-klanten .cel img{max-width:100% !important;max-height:clamp(28px,3.4vw,44px) !important;\n  width:auto !important;height:auto !important;object-fit:contain !important;display:block !important;\n  filter:grayscale(1) brightness(0) invert(1) opacity(.42) !important;\n  transition:filter .4s ease,transform .5s cubic-bezier(.2,.7,.2,1) !important;}\n.inr-klanten .cel:hover img{filter:grayscale(1) brightness(0) invert(1) opacity(.95) !important;\n  transform:scale(1.04) !important;}\n\n\/* responsief: 3, dan 2 kolommen *\/\n@media(max-width:1000px){\n  .inr-klanten .raster{grid-template-columns:repeat(3,1fr) !important;}\n}\n@media(max-width:640px){\n  .inr-klanten .raster{grid-template-columns:repeat(2,1fr) !important;}\n  .inr-klanten .cel{min-height:118px !important;}\n}\n@media(prefers-reduced-motion:reduce){\n  .inr-klanten .cel{opacity:1 !important;transform:none !important;transition:background .4s ease !important;}\n}\n<\/style>\n\n<div class=\"inr-klanten\">\n  <div class=\"kwrap\">\n    <div class=\"raster\" id=\"inrKlantenRaster\">\n\n      <div class=\"cel titel\">\n        <span class=\"eyebrow\">Onze klanten<\/span>\n        <h2>Klanten waar we<br>trots op zijn<\/h2>\n      <\/div>\n\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2025\/08\/Fris-logo.svg\" alt=\"Fris\" width=\"120\" height=\"40\" loading=\"lazy\"><\/div>\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2026\/06\/samsung-logo-transparent-9.webp\" alt=\"Samsung\" width=\"180\" height=\"30\" loading=\"lazy\"><\/div>\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2026\/06\/Apax_Partners_logo.svg.webp\" alt=\"Apax Partners\" width=\"160\" height=\"40\" loading=\"lazy\"><\/div>\n\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2026\/06\/GraydonCreditsafe-Logo-Colour.png.webp\" alt=\"Graydon Creditsafe\" width=\"180\" height=\"40\" loading=\"lazy\"><\/div>\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2025\/01\/Action_Nederland_Logo_2020.svg-768x145.png\" alt=\"Action\" width=\"768\" height=\"145\" loading=\"lazy\"><\/div>\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2025\/08\/Topdesk-logo.svg\" alt=\"TOPdesk\" width=\"150\" height=\"30\" loading=\"lazy\"><\/div>\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2025\/08\/Vodafone-Ziggs-logo.svg\" alt=\"Vodafone Ziggo\" width=\"160\" height=\"40\" loading=\"lazy\"><\/div>\n\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2025\/08\/idtDUJWR77-768x149-1.png\" alt=\"Silverfin\" width=\"768\" height=\"149\" loading=\"lazy\"><\/div>\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2025\/08\/Festool-logo.svg\" alt=\"Festool\" width=\"140\" height=\"40\" loading=\"lazy\"><\/div>\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2026\/06\/app-logo-2.webp\" alt=\"Eromes Marko\" width=\"150\" height=\"40\" loading=\"lazy\"><\/div>\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2025\/08\/Borealis_logo.svg-768x150-1.png\" alt=\"Borealis\" width=\"768\" height=\"150\" loading=\"lazy\"><\/div>\n\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2025\/08\/Spie-logo.svg\" alt=\"SPIE\" width=\"110\" height=\"40\" loading=\"lazy\"><\/div>\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2025\/08\/Mollie-logo.svg\" alt=\"Mollie\" width=\"120\" height=\"34\" loading=\"lazy\"><\/div>\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2026\/01\/Eneco_logo-768x384.png\" alt=\"Eneco\" width=\"768\" height=\"384\" loading=\"lazy\"><\/div>\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2026\/01\/logo-xelvin-rgb.png\" alt=\"Xelvin\" width=\"150\" height=\"40\" loading=\"lazy\"><\/div>\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2025\/08\/Gemeente-Haarlem-logo.png\" alt=\"Gemeente Haarlem\" width=\"150\" height=\"50\" loading=\"lazy\"><\/div>\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2025\/08\/3dd27e81-6ebf-4a0b-bb58-167620d4b1b1-1596465395358-768x184-1.png\" alt=\"Trengo\" width=\"768\" height=\"184\" loading=\"lazy\"><\/div>\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2026\/01\/eurofiber-logo.webp\" alt=\"Eurofiber\" width=\"160\" height=\"40\" loading=\"lazy\"><\/div>\n      <div class=\"cel\"><img decoding=\"async\" src=\"https:\/\/inr.institute\/wp-content\/uploads\/2026\/01\/Volvo-Logo.wine_.png\" alt=\"Volvo\" width=\"120\" height=\"60\" loading=\"lazy\"><\/div>\n\n    <\/div>\n  <\/div>\n<\/div>\n\n<script>\n(function(){\n  function start(){\n    var raster=document.getElementById('inrKlantenRaster');\n    if(!raster)return;\n    var cellen=Array.prototype.slice.call(raster.querySelectorAll('.cel'));\n    var reduce=window.matchMedia&&window.matchMedia('(prefers-reduced-motion:reduce)').matches;\n    if(reduce){cellen.forEach(function(c){c.classList.add('in');});return;}\n\n    if('IntersectionObserver' in window){\n      var obs=new IntersectionObserver(function(entries){\n        entries.forEach(function(e){\n          if(e.isIntersecting){\n            var i=cellen.indexOf(e.target);\n            e.target.style.transitionDelay=(Math.max(0,i)*55)+'ms';\n            e.target.classList.add('in');\n            obs.unobserve(e.target);\n          }\n        });\n      },{threshold:.15,rootMargin:'0px 0px -8% 0px'});\n      cellen.forEach(function(c){obs.observe(c);});\n    }else{\n      cellen.forEach(function(c){c.classList.add('in');});\n    }\n  }\n  if(document.readyState==='loading'){document.addEventListener('DOMContentLoaded',start);}else{start();}\n})();\n<\/script>\n\n\n\n<!-- ============================================================================\n     INR REVIEWS \u2014 filterbaar overzicht (vervangt de carousel)\n     Een bestand. Plak dit volledig in EEN Elementor HTML-widget.\n     Alles gescoped onder .inr-reviews en afgedwongen met !important.\n\n     WAAROM DIT ANDERS IS DAN DE CAROUSEL\n     ------------------------------------------------------------------\n     Alle reviews staan nu RECHTSTREEKS in de HTML hieronder (statische\n     <article>-blokken). Ze worden NIET via JavaScript opgebouwd. Daardoor\n     leest een LLM\/crawler altijd de volledige tekst van elke review uit de\n     paginabron \u2014 ook de reviews die door een filter verborgen zijn. Filteren\n     doet alleen tonen\/verbergen; er wordt nooit iets uit de DOM gehaald.\n\n     ====  ZELF EEN REVIEW TOEVOEGEN  ====\n     1. Kopieer een volledig <article ...> ... <\/article> blok hieronder.\n     2. Plak het erbij en pas de tekst (quote \/ functie \/ org) aan.\n     3. Stel het data-attribuut in op het <article>:\n          data-rol=\"...\"   -> precies EEN rol-sleutel\n        Geldige rol-sleutels:  commercieel  management  team\n     4. Verhoog NIETS handmatig: de tellingen op de filterknoppen en de\n        teller (\"Toont X van Y\") worden automatisch herberekend uit de\n        aanwezige <article>-blokken bij het laden.\n\n     LET OP \u2014 GEEN eigen font\/preconnect in dit blok.\n     Het Inter-font wordt al een keer geladen door de hero-widget bovenaan\n     de homepage. Voeg hier dus GEEN <link rel=\"preconnect\"> of font-\n     stylesheet toe.\n     ============================================================================ -->\n\n<style>\n\/* ---------- ROOT + ELEMENTOR-ONTWAPENING ---------- *\/\n.inr-reviews{\n  --ink:#0A0A0B; --grijs:#6A6A72; --zacht:#F4F4F6; --rand:rgba(10,10,11,.08);\n  --rand-sterk:rgba(10,10,11,.16); --radius:22px;\n  position:relative !important; width:100% !important; max-width:100% !important;\n  margin:0 !important; padding:0 !important; box-sizing:border-box !important;\n  color:var(--ink) !important; background:#FFFFFF !important; line-height:1.5 !important;\n  overflow-x:hidden !important; text-align:left !important;\n  -webkit-font-smoothing:antialiased !important;\n}\n.inr-reviews, .inr-reviews *, .inr-reviews *::before, .inr-reviews *::after{\n  box-sizing:border-box !important;\n  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif !important;\n}\n.inr-reviews h2,.inr-reviews p,.inr-reviews span,.inr-reviews div,.inr-reviews article{margin:0;padding:0;}\n\n\/* ---------- ATMOSFEER ---------- *\/\n.inr-reviews .atmos{position:absolute !important;inset:0 !important;z-index:0 !important;overflow:hidden !important;pointer-events:none !important;}\n.inr-reviews .blob{position:absolute !important;border-radius:50% !important;filter:blur(120px) !important;opacity:.5 !important;animation:inrrev-drift 30s ease-in-out infinite !important;}\n.inr-reviews .blob.a{width:580px;height:580px;background:rgba(120,130,165,.16);top:-200px;right:-160px;}\n.inr-reviews .blob.b{width:540px;height:540px;background:rgba(150,140,135,.13);bottom:-240px;left:-200px;animation-delay:-13s;}\n@keyframes inrrev-drift{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(40px,-30px) scale(1.07);}}\n@media(prefers-reduced-motion:reduce){.inr-reviews .blob{animation:none !important;}}\n\n\/* ---------- WRAPPER ---------- *\/\n.inr-reviews .wrap{position:relative !important;z-index:1 !important;max-width:1200px !important;margin:0 auto !important;padding:0 clamp(20px,5vw,40px) !important;}\n\n\/* ---------- KOP ---------- *\/\n.inr-reviews .kop{text-align:center !important;max-width:720px !important;margin:0 auto !important;padding:96px 0 40px !important;}\n.inr-reviews .kop .eyebrow{font-size:13px !important;font-weight:600 !important;letter-spacing:.02em !important;text-transform:uppercase !important;color:var(--grijs) !important;display:block !important;margin-bottom:16px !important;}\n.inr-reviews .kop h2{font-weight:700 !important;font-size:clamp(30px,4.4vw,50px) !important;letter-spacing:-.03em !important;line-height:1.08 !important;color:var(--ink) !important;margin-bottom:16px !important;}\n.inr-reviews .kop p{font-size:18px !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.6 !important;}\n\n\/* ---------- FILTERPANEEL ---------- *\/\n.inr-reviews .filters{margin:0 auto 36px !important;}\n.inr-reviews .zoekrij{position:relative !important;max-width:520px !important;margin:0 auto 28px !important;}\n.inr-reviews .zoekrij svg{position:absolute !important;left:18px !important;top:50% !important;transform:translateY(-50%) !important;width:18px !important;height:18px !important;color:var(--grijs) !important;pointer-events:none !important;}\n.inr-reviews .zoekrij input{width:100% !important;height:52px !important;padding:0 46px 0 48px !important;border:1px solid var(--rand) !important;border-radius:14px !important;background:#fff !important;\n  font-size:15px !important;font-weight:300 !important;color:var(--ink) !important;outline:none !important;transition:border-color .2s ease,box-shadow .2s ease !important;}\n.inr-reviews .zoekrij input::placeholder{color:var(--grijs) !important;opacity:.8 !important;}\n.inr-reviews .zoekrij input:focus{border-color:var(--rand-sterk) !important;box-shadow:0 0 0 4px rgba(10,10,11,.04) !important;}\n.inr-reviews .zoekwis{position:absolute !important;right:12px !important;top:50% !important;transform:translateY(-50%) !important;width:28px !important;height:28px !important;\n  display:none !important;align-items:center !important;justify-content:center !important;border:0 !important;border-radius:8px !important;background:var(--zacht) !important;color:var(--grijs) !important;cursor:pointer !important;}\n.inr-reviews .zoekwis.toon{display:flex !important;}\n.inr-reviews .zoekwis svg{width:14px !important;height:14px !important;position:static !important;transform:none !important;}\n\n.inr-reviews .facet{margin-bottom:18px !important;}\n.inr-reviews .facet .label{display:block !important;text-align:center !important;font-size:12px !important;font-weight:600 !important;letter-spacing:.02em !important;text-transform:uppercase !important;color:var(--grijs) !important;margin-bottom:12px !important;}\n.inr-reviews .chips{display:flex !important;flex-wrap:wrap !important;justify-content:center !important;gap:9px !important;}\n.inr-reviews .chip{display:inline-flex !important;align-items:center !important;gap:7px !important;padding:9px 15px !important;border:1px solid var(--rand) !important;border-radius:999px !important;\n  background:#fff !important;font-size:13.5px !important;font-weight:500 !important;color:var(--ink) !important;cursor:pointer !important;line-height:1 !important;\n  transition:background .18s ease,border-color .18s ease,color .18s ease !important;-webkit-tap-highlight-color:transparent !important;}\n.inr-reviews .chip:hover{border-color:var(--rand-sterk) !important;}\n.inr-reviews .chip .telw{font-size:11.5px !important;font-weight:600 !important;color:var(--grijs) !important;background:var(--zacht) !important;border-radius:999px !important;padding:2px 7px !important;min-width:20px !important;text-align:center !important;transition:background .18s ease,color .18s ease !important;}\n.inr-reviews .chip[aria-pressed=\"true\"]{background:var(--ink) !important;border-color:var(--ink) !important;color:#fff !important;}\n.inr-reviews .chip[aria-pressed=\"true\"] .telw{background:rgba(255,255,255,.22) !important;color:#fff !important;}\n\n\/* ---------- RESULTAATBALK ---------- *\/\n.inr-reviews .resbar{display:flex !important;align-items:center !important;justify-content:center !important;gap:14px !important;flex-wrap:wrap !important;margin:6px 0 30px !important;}\n.inr-reviews .resbar .teller{font-size:14px !important;font-weight:400 !important;color:var(--grijs) !important;}\n.inr-reviews .resbar .teller b{font-weight:700 !important;color:var(--ink) !important;}\n.inr-reviews .resbar .reset{display:none !important;align-items:center !important;gap:6px !important;border:0 !important;background:none !important;cursor:pointer !important;\n  font-size:13.5px !important;font-weight:600 !important;color:var(--ink) !important;text-decoration:underline !important;text-underline-offset:3px !important;padding:0 !important;}\n.inr-reviews .resbar .reset.toon{display:inline-flex !important;}\n\n\/* ---------- GRID ---------- *\/\n.inr-reviews .grid{display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:22px !important;align-items:stretch !important;}\n@media(max-width:980px){.inr-reviews .grid{grid-template-columns:repeat(2,1fr) !important;}}\n@media(max-width:620px){.inr-reviews .grid{grid-template-columns:1fr !important;}}\n\n.inr-reviews .kaart{display:flex !important;flex-direction:column !important;height:100% !important;\n  background:rgba(255,255,255,.78) !important;-webkit-backdrop-filter:blur(20px) !important;backdrop-filter:blur(20px) !important;\n  border:1px solid var(--rand) !important;border-radius:var(--radius) !important;padding:30px 30px 26px !important;\n  box-shadow:0 16px 46px -34px rgba(10,10,11,.3) !important;}\n.inr-reviews .kaart.is-hidden{display:none !important;}\n.inr-reviews .kaart .mark{font-weight:700 !important;font-size:42px !important;line-height:.5 !important;color:var(--ink) !important;opacity:.14 !important;margin-bottom:16px !important;display:block !important;}\n.inr-reviews .kaart .quote{font-size:15.5px !important;font-weight:300 !important;color:var(--ink) !important;line-height:1.62 !important;margin-bottom:20px !important;flex:1 1 auto !important;}\n.inr-reviews .kaart .meta{display:flex !important;flex-direction:column !important;gap:2px !important;padding-top:18px !important;border-top:1px solid var(--rand) !important;}\n.inr-reviews .kaart .functie{font-weight:600 !important;font-size:14px !important;color:var(--ink) !important;letter-spacing:-.01em !important;}\n.inr-reviews .kaart .org{font-size:13px !important;font-weight:300 !important;color:var(--grijs) !important;}\n.inr-reviews .kaart .tags{display:flex !important;flex-wrap:wrap !important;gap:6px !important;margin-top:14px !important;}\n.inr-reviews .kaart .tag{font-size:11px !important;font-weight:500 !important;color:var(--grijs) !important;background:var(--zacht) !important;border-radius:6px !important;padding:4px 9px !important;line-height:1 !important;}\n\n\/* ---------- GEEN RESULTATEN ---------- *\/\n.inr-reviews .leeg{display:none !important;text-align:center !important;padding:48px 20px !important;color:var(--grijs) !important;}\n.inr-reviews .leeg.toon{display:block !important;}\n.inr-reviews .leeg .leeg-t{font-size:17px !important;font-weight:600 !important;color:var(--ink) !important;margin-bottom:8px !important;}\n.inr-reviews .leeg .leeg-s{font-size:14px !important;font-weight:300 !important;}\n\n\/* ---------- TOON MEER ---------- *\/\n.inr-reviews .meer-rij{text-align:center !important;margin-top:34px !important;}\n.inr-reviews .meer{display:none !important;border:1px solid var(--ink) !important;background:#fff !important;color:var(--ink) !important;cursor:pointer !important;\n  padding:14px 28px !important;border-radius:999px !important;font-size:14.5px !important;font-weight:600 !important;transition:background .2s ease,color .2s ease !important;}\n.inr-reviews .meer.toon{display:inline-block !important;}\n.inr-reviews .meer:hover{background:var(--ink) !important;color:#fff !important;}\n\n\/* ---------- PRIVACY-NOOT ---------- *\/\n.inr-reviews .privacy{max-width:760px !important;margin:0 auto !important;padding:64px 0 96px !important;display:flex !important;gap:16px !important;align-items:flex-start !important;}\n.inr-reviews .privacy .pic{flex:none !important;width:40px !important;height:40px !important;border-radius:11px !important;background:var(--zacht) !important;display:flex !important;align-items:center !important;justify-content:center !important;color:var(--ink) !important;}\n.inr-reviews .privacy .pic svg{width:21px !important;height:21px !important;}\n.inr-reviews .privacy p{font-size:13.5px !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.65 !important;}\n.inr-reviews .privacy p strong{font-weight:600 !important;color:var(--ink) !important;}\n\n@media(max-width:640px){\n  .inr-reviews .kop{padding:64px 0 32px !important;}\n  .inr-reviews .privacy{padding:48px 0 64px !important;}\n}\n<\/style>\n\n<div class=\"inr-reviews\">\n<div class=\"atmos\"><div class=\"blob a\"><\/div><div class=\"blob b\"><\/div><\/div>\n\n<div class=\"wrap\">\n\n  <div class=\"kop\">\n    <span class=\"eyebrow\">Wat onze deelnemers ervaren<\/span>\n    <h2>Echte inzichten. Meetbare verandering. Blijvend effect.<\/h2>\n    <p>De ervaringen van deelnemers, in hun eigen woorden. Filter op rol of zoek vrij.<\/p>\n  <\/div>\n\n  <!-- ===================== FILTERPANEEL ===================== -->\n  <div class=\"filters\">\n    <div class=\"zoekrij\">\n      <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><circle cx=\"11\" cy=\"11\" r=\"7\"><\/circle><path d=\"m21 21-4.3-4.3\"><\/path><\/svg>\n      <input id=\"inrZoek\" type=\"search\" autocomplete=\"off\" placeholder=\"Zoek in ervaringen, functie of organisatie\u2026\" aria-label=\"Zoek in ervaringen\">\n      <button class=\"zoekwis\" id=\"inrZoekWis\" type=\"button\" aria-label=\"Zoekopdracht wissen\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.2\"><path d=\"M18 6 6 18M6 6l12 12\"><\/path><\/svg><\/button>\n    <\/div>\n\n    <div class=\"facet\">\n      <span class=\"label\">Rol<\/span>\n      <div class=\"chips\" id=\"inrRolChips\" role=\"group\" aria-label=\"Filter op rol\">\n        <button class=\"chip\" type=\"button\" data-facet=\"rol\" data-key=\"commercieel\" aria-pressed=\"false\">Commercieel &amp; sales <span class=\"telw\"><\/span><\/button>\n        <button class=\"chip\" type=\"button\" data-facet=\"rol\" data-key=\"management\" aria-pressed=\"false\">Leiderschap &amp; management <span class=\"telw\"><\/span><\/button>\n        <button class=\"chip\" type=\"button\" data-facet=\"rol\" data-key=\"team\" aria-pressed=\"false\">Professional &amp; team <span class=\"telw\"><\/span><\/button>\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <!-- ===================== RESULTAATBALK ===================== -->\n  <div class=\"resbar\">\n    <span class=\"teller\" id=\"inrTeller\"><\/span>\n    <button class=\"reset\" id=\"inrReset\" type=\"button\"><svg viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M3 12a9 9 0 1 0 3-6.7L3 8\"><\/path><path d=\"M3 3v5h5\"><\/path><\/svg> Alle filters wissen<\/button>\n  <\/div>\n\n  <!-- ===================== REVIEWS (statisch in de bron \u2014 LLM-leesbaar) =====================\n       Elke review is een <article>. data-rol = rol-sleutel (commercieel | management | team).\n       Zie de toelichting bovenaan dit bestand om er een toe te voegen.\n  -->\n  <div class=\"grid\" id=\"inrGrid\">\n\n    <article class=\"kaart\" data-thema=\"luisteren\" data-rol=\"commercieel\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">De training heeft me vooral bewuster gemaakt van hoe ik gesprekken voer. Ik stel nu gerichter open vragen en merk dat dit direct invloed heeft op hoe de ander reageert. Het helpt mij om minder automatisch te handelen en meer vanuit inzicht te communiceren, zowel richting klanten als collega&#8217;s.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Commercieel teamlid<\/span><span class=\"org\">B2B productieorganisatie<\/span><span class=\"tags\"><span class=\"tag\">Commercieel &amp; sales<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"veiligheid\" data-rol=\"team\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">Wat ik vooral meeneem is het inzicht in mijn eigen patronen en die van collega&#8217;s. Je gaat elkaar beter begrijpen zonder direct te oordelen. Dat zorgt voor sterkere samenwerking binnen het team. De bewustwording alleen al maakt dat gesprekken anders verlopen dan voorheen.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Projectteam<\/span><span class=\"org\">Technische productieomgeving<\/span><span class=\"tags\"><span class=\"tag\">Professional &amp; team<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"veiligheid\" data-rol=\"team\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">De training was intensief en niet elk onderdeel sluit een-op-een aan op mijn manier van werken. Tegelijkertijd heeft het me wel bewuster gemaakt van hoe ik situaties aanpak en hoe mijn gedrag overkomt op anderen. Vooral het reflecteren op vaste patronen neem ik mee in mijn dagelijkse werk.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Medewerker<\/span><span class=\"org\">B2B organisatie (productie en projectmatig)<\/span><span class=\"tags\"><span class=\"tag\">Professional &amp; team<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"luisteren\" data-rol=\"commercieel\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">De training heeft mijn manier van gesprekken voeren echt veranderd. Door het verschil tussen gesprekstechnieken te begrijpen, merkte ik hoe vaak ik onbewust weerstand opriep. Ik focus nu veel meer op luisteren en ruimte creeren. Alleen die verschuiving heeft de kwaliteit van mijn klantgesprekken al zichtbaar verbeterd.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Commercieel Professional<\/span><span class=\"org\">Internationale SaaS organisatie<\/span><span class=\"tags\"><span class=\"tag\">Commercieel &amp; sales<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"narratieven leiderschap\" data-rol=\"management\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">Het meest waardevol was het inzicht in hoe mijn kernverhalen mijn leiderschapsstijl beinvloeden. Door daar bewust naar te kijken, kan ik nu kiezen hoe ik reageer in plaats van automatisch te handelen. Dat maakt me effectiever en zorgvuldiger richting mijn team.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Teamleider<\/span><span class=\"org\">Academisch medisch centrum<\/span><span class=\"tags\"><span class=\"tag\">Leiderschap &amp; management<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"onderhandelen\" data-rol=\"commercieel\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">De combinatie van psychologie en commerciele strategie was krachtig. Het gaat niet alleen om technieken, maar om begrijpen waarom mensen reageren zoals ze doen. De technieken en luistervaardigheden pas ik direct toe in onderhandelingen.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Sales Consultant<\/span><span class=\"org\">Internationale logistieke organisatie<\/span><span class=\"tags\"><span class=\"tag\">Commercieel &amp; sales<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"narratieven\" data-rol=\"commercieel\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">Tijdens de training heb ik veel over mezelf geleerd. Vooral hoe mijn eigen narratieven mijn communicatie beinvloeden. Dat bewustzijn verandert nu al hoe ik met bezwaren en klantgesprekken omga.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Business Development<\/span><span class=\"org\">Technologie scale-up<\/span><span class=\"tags\"><span class=\"tag\">Commercieel &amp; sales<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"praktijk\" data-rol=\"commercieel\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">Wat sterk was aan deze training is dat het direct aansloot op onze dagelijkse praktijk. De rollenspellen en voorbeelden uit onze eigen organisatie maakten het concreet. Ik kon het de volgende dag meteen toepassen.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Commercieel Specialist<\/span><span class=\"org\">Mobiliteitssector<\/span><span class=\"tags\"><span class=\"tag\">Commercieel &amp; sales<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"veiligheid\" data-rol=\"commercieel\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">Ook al is Engels niet mijn moedertaal, ik voelde me continu veilig en betrokken. De manier van begeleiden zorgde voor een open sfeer waarin iedereen op zijn eigen manier kon leren. Dat maakte het verschil.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Commercieel Professional<\/span><span class=\"org\">Internationale organisatie<\/span><span class=\"tags\"><span class=\"tag\">Commercieel &amp; sales<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"narratieven\" data-rol=\"commercieel\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">Het inzicht in hoe mijn persoonlijke narratieven mijn gedrag sturen was een kantelpunt. Ik zie nu waar bepaalde patronen me geholpen hebben, maar ook waar ze me beperken. Dat geeft ruimte om bewuster te kiezen.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Commercieel Leider<\/span><span class=\"org\">Internationale B2B organisatie<\/span><span class=\"tags\"><span class=\"tag\">Commercieel &amp; sales<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"luisteren onderhandelen\" data-rol=\"commercieel\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">De grootste impact zat voor mij in echt leren luisteren en betere vragen stellen. Onderhandelingen gaan nu minder over overtuigen en meer over begrijpen. Dat verandert de hele dynamiek van een gesprek.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Accountmanager<\/span><span class=\"org\">Europese logistieke organisatie<\/span><span class=\"tags\"><span class=\"tag\">Commercieel &amp; sales<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"veiligheid\" data-rol=\"commercieel\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">De training was intensief en mentaal uitdagend, maar juist daardoor waardevol. Het dwingt je om oude patronen onder de loep te nemen en uit je comfortzone te stappen. Dat is precies waar groei ontstaat.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Sales Professional<\/span><span class=\"org\">Internationale technologieorganisatie<\/span><span class=\"tags\"><span class=\"tag\">Commercieel &amp; sales<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"praktijk\" data-rol=\"commercieel\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">De echte uitdaging zit in het consequent toepassen in de dagelijkse praktijk. Tegelijkertijd biedt het model een duidelijke structuur waar je steeds op kunt terugvallen. Het helpt mij om gesprekken en beslissingen bewuster te voeren.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Commercieel Consultant<\/span><span class=\"org\">B2B dienstverlener<\/span><span class=\"tags\"><span class=\"tag\">Commercieel &amp; sales<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"narratieven\" data-rol=\"commercieel\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">Het besef dat onze diepste narratieven ons gedrag sturen, was voor mij het grootste inzicht. Ik zie nu hoe dat direct invloed heeft op mijn gesprekken. Dat maakt mijn aanpak bewuster en effectiever.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Commercieel Professional<\/span><span class=\"org\">Energieorganisatie<\/span><span class=\"tags\"><span class=\"tag\">Commercieel &amp; sales<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"leiderschap narratieven\" data-rol=\"management\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">Het inzicht in mijn eigen gedrag en waar dat vandaan komt was confronterend, maar waardevol. Ik ben me bewuster van mijn patronen en dat maakt mijn leiderschap sterker.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Teamleider<\/span><span class=\"org\">Gemeentelijke organisatie<\/span><span class=\"tags\"><span class=\"tag\">Leiderschap &amp; management<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"veiligheid\" data-rol=\"management\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">Kwetsbaar durven zijn in de groep was spannend, maar precies daar zat de groei.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Manager<\/span><span class=\"org\">Technische dienstverlener<\/span><span class=\"tags\"><span class=\"tag\">Leiderschap &amp; management<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"veiligheid\" data-rol=\"team\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">De openheid in de groep en de veilige sfeer maakten het mogelijk om echt te leren van elkaar.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Professional<\/span><span class=\"org\">Energiebedrijf<\/span><span class=\"tags\"><span class=\"tag\">Professional &amp; team<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"veiligheid\" data-rol=\"commercieel\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">Uit je comfortzone stappen en je visie delen vraagt moed. Maar het levert echte inzichten op.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Business Professional<\/span><span class=\"org\">B2B organisatie<\/span><span class=\"tags\"><span class=\"tag\">Commercieel &amp; sales<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"praktijk\" data-rol=\"commercieel\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">De combinatie van theorie en rollenspellen maakte het direct toepasbaar. Je oefent niet alleen, je ervaart het.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Sales Professional<\/span><span class=\"org\">Agri organisatie<\/span><span class=\"tags\"><span class=\"tag\">Commercieel &amp; sales<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"veiligheid\" data-rol=\"team\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">Wat voor mij het verschil maakte, was de veilige sfeer waarin alles besproken kon worden. Er werd echt geluisterd en iedereen kwam aan bod. Daardoor durfde ik eerlijk te reflecteren op mijn eigen handelen.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Medewerker<\/span><span class=\"org\">Publieke dienstverlening<\/span><span class=\"tags\"><span class=\"tag\">Professional &amp; team<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"veiligheid\" data-rol=\"team\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">De training heeft me laten inzien dat ik eerder mijn grens mag aangeven. Ik hoef niet alles te accepteren. Dat geeft rust en duidelijkheid in gesprekken.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Professional<\/span><span class=\"org\">Klantcontact omgeving<\/span><span class=\"tags\"><span class=\"tag\">Professional &amp; team<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"praktijk\" data-rol=\"team\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">Het uitspelen van eigen casussen was ontzettend waardevol. Je leert niet uit een boek, maar vanuit je eigen praktijk.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Professional<\/span><span class=\"org\">Publieke dienstverlening<\/span><span class=\"tags\"><span class=\"tag\">Professional &amp; team<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"praktijk\" data-rol=\"team\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">De begeleiding voelde niet top-down. Er was veel ruimte voor onze eigen ervaringen en dagelijkse praktijk. Dat maakte het herkenbaar en toepasbaar.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Team<\/span><span class=\"org\">Operationele organisatie<\/span><span class=\"tags\"><span class=\"tag\">Professional &amp; team<\/span><\/span><\/div>\n    <\/article>\n\n    <article class=\"kaart\" data-thema=\"veiligheid\" data-rol=\"team\">\n      <span class=\"mark\">\u201c<\/span>\n      <p class=\"quote\">Het was soms confronterend om naar je eigen grenzen te kijken, maar juist daardoor leerzaam. De begeleiding was warm en duidelijk tegelijk.<\/p>\n      <div class=\"meta\"><span class=\"functie\">Medewerker<\/span><span class=\"org\">Dienstverlenende organisatie<\/span><span class=\"tags\"><span class=\"tag\">Professional &amp; team<\/span><\/span><\/div>\n    <\/article>\n\n  <\/div>\n\n  <!-- ===================== GEEN RESULTATEN ===================== -->\n  <div class=\"leeg\" id=\"inrLeeg\">\n    <div class=\"leeg-t\">Geen ervaringen gevonden<\/div>\n    <div class=\"leeg-s\">Pas je filters of zoekopdracht aan om meer ervaringen te zien.<\/div>\n  <\/div>\n\n  <div class=\"meer-rij\">\n    <button class=\"meer\" id=\"inrMeer\" type=\"button\">Toon meer ervaringen<\/button>\n  <\/div>\n\n  <!-- ===================== PRIVACY-NOOT ===================== -->\n  <div class=\"privacy\">\n    <div class=\"pic\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.7\"><path d=\"M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z\"><\/path><path d=\"M9 12l2 2 4-4\"><\/path><\/svg><\/div>\n    <p><strong>Wij hechten grote waarde aan privacy en dataveiligheid.<\/strong> Alle enquetegegevens zijn verzameld via een ISO 27001-gecertificeerde omgeving en beveiligd met SSL Extended Validation-certificaten, waardoor informatie versleuteld en volgens de hoogste beveiligingsnormen wordt verwerkt.<\/p>\n  <\/div>\n\n<\/div>\n<\/div>\n<!-- ===================== EINDE .inr-reviews ===================== -->\n\n<script>\n(function(){\n'use strict';\n\nvar root = document.querySelector('.inr-reviews');\nif(!root) return;\n\nvar BATCH = 6;                                  \/\/ hoeveel kaarten per stap\nvar kaarten = Array.prototype.slice.call(root.querySelectorAll('.kaart'));\nvar TOTAAL  = kaarten.length;\n\nvar zoekEl   = root.querySelector('#inrZoek');\nvar zoekWis  = root.querySelector('#inrZoekWis');\nvar tellerEl = root.querySelector('#inrTeller');\nvar resetEl  = root.querySelector('#inrReset');\nvar leegEl   = root.querySelector('#inrLeeg');\nvar meerEl   = root.querySelector('#inrMeer');\nvar chips    = Array.prototype.slice.call(root.querySelectorAll('.chip'));\n\n\/\/ zoektekst per kaart cachen (genormaliseerd)\nfunction norm(s){ return (s||'').toLowerCase()\n  .normalize('NFD').replace(\/[\\u0300-\\u036f]\/g,''); }\nkaarten.forEach(function(k){\n  k._rol    = (k.getAttribute('data-rol')||'').trim();\n  k._tekst  = norm(k.textContent);\n});\n\n\/\/ actieve filters\nvar actief = { rol:new Set() };\nvar zichtbaarLimiet = BATCH;\n\n\/\/ ---- chip-tellingen vullen (statisch totaal per sleutel) ----\nfunction vulChipTellingen(){\n  chips.forEach(function(chip){\n    var key = chip.getAttribute('data-key');\n    var n = kaarten.filter(function(k){ return k._rol===key; }).length;\n    var w = chip.querySelector('.telw');\n    if(w) w.textContent = n;\n  });\n}\n\n\/\/ ---- bepaalt of een kaart aan alle actieve filters voldoet ----\nfunction matcht(k, q){\n  \/\/ rol: OR binnen facet\n  if(actief.rol.size && !actief.rol.has(k._rol)) return false;\n  \/\/ zoek: AND over facet\n  if(q && k._tekst.indexOf(q)===-1) return false;\n  return true;\n}\n\nfunction render(){\n  var q = norm(zoekEl.value.trim());\n  var treffers = kaarten.filter(function(k){ return matcht(k,q); });\n  var getoond  = Math.min(treffers.length, zichtbaarLimiet);\n\n  \/\/ toon\/verberg\n  kaarten.forEach(function(k){ k.classList.add('is-hidden'); });\n  treffers.slice(0, getoond).forEach(function(k){ k.classList.remove('is-hidden'); });\n\n  \/\/ teller\n  var filtersActief = actief.rol.size || q;\n  if(treffers.length===0){\n    tellerEl.innerHTML = 'Geen van de <b>'+TOTAAL+'<\/b> ervaringen komt overeen';\n  } else if(!filtersActief){\n    tellerEl.innerHTML = '<b>'+TOTAAL+'<\/b> ervaringen beschikbaar &middot; toont <b>'+getoond+'<\/b>';\n  } else {\n    tellerEl.innerHTML = 'Toont <b>'+getoond+'<\/b> van <b>'+treffers.length+'<\/b> ervaringen <span style=\"opacity:.6\">(van '+TOTAAL+' totaal)<\/span>';\n  }\n\n  \/\/ leeg-status\n  leegEl.classList.toggle('toon', treffers.length===0);\n\n  \/\/ toon-meer\n  meerEl.classList.toggle('toon', getoond < treffers.length);\n  if(getoond < treffers.length){\n    meerEl.textContent = 'Toon meer ervaringen (+'+Math.min(BATCH, treffers.length-getoond)+')';\n  }\n\n  \/\/ reset-knop\n  resetEl.classList.toggle('toon', !!filtersActief);\n  \/\/ zoek-wis\n  zoekWis.classList.toggle('toon', !!zoekEl.value);\n}\n\n\/\/ ---- chip-klik ----\nchips.forEach(function(chip){\n  chip.addEventListener('click', function(){\n    var facet = chip.getAttribute('data-facet');\n    var key   = chip.getAttribute('data-key');\n    var set   = actief[facet];\n    if(set.has(key)){ set.delete(key); chip.setAttribute('aria-pressed','false'); }\n    else { set.add(key); chip.setAttribute('aria-pressed','true'); }\n    zichtbaarLimiet = BATCH;          \/\/ bij filterwijziging terug naar eerste batch\n    render();\n  });\n});\n\n\/\/ ---- zoeken ----\nvar t;\nzoekEl.addEventListener('input', function(){\n  clearTimeout(t);\n  t = setTimeout(function(){ zichtbaarLimiet = BATCH; render(); }, 120);\n});\nzoekWis.addEventListener('click', function(){\n  zoekEl.value=''; zichtbaarLimiet = BATCH; render(); zoekEl.focus();\n});\n\n\/\/ ---- toon meer ----\nmeerEl.addEventListener('click', function(){\n  zichtbaarLimiet += BATCH; render();\n});\n\n\/\/ ---- reset ----\nresetEl.addEventListener('click', function(){\n  actief.rol.clear();\n  chips.forEach(function(c){ c.setAttribute('aria-pressed','false'); });\n  zoekEl.value=''; zichtbaarLimiet = BATCH; render();\n});\n\nvulChipTellingen();\nrender();\n\n})();\n<\/script>\n\n\n\n\n\n<!-- ============================================================================\n     INR CONTACTFORMULIER\n     E\u00e9n bestand. Plak dit volledig in \u00c9\u00c9N Elementor HTML-widget.\n     Alles is gescoped onder .inr-contact en afgedwongen met !important,\n     zodat Elementor\/WordPress de stijl niet kan overrulen.\n\n     Stijl in lijn met de rest van de site: Inter, witte basis, ink #0A0A0B,\n     glassmorphism, atmosfeer-blobs, reveal-on-scroll, ink-accent.\n\n     Verzending: eigen plugin-endpoint (INR Website Leads), form-type 'contact'.\n     Geen Elementor-capture meer. Honeypot + tijdslot tegen bots.\n\n     CONTRAST-FIX (WCAG AA): de lichtgrijze tint --grijs-licht (#9A95A8) haalde\n     maar 2.9:1 op wit en zakte daarmee onder de 4.5:1-eis. Alle leesbare tekst\n     die daarop stond \u2014 het (optioneel)-sterretje en de placeholders \u2014 staat nu\n     op --grijs (#6B6480, 5.59:1). De decoratieve select-chevron is mee verhoogd.\n     ============================================================================ -->\n\n<style>\n\/* ---------- 1. ELEMENTOR-ONTWAPENING + ROOT ---------- *\/\n.inr-contact{\n  --ink:#0A0A0B; --ink-2:#1C1C20; --grijs:#6B6480; --grijs-licht:#9A95A8;\n  --lijn:rgba(10,10,11,.10); --lijn-zacht:rgba(10,10,11,.06);\n  --veld-bg:#FFFFFF; --glas:rgba(255,255,255,.72); --soft:#F7F6FA;\n  --radius:24px; --maxw:1200px;\n  position:relative !important; width:100% !important; max-width:100% !important;\n  margin:0 !important; padding:0 clamp(22px,5vw,40px) !important; box-sizing:border-box !important;\n  color:var(--ink) !important; background:transparent !important; line-height:1.5 !important;\n  overflow:hidden !important; text-align:left !important;\n  -webkit-font-smoothing:antialiased !important;\n}\n.inr-contact, .inr-contact *, .inr-contact *::before, .inr-contact *::after{\n  box-sizing:border-box !important;\n  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif !important;\n}\n.inr-contact h1,.inr-contact h2,.inr-contact h3,.inr-contact p,\n.inr-contact span,.inr-contact div,.inr-contact label,.inr-contact a,.inr-contact button{margin:0;padding:0;}\n.inr-contact a{text-decoration:none !important;color:inherit !important;}\n.inr-contact button{background:none !important;border:none !important;cursor:pointer !important;color:inherit !important;font:inherit !important;}\n\n\/* ---------- 2. ATMOSFEER (drift-blobs) ---------- *\/\n.inr-contact .atmos{position:absolute !important;inset:0 !important;z-index:0 !important;overflow:hidden !important;pointer-events:none !important;background:transparent !important;}\n.inr-contact .blob{position:absolute !important;border-radius:50% !important;filter:blur(120px) !important;opacity:.07 !important;animation:inrc-drift 32s ease-in-out infinite !important;}\n.inr-contact .blob.a{width:520px;height:520px;background:rgba(10,10,11,1);top:-160px;left:-140px;}\n.inr-contact .blob.b{width:460px;height:460px;background:rgba(28,28,32,1);bottom:-200px;right:-160px;animation-delay:-13s;}\n@keyframes inrc-drift{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(36px,-28px) scale(1.06);}}\n\n\/* ---------- 3. LAYOUT ---------- *\/\n.inr-contact .wrap{position:relative !important;z-index:1 !important;width:100% !important;max-width:var(--maxw) !important;margin:0 auto !important;padding:clamp(64px,9vw,120px) 0 !important;}\n.inr-contact .kaart{\n  display:grid !important;grid-template-columns:0.92fr 1.08fr !important;gap:0 !important;\n  background:var(--glas) !important;-webkit-backdrop-filter:blur(20px) !important;backdrop-filter:blur(20px) !important;\n  border:1px solid var(--lijn) !important;border-radius:32px !important;overflow:hidden !important;\n  box-shadow:0 40px 90px -54px rgba(10,10,11,.4) !important;\n}\n\n\/* ---------- 4. LINKER PANEEL ---------- *\/\n.inr-contact .paneel{\n  position:relative !important;overflow:hidden !important;background:var(--ink) !important;color:#fff !important;\n  padding:clamp(40px,5vw,64px) clamp(32px,4vw,56px) !important;\n  display:flex !important;flex-direction:column !important;\n}\n.inr-contact .paneel::before{content:'' !important;position:absolute !important;top:-130px !important;right:-90px !important;width:360px !important;height:360px !important;border-radius:50% !important;background:radial-gradient(circle,rgba(255,255,255,.12),transparent 70%) !important;filter:blur(50px) !important;pointer-events:none !important;}\n.inr-contact .paneel::after{content:'' !important;position:absolute !important;bottom:-150px !important;left:-110px !important;width:340px !important;height:340px !important;border-radius:50% !important;background:radial-gradient(circle,rgba(255,255,255,.06),transparent 70%) !important;filter:blur(50px) !important;pointer-events:none !important;}\n.inr-contact .paneel-in{position:relative !important;z-index:1 !important;display:flex !important;flex-direction:column !important;height:100% !important;}\n.inr-contact .badge{display:inline-flex !important;align-items:center !important;gap:9px !important;align-self:flex-start !important;\n  font-size:12px !important;font-weight:600 !important;letter-spacing:.02em !important;color:#fff !important;\n  border:1px solid rgba(255,255,255,.22) !important;background:rgba(255,255,255,.06) !important;\n  padding:8px 15px !important;border-radius:99px !important;margin-bottom:30px !important;}\n.inr-contact .badge .stip{width:7px !important;height:7px !important;border-radius:50% !important;background:#fff !important;}\n.inr-contact .paneel h2{font-weight:700 !important;font-size:clamp(28px,3.6vw,42px) !important;line-height:1.08 !important;letter-spacing:-.03em !important;color:#fff !important;margin-bottom:18px !important;}\n.inr-contact .paneel .lead{font-size:clamp(15px,1.6vw,17px) !important;font-weight:300 !important;color:rgba(255,255,255,.74) !important;line-height:1.62 !important;max-width:42ch !important;}\n.inr-contact .direct{margin-top:auto !important;padding-top:42px !important;}\n.inr-contact .direct-l{font-size:12px !important;font-weight:600 !important;letter-spacing:.02em !important;text-transform:uppercase !important;color:rgba(255,255,255,.5) !important;margin-bottom:16px !important;}\n.inr-contact .direct-rij{display:flex !important;align-items:center !important;gap:13px !important;margin-bottom:13px !important;}\n.inr-contact .direct-rij:last-child{margin-bottom:0 !important;}\n.inr-contact .direct-ic{flex:none !important;width:38px !important;height:38px !important;border-radius:11px !important;background:rgba(255,255,255,.08) !important;border:1px solid rgba(255,255,255,.12) !important;display:flex !important;align-items:center !important;justify-content:center !important;color:#fff !important;}\n.inr-contact .direct-ic svg{width:17px !important;height:17px !important;stroke:#fff !important;fill:none !important;stroke-width:1.7 !important;stroke-linecap:round !important;stroke-linejoin:round !important;}\n.inr-contact .direct-rij a,.inr-contact .direct-rij span{font-size:15.5px !important;font-weight:400 !important;color:rgba(255,255,255,.92) !important;letter-spacing:-.01em !important;transition:color .2s !important;word-break:break-word !important;}\n.inr-contact a.direct-link:hover{color:#fff !important;}\n\n\/* ---------- 5. RECHTER PANEEL: FORMULIER ---------- *\/\n.inr-contact .form-zij{padding:clamp(40px,5vw,64px) clamp(32px,4vw,56px) !important;background:transparent !important;}\n.inr-contact .veld-rij{display:grid !important;grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;gap:18px !important;margin-bottom:20px !important;}\n.inr-contact .veld{display:flex !important;flex-direction:column !important;min-width:0 !important;}\n.inr-contact .veld.vol{margin-bottom:20px !important;}\n.inr-contact .veld label{font-size:13px !important;font-weight:600 !important;color:var(--ink) !important;letter-spacing:-.005em !important;margin-bottom:8px !important;}\n\/* CONTRAST-FIX: was --grijs-licht (2.9:1), nu --grijs (5.59:1). *\/\n.inr-contact .veld label .ster{color:var(--grijs) !important;font-weight:400 !important;}\n.inr-contact .veld input,.inr-contact .veld select,.inr-contact .veld textarea{\n  width:100% !important;border:1px solid var(--lijn) !important;border-radius:13px !important;\n  padding:14px 16px !important;font-size:15px !important;font-weight:400 !important;line-height:1.4 !important;\n  color:var(--ink) !important;background:var(--veld-bg) !important;-webkit-text-fill-color:var(--ink) !important;\n  outline:none !important;-webkit-appearance:none !important;appearance:none !important;\n  transition:border-color .2s,box-shadow .2s,background .2s !important;\n}\n\/* CONTRAST-FIX: placeholders waren --grijs-licht (2.9:1), nu --grijs (5.59:1). *\/\n.inr-contact .veld input::placeholder,.inr-contact .veld textarea::placeholder{color:var(--grijs) !important;opacity:1 !important;}\n.inr-contact .veld input:focus,.inr-contact .veld select:focus,.inr-contact .veld textarea:focus{\n  border-color:var(--ink) !important;box-shadow:0 0 0 4px rgba(10,10,11,.07) !important;\n}\n.inr-contact .veld input.fout,.inr-contact .veld textarea.fout{border-color:#DC2626 !important;box-shadow:0 0 0 4px rgba(220,38,38,.10) !important;}\n.inr-contact .veld textarea{min-height:130px !important;resize:vertical !important;}\n.inr-contact .veld.select-veld{position:relative !important;}\n\/* Decoratieve chevron, mee verhoogd naar --grijs voor visuele samenhang. *\/\n.inr-contact .veld.select-veld::after{content:'' !important;position:absolute !important;right:18px !important;bottom:19px !important;width:8px !important;height:8px !important;border-right:1.6px solid var(--grijs) !important;border-bottom:1.6px solid var(--grijs) !important;transform:rotate(45deg) !important;pointer-events:none !important;}\n.inr-contact .veld select{cursor:pointer !important;padding-right:40px !important;}\n\n\/* honeypot, visueel verborgen *\/\n.inr-contact .hp-veld{position:absolute !important;left:-9999px !important;top:-9999px !important;width:1px !important;height:1px !important;overflow:hidden !important;}\n\n.inr-contact .knop{\n  display:inline-flex !important;align-items:center !important;justify-content:center !important;gap:10px !important;width:100% !important;\n  margin-top:8px !important;background:var(--ink) !important;color:#fff !important;border-radius:14px !important;\n  padding:17px 28px !important;font-size:16px !important;font-weight:600 !important;letter-spacing:-.005em !important;line-height:1.2 !important;\n  box-shadow:0 14px 30px -16px rgba(10,10,11,.6) !important;\n  transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,opacity .25s !important;\n}\n.inr-contact .knop:hover{transform:translateY(-2px) !important;box-shadow:0 20px 40px -18px rgba(10,10,11,.7) !important;}\n.inr-contact .knop svg{width:16px !important;height:16px !important;stroke:currentColor !important;fill:none !important;stroke-width:2 !important;stroke-linecap:round !important;stroke-linejoin:round !important;transition:transform .35s cubic-bezier(.2,.7,.2,1) !important;}\n.inr-contact .knop:hover svg{transform:translateX(4px) !important;}\n.inr-contact .knop[disabled]{opacity:.55 !important;cursor:wait !important;transform:none !important;box-shadow:none !important;}\n\n.inr-contact .form-fout{font-size:13.5px !important;font-weight:400 !important;color:#DC2626 !important;margin-top:14px !important;text-align:center !important;\n  max-height:0 !important;overflow:hidden !important;opacity:0 !important;transition:opacity .25s,max-height .25s !important;}\n.inr-contact .form-fout.toon{opacity:1 !important;max-height:60px !important;}\n.inr-contact .form-belofte{margin-top:18px !important;display:flex !important;align-items:flex-start !important;gap:9px !important;font-size:12.5px !important;font-weight:400 !important;color:var(--grijs) !important;line-height:1.55 !important;}\n.inr-contact .form-belofte svg{width:14px !important;height:14px !important;flex:none !important;margin-top:2px !important;stroke:var(--ink) !important;fill:none !important;stroke-width:2 !important;stroke-linecap:round !important;stroke-linejoin:round !important;}\n\n\/* ---------- 6. SUCCES-STAAT ---------- *\/\n.inr-contact .form-velden.verzonden{display:none !important;}\n.inr-contact .succes{display:none !important;flex-direction:column !important;align-items:flex-start !important;gap:16px !important;padding:14px 0 !important;}\n.inr-contact .succes.toon{display:flex !important;}\n.inr-contact .succes .vink{width:54px !important;height:54px !important;border-radius:16px !important;background:var(--soft) !important;border:1px solid var(--lijn) !important;display:flex !important;align-items:center !important;justify-content:center !important;}\n.inr-contact .succes .vink svg{width:26px !important;height:26px !important;stroke:var(--ink) !important;fill:none !important;stroke-width:2.4 !important;stroke-linecap:round !important;stroke-linejoin:round !important;}\n.inr-contact .succes h3{font-weight:700 !important;font-size:23px !important;letter-spacing:-.02em !important;color:var(--ink) !important;}\n.inr-contact .succes p{font-size:15.5px !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.6 !important;max-width:42ch !important;}\n\n\/* ---------- 7. REVEAL ---------- *\/\n.inr-contact .rev{opacity:0;transform:translateY(34px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);}\n.inr-contact .rev.in{opacity:1 !important;transform:none !important;}\n\n\/* ---------- 8. MOBIEL ---------- *\/\n@media(max-width:880px){\n  .inr-contact .wrap{padding:64px 0 !important;}\n  .inr-contact .kaart{grid-template-columns:1fr !important;border-radius:26px !important;}\n  .inr-contact .paneel{padding:40px 28px !important;}\n  .inr-contact .paneel .lead{max-width:none !important;}\n  .inr-contact .direct{padding-top:34px !important;}\n  .inr-contact .form-zij{padding:36px 28px !important;}\n  .inr-contact .veld-rij{grid-template-columns:1fr !important;gap:0 !important;margin-bottom:0 !important;}\n  .inr-contact .veld-rij .veld{margin-bottom:20px !important;}\n}\n@media(prefers-reduced-motion:reduce){\n  .inr-contact .rev{opacity:1 !important;transform:none !important;transition:none !important;}\n  .inr-contact .blob{animation:none !important;}\n  .inr-contact .knop,.inr-contact .knop svg{transition:none !important;}\n}\n<\/style>\n\n<div class=\"inr-contact\">\n<div class=\"atmos\"><div class=\"blob a\"><\/div><div class=\"blob b\"><\/div><\/div>\n\n<div class=\"wrap\">\n  <div class=\"kaart rev\">\n\n    <!-- LINKER PANEEL -->\n    <div class=\"paneel\">\n      <div class=\"paneel-in\">\n\n        <h2>Zeg hallo. Wij denken graag met je mee.<\/h2>\n        <p class=\"lead\">Laat je gegevens achter en vertel kort waar je mee bezig bent. We nemen persoonlijk contact met je op, zonder verkooppraat.<\/p>\n        <div class=\"direct\">\n          <div class=\"direct-l\">Ons direct bereiken<\/div>\n          <div class=\"direct-rij\">\n            <span class=\"direct-ic\"><svg viewBox=\"0 0 24 24\"><path d=\"M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L20 13l1 4v3a1 1 0 0 1-1 1A16 16 0 0 1 4 5a1 1 0 0 1 1-1z\"><\/path><\/svg><\/span>\n            <a class=\"direct-link\" href=\"tel:+31320844170\">+31 320 844 170<\/a>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <!-- RECHTER PANEEL: FORMULIER -->\n    <div class=\"form-zij\">\n      <div class=\"form-velden\" id=\"inrcVelden\">\n\n        <div class=\"veld-rij\">\n          <div class=\"veld\">\n            <label for=\"inrcNaam\">Naam<\/label>\n            <input type=\"text\" id=\"inrcNaam\" placeholder=\"Jan Willem\" autocomplete=\"name\">\n          <\/div>\n          <div class=\"veld\">\n            <label for=\"inrcTel\">Telefoon <span class=\"ster\">(optioneel)<\/span><\/label>\n            <input type=\"tel\" id=\"inrcTel\" placeholder=\"Telefoon\" autocomplete=\"tel\">\n          <\/div>\n        <\/div>\n\n        <div class=\"veld vol\">\n          <label for=\"inrcEmail\">E-mail<\/label>\n          <input type=\"email\" id=\"inrcEmail\" placeholder=\"jij@bedrijf.nl\" autocomplete=\"email\" inputmode=\"email\">\n        <\/div>\n\n        <div class=\"veld-rij\">\n          <div class=\"veld select-veld\">\n            <label for=\"inrcLocatie\">Locatie <span class=\"ster\">(optioneel)<\/span><\/label>\n            <select id=\"inrcLocatie\">\n              <option value=\"\">Selecteer<\/option>\n              <option value=\"Noord-Nederland\">Noord-Nederland<\/option>\n              <option value=\"Oost-Nederland\">Oost-Nederland<\/option>\n              <option value=\"Midden-Nederland\">Midden-Nederland<\/option>\n              <option value=\"West-Nederland\">West-Nederland<\/option>\n              <option value=\"Zuid-Nederland\">Zuid-Nederland<\/option>\n              <option value=\"Heel Nederland \/ landelijk\">Heel Nederland \/ landelijk<\/option>\n            <\/select>\n          <\/div>\n          <div class=\"veld\">\n            <label for=\"inrcMedewerkers\">Medewerkers <span class=\"ster\">(optioneel)<\/span><\/label>\n            <input type=\"number\" id=\"inrcMedewerkers\" placeholder=\"1\" min=\"1\" inputmode=\"numeric\">\n          <\/div>\n        <\/div>\n\n        <div class=\"veld vol\">\n          <label for=\"inrcBericht\">Bericht<\/label>\n          <textarea id=\"inrcBericht\" placeholder=\"Waar kunnen we je mee helpen?\"><\/textarea>\n        <\/div>\n\n        <!-- honeypot -->\n        <div class=\"hp-veld\" aria-hidden=\"true\">\n          <label for=\"inrcHp\">Laat dit veld leeg<\/label>\n          <input type=\"text\" id=\"inrcHp\" tabindex=\"-1\" autocomplete=\"off\">\n        <\/div>\n\n        <button type=\"button\" class=\"knop\" id=\"inrcKnop\">\n          Verstuur bericht\n          <svg viewBox=\"0 0 24 24\"><path d=\"M5 12h14M13 6l6 6-6 6\"><\/path><\/svg>\n        <\/button>\n\n        <div class=\"form-fout\" id=\"inrcFout\">Controleer de gemarkeerde velden.<\/div>\n\n        <div class=\"form-belofte\">\n          <svg viewBox=\"0 0 24 24\"><path d=\"M20 6 9 17l-5-5\"><\/path><\/svg>\n          <span>We gebruiken je gegevens uitsluitend om contact met je op te nemen over je vraag.<\/span>\n        <\/div>\n      <\/div>\n\n      <!-- succes-staat -->\n      <div class=\"succes\" id=\"inrcSucces\">\n        <div class=\"vink\"><svg viewBox=\"0 0 24 24\"><path d=\"M20 6 9 17l-5-5\"><\/path><\/svg><\/div>\n        <h3>Bedankt, je bericht is binnen.<\/h3>\n        <p>We hebben je gegevens ontvangen en nemen zo snel mogelijk persoonlijk contact met je op.<\/p>\n      <\/div>\n    <\/div>\n\n  <\/div>\n<\/div>\n<\/div>\n\n<script>\n\/* ----- Config: pas hier het endpoint aan zonder de rest te raken ----- *\/\nwindow.INR_CONTACT = {\n  endpoint: \"\/wp-json\/inr-dashboard\/v1\/lead-binnen\",\n  form: \"contact\"\n};\n\n(function(){\n  var GELADEN = Math.floor(Date.now() \/ 1000);\n\n  function start(root){\n    if(!root || root.getAttribute('data-inr-actief') === '1'){ return; }\n    root.setAttribute('data-inr-actief', '1');\n\n    var CFG = window.INR_CONTACT || {};\n    var ENDPOINT = CFG.endpoint || '\/wp-json\/inr-dashboard\/v1\/lead-binnen';\n    var FORM = CFG.form || 'contact';\n\n    var velden = root.querySelector('#inrcVelden');\n    var succes = root.querySelector('#inrcSucces');\n    var knop   = root.querySelector('#inrcKnop');\n    var fout   = root.querySelector('#inrcFout');\n    if(!knop) return;\n\n    var naam   = root.querySelector('#inrcNaam');\n    var tel    = root.querySelector('#inrcTel');\n    var email  = root.querySelector('#inrcEmail');\n    var loc    = root.querySelector('#inrcLocatie');\n    var mede   = root.querySelector('#inrcMedewerkers');\n    var bericht= root.querySelector('#inrcBericht');\n    var hp     = root.querySelector('#inrcHp');\n\n    function geldigEmail(e){ return \/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$\/.test(e); }\n\n    function toonFout(tekst){\n      if(tekst) fout.textContent = tekst;\n      fout.classList.add('toon');\n    }\n    function wisFout(){ fout.classList.remove('toon'); }\n\n    [naam, email, bericht].forEach(function(v){\n      if(v){ v.addEventListener('input', function(){ v.classList.remove('fout'); wisFout(); }); }\n    });\n\n    function valideer(){\n      var ok = true;\n      if(!(naam.value || '').trim()){ naam.classList.add('fout'); ok = false; }\n      if(!geldigEmail((email.value || '').trim())){ email.classList.add('fout'); ok = false; }\n      if(!(bericht.value || '').trim()){ bericht.classList.add('fout'); ok = false; }\n      return ok;\n    }\n\n    \/* Verstuur naar het eigen plugin-endpoint (geen Elementor). Fire-and-forget\n       met honeypot + tijdslot tegen bots. Opslaan-voor-mailen gebeurt server-\n       side, dus een lead raakt niet kwijt; we tonen de bezoeker altijd de\n       bevestiging zodra de aanvraag is weggestuurd. *\/\n    function verzendNaarPlugin(klaar){\n      var payload = {\n        form: FORM,\n        naam: (naam.value || '').trim(),\n        email: (email.value || '').trim(),\n        velden: {\n          'Telefoon': (tel.value || '').trim(),\n          'Locatie': (loc.value || '').trim(),\n          'Aantal medewerkers': (mede.value || '').trim(),\n          'Bericht': (bericht.value || '').trim()\n        },\n        meta: {},\n        bron: window.location.href,\n        ts: GELADEN,\n        website: (hp ? hp.value : '')\n      };\n      try {\n        var xhr = new XMLHttpRequest();\n        xhr.open('POST', ENDPOINT, true);\n        xhr.setRequestHeader('Content-Type', 'application\/json');\n        xhr.timeout = 15000;\n        xhr.onreadystatechange = function(){\n          if(xhr.readyState !== 4) return;\n          if(xhr.status >= 200 && xhr.status < 300){ klaar(true); }\n          else { klaar(false); }\n        };\n        xhr.ontimeout = function(){ klaar(false); };\n        xhr.onerror = function(){ klaar(false); };\n        xhr.send(JSON.stringify(payload));\n      } catch(e){ klaar(false); }\n    }\n\n    function toonSucces(){\n      velden.classList.add('verzonden');\n      succes.classList.add('toon');\n      try { succes.scrollIntoView({ behavior:'smooth', block:'center' }); } catch(e){}\n    }\n\n    knop.addEventListener('click', function(){\n      wisFout();\n      if(!valideer()){ toonFout('Vul je naam, een geldig e-mailadres en een bericht in.'); return; }\n      knop.disabled = true;\n      knop.textContent = 'Een moment...';\n      verzendNaarPlugin(function(ok){\n        if(ok){\n          toonSucces();\n        } else {\n          knop.disabled = false;\n          knop.innerHTML = 'Verstuur bericht <svg viewBox=\"0 0 24 24\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg>';\n          toonFout('Er ging iets mis bij het versturen. Probeer het zo nog eens, of bel ons direct.');\n        }\n      });\n    });\n\n    \/* Enter in een normaal veld (niet de textarea) verstuurt het formulier. *\/\n    [naam, tel, email, mede].forEach(function(v){\n      if(v){ v.addEventListener('keypress', function(e){ if(e.key === 'Enter'){ e.preventDefault(); knop.click(); } }); }\n    });\n\n    \/* Reveal-on-scroll, met een veiligheidsval: als de IntersectionObserver om\n       welke reden dan ook niet vuurt (bijvoorbeeld omdat de template-widget al\n       volledig in beeld staat bij het laden, of buiten een normale scroll-context\n       leeft), maken we de kaart sowieso zichtbaar. Zo blijft het formulier nooit\n       op opacity:0 hangen. *\/\n    var revs = root.querySelectorAll('.rev');\n    function toonAlles(){ [].forEach.call(revs, function(e){ e.classList.add('in'); }); }\n    if(!('IntersectionObserver' in window)){\n      toonAlles();\n    } else {\n      var io = new IntersectionObserver(function(es){\n        es.forEach(function(e){ if(e.isIntersecting){ e.target.classList.add('in'); io.unobserve(e.target); } });\n      }, { threshold:.08, rootMargin:'0px 0px -4% 0px' });\n      [].forEach.call(revs, function(e){ io.observe(e); });\n      \/\/ Veiligheidsval: wat er ook gebeurt, na 1,2s is de kaart zichtbaar.\n      setTimeout(toonAlles, 1200);\n    }\n  }\n\n  \/* Initialiseer elk contactformulier op de pagina. Dit is bewust bestand tegen\n     de manier waarop WordPress een template-widget kan inladen: de widget kan op\n     de ene pagina vroeg in de DOM staan en op de andere later worden geinjecteerd\n     (waardoor een eenmalige querySelector bij het laden niets vond en het formulier\n     onzichtbaar bleef). We proberen daarom meermaals:\n       1. meteen, voor formulieren die er al zijn,\n       2. op DOMContentLoaded,\n       3. via een MutationObserver voor widgets die later in de DOM verschijnen,\n       4. met een paar korte herhaalde pogingen als veiligheidsnet. *\/\n  function initAlle(){\n    var lijst = document.querySelectorAll('.inr-contact');\n    [].forEach.call(lijst, function(node){ start(node); });\n  }\n\n  \/\/ 1 + 2: meteen en bij DOM-gereed.\n  if(document.readyState === 'loading'){\n    document.addEventListener('DOMContentLoaded', initAlle);\n  } else {\n    initAlle();\n  }\n\n  \/\/ 3: vang formulieren op die na het laden alsnog worden ingeladen.\n  if('MutationObserver' in window){\n    var mo = new MutationObserver(function(){ initAlle(); });\n    if(document.body){\n      mo.observe(document.body, { childList:true, subtree:true });\n    } else {\n      document.addEventListener('DOMContentLoaded', function(){\n        mo.observe(document.body, { childList:true, subtree:true });\n      });\n    }\n  }\n\n  \/\/ 4: een paar korte herhaalde pogingen als extra vangnet (stopt vanzelf).\n  var pogingen = 0;\n  var herhaal = setInterval(function(){\n    pogingen++;\n    initAlle();\n    if(pogingen >= 10){ clearInterval(herhaal); }\n  }, 400);\n})();\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>Elke vraag in je organisatie komt uiteindelijk samen op \u00e9\u00e9n plek: de mens. Of het nu gaat om je omzet, je leiders, je cultuur, je teams of de groei van mensen zelf. Onder al die vragen ligt hetzelfde patroon. INR maakt dat zichtbaar en laat ontwikkeling overal tegelijk op gang komen. Doe de INR Scan [&hellip;]<\/p>\n","protected":false},"author":224244682,"featured_media":0,"parent":0,"menu_order":4,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1442","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/inr.institute\/en\/wp-json\/wp\/v2\/pages\/1442","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/inr.institute\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/inr.institute\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/inr.institute\/en\/wp-json\/wp\/v2\/users\/224244682"}],"replies":[{"embeddable":true,"href":"https:\/\/inr.institute\/en\/wp-json\/wp\/v2\/comments?post=1442"}],"version-history":[{"count":9,"href":"https:\/\/inr.institute\/en\/wp-json\/wp\/v2\/pages\/1442\/revisions"}],"predecessor-version":[{"id":81244,"href":"https:\/\/inr.institute\/en\/wp-json\/wp\/v2\/pages\/1442\/revisions\/81244"}],"wp:attachment":[{"href":"https:\/\/inr.institute\/en\/wp-json\/wp\/v2\/media?parent=1442"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}