{"id":79325,"date":"2026-07-01T19:58:33","date_gmt":"2026-07-01T17:58:33","guid":{"rendered":"https:\/\/inr.institute\/?page_id=79325"},"modified":"2026-08-03T09:01:28","modified_gmt":"2026-08-03T07:01:28","slug":"promise-and-value","status":"publish","type":"page","link":"https:\/\/inr.institute\/en\/belofte-en-waarde\/","title":{"rendered":"Our Promise and Value to Organizations"},"content":{"rendered":"\n<style>\n\/* ============================================================\n   INR ONZE BELOFTE EN WAARDE\n   Golden circle als onzichtbaar skelet: geloof -> aanpak -> bewijs\n   Root: .inr-belofte   scoped, !important, Elementor-proof\n   ============================================================ *\/\n\n.inr-belofte{\n  --ink:#0E0E12; --ink-2:#1A1A20; --grijs:#64646E; --grijs-2:#9A9AA4; --bg:#F5F5F7;\n  --lijn:rgba(14,14,18,.10); --lijn-2:rgba(14,14,18,.06);\n  --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-belofte, .inr-belofte *, .inr-belofte *::before, .inr-belofte *::after{\n  box-sizing:border-box !important;\n  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif !important;\n}\n.inr-belofte h1,.inr-belofte h2,.inr-belofte h3,.inr-belofte h4,.inr-belofte p,\n.inr-belofte span,.inr-belofte div,.inr-belofte ul,.inr-belofte li,.inr-belofte a{margin:0;padding:0;}\n.inr-belofte ul{list-style:none !important;}\n.inr-belofte a{text-decoration:none !important;color:inherit !important;}\n\n\/* taalafhankelijk verbergen (EN), zelfde mechaniek als homepage *\/\n.inr-belofte.lang-en .hero .knop.hide-on-en{display:none !important;}\n.inr-belofte.lang-en .slot .scta.hide-on-en{display:none !important;}\n\n\/* ---------- atmosfeer ---------- *\/\n.inr-belofte .atmos{position:absolute !important;inset:0 !important;z-index:0 !important;overflow:hidden !important;pointer-events:none !important;background:transparent !important;}\n.inr-belofte .blob{position:absolute !important;border-radius:50% !important;filter:blur(120px) !important;opacity:.5 !important;animation:inrb-drift 30s ease-in-out infinite !important;}\n.inr-belofte .blob.a{width:580px;height:580px;background:rgba(14,14,18,.10);top:-180px;left:-160px;}\n.inr-belofte .blob.b{width:520px;height:520px;background:rgba(100,100,110,.12);top:44%;right:-200px;animation-delay:-11s;}\n.inr-belofte .blob.c{width:660px;height:660px;background:rgba(14,14,18,.06);bottom:-260px;left:26%;animation-delay:-19s;}\n@keyframes inrb-drift{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(46px,-34px) scale(1.07);}}\n\n\/* ---------- layout-primitieven ---------- *\/\n.inr-belofte .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.inr-belofte .sec{position:relative !important;z-index:1 !important;padding:120px 0 !important;}\n.inr-belofte .sec.tight{padding:80px 0 !important;}\n\n\/* ---------- typo-helpers ---------- *\/\n.inr-belofte .eyebrow{font-size:13px !important;font-weight:600 !important;letter-spacing:.09em !important;text-transform:uppercase !important;color:var(--grijs) !important;}\n.inr-belofte .kop{text-align:center !important;max-width:800px !important;margin:0 auto 60px !important;}\n.inr-belofte .kop .eyebrow{display:block !important;margin-bottom:16px !important;}\n.inr-belofte .kop h2{font-weight:600 !important;font-size:clamp(30px,4.4vw,50px) !important;letter-spacing:-.028em !important;line-height:1.08 !important;color:var(--ink) !important;margin-bottom:18px !important;}\n.inr-belofte .kop p{font-size:18px !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.6 !important;}\n\n\/* ---------- reveal ---------- *\/\n.inr-belofte .rev{opacity:0;transform:translateY(24px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);}\n.inr-belofte .rev.in{opacity:1 !important;transform:none !important;}\n.inr-belofte .d1{transition-delay:.07s;}.inr-belofte .d2{transition-delay:.14s;}.inr-belofte .d3{transition-delay:.21s;}\n.inr-belofte .d4{transition-delay:.28s;}.inr-belofte .d5{transition-delay:.35s;}.inr-belofte .d6{transition-delay:.42s;}\n.no-js .inr-belofte .rev{opacity:1 !important;transform:none !important;}\n\n@media(max-width:820px){\n  .inr-belofte{padding-left:22px !important;padding-right:22px !important;}\n  .inr-belofte .wrap{padding-left:0 !important;padding-right:0 !important;}\n  .inr-belofte .hero{padding-left:0 !important;padding-right:0 !important;}\n  .inr-belofte .slot{padding-left:0 !important;padding-right:0 !important;}\n  .inr-belofte .band{margin-left:-22px !important;margin-right:-22px !important;padding-left:22px !important;padding-right:22px !important;}\n  .inr-belofte .sec{padding:72px 0 !important;}\n  .inr-belofte .blob.a{width:320px;height:320px;top:-90px;left:-100px;}\n  .inr-belofte .blob.b{width:300px;height:300px;right:-140px;}\n  .inr-belofte .blob.c{width:340px;height:340px;left:-60px;bottom:-160px;}\n}\n@media(prefers-reduced-motion:reduce){\n  .inr-belofte .rev{opacity:1 !important;transform:none !important;transition:none !important;}\n  .inr-belofte .blob{animation:none !important;}\n}\n\n\/* =================== HERO (WHY, opening) =================== *\/\n.inr-belofte .hero{min-height:82vh !important;display:flex !important;flex-direction:column !important;justify-content:center !important;\n  align-items:flex-start !important;padding:150px clamp(24px,5vw,40px) 90px !important;max-width:var(--maxw) !important;margin:0 auto !important;position:relative !important;z-index:1 !important;}\n.inr-belofte .hero .badge{display:inline-flex !important;align-items:center !important;gap:9px !important;\n  font-size:13px !important;font-weight:600 !important;color:var(--ink) !important;background:rgba(14,14,18,.06) !important;\n  padding:8px 16px !important;border-radius:99px !important;margin-bottom:30px !important;}\n.inr-belofte .hero .badge .stip{width:8px !important;height:8px !important;border-radius:50% !important;background:var(--ink) !important;box-shadow:0 0 0 4px rgba(14,14,18,.12) !important;}\n.inr-belofte .hero h1{font-weight:600 !important;font-size:clamp(42px,6.6vw,86px) !important;line-height:1.02 !important;letter-spacing:-.04em !important;\n  color:var(--ink) !important;margin-bottom:30px !important;max-width:16ch !important;}\n.inr-belofte .hero h1 .zacht{color:var(--grijs-2) !important;}\n.inr-belofte .hero .lead{font-size:clamp(18px,2.3vw,23px) !important;font-weight:300 !important;color:var(--grijs) !important;max-width:52ch !important;line-height:1.5 !important;margin-bottom:40px !important;}\n.inr-belofte .hero .lead strong{font-weight:600 !important;color:var(--ink) !important;}\n.inr-belofte .hero .acties{display:flex !important;gap:14px !important;flex-wrap:wrap !important;}\n.inr-belofte .knop{display:inline-flex !important;align-items:center !important;gap:10px !important;font-weight:600 !important;font-size:15px !important;padding:15px 26px !important;border-radius:99px !important;\n  transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,background .3s !important;cursor:pointer !important;}\n.inr-belofte .knop svg{width:16px !important;height:16px !important;transition:transform .35s cubic-bezier(.2,.7,.2,1) !important;}\n.inr-belofte .knop.primair{background:var(--ink) !important;color:#fff !important;}\n.inr-belofte .knop.primair:hover{transform:translateY(-3px) !important;box-shadow:0 18px 40px -20px rgba(14,14,18,.5) !important;}\n.inr-belofte .knop.primair:hover svg{transform:translateX(4px) !important;}\n.inr-belofte .knop.ghost{background:rgba(14,14,18,.04) !important;color:var(--ink) !important;border:1px solid var(--lijn) !important;}\n.inr-belofte .knop.ghost:hover{background:rgba(14,14,18,.08) !important;transform:translateY(-3px) !important;}\n@media(max-width:820px){\n  .inr-belofte .hero{min-height:auto !important;padding:130px clamp(28px,5vw,40px) 60px !important;}\n  .inr-belofte .hero h1{font-size:clamp(38px,11vw,58px) !important;}\n}\n\n\/* =================== GELOOF (WHY, uitgesproken) =================== *\/\n.inr-belofte .geloof{background:var(--ink) !important;color:#fff !important;border-radius:36px !important;padding:96px 60px !important;position:relative !important;overflow:hidden !important;text-align:center !important;}\n.inr-belofte .geloof::before{content:'' !important;position:absolute !important;top:-140px !important;left:50% !important;transform:translateX(-50%) !important;width:520px !important;height:520px !important;border-radius:50% !important;background:radial-gradient(circle,rgba(255,255,255,.10),transparent 70%) !important;filter:blur(60px) !important;}\n.inr-belofte .geloof .g-in{position:relative !important;z-index:1 !important;max-width:820px !important;margin:0 auto !important;}\n.inr-belofte .geloof .eyebrow{color:rgba(255,255,255,.55) !important;display:block !important;margin-bottom:26px !important;}\n.inr-belofte .geloof .stelling{font-weight:600 !important;font-size:clamp(28px,4.4vw,50px) !important;letter-spacing:-.028em !important;line-height:1.12 !important;color:#fff !important;margin-bottom:30px !important;}\n.inr-belofte .geloof .stelling em{font-style:normal !important;color:var(--grijs-2) !important;}\n.inr-belofte .geloof p{font-size:19px !important;font-weight:300 !important;color:rgba(255,255,255,.74) !important;line-height:1.62 !important;max-width:60ch !important;margin:0 auto !important;}\n.inr-belofte .geloof p + p{margin-top:18px !important;}\n.inr-belofte .geloof p strong{font-weight:600 !important;color:#fff !important;}\n@media(max-width:820px){.inr-belofte .geloof{padding:60px 26px !important;border-radius:26px !important;}}\n\n\/* =================== KANTELPUNT (HOW, contrast) =================== *\/\n.inr-belofte .kantel{display:grid !important;grid-template-columns:1fr 1fr !important;gap:20px !important;max-width:1000px !important;margin:0 auto !important;}\n.inr-belofte .kkaart{border-radius:22px !important;padding:38px 34px !important;position:relative !important;}\n.inr-belofte .kkaart.oud{background:rgba(14,14,18,.03) !important;border:1px solid var(--lijn-2) !important;}\n.inr-belofte .kkaart.nieuw{background:rgba(255,255,255,.72) !important;-webkit-backdrop-filter:blur(20px) !important;backdrop-filter:blur(20px) !important;border:1px solid var(--lijn) !important;box-shadow:0 20px 60px -40px rgba(14,14,18,.3) !important;}\n.inr-belofte .kkaart .klabel{font-size:12px !important;font-weight:600 !important;letter-spacing:.09em !important;text-transform:uppercase !important;margin-bottom:22px !important;display:inline-block !important;}\n.inr-belofte .kkaart.oud .klabel{color:var(--grijs-2) !important;}\n.inr-belofte .kkaart.nieuw .klabel{color:var(--ink) !important;}\n.inr-belofte .kkaart .kregel{display:flex !important;gap:13px !important;align-items:flex-start !important;padding:13px 0 !important;border-bottom:1px solid var(--lijn-2) !important;font-size:16px !important;font-weight:300 !important;line-height:1.5 !important;}\n.inr-belofte .kkaart .kregel:last-child{border-bottom:none !important;padding-bottom:0 !important;}\n.inr-belofte .kkaart .kregel:first-of-type{padding-top:0 !important;}\n.inr-belofte .kkaart.oud .kregel{color:var(--grijs) !important;}\n.inr-belofte .kkaart.nieuw .kregel{color:var(--ink) !important;}\n.inr-belofte .kkaart .ki{flex:none !important;width:22px !important;height:22px !important;border-radius:7px !important;display:flex !important;align-items:center !important;justify-content:center !important;margin-top:1px !important;}\n.inr-belofte .kkaart.oud .ki{background:rgba(14,14,18,.06) !important;color:var(--grijs-2) !important;}\n.inr-belofte .kkaart.nieuw .ki{background:rgba(14,14,18,.08) !important;color:var(--ink) !important;}\n.inr-belofte .kkaart .ki svg{width:13px !important;height:13px !important;}\n@media(max-width:820px){.inr-belofte .kantel{grid-template-columns:1fr !important;}}\n\n\/* =================== BELOFTE-KERN (HOW, de zin) =================== *\/\n.inr-belofte .kern{text-align:center !important;max-width:880px !important;margin:0 auto !important;}\n.inr-belofte .kern .q{font-weight:600 !important;font-size:clamp(28px,4.4vw,48px) !important;letter-spacing:-.026em !important;line-height:1.14 !important;color:var(--ink) !important;margin-bottom:24px !important;}\n.inr-belofte .kern .q .grijs{color:var(--grijs-2) !important;}\n.inr-belofte .kern p{font-size:19px !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.62 !important;max-width:60ch !important;margin:0 auto !important;}\n\n\/* =================== WAARDE (WHAT, het bewijs) =================== *\/\n.inr-belofte .band{background:var(--bg) !important;border-top:1px solid var(--lijn-2) !important;border-bottom:1px solid var(--lijn-2) !important;}\n.inr-belofte .waarde{display:grid !important;grid-template-columns:repeat(2,1fr) !important;gap:18px !important;max-width:1040px !important;margin:0 auto !important;}\n.inr-belofte .wkaart{background:rgba(255,255,255,.72) !important;-webkit-backdrop-filter:blur(20px) !important;backdrop-filter:blur(20px) !important;\n  border:1px solid var(--lijn) !important;border-radius:20px !important;padding:34px 32px !important;\n  box-shadow:0 10px 40px -32px rgba(14,14,18,.25) !important;transition:transform .4s cubic-bezier(.2,.7,.2,1) !important;}\n.inr-belofte .wkaart:hover{transform:translateY(-5px) !important;}\n.inr-belofte .wkaart .wi{width:46px !important;height:46px !important;border-radius:13px !important;background:rgba(14,14,18,.06) !important;color:var(--ink) !important;\n  display:flex !important;align-items:center !important;justify-content:center !important;margin-bottom:22px !important;}\n.inr-belofte .wkaart .wi svg{width:23px !important;height:23px !important;}\n.inr-belofte .wkaart h4{font-weight:600 !important;font-size:19px !important;color:var(--ink) !important;letter-spacing:-.014em !important;margin-bottom:10px !important;}\n.inr-belofte .wkaart p{font-size:15px !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.62 !important;}\n@media(max-width:820px){.inr-belofte .waarde{grid-template-columns:1fr !important;}}\n\n\/* =================== VERSCHUIVING (WHAT, de kanteling) =================== *\/\n.inr-belofte .schuif{display:grid !important;grid-template-columns:.9fr 1.1fr !important;gap:52px !important;align-items:center !important;}\n.inr-belofte .schuif-tekst .eyebrow{display:block !important;margin-bottom:16px !important;}\n.inr-belofte .schuif-tekst h2{font-weight:600 !important;font-size:clamp(28px,3.8vw,44px) !important;letter-spacing:-.026em !important;line-height:1.1 !important;color:var(--ink) !important;margin-bottom:18px !important;}\n.inr-belofte .schuif-tekst p{font-size:17px !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.64 !important;}\n.inr-belofte .schuif-tekst p + p{margin-top:16px !important;}\n.inr-belofte .schuif-tekst p strong{font-weight:600 !important;color:var(--ink) !important;}\n.inr-belofte .schuifrij-wrap{display:flex !important;flex-direction:column !important;gap:12px !important;}\n.inr-belofte .schuifrij{display:grid !important;grid-template-columns:1fr auto 1fr !important;gap:16px !important;align-items:center !important;\n  background:rgba(255,255,255,.72) !important;-webkit-backdrop-filter:blur(20px) !important;backdrop-filter:blur(20px) !important;\n  border:1px solid var(--lijn) !important;border-radius:16px !important;padding:20px 24px !important;\n  box-shadow:0 10px 40px -34px rgba(14,14,18,.3) !important;transition:transform .4s cubic-bezier(.2,.7,.2,1) !important;}\n.inr-belofte .schuifrij:hover{transform:translateX(6px) !important;}\n.inr-belofte .schuifrij .van{font-size:15px !important;font-weight:300 !important;color:var(--grijs-2) !important;line-height:1.4 !important;text-align:right !important;}\n.inr-belofte .schuifrij .naar{font-size:15px !important;font-weight:600 !important;color:var(--ink) !important;line-height:1.4 !important;}\n.inr-belofte .schuifrij .pijl{flex:none !important;width:30px !important;height:30px !important;border-radius:9px !important;background:rgba(14,14,18,.06) !important;color:var(--ink) !important;display:flex !important;align-items:center !important;justify-content:center !important;}\n.inr-belofte .schuifrij .pijl svg{width:15px !important;height:15px !important;}\n@media(max-width:880px){\n  .inr-belofte .schuif{grid-template-columns:1fr !important;gap:34px !important;}\n  .inr-belofte .schuifrij{grid-template-columns:1fr auto 1fr !important;padding:16px 18px !important;}\n  .inr-belofte .schuifrij .van,.inr-belofte .schuifrij .naar{font-size:14px !important;}\n}\n\n\/* =================== LENS (samenvattend, WHY-echo) =================== *\/\n.inr-belofte .lens{background:var(--ink) !important;color:#fff !important;border-radius:36px !important;padding:88px 60px !important;position:relative !important;overflow:hidden !important;}\n.inr-belofte .lens::before{content:'' !important;position:absolute !important;bottom:-140px !important;right:-100px !important;width:420px !important;height:420px !important;border-radius:50% !important;background:radial-gradient(circle,rgba(255,255,255,.09),transparent 70%) !important;filter:blur(50px) !important;}\n.inr-belofte .lens-grid{display:grid !important;grid-template-columns:1.1fr .9fr !important;gap:52px !important;align-items:center !important;position:relative !important;z-index:1 !important;}\n.inr-belofte .lens .eyebrow{color:rgba(255,255,255,.55) !important;display:block !important;margin-bottom:16px !important;}\n.inr-belofte .lens h2{font-weight:600 !important;font-size:clamp(28px,4vw,46px) !important;letter-spacing:-.026em !important;line-height:1.08 !important;color:#fff !important;margin-bottom:20px !important;}\n.inr-belofte .lens .lead{font-size:18px !important;font-weight:300 !important;color:rgba(255,255,255,.74) !important;line-height:1.62 !important;}\n.inr-belofte .lens .lead + .lead{margin-top:16px !important;}\n.inr-belofte .lens .lead strong{font-weight:600 !important;color:#fff !important;}\n.inr-belofte .lens-vinkjes{display:flex !important;flex-direction:column !important;gap:12px !important;}\n.inr-belofte .lvink{display:flex !important;gap:14px !important;align-items:center !important;background:rgba(255,255,255,.05) !important;border:1px solid rgba(255,255,255,.12) !important;border-radius:16px !important;padding:18px 22px !important;\n  transition:transform .4s cubic-bezier(.2,.7,.2,1),background .4s !important;}\n.inr-belofte .lvink:hover{transform:translateX(6px) !important;background:rgba(255,255,255,.09) !important;}\n.inr-belofte .lvink .lv-i{flex:none !important;width:34px !important;height:34px !important;border-radius:10px !important;background:rgba(255,255,255,.12) !important;color:#fff !important;display:flex !important;align-items:center !important;justify-content:center !important;}\n.inr-belofte .lvink .lv-i svg{width:17px !important;height:17px !important;}\n.inr-belofte .lvink span{font-size:15.5px !important;font-weight:600 !important;color:#fff !important;letter-spacing:-.01em !important;}\n@media(max-width:880px){\n  .inr-belofte .lens{padding:56px 26px !important;border-radius:26px !important;}\n  .inr-belofte .lens-grid{grid-template-columns:1fr !important;gap:38px !important;}\n}\n\n\/* =================== SLOT =================== *\/\n.inr-belofte .slot-sec{position:relative !important;z-index:2 !important;background:#FFFFFF !important;}\n.inr-belofte .slot{text-align:center !important;min-height:56vh !important;display:flex !important;flex-direction:column !important;justify-content:center !important;align-items:center !important;padding-top:100px !important;padding-bottom:110px !important;max-width:var(--maxw) !important;margin:0 auto !important;}\n.inr-belofte .slot > .rev{display:flex !important;flex-direction:column !important;align-items:center !important;text-align:center !important;}\n.inr-belofte .slot h2{font-weight:600 !important;font-size:clamp(34px,6vw,66px) !important;letter-spacing:-.032em !important;line-height:1.04 !important;max-width:17ch !important;color:var(--ink) !important;margin-bottom:24px !important;}\n.inr-belofte .slot p{font-size:19px !important;font-weight:300 !important;color:var(--grijs) !important;max-width:50ch !important;line-height:1.55 !important;margin-bottom:40px !important;}\n.inr-belofte .slot .scta{display:inline-flex !important;align-items:center !important;gap:11px !important;background:var(--ink) !important;color:#fff !important;font-weight:600 !important;font-size:15px !important;padding:16px 32px !important;border-radius:99px !important;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s !important;}\n.inr-belofte .slot .scta:hover{transform:translateY(-3px) !important;box-shadow:0 22px 50px -22px rgba(14,14,18,.6) !important;}\n.inr-belofte .slot .scta svg{width:17px !important;height:17px !important;transition:transform .35s cubic-bezier(.2,.7,.2,1) !important;}\n.inr-belofte .slot .scta:hover svg{transform:translateX(4px) !important;}\n.inr-belofte .slot .merk{margin-top:50px !important;display:inline-flex !important;align-items:center !important;gap:12px !important;font-weight:600 !important;font-size:22px !important;color:var(--ink) !important;}\n.inr-belofte .slot .merk .dot{width:11px !important;height:11px !important;border-radius:50% !important;background:var(--ink) !important;box-shadow:0 0 0 5px rgba(14,14,18,.12) !important;}\n<\/style>\n\n<div class=\"inr-belofte\">\n  <div class=\"atmos\"><span class=\"blob a\"><\/span><span class=\"blob b\"><\/span><span class=\"blob c\"><\/span><\/div>\n\n  <!-- ============ HERO WHY (opening) ============ -->\n  <section class=\"hero\">\n    <h1 class=\"rev d1\">Wij dwingen geen verandering af. <span class=\"zacht\">Wij maken ze onvermijdelijk.<\/span><\/h1>\n    <p class=\"lead rev d2\">Dat is onze belofte. Niet nog een programma dat je moet bewaken, maar een blik die gedrag vanzelf de goede kant op laat bewegen. Dit is wat INR een organisatie geeft, en wat het waard is.<\/p>\n    <div class=\"acties rev d3\">\n      <a class=\"knop primair hide-on-en\" href=\"#geloof\">Waar wij in geloven <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.2\"><path d=\"M5 12h14M13 6l6 6-6 6\"><\/path><\/svg><\/a>\n      <a class=\"knop ghost\" href=\"#waarde\">Wat het oplevert<\/a>\n    <\/div>\n  <\/section>\n\n  <!-- ============ GELOOF WHY (uitgesproken) ============ -->\n  <section class=\"sec\" id=\"geloof\">\n    <div class=\"wrap\">\n      <div class=\"geloof rev\">\n        <div class=\"g-in\">\n          <span class=\"eyebrow\">Waar wij in geloven<\/span>\n          <h2 class=\"stelling\">Gedrag is geen probleem om op te lossen. <em>Het is informatie om te lezen.<\/em><\/h2>\n          <p>De meeste organisaties behandelen lastig gedrag als iets dat weg moet. Corrigeren, bijsturen, afspreken. Maar gedrag dat je bestrijdt zonder het te begrijpen, komt altijd terug. Vaak sterker dan eerst.<\/p>\n          <p>Wij zien het anders. Onder elk gedrag ligt een reden die klopt, ook als het gedrag dat niet doet. Wie die reden leert lezen, hoeft gedrag niet langer af te dwingen. <strong>Dan begint het vanzelf de goede kant op te bewegen.<\/strong><\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ============ KANTELPUNT HOW (contrast) ============ -->\n  <section class=\"sec tight\">\n    <div class=\"wrap\">\n      <div class=\"kop rev\">\n        <span class=\"eyebrow\">Onze aanpak<\/span>\n        <h2>Niet aan de symptomen. Aan de oorzaak.<\/h2>\n        <p>Het verschil zit niet in harder werken aan hetzelfde. Het zit in waar je je aandacht op richt. Dit is wat er verschuift zodra je gedrag leert lezen in plaats van bestrijden.<\/p>\n      <\/div>\n      <div class=\"kantel\">\n        <div class=\"kkaart oud rev d1\">\n          <span class=\"klabel\">De oude reflex<\/span>\n          <div class=\"kregel\"><span class=\"ki\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\"><path d=\"M18 6 6 18M6 6l12 12\"><\/path><\/svg><\/span>Gedrag corrigeren tot het even wijkt<\/div>\n          <div class=\"kregel\"><span class=\"ki\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\"><path d=\"M18 6 6 18M6 6l12 12\"><\/path><\/svg><\/span>Sturen met meer controle en druk<\/div>\n          <div class=\"kregel\"><span class=\"ki\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\"><path d=\"M18 6 6 18M6 6l12 12\"><\/path><\/svg><\/span>Weerstand zien als onwil<\/div>\n          <div class=\"kregel\"><span class=\"ki\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\"><path d=\"M18 6 6 18M6 6l12 12\"><\/path><\/svg><\/span>Symptomen blijven bestrijden<\/div>\n        <\/div>\n        <div class=\"kkaart nieuw rev d2\">\n          <span class=\"klabel\">De INR blik<\/span>\n          <div class=\"kregel\"><span class=\"ki\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.6\"><path d=\"M20 6 9 17l-5-5\"><\/path><\/svg><\/span>Begrijpen waar gedrag vandaan komt<\/div>\n          <div class=\"kregel\"><span class=\"ki\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.6\"><path d=\"M20 6 9 17l-5-5\"><\/path><\/svg><\/span>Condities scheppen in plaats van dwingen<\/div>\n          <div class=\"kregel\"><span class=\"ki\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.6\"><path d=\"M20 6 9 17l-5-5\"><\/path><\/svg><\/span>Weerstand lezen als signaal<\/div>\n          <div class=\"kregel\"><span class=\"ki\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.6\"><path d=\"M20 6 9 17l-5-5\"><\/path><\/svg><\/span>Werken aan de oorzaak eronder<\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ============ BELOFTE-KERN HOW (de zin) ============ -->\n  <section class=\"sec tight\">\n    <div class=\"wrap\">\n      <div class=\"kern rev\">\n        <div class=\"q\">Wij beloven geen methode die je moet volgen. <span class=\"grijs\">Wij geven je een manier van kijken die blijft werken.<\/span><\/div>\n        <p>Een checklist raakt verouderd. Een protocol wordt genegeerd zodra de aandacht wegtrekt. Een blik die klopt, blijft. Dat is wat INR een organisatie geeft: niet nog een programma, maar een lens die je op elk moment en op elke plek helpt zien wat er werkelijk speelt.<\/p>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ============ WAARDE WHAT (het bewijs) ============ -->\n  <section class=\"band\">\n    <div class=\"sec\">\n      <div class=\"wrap\">\n        <div class=\"kop rev\">\n          <span class=\"eyebrow\">Wat het oplevert<\/span>\n          <h2>Wat er mogelijk wordt zodra je gedrag begrijpt.<\/h2>\n          <p>Een organisatie kan gedrag niet afdwingen, maar wel de condities cre\u00ebren waarin het vanzelf de goede kant op beweegt. Dit is wat dat in de praktijk kan betekenen.<\/p>\n        <\/div>\n        <div class=\"waarde\">\n          <div class=\"wkaart rev d1\">\n            <div class=\"wi\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M12 2v6M12 2 8 6M12 2l4 4\"><\/path><path d=\"M5 12a7 7 0 0 0 14 0\"><\/path><path d=\"M5 12v4a7 7 0 0 0 14 0v-4\"><\/path><\/svg><\/div>\n            <h4>Minder verzuim en uitval<\/h4>\n            <p>Veel uitval ontstaat niet door de fysieke last van werk, maar door mensen die structureel in overdrive zitten. Wie eerder ziet wat er onder speelt, kan eerder herstellen. Dat kan zichtbaar schelen in verzuimkosten.<\/p>\n          <\/div>\n          <div class=\"wkaart rev d2\">\n            <div class=\"wi\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M12 2 2 7l10 5 10-5-10-5z\"><\/path><path d=\"M2 17l10 5 10-5M2 12l10 5 10-5\"><\/path><\/svg><\/div>\n            <h4>Meer eigenaarschap, minder controle<\/h4>\n            <p>Gedrag dat aansluit bij wat mensen van binnenuit drijft, hoeft niet bewaakt te worden. Waar autonomie hersteld wordt, ontstaat zelfsturing. Dat vraagt minder controle, geen extra druk.<\/p>\n          <\/div>\n          <div class=\"wkaart rev d3\">\n            <div class=\"wi\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M14 9V5a3 3 0 0 0-6 0v4\"><\/path><rect x=\"5\" y=\"9\" width=\"14\" height=\"11\" rx=\"2\"><\/rect><\/svg><\/div>\n            <h4>Sterker leiderschap zonder micromanagement<\/h4>\n            <p>Leiders die begrijpen wat gedrag stuurt, sturen minder op angst en meer op vertrouwen. Dat verlaagt het brandjes blussen en maakt ruimte voor strategische focus.<\/p>\n          <\/div>\n          <div class=\"wkaart rev d4\">\n            <div class=\"wi\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z\"><\/path><\/svg><\/div>\n            <h4>Betere gesprekken met klanten<\/h4>\n            <p>Extern gedrag is een spiegel van wat intern leeft. Teams die reacties leren lezen in plaats van te pushen, communiceren overtuigender. Verbinding in plaats van verdediging vergroot de commerci\u00eble waarde direct.<\/p>\n          <\/div>\n          <div class=\"wkaart rev d5\">\n            <div class=\"wi\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M13 2 3 14h9l-1 8 10-12h-9l1-8z\"><\/path><\/svg><\/div>\n            <h4>Sneller schakelen in verandering<\/h4>\n            <p>Of het nu om transformatie, cultuur of teamgroei gaat: als mensen de logica onder hun eigen gedrag snappen, omarmen ze verandering sneller. Dat kan de implementatietijd verkorten en de adoptie verhogen.<\/p>\n          <\/div>\n          <div class=\"wkaart rev d6\">\n            <div class=\"wi\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><circle cx=\"12\" cy=\"12\" r=\"10\"><\/circle><path d=\"M8 14s1.5 2 4 2 4-2 4-2M9 9h.01M15 9h.01\"><\/path><\/svg><\/div>\n            <h4>Een gedeelde taal voor gedrag<\/h4>\n            <p>Teams krijgen woorden voor wat zich onder de oppervlakte afspeelt. Lastige gesprekken worden makkelijker, omdat ze niet meer over personen gaan maar over patronen.<\/p>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ============ VERSCHUIVING WHAT (de kanteling) ============ -->\n  <section class=\"sec\">\n    <div class=\"wrap\">\n      <div class=\"schuif\">\n        <div class=\"schuif-tekst rev\">\n          <span class=\"eyebrow\">De rol van de organisatie<\/span>\n          <h2>Van controleren naar mogelijk maken.<\/h2>\n          <p>Je dwingt gedrag niet af. Je schept de condities waarin het vanzelf de goede kant op beweegt. Dat is <strong>goedkoper te onderhouden<\/strong> en het houdt langer stand.<\/p>\n          <p>Verandering die klopt met de eigen drijfveren van mensen hoeft niet bewaakt te worden. Wat van binnenuit komt, veert niet terug zodra de aandacht wegtrekt.<\/p>\n        <\/div>\n        <div class=\"schuifrij-wrap\">\n          <div class=\"schuifrij rev d1\"><span class=\"van\">Gedrag afdwingen<\/span><span class=\"pijl\"><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><span class=\"naar\">Condities scheppen<\/span><\/div>\n          <div class=\"schuifrij rev d2\"><span class=\"van\">Symptomen bestrijden<\/span><span class=\"pijl\"><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><span class=\"naar\">Oorzaak begrijpen<\/span><\/div>\n          <div class=\"schuifrij rev d3\"><span class=\"van\">Sturen op controle<\/span><span class=\"pijl\"><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><span class=\"naar\">Sturen op vertrouwen<\/span><\/div>\n          <div class=\"schuifrij rev d4\"><span class=\"van\">Verandering bewaken<\/span><span class=\"pijl\"><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><span class=\"naar\">Verandering die standhoudt<\/span><\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ============ LENS WHY-echo ============ -->\n  <section class=\"sec\">\n    <div class=\"wrap\">\n      <div class=\"lens rev\">\n        <div class=\"lens-grid\">\n          <div class=\"lens-tekst\">\n            <span class=\"eyebrow\">Geen methodiek, een lens<\/span>\n            <h2>Een manier van kijken die blijvend waarde houdt.<\/h2>\n            <p class=\"lead\">INR geeft je geen checklist en geen protocol. Het geeft je een blik die je helpt voorbij symptomen te kijken, precies daar waar het verschil echt gemaakt wordt: aan de binnenkant.<\/p>\n            <p class=\"lead\">Voor leider, HR, teamlid of commercieel professional werkt diezelfde lens. <strong>Een model, dat meebeweegt met waar mensen staan.<\/strong><\/p>\n          <\/div>\n          <div class=\"lens-vinkjes\">\n            <div class=\"lvink rev d1\"><span class=\"lv-i\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.6\"><path d=\"M20 6 9 17l-5-5\"><\/path><\/svg><\/span><span>Voorbij symptomen kijken<\/span><\/div>\n            <div class=\"lvink rev d2\"><span class=\"lv-i\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.6\"><path d=\"M20 6 9 17l-5-5\"><\/path><\/svg><\/span><span>Werken aan de oorzaak<\/span><\/div>\n            <div class=\"lvink rev d3\"><span class=\"lv-i\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.6\"><path d=\"M20 6 9 17l-5-5\"><\/path><\/svg><\/span><span>Blijft werken op elke plek<\/span><\/div>\n            <div class=\"lvink rev d4\"><span class=\"lv-i\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.6\"><path d=\"M20 6 9 17l-5-5\"><\/path><\/svg><\/span><span>De lens op het systeem, nooit op de persoon<\/span><\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ============ SLOT ============ -->\n  <div class=\"slot-sec\">\n    <section class=\"slot\">\n      <div class=\"rev\">\n        <h2>Begrijp gedrag. Beweeg het.<\/h2>\n        <p>Onze belofte is geen groter budget of harder werken. Het is een blik die het verschil maakt waar het telt. Begin bij het model, en laat gedrag ontstaan dat klopt met wie mensen werkelijk zijn.<\/p>\n        <a class=\"scta hide-on-en\" href=\"https:\/\/inr.institute\/inr\/\">Ontdek het INR Model <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.2\"><path d=\"M5 12h14M13 6l6 6-6 6\"><\/path><\/svg><\/a>\n        <div class=\"merk\"><span class=\"dot\"><\/span>Onze belofte en waarde<\/div>\n      <\/div>\n    <\/section>\n  <\/div>\n<\/div>\n\n<script>\n(function(){\n  var root=document.querySelector('.inr-belofte');\n  if(!root) return;\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:0.12,rootMargin:'0px 0px -8% 0px'});\n  root.querySelectorAll('.rev').forEach(function(el){ io.observe(el); });\n})();\n<\/script>\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>Wij dwingen geen verandering af. Wij maken ze onvermijdelijk. Dat is onze belofte. Niet nog een programma dat je moet bewaken, maar een blik die gedrag vanzelf de goede kant op laat bewegen. Dit is wat INR een organisatie geeft, en wat het waard is. Waar wij in geloven Wat het oplevert Waar wij in [&hellip;]<\/p>\n","protected":false},"author":224244682,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-79325","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/inr.institute\/en\/wp-json\/wp\/v2\/pages\/79325","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=79325"}],"version-history":[{"count":3,"href":"https:\/\/inr.institute\/en\/wp-json\/wp\/v2\/pages\/79325\/revisions"}],"predecessor-version":[{"id":80617,"href":"https:\/\/inr.institute\/en\/wp-json\/wp\/v2\/pages\/79325\/revisions\/80617"}],"wp:attachment":[{"href":"https:\/\/inr.institute\/en\/wp-json\/wp\/v2\/media?parent=79325"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}