{"id":4351,"date":"2026-10-06T08:18:09","date_gmt":"2026-10-06T08:18:09","guid":{"rendered":"https:\/\/fullmark.eu\/immersief-360-onthaal\/"},"modified":"2026-10-06T12:03:16","modified_gmt":"2026-10-06T12:03:16","slug":"immersief-360-onthaal","status":"publish","type":"page","link":"https:\/\/fullmark.eu\/nl\/immersief-360-onthaal\/","title":{"rendered":"Immersief 360-onthaal"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"4351\" class=\"elementor elementor-4351 elementor-4306\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-41da465 e-flex e-con-boxed e-con e-parent\" data-id=\"41da465\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-1666fc4 e-con-full e-flex e-con e-child\" data-id=\"1666fc4\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0588b05 animated-slow elementor-widget__width-initial elementor-widget-mobile__width-initial elementor-widget-tablet__width-initial elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"0588b05\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;,&quot;_animation_delay&quot;:300}\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">360\u00b0 immersieve onthaalruimte voor veiligheid<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3616e1f e-flex e-con-boxed e-con e-parent\" data-id=\"3616e1f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b546fc5 elementor-widget elementor-widget-html\" data-id=\"b546fc5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- Fullmark 360 Veiligheidsruimte (NL): HTML-widget Elementor -->\n<div id=\"salle-securite-fullmark-nl\"><\/div>\n<script>\n(function(){\n\/* ====== ENIGE REGEL OM AAN TE PASSEN: het adres van de map met je afbeeldingen in de Mediabibliotheek ====== *\/\nvar BASE = \"https:\/\/fullmark.eu\/wp-content\/uploads\/2026\/10\/\";\n\/* Achtergrondafbeelding NL (zelfde formaat en kadrering als het origineel: 2244 \u00d7 2048 px) *\/\nvar BG = \"https:\/\/fullmark.eu\/wp-content\/uploads\/2026\/10\/sallenl.jpg\";\n\/* ================================================================================================== *\/\nif(!BASE.endsWith('\/'))BASE+='\/';\nvar host=document.getElementById('salle-securite-fullmark-nl');\nif(!host||host.shadowRoot)return;\nif(!document.getElementById('ssf-fonts')){var l=document.createElement('link');l.id='ssf-fonts';l.rel='stylesheet';l.href='https:\/\/fonts.googleapis.com\/css2?family=Barlow+Condensed:wght@600;700;800&family=Barlow:wght@400;500;600&display=swap';document.head.appendChild(l);}\nvar root=host.attachShadow({mode:'open'});\nroot.innerHTML=`<style>\n\/* Layout: de ruimte vult het beeld, een infofiche in signalisatiestijl opent rechts (onder het beeld op mobiel). *\/\n:host{display:block;\n  --navy:#0f2347; --navy-2:#16305e; --navy-3:#21427c;\n  --orange:#f07d1a; --hivis:#e8f03a; --paper:#f3f6fb; --ink:#0f2347;\n  --muted:#9fb1cf; --line:rgba(159,177,207,.22);\n  --display:\"Barlow Condensed\",\"Arial Narrow\",sans-serif;\n  --body:\"Barlow\",\"Segoe UI\",system-ui,sans-serif;\n  color-scheme:dark;\n}\n*{box-sizing:border-box}\n.app{border-radius:6px;overflow:hidden;-webkit-font-smoothing:antialiased}\nh1,h2,p,ul{margin:0}\nbutton{line-height:1.2;text-shadow:none;min-height:0}\nimg{max-width:none}\n.stage>img.bg{max-width:100%}\n:host(:fullscreen) .app{height:100%;overflow:auto;border-radius:0}\n.app{background:var(--navy);color:var(--paper);font-family:var(--body);font-size:15px;line-height:1.5}\n.wrap{display:flex;flex-direction:column;padding-inline:16px;padding-block:12px 16px;gap:12px}\nheader{display:flex;align-items:center;gap:16px;flex-wrap:wrap}\n.brand{display:flex;flex-direction:column;line-height:1.05;margin-right:auto}\n.brand small{font-family:var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--orange);font-size:13px;font-weight:700}\n.brand h1{margin:0;hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word;font-family:var(--display);font-weight:800;font-size:clamp(22px,3vw,30px);text-transform:uppercase;letter-spacing:.01em;text-wrap:balance}\n.progress{font-family:var(--display);font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-variant-numeric:tabular-nums}\n.progress b{color:var(--hivis)}\nbutton{font:inherit;cursor:pointer}\n.btn{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:15px;border:0;border-radius:3px;padding:9px 16px;background:var(--orange);color:var(--navy)}\n.btn.ghost{background:transparent;color:var(--paper);box-shadow:inset 0 0 0 1.5px var(--line)}\n.btn:hover{filter:brightness(1.08)}\n.btn:focus-visible,.dev-btn:focus-visible,.marker:focus-visible{outline:3px solid var(--hivis);outline-offset:2px}\n\nmain{flex:1;display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:16px;align-items:start}\n.app.narrow main{grid-template-columns:minmax(0,1fr)}\n\n.stage{position:relative;width:100%;max-width:100%;aspect-ratio:2244\/2048;max-height:calc(100vh - 110px);margin-inline:auto;border-radius:4px;overflow:hidden;background:#cfd6e2;cursor:default;touch-action:manipulation}\n.app:not(.narrow) .stage{width:min(100%, calc((100vh - 110px) * 2244 \/ 2048))}\n.stage>img.bg{position:absolute;inset:0;width:100%;height:100%;display:block;user-select:none;-webkit-user-drag:none}\n.dim{position:absolute;inset:0;background:rgba(10,24,52,.62);opacity:0;transition:opacity .35s ease;pointer-events:none}\n.stage.focus .dim{opacity:1}\n.cut{position:absolute;pointer-events:none;opacity:0;transition:opacity .25s ease,transform .35s ease,filter .35s ease;transform-origin:50% 60%}\n.cut.hover{opacity:1;filter:brightness(1.12) drop-shadow(0 0 6px rgba(240,125,26,.9))}\n.cut.on{opacity:1;transform:scale(1.035);filter:drop-shadow(0 0 2px #fff) drop-shadow(0 0 14px rgba(240,125,26,.95))}\n\n\/* Sfeeranimaties *\/\n.glare{position:absolute;overflow:hidden;pointer-events:none;mix-blend-mode:screen}\n.glare::after{content:\"\";position:absolute;top:-20%;bottom:-20%;width:35%;left:-50%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.42),transparent);animation:sweep 5.5s ease-in-out infinite}\n.glare.b::after{animation-delay:2.4s;animation-duration:6.5s}\n@keyframes sweep{0%,55%{left:-50%}85%,100%{left:120%}}\n.screen-pulse{position:absolute;pointer-events:none;background:radial-gradient(closest-side,rgba(120,200,255,.45),transparent);animation:pulse 3.2s ease-in-out infinite;mix-blend-mode:screen}\n@keyframes pulse{0%,100%{opacity:.15}50%{opacity:.7}}\n\n.marker{position:absolute;transform:translate(-50%,-50%);width:30px;height:30px;border-radius:50%;border:0;background:var(--orange);color:var(--navy);font-family:var(--display);font-weight:800;font-size:16px;display:grid;place-items:center;box-shadow:0 2px 8px rgba(0,0,0,.35);transition:transform .2s,opacity .3s}\n.marker::before{content:\"\";position:absolute;inset:-6px;border-radius:50%;border:2px solid var(--orange);animation:ring 2.2s ease-out infinite}\n@keyframes ring{0%{transform:scale(.7);opacity:.9}100%{transform:scale(1.6);opacity:0}}\n.marker:hover{transform:translate(-50%,-50%) scale(1.15)}\n.marker.seen{background:var(--paper)}\n.marker.seen::before{border-color:var(--paper);animation:none;opacity:0}\n.stage.focus .marker{opacity:0;pointer-events:none}\n.tip{position:absolute;transform:translate(-50%,-140%);background:var(--navy);color:var(--paper);font-family:var(--display);font-weight:700;letter-spacing:.04em;text-transform:uppercase;font-size:14px;padding:4px 10px;border-radius:3px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s}\n.tip.show{opacity:1}\n\n@media (prefers-reduced-motion:reduce){.glare::after,.screen-pulse,.marker::before{animation:none}.cut{transition:none}}\n\n\/* Infofiche *\/\n.panel{background:var(--paper);color:var(--ink);border-radius:4px;overflow:hidden;display:flex;flex-direction:column;min-width:0}\n.panel .band{background:repeating-linear-gradient(-45deg,var(--hivis) 0 14px,var(--navy) 14px 28px);height:8px}\n.panel .inner{padding:20px 22px 22px;display:flex;flex-direction:column;gap:14px}\n.eyebrow{font-family:var(--display);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--orange)}\n.panel h2{margin:0;hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word;font-family:var(--display);font-weight:800;font-size:30px;line-height:1.02;text-transform:uppercase;text-wrap:balance}\n.panel p{margin:0;max-width:62ch}\n.consigne{background:var(--navy);color:var(--paper);border-radius:3px;padding:12px 14px;display:flex;gap:12px;align-items:flex-start}\n.consigne .ico{flex:none;width:26px;height:26px;border-radius:50%;background:var(--hivis);color:var(--navy);font-family:var(--display);font-weight:800;display:grid;place-items:center;font-size:17px}\n.consigne strong{display:block;font-family:var(--display);text-transform:uppercase;letter-spacing:.06em;font-size:13px;color:var(--hivis)}\n.panel ul{margin:0;padding:0;list-style:none;display:grid;gap:6px}\n.panel li{display:flex;gap:10px;align-items:baseline}\n.panel li::before{content:\"\";flex:none;width:8px;height:8px;background:var(--orange);transform:translateY(-1px) rotate(45deg)}\n.nav{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}\n.nav .btn.ghost{color:var(--ink);box-shadow:inset 0 0 0 1.5px rgba(15,35,71,.25)}\n.draft{font-size:12px;color:#6a7a96;border-top:1px dashed rgba(15,35,71,.2);padding-top:10px}\n.list{display:grid;gap:4px}\n.dev-btn{display:flex;align-items:center;gap:10px;background:transparent;border:0;padding:7px 8px;border-radius:3px;text-align:left;color:var(--ink);font-weight:500}\n.dev-btn:hover{background:rgba(15,35,71,.07)}\n.dev-btn .n{flex:none;width:24px;height:24px;border-radius:50%;background:var(--orange);color:var(--navy);display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size:14px}\n.dev-btn.seen .n{background:var(--navy);color:var(--paper)}\n.done{background:var(--hivis);color:var(--navy);border-radius:3px;padding:10px 12px;font-weight:600}\n<\/style>\n<div class=\"app\" lang=\"nl\"><div class=\"wrap\">\n  <header>\n    <div class=\"brand\"><small>Onthaal nieuwe medewerkers<\/small><h1>Fullmark 360 Veiligheidsruimte<\/h1><\/div>\n    <span class=\"progress\" id=\"progress\"><b>0<\/b> \/ 10 hulpmiddelen bekeken<\/span>\n    <button class=\"btn ghost\" id=\"fs\" type=\"button\">Volledig scherm<\/button>\n  <\/header>\n\n  <main>\n    <div class=\"stage\" id=\"stage\" aria-label=\"Fotomontage van de uitgeruste vergaderruimte\">\n      <img decoding=\"async\" class=\"bg\" src=\"${BG}\" alt=\"Vergaderruimte uitgerust met de veiligheidshulpmiddelen van Fullmark\" draggable=\"false\">\n      <div class=\"glare\" style=\"left:33%;top:24.3%;width:18.3%;height:14%\"><\/div>\n      <div class=\"glare b\" style=\"left:16.2%;top:46.9%;width:9.6%;height:7%\"><\/div>\n      <div class=\"screen-pulse\" style=\"left:15%;top:45.5%;width:12%;height:10%\"><\/div>\n      <div class=\"dim\"><\/div>\n      <div id=\"cuts\"><\/div>\n      <div id=\"markers\"><\/div>\n      <div class=\"tip\" id=\"tip\"><\/div>\n    <\/div>\n\n    <aside class=\"panel\" id=\"panel\" aria-live=\"polite\"><\/aside>\n  <\/main>\n<\/div><\/div>`;\n\nconst W=2244,H=2048;\n\/\/ Volgorde van de rondleiding = volgorde waarin je de ruimte ontdekt bij het binnenkomen (van links naar rechts).\nconst DEVICES=[\n {id:\"totem\",file:\"Totem\",bb:[68,746,418,2048],anchor:[205,1180],\n  cat:\"Onthaalsignalisatie\",name:\"Veiligheidstotem silhouet\",\n  desc:\"Levensgroot silhouet van een operator met al zijn PBM's. Bij de ingang trekt het de aandacht van iedereen die binnenkomt en herinnert het aan de verplichte kledij op de site.\",\n  rule:\"Controleer uw uitrusting van kop tot teen voordat u de productiezone betreedt.\",\n  points:[\"Helm en veiligheidsbril\",\"Fluovestje\",\"Handschoenen aangepast aan de taak\",\"Veiligheidsschoenen\"]},\n {id:\"borne\",file:\"borne\",bb:[316,938,624,1548],anchor:[470,1240],\n  cat:\"Digitaal\",name:\"Zuil \u2018Digitale veiligheidsgesprekken\u2019\",\n  desc:\"Aanraakzuil waarmee u in enkele minuten een veiligheidsgesprek start: een thema, een korte video en vragen om het team te laten reageren.\",\n  rule:\"Minstens \u00e9\u00e9n veiligheidsgesprek per week met uw team: de zuil stelt het thema van de dag voor.\",\n  points:[\"Thema's ingedeeld per risico\",\"Kort formaat (5 tot 10 min)\",\"Opvolging van de deelnemers\"]},\n {id:\"tv\",file:\"TV\",bb:[731,460,1157,792],anchor:[944,620],\n  cat:\"Dynamische weergave\",name:\"Veiligheidsscherm\",\n  desc:\"Scherm dat doorlopend de belangrijkste boodschappen van de site toont: veiligheidsslogan, cijfers van de maand, waarschuwingen en herinneringen aan de richtlijnen.\",\n  rule:\"Werp bij aankomst een blik op het scherm: de waarschuwingen van de dag staan erop.\",\n  points:[\"Boodschappen op maat van uw site\",\"Op afstand bij te werken\"]},\n {id:\"poster\",file:\"poster\",bb:[627,832,1203,1098],anchor:[915,965],\n  cat:\"Affiches\",name:\"Sensibiliserings\\u00ADaffiches\",\n  desc:\"Reeks ingekaderde affiches over de grote veiligheidsthema's, bijvoorbeeld: PBM's, gedeelde waakzaamheid, het dragen van lasten en de verschillende veilige gedragingen in de werkzones.\",\n  rule:\"Ik respecteer de verkeersregels en blijf waakzaam wanneer ik me verplaats.\",example:true,\n  points:[\"Volledig aanpasbare affiches\",\"Click-kadersysteem\",\"Affichehouders\"]},\n {id:\"toolboxm\",file:\"Toolbox_meeting\",bb:[941,1131,1094,1337],anchor:[1018,1234],\n  cat:\"Animatie\",name:\"Toolbox Meeting-koffer\",\n  desc:\"Volledige kit om een korte veiligheidsvergadering op de werkpost te leiden: themafiches, visuele ondersteuning en een gids voor de begeleider.\",\n  rule:\"Uw leidinggevende houdt regelmatig een Toolbox Meeting: kom met uw vragen en uw meldingen van op de werkvloer.\",\n  points:[\"Kant-en-klare fiches\",\"Gids voor de begeleider\",\"Een ge\u00efllustreerde poster per thema\",\"Engagementposter voor de medewerkers\"]},\n {id:\"toolbox\",file:\"Toolbox\",bb:[1106,1132,1244,1353],anchor:[1175,1240],\n  cat:\"Animatie\",name:\"Animatiefolder over het thema\",\n  desc:\"De rode draad van het thema: deze folder leidt het hele veiligheidsgesprek, van de inleiding tot de juiste handelingen. Hij legt uit waarom dit thema belangrijk is, toont de risicosituaties en verwijst via een QR-code naar de volledige inhoud.\",\n  rule:\"Grijp nooit in op een draaiende machine: vergrendeling (LOTO) is verplicht.\",example:true,\n  points:[\"Waarom dit thema?\",\"Ge\u00efllustreerde risicosituaties\",\"QR-code naar de video\"]},\n {id:\"autre\",file:\"Autre\",bb:[1201,1316,1479,1460],anchor:[1340,1388],\n  cat:\"Ondersteuning\",name:\"Aanvullende fiches en flyers\",\n  desc:\"Documenten om na een veiligheidsgesprek aan de deelnemers te geven, zodat de boodschappen blijven hangen.\",\n  rule:\"Houd uw fiches binnen handbereik: ze vatten de kernpunten van elk thema samen.\",\n  points:[\"Samenvatting van de richtlijnen\",\"Zakformaat\",\"Beschikbaar per thema\"]},\n {id:\"chasse\",file:\"chasses_aux_risques\",bb:[889,1379,1469,1538],anchor:[1060,1470],\n  cat:\"Educatief spel\",name:\"Risicojacht\",\n  desc:\"Grote illustratie van een werkplaats waarin het team alle gevaarlijke situaties moet opsporen. Een speelse oefening die het oog traint.\",\n  rule:\"Ziet u een gevaarlijke situatie op de site? Meld ze meteen aan uw verantwoordelijke.\",\n  points:[\"Speel je in team\",\"Oplossingen inbegrepen\",\"Verschillende omgevingen beschikbaar\"]},\n {id:\"veleda\",file:\"tableau_veleda\",bb:[1362,676,1792,1149],anchor:[1577,912],\n  cat:\"Opvolging\",name:\"Safety Meeting-bord\",\n  desc:\"Voorbedrukt whiteboard om de veiligheidsvergadering te structureren: teamweerbericht, punten van de dag, op te volgen acties en aanwezigheidslijst.\",\n  rule:\"Elke vergadering eindigt met concrete acties, met een naam en een datum.\",\n  points:[\"Teamindicatoren\",\"Opvolging van de acties\",\"Aanwezigheidslijst\"]},\n {id:\"epi\",file:\"paneau_epi\",bb:[1844,417,2171,1699],anchor:[2008,1060],\n  cat:\"Signalisatie\",name:\"PBM-paneel \u2018Bent u goed beschermd?\u2019\",\n  desc:\"Groot paneel met de verplichte uitrusting, met het verschil tussen operatoren en bezoekers. Geplaatst aan de ingang van de werkzones.\",\n  rule:\"Draag de juiste PBM's volgens de plaats waar u zich op de site bevindt.\",\n  points:[\"Stootpet of veiligheidshelm\",\"Volledige fluokledij\",\"Fluovestje\",\"Veiligheidsschoenen\"]}\n];\n\/\/ Stapelvolgorde voor het klikken: kleine voorwerpen gaan voor grote.\nconst HIT_ORDER=[\"toolboxm\",\"toolbox\",\"autre\",\"chasse\",\"tv\",\"poster\",\"borne\",\"veleda\",\"epi\",\"totem\"];\n\nconst stage=root.getElementById('stage'),cutsEl=root.getElementById('cuts'),\n markersEl=root.getElementById('markers'),panel=root.getElementById('panel'),\n tip=root.getElementById('tip'),progress=root.getElementById('progress');\nconst pct=(v,t)=>(v\/t*100)+'%';\nconst seen=new Set();let current=-1,hoverId=null;\n\n\/\/ De uitsneden worden uit de NL-achtergrond geknipt, met de originele uitsneden als masker.\nconst bgImg=root.querySelector('img.bg');\nconst bgReady=bgImg.decode().then(()=>bgImg).catch(()=>null);\nDEVICES.forEach((d,i)=>{\n  const [x0,y0,x1,y1]=d.bb;\n  const img=new Image();img.className='cut';img.alt='';\n  Object.assign(img.style,{left:pct(x0,W),top:pct(y0,H),width:pct(x1-x0,W),height:pct(y1-y0,H)});\n  cutsEl.appendChild(img);d.el=img;\n  const mask=new Image();mask.src=BASE+d.file+'.webp';\n  Promise.all([mask.decode(),bgReady]).then(([_,bg])=>{\n    const c=document.createElement('canvas');const s=0.25;\n    c.width=Math.max(1,Math.round(mask.naturalWidth*s));c.height=Math.max(1,Math.round(mask.naturalHeight*s));\n    const g=c.getContext('2d');g.drawImage(mask,0,0,c.width,c.height);\n    try{d.alpha={w:c.width,h:c.height,data:g.getImageData(0,0,c.width,c.height).data,s:c.width\/(x1-x0)};}catch(e){}\n    if(!bg){img.src=mask.src;return;}\n    const k=bg.naturalWidth\/W;\n    const cv=document.createElement('canvas');cv.width=mask.naturalWidth;cv.height=mask.naturalHeight;\n    const g2=cv.getContext('2d');\n    g2.drawImage(bg,x0*k,y0*k,(x1-x0)*k,(y1-y0)*k,0,0,cv.width,cv.height);\n    g2.globalCompositeOperation='destination-in';g2.drawImage(mask,0,0);\n    try{img.src=cv.toDataURL('image\/png');}catch(e){img.src=mask.src;}\n  }).catch(()=>{img.src=mask.src;});\n  const m=document.createElement('button');m.type='button';m.className='marker';m.textContent=i+1;\n  m.setAttribute('aria-label',d.name);\n  m.style.left=pct(d.anchor[0],W);m.style.top=pct(d.anchor[1],H);\n  m.addEventListener('click',e=>{e.stopPropagation();select(i)});\n  markersEl.appendChild(m);d.marker=m;\n});\n\nfunction hitTest(ev){\n  const r=stage.getBoundingClientRect();\n  const x=(ev.clientX-r.left)\/r.width*W,y=(ev.clientY-r.top)\/r.height*H;\n  for(const id of HIT_ORDER){const d=DEVICES.find(o=>o.id===id);const [x0,y0,x1,y1]=d.bb;\n    if(x<x0||x>x1||y<y0||y>y1)continue;\n    if(!d.alpha)return d;\n    const ax=Math.floor((x-x0)*d.alpha.s),ay=Math.floor((y-y0)*d.alpha.s);\n    if(ax>=0&&ay>=0&&ax<d.alpha.w&&ay<d.alpha.h&&d.alpha.data[(ay*d.alpha.w+ax)*4+3]>40)return d;}\n  return null;\n}\nstage.addEventListener('pointermove',ev=>{\n  if(ev.pointerType==='touch')return;\n  const d=hitTest(ev);const id=d?d.id:null;\n  if(id!==hoverId){DEVICES.forEach(o=>o.el.classList.toggle('hover',o.id===id&&current<0));hoverId=id;}\n  stage.style.cursor=d?'pointer':'default';\n  if(d&&current<0){const r=stage.getBoundingClientRect();tip.textContent=d.name;\n    tip.style.left=(ev.clientX-r.left)+'px';tip.style.top=(ev.clientY-r.top)+'px';tip.classList.add('show');}\n  else tip.classList.remove('show');\n});\nstage.addEventListener('pointerleave',()=>{tip.classList.remove('show');DEVICES.forEach(o=>o.el.classList.remove('hover'));hoverId=null});\nstage.addEventListener('click',ev=>{const d=hitTest(ev);if(d)select(DEVICES.indexOf(d));else if(current>=0)reset();});\n\nfunction select(i){\n  current=i;const d=DEVICES[i];seen.add(d.id);\n  stage.classList.add('focus');tip.classList.remove('show');\n  DEVICES.forEach(o=>{o.el.classList.toggle('on',o===d);o.el.classList.remove('hover');o.marker.classList.toggle('seen',seen.has(o.id))});\n  updateProgress();\n  const last=i===DEVICES.length-1;\n  panel.innerHTML=`<div class=\"band\"><\/div><div class=\"inner\">\n    <span class=\"eyebrow\">${i+1} \/ ${DEVICES.length} \u00b7 ${d.cat}<\/span>\n    <h2>${d.name}<\/h2>\n    <p>${d.desc}<\/p>\n    <div class=\"consigne\"><span class=\"ico\">!<\/span><div><strong>${d.example?'Voorbeeld van een richtlijn om te onthouden':'De richtlijn om te onthouden'}<\/strong>${d.rule}<\/div><\/div>\n    <ul>${d.points.map(p=>`<li>${p}<\/li>`).join('')}<\/ul>\n    ${seen.size===DEVICES.length&&last?'<div class=\"done\">Rondleiding voltooid: u hebt de 10 hulpmiddelen van de ruimte ontdekt.<\/div>':''}\n    <div class=\"nav\">\n      <button class=\"btn ghost\" type=\"button\" id=\"prev\" ${i===0?'disabled':''}>Vorige<\/button>\n      <button class=\"btn\" type=\"button\" id=\"next\">${last?'Terug naar de ruimte':'Volgend hulpmiddel'}<\/button>\n    <\/div><\/div>`;\n  root.getElementById('prev').onclick=()=>i>0&&select(i-1);\n  root.getElementById('next').onclick=()=>last?reset():select(i+1);\n}\nfunction reset(){\n  current=-1;stage.classList.remove('focus');DEVICES.forEach(o=>o.el.classList.remove('on'));renderIntro();\n}\nfunction updateProgress(){progress.innerHTML=`<b>${seen.size}<\/b> \/ ${DEVICES.length} hulpmiddelen bekeken`}\nfunction renderIntro(){\n  panel.innerHTML=`<div class=\"band\"><\/div><div class=\"inner\">\n    <span class=\"eyebrow\">Welkom<\/span>\n    <h2>Veiligheid is een zaak van iedereen<\/h2>\n    <p>In deze ruimte vindt u de hulpmiddelen die u dagelijks zullen begeleiden. Klik op een hulpmiddel in de ruimte of volg de rondleiding.<\/p>\n    <div class=\"nav\"><button class=\"btn\" type=\"button\" id=\"start\">${seen.size?'Rondleiding hervatten':'Rondleiding starten'}<\/button><\/div>\n    <div class=\"list\">${DEVICES.map((d,i)=>`<button type=\"button\" class=\"dev-btn ${seen.has(d.id)?'seen':''}\" data-i=\"${i}\"><span class=\"n\">${i+1}<\/span>${d.name}<\/button>`).join('')}<\/div><\/div>`;\n  root.getElementById('start').onclick=()=>{const n=DEVICES.findIndex(d=>!seen.has(d.id));select(n<0?0:n)};\n  panel.querySelectorAll('.dev-btn').forEach(b=>b.onclick=()=>select(+b.dataset.i));\n}\ndocument.addEventListener('keydown',e=>{\n  if(current<0)return;\n  if(e.key==='ArrowRight'&&current<DEVICES.length-1)select(current+1);\n  else if(e.key==='ArrowLeft'&&current>0)select(current-1);\n  else if(e.key==='Escape')reset();\n});\nroot.getElementById('fs').onclick=()=>{\n  const el=host;\n  if(document.fullscreenElement)document.exitFullscreen?.().catch(()=>{});\n  else el.requestFullscreen?.().catch(()=>{});\n};\nvar appEl=root.querySelector('.app');\nfunction fit(){appEl.classList.toggle('narrow',host.clientWidth<900);}\nfit();if(window.ResizeObserver){new ResizeObserver(fit).observe(host);}else{window.addEventListener('resize',fit);}\nrenderIntro();\n\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-482f21c e-con-full e-flex e-con e-child\" data-id=\"482f21c\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-e2dc213 e-flex e-con-boxed e-con e-parent\" data-id=\"e2dc213\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ed7750d elementor-mobile-align-center elementor-align-center elementor-widget elementor-widget-button\" data-id=\"ed7750d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/fullmark.eu\/nl\/contact\/\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Wij ontwerpen uw veiligheidscommunicatie op maat, laten we dit samen bespreken<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>360\u00b0 immersieve onthaalruimte voor veiligheid Wij ontwerpen uw veiligheidscommunicatie op maat, laten we dit samen bespreken<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-4351","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.2 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Immersief 360-onthaal - Fullmark<\/title>\n<meta name=\"robots\" content=\"noindex, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<meta property=\"og:locale\" content=\"nl_NL\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Immersief 360-onthaal - Fullmark\" \/>\n<meta property=\"og:description\" content=\"360\u00b0 immersieve onthaalruimte voor veiligheid Wij ontwerpen uw veiligheidscommunicatie op maat, laten we dit samen bespreken\" \/>\n<meta property=\"og:url\" content=\"https:\/\/fullmark.eu\/accueil-immersif-360\/\" \/>\n<meta property=\"og:site_name\" content=\"Fullmark\" \/>\n<meta property=\"article:modified_time\" content=\"2026-10-06T12:03:16+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Geschatte leestijd\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minuut\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/fullmark.eu\\\/accueil-immersif-360\\\/\",\"url\":\"https:\\\/\\\/fullmark.eu\\\/accueil-immersif-360\\\/\",\"name\":\"Immersief 360-onthaal - Fullmark\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/fullmark.eu\\\/#website\"},\"datePublished\":\"2026-10-06T08:18:09+00:00\",\"dateModified\":\"2026-10-06T12:03:16+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/fullmark.eu\\\/accueil-immersif-360\\\/#breadcrumb\"},\"inLanguage\":\"nl-NL\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/fullmark.eu\\\/accueil-immersif-360\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/fullmark.eu\\\/accueil-immersif-360\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Accueil\",\"item\":\"https:\\\/\\\/fullmark.eu\\\/nl\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Immersief 360-onthaal\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/fullmark.eu\\\/#website\",\"url\":\"https:\\\/\\\/fullmark.eu\\\/\",\"name\":\"Fullmark\",\"description\":\"Safety Culture\",\"publisher\":{\"@id\":\"https:\\\/\\\/fullmark.eu\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/fullmark.eu\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"nl-NL\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/fullmark.eu\\\/#organization\",\"name\":\"Fullmark\",\"url\":\"https:\\\/\\\/fullmark.eu\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"nl-NL\",\"@id\":\"https:\\\/\\\/fullmark.eu\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/fullmark.eu\\\/wp-content\\\/uploads\\\/2026\\\/06\\\/Fullmark_logo-bleu-scaled.png\",\"contentUrl\":\"https:\\\/\\\/fullmark.eu\\\/wp-content\\\/uploads\\\/2026\\\/06\\\/Fullmark_logo-bleu-scaled.png\",\"width\":2560,\"height\":1930,\"caption\":\"Fullmark\"},\"image\":{\"@id\":\"https:\\\/\\\/fullmark.eu\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.linkedin.com\\\/company\\\/fullmark\\\/\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Immersief 360-onthaal - Fullmark","robots":{"index":"noindex","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"og_locale":"nl_NL","og_type":"article","og_title":"Immersief 360-onthaal - Fullmark","og_description":"360\u00b0 immersieve onthaalruimte voor veiligheid Wij ontwerpen uw veiligheidscommunicatie op maat, laten we dit samen bespreken","og_url":"https:\/\/fullmark.eu\/accueil-immersif-360\/","og_site_name":"Fullmark","article_modified_time":"2026-10-06T12:03:16+00:00","twitter_card":"summary_large_image","twitter_misc":{"Geschatte leestijd":"1 minuut"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/fullmark.eu\/accueil-immersif-360\/","url":"https:\/\/fullmark.eu\/accueil-immersif-360\/","name":"Immersief 360-onthaal - Fullmark","isPartOf":{"@id":"https:\/\/fullmark.eu\/#website"},"datePublished":"2026-10-06T08:18:09+00:00","dateModified":"2026-10-06T12:03:16+00:00","breadcrumb":{"@id":"https:\/\/fullmark.eu\/accueil-immersif-360\/#breadcrumb"},"inLanguage":"nl-NL","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fullmark.eu\/accueil-immersif-360\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/fullmark.eu\/accueil-immersif-360\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Accueil","item":"https:\/\/fullmark.eu\/nl\/"},{"@type":"ListItem","position":2,"name":"Immersief 360-onthaal"}]},{"@type":"WebSite","@id":"https:\/\/fullmark.eu\/#website","url":"https:\/\/fullmark.eu\/","name":"Fullmark","description":"Safety Culture","publisher":{"@id":"https:\/\/fullmark.eu\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/fullmark.eu\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"nl-NL"},{"@type":"Organization","@id":"https:\/\/fullmark.eu\/#organization","name":"Fullmark","url":"https:\/\/fullmark.eu\/","logo":{"@type":"ImageObject","inLanguage":"nl-NL","@id":"https:\/\/fullmark.eu\/#\/schema\/logo\/image\/","url":"https:\/\/fullmark.eu\/wp-content\/uploads\/2026\/06\/Fullmark_logo-bleu-scaled.png","contentUrl":"https:\/\/fullmark.eu\/wp-content\/uploads\/2026\/06\/Fullmark_logo-bleu-scaled.png","width":2560,"height":1930,"caption":"Fullmark"},"image":{"@id":"https:\/\/fullmark.eu\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.linkedin.com\/company\/fullmark\/"]}]}},"_links":{"self":[{"href":"https:\/\/fullmark.eu\/nl\/wp-json\/wp\/v2\/pages\/4351","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fullmark.eu\/nl\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/fullmark.eu\/nl\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/fullmark.eu\/nl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fullmark.eu\/nl\/wp-json\/wp\/v2\/comments?post=4351"}],"version-history":[{"count":13,"href":"https:\/\/fullmark.eu\/nl\/wp-json\/wp\/v2\/pages\/4351\/revisions"}],"predecessor-version":[{"id":4367,"href":"https:\/\/fullmark.eu\/nl\/wp-json\/wp\/v2\/pages\/4351\/revisions\/4367"}],"wp:attachment":[{"href":"https:\/\/fullmark.eu\/nl\/wp-json\/wp\/v2\/media?parent=4351"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}