{"id":78307,"date":"2026-06-23T18:00:10","date_gmt":"2026-06-23T16:00:10","guid":{"rendered":"https:\/\/inr.institute\/?page_id=78307"},"modified":"2026-06-27T20:16:44","modified_gmt":"2026-06-27T18:16:44","slug":"inr-align-navigation","status":"publish","type":"page","link":"https:\/\/inr.institute\/en\/inr-align\/inr-align-navigation\/","title":{"rendered":"INR Align Navigation"},"content":{"rendered":"\n<!-- ============================================================================\n     INR ALIGN &middot; SUBPAGINA &middot; NAVIGATION\n     E&eacute;n bestand. Plak dit volledig in EEN Elementor HTML-widget.\n     Dragende laagkleur: Navigation-groen #5AC380. Anker: indigo #292558.\n     Slotlaag: geen volgende laag, maar terugkoppeling naar het hele spectrum.\n     ============================================================================ -->\n\n<style>\n.inr-align-navigation{\n  --lc:#5AC380; --lc-2:#7FD49D; --lc-diep:#2E9456;\n  --anker:#292558; --anker-2:#4B3FA0;\n  --ink:#15122E; --grijs:#615C7A; --zacht:#8E89A6;\n  --lc-soft:rgba(90,195,128,.12); --lc-soft2:rgba(90,195,128,.18); --lc-shadow:rgba(90,195,128,.32);\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; -webkit-font-smoothing:antialiased !important;\n}\n.inr-align-navigation, .inr-align-navigation *, .inr-align-navigation *::before, .inr-align-navigation *::after{\n  box-sizing:border-box !important; font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif !important;}\n.inr-align-navigation h1,.inr-align-navigation h2,.inr-align-navigation h3,.inr-align-navigation h4,\n.inr-align-navigation p,.inr-align-navigation span,.inr-align-navigation div,\n.inr-align-navigation ul,.inr-align-navigation li,.inr-align-navigation a{margin:0;padding:0;}\n.inr-align-navigation ul{list-style:none !important;}\n.inr-align-navigation a{text-decoration:none !important;color:inherit !important;}\n\n.inr-align-navigation .atmos{position:absolute !important;inset:0 !important;z-index:0 !important;overflow:hidden !important;pointer-events:none !important;background:transparent !important;}\n.inr-align-navigation .blob{position:absolute !important;border-radius:50% !important;filter:blur(120px) !important;opacity:.26 !important;animation:inra-drift 30s ease-in-out infinite !important;}\n.inr-align-navigation .blob.a{width:600px;height:600px;background:rgba(90,195,128,.20);top:-190px;left:-160px;}\n.inr-align-navigation .blob.b{width:520px;height:520px;background:rgba(127,212,157,.18);top:34%;right:-200px;animation-delay:-12s;}\n.inr-align-navigation .blob.c{width:560px;height:560px;background:rgba(41,37,88,.12);bottom:6%;left:14%;animation-delay:-20s;}\n@keyframes inra-drift{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(50px,-38px) scale(1.09);}}\n\n.inr-align-navigation .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-align-navigation .sec{position:relative !important;z-index:1 !important;padding:114px 0 !important;}\n.inr-align-navigation .sec.tight{padding:74px 0 !important;}\n\n.inr-align-navigation .eyebrow{font-size:13px !important;font-weight:600 !important;letter-spacing:.1em !important;text-transform:uppercase !important;color:var(--lc-diep) !important;}\n.inr-align-navigation .grad{background:linear-gradient(115deg,var(--lc),var(--lc-diep)) !important;-webkit-background-clip:text !important;background-clip:text !important;color:transparent !important;-webkit-text-fill-color:transparent !important;}\n.inr-align-navigation .kop{text-align:center !important;max-width:800px !important;margin:0 auto 60px !important;}\n.inr-align-navigation .kop .eyebrow{display:block !important;margin-bottom:16px !important;}\n.inr-align-navigation .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-align-navigation .kop p{font-size:18px !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.62 !important;}\n\n.inr-align-navigation .rev{opacity:0;transform:translateY(38px);transition:opacity .85s cubic-bezier(.2,.7,.2,1),transform .85s cubic-bezier(.2,.7,.2,1);}\n.inr-align-navigation .rev.in{opacity:1 !important;transform:none !important;}\n.inr-align-navigation .d1{transition-delay:.07s;}.inr-align-navigation .d2{transition-delay:.14s;}.inr-align-navigation .d3{transition-delay:.21s;}\n.inr-align-navigation .d4{transition-delay:.28s;}.inr-align-navigation .d5{transition-delay:.35s;}.inr-align-navigation .d6{transition-delay:.42s;}\n.no-js .inr-align-navigation .rev{opacity:1 !important;transform:none !important;}\n\n.inr-align-navigation .hero{min-height:90vh !important;display:flex !important;flex-direction:column !important;justify-content:center !important;padding:150px clamp(24px,5vw,40px) 96px !important;position:relative !important;}\n.inr-align-navigation .hero .terug{display:inline-flex !important;align-items:center !important;gap:8px !important;align-self:flex-start !important;font-size:13px !important;font-weight:500 !important;color:var(--zacht) !important;margin-bottom:30px !important;transition:color .3s !important;}\n.inr-align-navigation .hero .terug:hover{color:var(--lc-diep) !important;}\n.inr-align-navigation .hero .terug svg{width:15px !important;height:15px !important;}\n.inr-align-navigation .hero .top{display:flex !important;align-items:center !important;gap:20px !important;margin-bottom:30px !important;}\n.inr-align-navigation .hero .letter{font-weight:700 !important;font-size:clamp(78px,13vw,150px) !important;line-height:.82 !important;letter-spacing:-.05em !important;color:var(--lc) !important;position:relative !important;}\n.inr-align-navigation .hero .meta{display:flex !important;flex-direction:column !important;gap:8px !important;}\n.inr-align-navigation .hero .nr{font-size:13px !important;font-weight:600 !important;letter-spacing:.14em !important;text-transform:uppercase !important;color:var(--lc-diep) !important;}\n.inr-align-navigation .hero .naam{font-weight:600 !important;font-size:clamp(26px,4.4vw,42px) !important;letter-spacing:-.03em !important;color:var(--ink) !important;line-height:1 !important;}\n.inr-align-navigation .hero .tag{font-size:15px !important;font-weight:500 !important;color:var(--lc-diep) !important;}\n.inr-align-navigation .hero h1{font-weight:600 !important;font-size:clamp(30px,5vw,58px) !important;line-height:1.07 !important;letter-spacing:-.032em !important;max-width:20ch !important;color:var(--ink) !important;margin-bottom:28px !important;}\n.inr-align-navigation .hero .lead{font-size:clamp(18px,2.2vw,22px) !important;font-weight:300 !important;color:var(--grijs) !important;max-width:60ch !important;line-height:1.56 !important;}\n.inr-align-navigation .hero .lead strong{font-weight:600 !important;color:var(--ink) !important;}\n.inr-align-navigation .hero .bar{margin-top:42px !important;height:6px !important;width:min(420px,80%) !important;border-radius:99px !important;background:linear-gradient(90deg,var(--lc),var(--lc-2)) !important;box-shadow:0 6px 22px -8px var(--lc-shadow) !important;}\n@media(max-width:820px){.inr-align-navigation .hero{min-height:auto !important;padding:128px clamp(28px,5vw,40px) 64px !important;}.inr-align-navigation .hero h1{font-size:clamp(26px,7.4vw,40px) !important;}.inr-align-navigation .hero .lead{font-size:18px !important;}.inr-align-navigation .hero .top{gap:14px !important;}}\n\n.inr-align-navigation .statement{max-width:920px !important;margin:0 auto !important;text-align:center !important;}\n.inr-align-navigation .statement .groot{font-weight:600 !important;font-size:clamp(26px,3.8vw,40px) !important;letter-spacing:-.024em !important;line-height:1.24 !important;color:var(--ink) !important;}\n.inr-align-navigation .statement .groot em{font-style:normal !important;color:var(--lc-diep) !important;}\n.inr-align-navigation .statement .sub{margin-top:26px !important;font-size:18px !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.64 !important;}\n\n.inr-align-navigation .stroom{display:grid !important;grid-template-columns:1fr 1fr !important;gap:56px !important;align-items:center !important;}\n.inr-align-navigation .stroom .tekst .eyebrow{display:block !important;margin-bottom:16px !important;}\n.inr-align-navigation .stroom .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:20px !important;}\n.inr-align-navigation .stroom .tekst p{font-size:17px !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.66 !important;margin-bottom:14px !important;}\n.inr-align-navigation .stroom .tekst p:last-child{margin-bottom:0 !important;}\n.inr-align-navigation .stroom .tekst p strong{font-weight:600 !important;color:var(--ink) !important;}\n.inr-align-navigation .behoeften{display:flex !important;flex-direction:column !important;gap:16px !important;}\n.inr-align-navigation .bkaart{background:rgba(255,255,255,.72) !important;-webkit-backdrop-filter:blur(20px) !important;backdrop-filter:blur(20px) !important;\n  border:1px solid rgba(41,37,88,.12) !important;border-radius:20px !important;padding:24px 26px !important;\n  box-shadow:0 10px 40px -30px rgba(41,37,88,.24) !important;position:relative !important;overflow:hidden !important;transition:transform .4s cubic-bezier(.2,.7,.2,1) !important;}\n.inr-align-navigation .bkaart:hover{transform:translateX(5px) !important;}\n.inr-align-navigation .bkaart::before{content:'' !important;position:absolute !important;left:0 !important;top:0 !important;bottom:0 !important;width:4px !important;background:var(--lc) !important;}\n.inr-align-navigation .bkaart .lbl{font-size:11px !important;font-weight:600 !important;letter-spacing:.14em !important;text-transform:uppercase !important;color:var(--lc-diep) !important;margin-bottom:8px !important;}\n.inr-align-navigation .bkaart h4{font-weight:600 !important;font-size:17px !important;letter-spacing:-.012em !important;color:var(--ink) !important;margin-bottom:6px !important;}\n.inr-align-navigation .bkaart p{font-size:14.5px !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.6 !important;}\n@media(max-width:820px){.inr-align-navigation .stroom{grid-template-columns:1fr !important;gap:38px !important;}}\n\n.inr-align-navigation .narratief-sec{background:rgba(90,195,128,.06) !important;border-top:1px solid rgba(90,195,128,.18) !important;border-bottom:1px solid rgba(90,195,128,.18) !important;}\n.inr-align-navigation .verhalen{display:grid !important;grid-template-columns:1fr 1fr !important;gap:22px !important;max-width:980px !important;margin:0 auto !important;}\n.inr-align-navigation .vh{background:rgba(255,255,255,.82) !important;-webkit-backdrop-filter:blur(20px) !important;backdrop-filter:blur(20px) !important;\n  border:1px solid rgba(41,37,88,.1) !important;border-radius:var(--radius) !important;padding:34px 34px 30px !important;position:relative !important;overflow:hidden !important;box-shadow:0 12px 44px -30px var(--lc-shadow) !important;}\n.inr-align-navigation .vh .quote{font-size:46px !important;line-height:.6 !important;font-weight:700 !important;color:var(--lc) !important;opacity:.5 !important;margin-bottom:8px !important;display:block !important;}\n.inr-align-navigation .vh .zin{font-weight:600 !important;font-size:clamp(19px,2.4vw,24px) !important;letter-spacing:-.018em !important;line-height:1.28 !important;color:var(--ink) !important;margin-bottom:14px !important;}\n.inr-align-navigation .vh p{font-size:14.5px !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.62 !important;}\n@media(max-width:820px){.inr-align-navigation .verhalen{grid-template-columns:1fr !important;}}\n\n.inr-align-navigation .patronen{display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:22px !important;}\n.inr-align-navigation .pk{background:rgba(255,255,255,.72) !important;-webkit-backdrop-filter:blur(20px) !important;backdrop-filter:blur(20px) !important;\n  border:1px solid rgba(41,37,88,.12) !important;border-radius:var(--radius) !important;padding:34px 30px !important;position:relative !important;overflow:hidden !important;\n  box-shadow:0 10px 40px -30px rgba(41,37,88,.22) !important;transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s !important;}\n.inr-align-navigation .pk:hover{transform:translateY(-6px) !important;box-shadow:0 28px 60px -30px var(--lc-shadow) !important;}\n.inr-align-navigation .pk .ico{width:48px !important;height:48px !important;border-radius:14px !important;display:flex !important;align-items:center !important;justify-content:center !important;margin-bottom:18px !important;background:var(--lc-soft) !important;color:var(--lc-diep) !important;}\n.inr-align-navigation .pk .ico svg{width:24px !important;height:24px !important;}\n.inr-align-navigation .pk h3{font-weight:600 !important;font-size:19px !important;letter-spacing:-.016em !important;color:var(--ink) !important;margin-bottom:10px !important;}\n.inr-align-navigation .pk p{font-size:14.5px !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.6 !important;}\n@media(max-width:820px){.inr-align-navigation .patronen{grid-template-columns:1fr !important;}}\n\n.inr-align-navigation .signalen{max-width:900px !important;margin:0 auto !important;display:flex !important;flex-direction:column !important;gap:2px !important;}\n.inr-align-navigation .sig{display:flex !important;gap:18px !important;align-items:flex-start !important;padding:20px 4px !important;border-bottom:1px solid rgba(41,37,88,.1) !important;}\n.inr-align-navigation .sig:last-child{border-bottom:0 !important;}\n.inr-align-navigation .sig .n{flex:none !important;width:30px !important;height:30px !important;border-radius:9px !important;background:var(--lc-soft) !important;color:var(--lc-diep) !important;display:flex !important;align-items:center !important;justify-content:center !important;font-size:14px !important;font-weight:700 !important;}\n.inr-align-navigation .sig .n svg{width:15px !important;height:15px !important;}\n.inr-align-navigation .sig p{font-size:16px !important;font-weight:300 !important;color:var(--ink) !important;line-height:1.55 !important;padding-top:3px !important;}\n.inr-align-navigation .overgang{max-width:900px !important;margin:46px auto 0 !important;background:var(--ink) !important;border-radius:var(--radius) !important;padding:38px 40px !important;position:relative !important;overflow:hidden !important;}\n.inr-align-navigation .overgang::before{content:'' !important;position:absolute !important;top:-80px !important;right:-60px !important;width:280px !important;height:280px !important;border-radius:50% !important;background:radial-gradient(circle,rgba(90,195,128,.5),transparent 70%) !important;filter:blur(30px) !important;}\n.inr-align-navigation .overgang .lbl{position:relative !important;z-index:1 !important;font-size:12px !important;font-weight:600 !important;letter-spacing:.12em !important;text-transform:uppercase !important;color:var(--lc-2) !important;margin-bottom:12px !important;display:block !important;}\n.inr-align-navigation .overgang p{position:relative !important;z-index:1 !important;font-size:18px !important;font-weight:300 !important;color:rgba(255,255,255,.86) !important;line-height:1.6 !important;}\n.inr-align-navigation .overgang p strong{font-weight:600 !important;color:#fff !important;}\n\n.inr-align-navigation .ethiek{max-width:880px !important;margin:0 auto !important;text-align:center !important;}\n.inr-align-navigation .ethiek .mark{display:inline-flex !important;align-items:center !important;justify-content:center !important;width:56px !important;height:56px !important;border-radius:16px !important;background:var(--lc-soft) !important;color:var(--lc-diep) !important;margin-bottom:26px !important;}\n.inr-align-navigation .ethiek .mark svg{width:28px !important;height:28px !important;}\n.inr-align-navigation .ethiek .q{font-weight:600 !important;font-size:clamp(23px,3.2vw,34px) !important;letter-spacing:-.022em !important;line-height:1.26 !important;color:var(--ink) !important;margin-bottom:22px !important;}\n.inr-align-navigation .ethiek .q em{font-style:normal !important;color:var(--lc-diep) !important;}\n.inr-align-navigation .ethiek p{font-size:17px !important;font-weight:300 !important;color:var(--grijs) !important;line-height:1.66 !important;}\n\n.inr-align-navigation .slot-sec{position:relative !important;z-index:2 !important;background:#FFFFFF !important;}\n.inr-align-navigation .slot{text-align:center !important;padding-top:96px !important;padding-bottom:60px !important;}\n.inr-align-navigation .slot h2{font-weight:600 !important;font-size:clamp(30px,5vw,56px) !important;letter-spacing:-.03em !important;line-height:1.06 !important;max-width:20ch !important;margin:0 auto 22px !important;color:var(--ink) !important;}\n.inr-align-navigation .slot p{font-size:18px !important;font-weight:300 !important;color:var(--grijs) !important;max-width:50ch !important;margin:0 auto !important;line-height:1.56 !important;}\n.inr-align-navigation .navlagen{padding-bottom:104px !important;}\n.inr-align-navigation .navrij{display:grid !important;grid-template-columns:repeat(5,1fr) !important;gap:12px !important;max-width:920px !important;margin:0 auto !important;}\n.inr-align-navigation .navkaart{display:flex !important;flex-direction:column !important;align-items:center !important;gap:8px !important;padding:22px 10px !important;border-radius:18px !important;background:rgba(255,255,255,.7) !important;border:1px solid rgba(41,37,88,.1) !important;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s !important;}\n.inr-align-navigation .navkaart:hover{transform:translateY(-5px) !important;box-shadow:0 22px 50px -30px rgba(41,37,88,.3) !important;}\n.inr-align-navigation .navkaart .nl{font-weight:700 !important;font-size:30px !important;line-height:1 !important;letter-spacing:-.04em !important;}\n.inr-align-navigation .navkaart .nn{font-size:12.5px !important;font-weight:600 !important;letter-spacing:.02em !important;color:var(--grijs) !important;}\n.inr-align-navigation .navkaart.huidig{background:var(--lc-soft2) !important;border-color:var(--lc) !important;}\n.inr-align-navigation .navkaart.huidig .nn{color:var(--lc-diep) !important;}\n.inr-align-navigation .nav-c-act{color:#FD7634 !important;} .inr-align-navigation .nav-c-lea{color:#7448FD !important;}\n.inr-align-navigation .nav-c-int{color:#292558 !important;} .inr-align-navigation .nav-c-gov{color:#2875FB !important;} .inr-align-navigation .nav-c-nav{color:#5AC380 !important;}\n.inr-align-navigation .terughub{display:flex !important;justify-content:center !important;margin-top:40px !important;}\n.inr-align-navigation .terughub a{display:inline-flex !important;align-items:center !important;gap:10px !important;font-size:15px !important;font-weight:600 !important;color:#fff !important;background:var(--anker) !important;padding:15px 30px !important;border-radius:99px !important;transition:transform .3s,box-shadow .3s !important;box-shadow:0 14px 34px -16px rgba(41,37,88,.5) !important;}\n.inr-align-navigation .terughub a:hover{transform:translateY(-3px) !important;box-shadow:0 20px 44px -16px rgba(41,37,88,.6) !important;}\n.inr-align-navigation .terughub a svg{width:17px !important;height:17px !important;}\n@media(max-width:820px){\n  .inr-align-navigation{padding-left:22px !important;padding-right:22px !important;}\n  .inr-align-navigation .wrap{padding-left:0 !important;padding-right:0 !important;}\n  .inr-align-navigation .hero{padding-left:0 !important;padding-right:0 !important;}\n  .inr-align-navigation .narratief-sec{margin-left:-22px !important;margin-right:-22px !important;padding-left:22px !important;padding-right:22px !important;}\n  .inr-align-navigation .sec{padding:70px 0 !important;}\n  .inr-align-navigation .navrij{grid-template-columns:repeat(5,1fr) !important;gap:6px !important;}\n  .inr-align-navigation .navkaart{padding:16px 4px !important;}\n  .inr-align-navigation .navkaart .nl{font-size:22px !important;}\n  .inr-align-navigation .navkaart .nn{font-size:9.5px !important;letter-spacing:0 !important;}\n  .inr-align-navigation .blob.a{width:340px;height:340px;top:-100px;left:-110px;}\n  .inr-align-navigation .blob.b{width:300px;height:300px;right:-150px;}\n  .inr-align-navigation .blob.c{width:320px;height:320px;left:-60px;}\n}\n@media(prefers-reduced-motion:reduce){.inr-align-navigation .rev{opacity:1 !important;transform:none !important;transition:none !important;}.inr-align-navigation .blob{animation:none !important;}}\n<\/style>\n\n<div class=\"inr-align-navigation\">\n<div class=\"atmos\"><div class=\"blob a\"><\/div><div class=\"blob b\"><\/div><div class=\"blob c\"><\/div><\/div>\n\n<section class=\"hero wrap\">\n  <a class=\"terug\" href=\"\/inr-align\/\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M19 12H5M11 18l-6-6 6-6\"\/><\/svg>INR Align<\/a>\n  <div class=\"top\">\n    <div class=\"letter\">N<\/div>\n    <div class=\"meta\">\n      <span class=\"nr\">Laag 05 van 5<\/span>\n      <span class=\"naam\">Navigation<\/span>\n      <span class=\"tag\">De laag van adaptie<\/span>\n    <\/div>\n  <\/div>\n  <h1>De fase waarin een groot systeem <span class=\"grad\">beweeglijk<\/span> moet blijven.<\/h1>\n  <p class=\"lead\">Structuur alleen blijkt niet meer genoeg om mee te bewegen met een werkelijkheid die voortdurend verandert. De uitdaging verschuift van bestuurbaarheid naar aanpassingsvermogen. <strong>De kunst is stabiel blijven zonder te verstarren.<\/strong><\/p>\n  <div class=\"bar\"><\/div>\n<\/section>\n\n<section class=\"sec tight wrap\">\n  <div class=\"statement rev\">\n    <div class=\"groot\">Schaalbaarheid draait hier niet langer om meer structuur toevoegen, maar om het vermogen om <em>beweging toe te laten zonder samenhang te verliezen<\/em>.<\/div>\n    <p class=\"sub\">Hoe groter een organisatie wordt, hoe sterker de neiging om zichzelf te optimaliseren voor beheersbaarheid in plaats van aanpassingsvermogen. Daar ontstaat de paradox van deze laag: stabiliteit zoeken in een werkelijkheid die niet stilstaat.<\/p>\n  <\/div>\n<\/section>\n\n<section class=\"sec wrap\" style=\"padding-top:0 !important;\">\n  <div class=\"stroom\">\n    <div class=\"tekst rev\">\n      <span class=\"eyebrow\">Wat er menselijk gebeurt<\/span>\n      <h2>De behoefte die voortdurend onderhandeld wordt.<\/h2>\n      <p>In Navigation wordt autonomie iets dat steeds opnieuw afgestemd moet worden tussen lokale wendbaarheid en collectieve samenhang. Het is geen gegeven meer, maar een doorlopend gesprek.<\/p>\n      <p>Competentie wordt onstabiel: wat je dit jaar weet, is volgend jaar misschien niet meer relevant. En verbondenheid wordt een bewuste keuze. Wat in Activation vanzelf ontstond, moet hier actief georganiseerd worden om te bestaan.<\/p>\n      <p><strong>Organisaties die deze laag gezond doorlopen, investeren niet alleen in vakkennis, maar in het vermogen van mensen om hun bekwaamheid te blijven herzien en verbinding bewust op te zoeken.<\/strong><\/p>\n    <\/div>\n    <div class=\"behoeften\">\n      <div class=\"bkaart rev d1\">\n        <div class=\"lbl\">Autonomie<\/div>\n        <h4>Voortdurend afgestemd<\/h4>\n        <p>Ruimte wordt steeds opnieuw onderhandeld tussen wat lokaal nodig is en wat het geheel samenhoudt. Niet vastgelegd, maar levend en in gesprek.<\/p>\n      <\/div>\n      <div class=\"bkaart rev d2\">\n        <div class=\"lbl\">Competentie<\/div>\n        <h4>Bewegend, niet vast<\/h4>\n        <p>Expertise veroudert sneller dan voorheen. De waarde verschuift van wat je weet naar je vermogen om te blijven leren en je oordeel te herzien.<\/p>\n      <\/div>\n      <div class=\"bkaart rev d3\">\n        <div class=\"lbl\">Verbondenheid<\/div>\n        <h4>Actief georganiseerd<\/h4>\n        <p>De natuurlijke aanleidingen voor verbinding zijn vrijwel verdwenen. Gezonde organisaties richten de momenten waarop verbinding kan ontstaan bewust in.<\/p>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<section class=\"sec narratief-sec\">\n  <div class=\"wrap\">\n    <div class=\"kop rev\">\n      <span class=\"eyebrow\">Het collectief narratief<\/span>\n      <h2>Het verhaal dat het diepst is ingebed.<\/h2>\n      <p>De narratieven in Navigation zijn vaak het lastigst te benoemen, omdat ze zo verweven zijn met hoe het systeem zichzelf is gaan zien. Ze worden zelden hardop gezegd. Ze leven in de wandelgangen, in wat mensen elkaar vertellen over hoe het hier echt werkt.<\/p>\n    <\/div>\n    <div class=\"verhalen\">\n      <div class=\"vh rev d1\">\n        <span class=\"quote\">&ldquo;<\/span>\n        <div class=\"zin\">Verandering is hier moeilijk.<\/div>\n        <p>Een verhaal dat zichzelf bevestigt. Wie gelooft dat verandering moeilijk is, begint er voorzichtiger aan, en die voorzichtigheid maakt verandering inderdaad moeilijker. Het verhaal wordt zo zijn eigen bewijs.<\/p>\n      <\/div>\n      <div class=\"vh rev d2\">\n        <span class=\"quote\">&ldquo;<\/span>\n        <div class=\"zin\">Wat je ook bedenkt, het komt nooit door alle lagen heen.<\/div>\n        <p>Een verhaal van gelatenheid. Het beschermt mensen tegen de teleurstelling van een initiatief dat strandt. En het houdt tegelijk het initiatief tegen dat de organisatie juist nodig heeft.<\/p>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<section class=\"sec wrap\">\n  <div class=\"kop rev\">\n    <span class=\"eyebrow\">Hoe het zich laat zien<\/span>\n    <h2>Wat het systeem doet wanneer beweging spannend wordt.<\/h2>\n    <p>Drie patronen kenmerken deze laag. Ze zijn stiller dan in eerdere lagen, en juist daardoor moeilijker te zien. Geen van drie is onwil, alle drie zijn vormen van bescherming.<\/p>\n  <\/div>\n  <div class=\"patronen\">\n    <div class=\"pk rev d1\">\n      <div class=\"ico\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M18 6 6 18M8 6H6v2M18 16v2h-2\"\/><path d=\"M3 12a9 9 0 0 0 9 9\"\/><\/svg><\/div>\n      <h3>Stil afhaken<\/h3>\n      <p>Het meest voorkomende patroon is geen actieve weerstand, maar passieve afstand. Mensen praten minder in meetings, beslissingen worden indirect genomen, nieuwe ideeen blijven uit. Het systeem houdt rust, en verliest initiatief.<\/p>\n    <\/div>\n    <div class=\"pk rev d2\">\n      <div class=\"ico\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><circle cx=\"12\" cy=\"12\" r=\"9\"\/><path d=\"M12 7v5l3 2\"\/><\/svg><\/div>\n      <h3>Beweging die symbolisch blijft<\/h3>\n      <p>Wanneer beweging nodig is maar te risicovol voelt, ontstaat symbolisch handelen. Trajecten worden opgestart, werkgroepen ingesteld, strategieen geformuleerd. Er gebeurt veel, en er verandert weinig fundamenteel. Het systeem geeft zichzelf het gevoel van beweging.<\/p>\n    <\/div>\n    <div class=\"pk rev d3\">\n      <div class=\"ico\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M12 2a7 7 0 0 0-4 12.7V17h8v-2.3A7 7 0 0 0 12 2z\"\/><path d=\"M9 21h6M10 17v4M14 17v4\"\/><\/svg><\/div>\n      <h3>Innovatie op een eiland<\/h3>\n      <p>Vernieuwing ontstaat wel, maar wordt afgeschermd in aparte labs of innovatieafdelingen. Daar mag het anders. Maar wat daar ontstaat, krijgt moeite om terug te integreren. Innovatie is geadopteerd als concept, niet als eigenschap van het hele systeem.<\/p>\n    <\/div>\n  <\/div>\n<\/section>\n\n<section class=\"sec wrap\" style=\"padding-top:0 !important;\">\n  <div class=\"kop rev\">\n    <span class=\"eyebrow\">Hoe het er gezond uitziet<\/span>\n    <h2>Waar een beweeglijke organisatie aan te herkennen is.<\/h2>\n    <p>Deze laag laat zich makkelijk beschrijven via wat een organisatie niet moet doen. Belangrijker is hoe gezonde beweeglijkheid er werkelijk uitziet. Dat zijn geen utopische kenmerken, maar herkenbare, observeerbare dingen.<\/p>\n  <\/div>\n  <div class=\"signalen\">\n    <div class=\"sig rev d1\"><span class=\"n\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg><\/span><p>Beslissingen worden genomen op het niveau waar de informatie het rijkst is, niet altijd op het hoogste niveau.<\/p><\/div>\n    <div class=\"sig rev d1\"><span class=\"n\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg><\/span><p>Processen worden ervaren als hulpmiddelen die je kunt aanpassen, niet als wetten waar je je aan onderwerpt.<\/p><\/div>\n    <div class=\"sig rev d2\"><span class=\"n\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg><\/span><p>Strategie wordt doorlopend herzien op basis van wat er gebeurt, niet als jaarlijks ritueel maar als gesprek.<\/p><\/div>\n    <div class=\"sig rev d2\"><span class=\"n\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg><\/span><p>Mensen kunnen zonder voorzichtigheid melden dat iets niet meer klopt of dat een aanpassing nodig is.<\/p><\/div>\n    <div class=\"sig rev d3\"><span class=\"n\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg><\/span><p>Verandering voelt als een normaal deel van het werk, niet als iets bijzonders waar speciale trajecten voor nodig zijn.<\/p><\/div>\n  <\/div>\n  <div class=\"overgang rev\">\n    <span class=\"lbl\">Het hele spectrum<\/span>\n    <p>Navigation is geen eindpunt dat je bereikt en afvinkt. <strong>Organisaties leven vaak in meerdere lagen tegelijk en vallen onder druk terug op een eerdere. Adaptief vermogen is daarom geen laatste fase, maar een blijvende kwaliteit die het hele spectrum bij elkaar houdt.<\/strong><\/p>\n  <\/div>\n<\/section>\n\n<section class=\"sec tight wrap\">\n  <div class=\"ethiek rev\">\n    <div class=\"mark\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.7\"><path d=\"M12 3 4 7v5c0 5 3.5 8.5 8 10 4.5-1.5 8-5 8-10V7z\"\/><path d=\"M9 12l2 2 4-4\"\/><\/svg><\/div>\n    <div class=\"q\">Een gezonde organisatie heeft niet minder narratieven, maar maakt ze <em>bespreekbaar<\/em>.<\/div>\n    <p>Het verschil tussen een beweeglijke en een vastgelopen Navigation laag zit niet in de afwezigheid van twijfel, maar in hoe die twijfel besproken kan worden. INR Align kijkt naar het systeem, niet naar de persoon, en plaatst geen laag boven een andere. Het verhaal zichtbaar maken is geen oordeel, het is de opening naar beweging. Die terughoudendheid is geen bijzaak, het is de ruggengraat van het model.<\/p>\n  <\/div>\n<\/section>\n\n<div class=\"slot-sec\">\n<section class=\"slot wrap\">\n  <div class=\"rev\">\n    <h2>Beweeglijk blijven als <span class=\"grad\">blijvende kwaliteit<\/span>.<\/h2>\n    <p>Navigation begrijpen is het adaptief vermogen van de organisatie tot onderwerp van gesprek maken, zodat verandering een normaal deel van het werk wordt in plaats van een uitzondering.<\/p>\n  <\/div>\n<\/section>\n<section class=\"navlagen wrap\">\n  <div class=\"navrij rev\">\n    <a class=\"navkaart\" href=\"https:\/\/inr.institute\/inr-align\/inr-align-activation\/\"><span class=\"nl nav-c-act\">A<\/span><span class=\"nn\">Activation<\/span><\/a>\n    <a class=\"navkaart\" href=\"https:\/\/inr.institute\/inr-align\/inr-align-leadership\/\"><span class=\"nl nav-c-lea\">L<\/span><span class=\"nn\">Leadership<\/span><\/a>\n    <a class=\"navkaart\" href=\"https:\/\/inr.institute\/inr-align\/inr-align-integration\/\"><span class=\"nl nav-c-int\">I<\/span><span class=\"nn\">Integration<\/span><\/a>\n    <a class=\"navkaart\" href=\"https:\/\/inr.institute\/inr-align\/inr-align-governance\/\"><span class=\"nl nav-c-gov\">G<\/span><span class=\"nn\">Governance<\/span><\/a>\n    <a class=\"navkaart huidig\" href=\"https:\/\/inr.institute\/inr-align\/inr-align-navigation\/\"><span class=\"nl nav-c-nav\">N<\/span><span class=\"nn\">Navigation<\/span><\/a>\n  <\/div>\n  <div class=\"terughub rev\">\n    <a href=\"\/inr-align\/\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M19 12H5M11 18l-6-6 6-6\"\/><\/svg>Terug naar INR Align<\/a>\n  <\/div>\n<\/section>\n<\/div>\n\n<\/div>\n\n<script>\n(function(){\n  function start(){\n    var els=document.querySelectorAll('.inr-align-navigation .rev');\n    if(!('IntersectionObserver' in window)){els.forEach(function(e){e.classList.add('in');});return;}\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  if(document.readyState==='loading'){document.addEventListener('DOMContentLoaded',start);}else{start();}\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:.06em !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:.12em !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        <div class=\"badge\"><span class=\"stip\"><\/span>Contact<\/div>\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>INR Align N Laag 05 van 5 Navigation De laag van adaptie De fase waarin een groot systeem beweeglijk moet blijven. Structuur alleen blijkt niet meer genoeg om mee te bewegen met een werkelijkheid die voortdurend verandert. De uitdaging verschuift van bestuurbaarheid naar aanpassingsvermogen. De kunst is stabiel blijven zonder te verstarren. Schaalbaarheid draait hier [&hellip;]<\/p>\n","protected":false},"author":224244682,"featured_media":0,"parent":75855,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-78307","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/inr.institute\/en\/wp-json\/wp\/v2\/pages\/78307","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=78307"}],"version-history":[{"count":0,"href":"https:\/\/inr.institute\/en\/wp-json\/wp\/v2\/pages\/78307\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/inr.institute\/en\/wp-json\/wp\/v2\/pages\/75855"}],"wp:attachment":[{"href":"https:\/\/inr.institute\/en\/wp-json\/wp\/v2\/media?parent=78307"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}