{"id":9384,"date":"2026-08-13T10:47:13","date_gmt":"2026-08-13T08:47:13","guid":{"rendered":"https:\/\/fiets-o-fit.nl\/nieuw\/?page_id=9384"},"modified":"2026-08-20T16:11:43","modified_gmt":"2026-08-20T14:11:43","slug":"home","status":"publish","type":"page","link":"https:\/\/fiets-o-fit.nl\/es\/","title":{"rendered":"Home"},"content":{"rendered":"<section class=\"l-section wpb_row height_auto width_full\"><div class=\"l-section-h i-cf\"><div class=\"g-cols vc_row via_flex valign_top type_default stacking_default\"><div class=\"vc_col-sm-12 wpb_column vc_column_container\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><div class=\"w-html\"><style>\n\/*\n * V5.2.23\n * Bij terugkeer naar een anker op de homepage (bijv. #over-ons)\n * verbergen we de pagina heel kort v\u00f3\u00f3r de eerste paint.\n * De browser\/JS kan dan eerst naar het anker springen.\n * Hierdoor kan de hero \/ het Fiets-O-Fit-logo niet \u00e9\u00e9n frame flashen.\n *\/\nhtml.custom-fof-hash-return body {\n\tvisibility: hidden !important;\n}\n<\/style>\n\n<style>\n\/*\n * V5.2.32 \u2014 wordt de class al in <head> gezet, dan blijft de pagina\n * volledig verborgen tot de doelrij onder de hero is gepositioneerd.\n *\/\nhtml.custom-fof-translate-return {\n\tvisibility: hidden !important;\n}\n<\/style>\n\n<script>\n(function () {\n\n\ttry {\n\n\t\tvar sessionKey =\n\t\t\t'fof-home-animation-seen-v1';\n\n\t\tvar seen =\n\t\t\tsessionStorage.getItem(\n\t\t\t\tsessionKey\n\t\t\t) === '1';\n\n\t\tvar isReload =\n\t\t\tfalse;\n\n\n\t\ttry {\n\n\t\t\tvar navEntries =\n\t\t\t\tperformance.getEntriesByType(\n\t\t\t\t\t'navigation'\n\t\t\t\t);\n\n\t\t\tif (\n\t\t\t\tnavEntries &&\n\t\t\t\tnavEntries.length\n\t\t\t) {\n\n\t\t\t\tisReload =\n\t\t\t\t\tnavEntries[0].type ===\n\t\t\t\t\t'reload';\n\n\t\t\t}\n\n\t\t}\n\t\tcatch (e) {}\n\n\n\t\tif (\n\t\t\t!isReload &&\n\t\t\tperformance.navigation\n\t\t) {\n\n\t\t\tisReload =\n\t\t\t\tperformance.navigation.type ===\n\t\t\t\t1;\n\n\t\t}\n\n\n\t\t\/*\n\t\t * V5.2.23:\n\t\t * Komt iemand binnen dezelfde sessie terug naar een\n\t\t * homepage-anker zoals #over-ons, dan kan de browser\n\t\t * eerst \u00e9\u00e9n frame de hero bovenaan tonen voordat de\n\t\t * ankernavigatie wordt toegepast.\n\t\t *\n\t\t * Markeer daarom het document v\u00f3\u00f3r de eerste paint.\n\t\t *\/\n\t\tif (\n\t\t\tseen &&\n\t\t\t!isReload &&\n\t\t\twindow.location.hash\n\t\t) {\n\n\t\t\tdocument.documentElement.classList.add(\n\t\t\t\t'custom-fof-hash-return'\n\t\t\t);\n\n\t\t}\n\n\n\t\t\/*\n\t\t * Alleen zichtbaar maken bij:\n\t\t * - eerste bezoek in deze tab\/sessie\n\t\t * - expliciete reload van de homepage\n\t\t *\n\t\t * Terugkomen vanaf een andere pagina, ook naar\n\t\t * \/#over-ons, houdt het groene vlak vanaf\n\t\t * de allereerste paint verborgen.\n\t\t *\/\n\t\tif (\n\t\t\t!seen ||\n\t\t\tisReload\n\t\t) {\n\n\t\t\tdocument.documentElement.classList.add(\n\t\t\t\t'custom-fof-intro-preflight'\n\t\t\t);\n\n\t\t}\n\n\t}\n\tcatch (e) {\n\n\t\t\/*\n\t\t * Als sessionStorage niet beschikbaar is:\n\t\t * liever de intro tonen dan een kapotte start.\n\t\t *\/\n\t\tdocument.documentElement.classList.add(\n\t\t\t'custom-fof-intro-preflight'\n\t\t);\n\n\t}\n\n})();\n<\/script>\n\n<!-- FIETS-O-FIT SPRAY INTRO \u2014 VERSION 5.2.36 \u2014 FIRST-PAINT ALTIJD GROEN OP EERSTE LOAD\/RELOAD -->\n<section class=\"custom-fof-spray-logo\">\n\t<!-- ======================================================\n\t     V5.2 \u2014 GROENE OPENINGSINTRO\n\t======================================================= -->\n\t<div class=\"custom-fof-intro\" aria-hidden=\"true\">\n\n\t\t<div class=\"custom-fof-intro-inner\">\n<div class=\"custom-fof-intro-title\">\n\t\t\t\t<span class=\"custom-fof-intro-line custom-fof-intro-line-1\">\n\t\t\t\t\tKwaliteit inkopen.\n\t\t\t\t<\/span>\n\t\t\t\t<span class=\"custom-fof-intro-line custom-fof-intro-line-2\">\n\t\t\t\t\tBetrouwbaar leveren.\n\t\t\t\t<\/span>\n\t\t\t\t<span class=\"custom-fof-intro-line custom-fof-intro-line-3\">\n\t\t\t\t\tWaarde cre\u00ebren.\n\t\t\t\t<\/span>\n\t\t\t<\/div>\n\n\t\t<\/div>\n\n\t<\/div>\n\n\n\n\t<!--\n\t\tORIGINEEL FIETS-O-FIT LOGO\n\t\tWordt onzichtbaar gebruikt als bron voor het canvas.\n\t-->\n\t<svg\n\t\tclass=\"custom-fof-logo-source\"\n\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\"\n\t\tviewBox=\"0 0 395.52 97.25\"\n\t\taria-hidden=\"true\"\n\t>\n\t\t<defs>\n\n\t\t\t<linearGradient\n\t\t\t\tid=\"custom-fof-green-gradient-1\"\n\t\t\t\tx1=\"192.06\"\n\t\t\t\ty1=\"49.14\"\n\t\t\t\tx2=\"215.15\"\n\t\t\t\ty2=\"49.14\"\n\t\t\t\tgradientUnits=\"userSpaceOnUse\"\n\t\t\t>\n\t\t\t\t<stop offset=\"0\" stop-color=\"#62bf63\"\/>\n\t\t\t\t<stop offset=\"1\" stop-color=\"#70bf4c\"\/>\n\t\t\t<\/linearGradient>\n\n\t\t\t<radialGradient\n\t\t\t\tid=\"custom-fof-green-gradient-2\"\n\t\t\t\tcx=\"315.48\"\n\t\t\t\tcy=\"381.24\"\n\t\t\t\tr=\"40.76\"\n\t\t\t\tgradientTransform=\"translate(13.07 -383.91) rotate(10.77)\"\n\t\t\t\tgradientUnits=\"userSpaceOnUse\"\n\t\t\t>\n\t\t\t\t<stop offset=\"0\" stop-color=\"#e8f552\"\/>\n\t\t\t\t<stop offset=\".18\" stop-color=\"#dff151\"\/>\n\t\t\t\t<stop offset=\".33\" stop-color=\"#d3ec50\"\/>\n\t\t\t\t<stop offset=\".49\" stop-color=\"#bfe54f\"\/>\n\t\t\t\t<stop offset=\".65\" stop-color=\"#a4da4d\"\/>\n\t\t\t\t<stop offset=\".8\" stop-color=\"#80cd4b\"\/>\n\t\t\t\t<stop offset=\".95\" stop-color=\"#55bc48\"\/>\n\t\t\t\t<stop offset=\"1\" stop-color=\"#47b748\"\/>\n\t\t\t<\/radialGradient>\n\n\t\t<\/defs>\n\n\n\t\t<!-- GROENE DELEN -->\n\n\t\t<polygon\n\t\t\tfill=\"#61bc4b\"\n\t\t\tpoints=\"290.76 43.13 302.23 43.13 300.69 55.16 289.08 55.16 290.76 43.13\"\n\t\t\/>\n\n\t\t<polygon\n\t\t\tfill=\"url(#custom-fof-green-gradient-1)\"\n\t\t\tpoints=\"192.06 43.13 215.15 43.13 211.93 55.16 206.61 55.16 204.52 49.98 194.25 43.9 195.14 44.53 192.06 43.13\"\n\t\t\/>\n\n\t\t<path\n\t\t\tfill=\"url(#custom-fof-green-gradient-2)\"\n\t\t\td=\"M211.91,53.67c5.65-29.7,24.51-50.81,54.92-45.03,17.26,3.28,28.81,15.46,24.75,36.83-5.65,29.7-24.51,50.81-54.92,45.03-17.26-3.28-28.81-15.46-24.75-36.83h0ZM270.76,41.03c1.94-10.21-1.44-16.09-9.31-17.59-11.86-2.26-24,9.79-28.74,34.68-1.94,10.21,1.44,16.09,9.31,17.59,11.86,2.26,24-9.79,28.74-34.68Z\"\n\t\t\/>\n\n\n\t\t<!-- FI -->\n\n\t\t<path\n\t\t\tfill=\"#646466\"\n\t\t\td=\"M6.5,86c5.1,0,7.8-2.3,9.1-8.9l8.7-44.7h-4.6c-3.6,0-4.9-1.6-4.4-4.5l.1-.6c.6-3.1,2.5-4.3,6.1-4.3h4.7l.4-2.5C28.7,7.3,37.3.7,50.8.7h1c4.1,0,6.5,1.9,5.8,5.3l-.2,1.1c-.6,2.8-2.4,3.8-4.8,3.8h-1.1c-6.6,0-10.4,3.2-11.7,10l-.4,2.1h26.4c3.7,0,5.3,1.4,5.3,4.4,0,.6-.1,1.2-.2,2l-7.8,39.9c-.9,4.7-3,6.5-7.5,6.5h-.6c-3.6,0-5.3-1.5-5.3-4.6,0-.7.1-1.3.3-2.1l7.1-36.7h-19.6l-8.7,45c-2.6,13.1-8.8,18.8-19.8,18.8-1.2,0-2.2,0-3.8-.2-3.4-.4-5.2-1.8-5.2-4.1,0-.4.1-1.3.3-2.3.5-2.6,2.6-3.6,5-3.6h1.2ZM66.1,13.6c-3.5,0-5.2-1.4-5.2-4.3,0-.6.1-1.5.4-3.1.9-4.4,3-6.2,7.3-6.2h2.7c3.4,0,5.1,1.4,5.1,4.2,0,.6-.1,1.6-.4,3.2-.9,4.4-2.9,6.2-7.2,6.2h-2.7Z\"\n\t\t\/>\n\n\n\t\t<!-- E -->\n\n\t\t<path\n\t\t\tfill=\"#6c6c6e\"\n\t\t\td=\"M92.8,55.8c0,6.5,3.3,10.3,11.5,10.3,3.4,0,5.4-.6,8.2-1.7,4.6-1.8,6.5,0,6.5,2.4,0,.5-.1,1.3-.3,2.3-.6,2.9-2.1,4.5-6.4,5.8-3,.8-7,1.3-10.3,1.3-14.6,0-22.6-7.8-22.6-21.6,0-17.6,11.7-32.6,30.3-32.6,10.8,0,17,5,17,13.6,0,10-8.3,16.2-25.5,17.8l-8.4.9v1.5h0ZM99.1,45.5c10.7-1,15.3-4.1,15.3-9.2,0-3.5-2.4-5.5-6.3-5.5-7,0-12.5,5.9-14.5,15.2l5.5-.5Z\"\n\t\t\/>\n\n\n\t\t<!-- T -->\n\n\t\t<path\n\t\t\tfill=\"#737476\"\n\t\t\td=\"M142.6,32.4h-4.9c-2.9,0-4.2-1.3-4.2-3.3,0-.5.1-1.3.2-1.8.7-3.6,2.5-4.3,5.8-4.3h4.9l1.7-8.7c.9-4.7,3-6.5,7.5-6.5h.5c3.6,0,5.3,1.5,5.3,4.6,0,.6-.2,1.6-.3,2.1l-1.6,8.5h8.1c2.9,0,4.1,1.3,4.1,3.2,0,.5-.1,1.4-.2,1.9-.7,3.5-2.4,4.3-5.7,4.3h-8.2l-4.7,24.4c-.3,1.7-.5,2.5-.5,3.4,0,4.1,2.3,5.6,6.7,5.6h1c2.6-.1,4,1.3,3.4,4.4l-.2,1.2c-.5,2.7-3,4.1-6.6,4.6-.9.1-2.1.2-3,.2-9.5,0-14.6-4.4-14.6-12.9,0-1.6.2-3.5.7-6.1,0,0,4.8-24.8,4.8-24.8Z\"\n\t\t\/>\n\n\n\t\t<!-- S -->\n\n\t\t<path\n\t\t\tfill=\"#7b7c7e\"\n\t\t\td=\"M169.4,67.7c.7-3.3,3.9-4,8.9-2.4,1.4.5,3.8,1,6.7,1,6.9,0,9.8-2.8,9.8-6.8,0-2.6-1.4-4.1-5.2-5.6l-6-2.4c-5.4-2.2-8.7-6.5-8.7-12.4,0-9.6,8.9-17.1,23.3-17.1,2.7,0,5.2.2,7.1.7,4.2,1,6.3,2.9,6.4,5.6,0,.5-.1,1.2-.3,2.2-.6,2.8-3.9,3.9-7.9,2.3-1.9-.7-3.9-1.1-6.2-1.1-6.1,0-9.1,2.7-9.1,6.2,0,2.5,1.3,4.1,4.9,5.6l6,2.3c5.6,2.2,9.1,6.3,9.1,12.7,0,10.6-9.5,17.7-23.7,17.7-3.8,0-7.4-.6-8.9-1-4.2-1.1-6.4-2.8-6.4-5.6,0-.4,0-.9.2-1.9h0Z\"\n\t\t\/>\n\n\n\t\t<!-- FI -->\n\n\t\t<path\n\t\t\tfill=\"#666769\"\n\t\t\td=\"M286.52,87.05c5.1,0,7.8-2.3,9.1-8.9l8.7-44.7h-4.6c-3.6,0-4.9-1.6-4.4-4.5l.1-.6c.6-3.1,2.5-4.3,6.1-4.3h4.7l.4-2.5c2.1-13.2,10.7-19.8,24.2-19.8h1c4.1,0,6.5,1.9,5.8,5.3l-.2,1.1c-.6,2.8-2.4,3.8-4.8,3.8h-1.1c-6.6,0-10.4,3.2-11.7,10l-.4,2.1h26.4c3.7,0,5.3,1.4,5.3,4.4,0,.6-.1,1.2-.2,2l-7.8,39.9c-.9,4.7-3,6.5-7.5,6.5h-.6c-3.6,0-5.3-1.5-5.3-4.6,0-.7.1-1.3.3-2.1l7.1-36.7h-19.6l-8.7,45c-2.6,13.1-8.8,18.8-19.8,18.8-1.2,0-2.2,0-3.8-.2-3.4-.4-5.2-1.8-5.2-4.1,0-.4.1-1.3.3-2.3.5-2.6,2.6-3.6,5-3.6h1.2ZM346.13,14.65c-3.5,0-5.2-1.4-5.2-4.3,0-.6.1-1.5.4-3.1.9-4.4,3-6.2,7.3-6.2h2.7c3.4,0,5.1,1.4,5.1,4.2,0,.6-.1,1.6-.4,3.2-.9,4.4-2.9,6.2-7.2,6.2h-2.7,0Z\"\n\t\t\/>\n\n\n\t\t<!-- T -->\n\n\t\t<path\n\t\t\tfill=\"#5f5f61\"\n\t\t\td=\"M368.42,33.45h-4.9c-2.9,0-4.2-1.3-4.2-3.3,0-.5.1-1.3.2-1.8.7-3.6,2.5-4.3,5.8-4.3h4.9l1.7-8.7c.9-4.7,3-6.5,7.5-6.5h.5c3.6,0,5.3,1.5,5.3,4.6,0,.6-.2,1.6-.3,2.1l-1.6,8.5h8.1c2.9,0,4.1,1.3,4.1,3.2,0,.5-.1,1.4-.2,1.9-.7,3.5-2.4,4.3-5.7,4.3h-8.2l-4.7,24.4c-.3,1.7-.5,2.5-.5,3.4,0,4.1,2.3,5.6,6.7,5.6h1c2.6-.1,4,1.3,3.4,4.4l-.2,1.2c-.5,2.7-3,4.1-6.6,4.6-.9.1-2.1.2-3,.2-9.5,0-14.6-4.4-14.6-12.9,0-1.6.2-3.5.7-6.1l4.8-24.8h0Z\"\n\t\t\/>\n\n\t<\/svg>\n\n\n\t<!--\n\t\tRESULTAAT VAN DE SPRAY\n\t-->\n\t<canvas class=\"custom-fof-spray-result\"><\/canvas>\n\n\t<!--\n\t\tV5.1:\n\t\tKorte donkere\/natte verflaag bovenop het verse deel.\n\t-->\n\t<canvas class=\"custom-fof-spray-wet\"><\/canvas>\n\n\n\t<!--\n\t\tSPRAY DEELTJES BUITEN HET LOGO\n\t-->\n\t<canvas class=\"custom-fof-spray-particles\"><\/canvas>\n\n\n\t<!--\n\t\tV4.6\n\t\tARM-STAGE:\n\t\tde arm blijft onderaan verankerd en zwaait vanuit de onderrand.\n\t\tDaardoor komt de afgesneden onderkant nooit midden in beeld.\n\t-->\n\t<div class=\"custom-fof-spray-arm-stage\">\n\n\t\t<div class=\"custom-fof-spray-can\">\n\n\t\t\t<img\n\t\t\t\tclass=\"custom-fof-spray-can-image\"\n\t\t\t\tsrc=\"https:\/\/fiets-o-fit.nl\/wp-content\/uploads\/2026\/08\/Arm-spectrum-spuitbus.webp\"\n\t\t\t\talt=\"\"\n\t\t\t\taria-hidden=\"true\"\n\t\t\t>\n\n\t\t<\/div>\n\n\t<\/div>\n\n\n\t<!-- SPRAYNEVEL BIJ NOZZLE -->\n\t<div class=\"custom-fof-spray-mist\"><\/div>\n\n\n\t<!-- REPLAY -->\n\t<button\n\t\tclass=\"custom-fof-spray-replay\"\n\t\ttype=\"button\"\n\t>\n\t\tOpnieuw\n\t<\/button>\n\n<\/section>\n\n\n<style>\n\n\/* =========================================================\n   BASIS\n========================================================= *\/\n\n.custom-fof-spray-logo {\n\n\tposition: relative;\n\n\twidth: 100%;\n\n\theight: 100vh;\n\theight: 100svh;\n\n\tmin-height: 650px;\n\n\toverflow: hidden;\n\n\tbackground:\n\t\tradial-gradient(\n\t\t\tellipse at 50% 43%,\n\t\t\t#ffffff 0%,\n\t\t\t#f8fbfb 40%,\n\t\t\t#f0f4f4 72%,\n\t\t\t#e9eeee 100%\n\t\t);\n\n\tisolation: isolate;\n\n}\n\n\n\/*\n * V5.2 \u2014 subtiele moderne oppervlaktestructuur.\n * Niet als \"effect\" zichtbaar, wel genoeg om de achtergrond\n * minder vlak en demo-achtig te maken.\n *\/\n.custom-fof-spray-logo::before {\n\n\tcontent: \"\";\n\n\tposition: absolute;\n\tinset: 0;\n\n\tz-index: 0;\n\n\tpointer-events: none;\n\n\topacity: .018;\n\n\tbackground-image:\n\t\tradial-gradient(\n\t\t\trgba(0,0,0,.16) .45px,\n\t\t\ttransparent .45px\n\t\t);\n\n\tbackground-size:\n\t\t4px 4px;\n\n}\n\n\n\/*\n * Zachte vignette\/ruimtewerking.\n *\/\n.custom-fof-spray-logo::after {\n\n\tcontent: \"\";\n\n\tposition: absolute;\n\tinset: 0;\n\n\tz-index: 0;\n\n\tpointer-events: none;\n\n\tbackground:\n\t\tlinear-gradient(\n\t\t\tto bottom,\n\t\t\trgba(255,255,255,.10) 0%,\n\t\t\trgba(255,255,255,0) 35%,\n\t\t\trgba(0,0,0,.010) 100%\n\t\t);\n\n}\n\n\n\/*\n * V5.2.12\n * Tijdens de openingsintro de hele pagina locken.\n * Daardoor zie je bij reload op een scrolpositie\n * niet ineens een lager paginadeel achter de intro.\n *\/\nhtml.custom-fof-intro-lock,\nbody.custom-fof-intro-lock {\n\n\toverflow: hidden !important;\n\theight: 100%;\n\n}\n\n\nbody.custom-fof-intro-lock {\n\n\ttouch-action: none;\n\n}\n\n\n\/*\n * V5.2.24\n * De groene fullscreen intro en de hero-animatielaag zijn nu\n * volledig van elkaar losgekoppeld.\n *\n * Tijdens het groene openingsscherm blijft de complete\n * spray\/logo-laag verborgen. Pas nadat reset() de exacte\n * startpose van de arm heeft berekend, krijgt de hero\n * custom-fof-animation-ready.\n *\n * Daardoor kan er tussen groen en de echte start geen oud,\n * half getekend of voortijdig logo-frame meer verschijnen.\n *\n * Niet alleen de groene intro, maar ook de animatielaag zelf\n * standaard v\u00f3\u00f3r de eerste paint verbergen.\n *\n * Daardoor kan bij terugnavigeren nooit heel kort het\n * Fiets-O-Fit animatielogo of de arm\/canvas zichtbaar worden.\n *\/\n.custom-fof-spray-logo:not(.custom-fof-animation-ready)\n.custom-fof-logo-stage,\n.custom-fof-spray-logo:not(.custom-fof-animation-ready)\n.custom-fof-spray-can,\n.custom-fof-spray-logo:not(.custom-fof-animation-ready)\ncanvas {\n\n\tvisibility: hidden !important;\n\topacity: 0 !important;\n\n}\n\n\n\/*\n * Zodra JavaScript de juiste toestand heeft bepaald,\n * mogen de animatielagen worden weergegeven.\n *\/\n.custom-fof-spray-logo.custom-fof-animation-ready\n.custom-fof-logo-stage,\n.custom-fof-spray-logo.custom-fof-animation-ready\ncanvas {\n\n\tvisibility: visible;\n\n}\n\n\n\/*\n * De arm behoudt zijn bestaande eigen opacity-logica.\n * We geven alleen visibility terug zodra init klaar is.\n *\/\n.custom-fof-spray-logo.custom-fof-animation-ready\n.custom-fof-spray-can {\n\n\tvisibility: visible;\n\n}\n\n\n\/*\n * V5.2.27 \u2014 COMPLIANZ ROBUUST VERBERGEN TOT EINDE ANIMATIE\n *\n * De banner kan door Complianz pas later dynamisch aan de DOM worden\n * toegevoegd. Daarom gebruiken we naast CSS ook JavaScript hieronder.\n *\/\nhtml.fof-animation-running #cmplz-cookiebanner-container,\nhtml.fof-animation-running .cmplz-cookiebanner-container,\nhtml.fof-animation-running .cmplz-cookiebanner,\nhtml.fof-animation-running .cmplz-manage-consent {\n\n\tvisibility: hidden !important;\n\topacity: 0 !important;\n\tpointer-events: none !important;\n\n}\n\n\n\/*\n * Zodra de animatie klaar is mag Complianz weer normaal verschijnen.\n *\/\nhtml.fof-animation-complete #cmplz-cookiebanner-container,\nhtml.fof-animation-complete .cmplz-cookiebanner-container,\nhtml.fof-animation-complete .cmplz-cookiebanner,\nhtml.fof-animation-complete .cmplz-manage-consent {\n\n\tvisibility: visible !important;\n\topacity: 1 !important;\n\tpointer-events: auto !important;\n\n\ttransition:\n\t\topacity .35s ease;\n\n}\n\n\n\/*\n * V5.2.35 \u2014 GEEN WITTE FLASH VOOR DE GROENE INTRO\n *\n * De HEAD-preflight zet deze class v\u00f3\u00f3r de eerste paint.\n * Daardoor is de browserachtergrond al groen nog voordat\n * de hero-markup en de fullscreen intro volledig zijn gerenderd.\n *\/\nhtml.custom-fof-first-intro,\nhtml.custom-fof-first-intro body {\n\n\tbackground:\n\t\t#34872D !important;\n\n}\n\n\n\/*\n * V5.2.36 \u2014 extra first-paint safeguard.\n * De HEAD-preflight bepaalt v\u00f3\u00f3r de eerste paint of de homepage\n * groen moet starten. Deze CSS in de hero is alleen een fallback.\n *\/\nhtml.custom-fof-first-intro,\nhtml.custom-fof-first-intro body {\n\tbackground: #34872D !important;\n}\n\n\n\/* =========================================================\n   V5.2 \u2014 GROENE INTRO\n========================================================= *\/\n\n.custom-fof-intro {\n\n\tposition: fixed;\n\n\t\/*\n\t * V5.2.21:\n\t * standaard al v\u00f3\u00f3r de eerste paint verborgen.\n\t * Zo kan bij terugnavigeren nooit \u00e9\u00e9n groen frame lekken.\n\t *\/\n\tvisibility: hidden;\n\topacity: 0;\n\n\tleft: 0;\n\ttop: 0;\n\n\twidth: 100vw;\n\theight: 100vh;\n\theight: 100dvh;\n\n\tz-index: 999999;\n\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\n\toverflow: hidden;\n\n\tbackground:\n\t\tlinear-gradient(\n\t\t\t135deg,\n\t\t\t#34872D 0%,\n\t\t\t#469C37 48%,\n\t\t\t#59B849 100%\n\t\t);\n\n\ttransform:\n\t\ttranslateY(0);\n\n\twill-change:\n\t\ttransform;\n\n}\n\n\n.custom-fof-intro-preflight\n.custom-fof-intro {\n\n\tvisibility: visible;\n\topacity: 1;\n\n}\n\n\n\/*\n * Grote zachte groen-lichtvorm voor meer diepte.\n *\/\n.custom-fof-intro::before {\n\n\tcontent: \"\";\n\n\tposition: absolute;\n\n\twidth: min(70vw, 1100px);\n\taspect-ratio: 1 \/ 1;\n\n\tleft: 50%;\n\ttop: 44%;\n\n\ttransform:\n\t\ttranslate(-50%, -50%);\n\n\tborder-radius: 50%;\n\n\tbackground:\n\t\tradial-gradient(\n\t\t\tcircle,\n\t\t\trgba(255,255,255,.15) 0%,\n\t\t\trgba(255,255,255,.05) 42%,\n\t\t\trgba(255,255,255,0) 72%\n\t\t);\n\n}\n\n\n\/*\n * Heel subtiele korrel op het groene openingsvlak.\n *\/\n.custom-fof-intro::after {\n\n\tcontent: \"\";\n\n\tposition: absolute;\n\tinset: 0;\n\n\topacity: .12;\n\n\tbackground-image:\n\t\tradial-gradient(\n\t\t\trgba(0,0,0,.12) .45px,\n\t\t\ttransparent .45px\n\t\t);\n\n\tbackground-size:\n\t\t4px 4px;\n\n}\n\n\n.custom-fof-intro-inner {\n\n\tposition: relative;\n\n\tz-index: 2;\n\n\ttext-align: center;\n\n\tcolor: #fff;\n\n\ttransform:\n\t\ttranslateY(14px);\n\n\topacity: 0;\n\n\twill-change:\n\t\ttransform,\n\t\topacity;\n\n}\n\n\n.custom-fof-intro-kicker {\n\n\tmargin-bottom: 10px;\n\n\tfont-family:\n\t\tArial,\n\t\tsans-serif;\n\n\tfont-size:\n\t\tclamp(12px, .9vw, 16px);\n\n\tfont-weight: 700;\n\n\tletter-spacing:\n\t\t.22em;\n\n\ttext-transform:\n\t\tuppercase;\n\n\topacity: .76;\n\n}\n\n\n.custom-fof-intro-title {\n\n\tfont-family:\n\t\tArial,\n\t\tsans-serif;\n\n\tfont-size:\n\t\tclamp(28px, 4.8vw, 68px);\n\n\tfont-weight: 800;\n\n\tline-height: 1.02;\n\n\tletter-spacing:\n\t\t-.03em;\n\n\tmax-width:\n\t\tmin(1100px, 84vw);\n\n\tmargin:\n\t\t0 auto;\n\n}\n\n.custom-fof-intro-line {\n\n\tdisplay: block;\n\n\topacity: 0;\n\n\ttransform:\n\t\ttranslateY(18px);\n\n\twill-change:\n\t\topacity,\n\t\ttransform;\n\n}\n\n\n.custom-fof-intro-line-2,\n.custom-fof-intro-line-3 {\n\n\tmargin-top: .16em;\n\n}\n\n\n.custom-fof-spray-logo.is-intro-line1\n.custom-fof-intro-line-1 {\n\n\topacity: 1;\n\n\ttransform:\n\t\ttranslateY(0);\n\n\ttransition:\n\t\topacity .48s ease,\n\t\ttransform .62s cubic-bezier(.22,1,.36,1);\n\n}\n\n\n.custom-fof-spray-logo.is-intro-line2\n.custom-fof-intro-line-2 {\n\n\topacity: 1;\n\n\ttransform:\n\t\ttranslateY(0);\n\n\ttransition:\n\t\topacity .48s ease,\n\t\ttransform .62s cubic-bezier(.22,1,.36,1);\n\n}\n\n.custom-fof-spray-logo.is-intro-line3\n.custom-fof-intro-line-3 {\n\n\topacity: 1;\n\n\ttransform:\n\t\ttranslateY(0);\n\n\ttransition:\n\t\topacity .48s ease,\n\t\ttransform .62s cubic-bezier(.22,1,.36,1);\n\n}\n\n\n\n\/*\n * Intro tekst verschijnt.\n *\/\n.custom-fof-spray-logo.is-intro-text\n.custom-fof-intro-inner {\n\n\topacity: 1;\n\n\ttransform:\n\t\ttranslateY(0);\n\n\ttransition:\n\t\topacity .42s ease,\n\t\ttransform .54s\n\t\tcubic-bezier(.22,1,.36,1);\n\n}\n\n\n\/*\n * Groene laag schuift omhoog weg.\n *\/\n.custom-fof-spray-logo.is-intro-wipe\n.custom-fof-intro {\n\n\ttransform:\n\t\ttranslate3d(0,-100%,0);\n\n\ttransition:\n\t\ttransform .72s\n\t\tcubic-bezier(.76,0,.24,1);\n\n}\n\n\n\n.custom-fof-spray-logo:not(.is-intro-done)\n.custom-fof-intro {\n\n\toverscroll-behavior: none;\n\n}\n\n\/*\n * Na de intro niet meer interactief\/render-intensief.\n *\/\n.custom-fof-spray-logo.is-intro-done\n.custom-fof-intro {\n\n\tvisibility: hidden;\n\n}\n\n\n\n\/* =========================================================\n   BRON SVG\n\n   Buiten beeld, maar nog wel beschikbaar voor JS.\n========================================================= *\/\n\n.custom-fof-logo-source {\n\n\tposition: absolute;\n\n\tleft: -99999px;\n\ttop: -99999px;\n\n\twidth: 395.52px;\n\theight: 97.25px;\n\n\tvisibility: hidden;\n\n}\n\n\n\/* =========================================================\n   CANVAS\n========================================================= *\/\n\n.custom-fof-spray-result,\n.custom-fof-spray-wet,\n.custom-fof-spray-particles {\n\n\tposition: absolute;\n\n\tinset: 0;\n\n\twidth: 100%;\n\theight: 100%;\n\n\tpointer-events: none;\n\n}\n\n\n.custom-fof-spray-result {\n\n\tz-index: 2;\n\n}\n\n\n.custom-fof-spray-wet {\n\n\tz-index: 2;\n\n\tmix-blend-mode: multiply;\n\n\topacity: .55;\n\n\ttransition:\n\t\topacity .45s ease;\n\n}\n\n\n.custom-fof-spray-particles {\n\n\tz-index: 3;\n\n}\n\n\n\/* =========================================================\n   V4.6 \u2014 ARM VERANKERD ONDERAAN\n========================================================= *\/\n\n\/*\n * Volledig bewegingsvlak.\n * De hero zelf heeft al overflow:hidden, maar deze stage zorgt\n * ervoor dat de arm als \u00e9\u00e9n gecontroleerd object behandeld wordt.\n *\/\n.custom-fof-spray-arm-stage {\n\n\tposition: absolute;\n\n\tinset: 0;\n\n\tz-index: 6;\n\n\toverflow: hidden;\n\n\tpointer-events: none;\n\n}\n\n\n\/*\n * Deze wrapper is GEEN afbeelding-box.\n * Het nulpunt van deze wrapper is het \"scharnierpunt\" van de arm:\n * net buiten de linker-\/onderrand van het scherm.\n *\n * JS roteert en schaalt de hele arm rond dit vaste punt.\n *\/\n.custom-fof-spray-can {\n\n\tposition: absolute;\n\n\tleft: 0;\n\ttop: 0;\n\n\twidth: 0;\n\theight: 0;\n\n\tpointer-events: none;\n\n\ttransform-origin: 0 0;\n\n\twill-change:\n\t\ttransform,\n\t\topacity;\n\n\t\/*\n\t * V5.2.2:\n\t * arm blijft volledig verborgen totdat JS de exacte\n\t * beginpositie bij de F van FIETS heeft berekend.\n\t *\/\n\topacity: 0;\n\n}\n\n\n\/*\n * Langere transparante arm + Spectrum-bus.\n *\n * BELANGRIJK:\n * gebruik bij voorkeur een PNG\/WebP waarbij de mouw ver genoeg\n * naar linksonder doorloopt. Het uiteinde blijft door de nieuwe\n * beweging buiten de viewport.\n *\/\n.custom-fof-spray-can-image {\n\n\tposition: absolute;\n\n\tleft: 0;\n\ttop: 0;\n\n\tdisplay: block;\n\n\twidth: clamp(680px, 58vw, 980px);\n\theight: auto;\n\n\tmax-width: none;\n\n\tuser-select: none;\n\tpointer-events: none;\n\n\t-webkit-user-drag: none;\n\n\twill-change: transform;\n\n}\n\n.custom-fof-spray-can-image {\n\n\tfilter:\n\t\tdrop-shadow(\n\t\t\t0 18px 24px\n\t\t\trgba(0,0,0,.10)\n\t\t);\n\n\ttransition:\n\t\tfilter .35s ease;\n\n}\n\n\n.custom-fof-spray-logo.is-finishing\n.custom-fof-spray-wet {\n\n\topacity: 0;\n\n}\n\n\n.custom-fof-spray-logo.is-finished\n.custom-fof-spray-can-image {\n\n\tfilter:\n\t\tdrop-shadow(\n\t\t\t0 10px 16px\n\t\t\trgba(0,0,0,.06)\n\t\t);\n\n}\n\n\n\n\/*\n * Mobiel iets compacter.\n *\/\n@media (max-width: 767px) {\n\n\t.custom-fof-spray-can-image {\n\n\t\t\/*\n\t\t * Op mobiel mag de arm groter zijn dan de viewport.\n\t\t * De stage snijdt alleen het deel buiten het scherm af,\n\t\t * terwijl de mouw onderaan verborgen blijft.\n\t\t *\/\n\t\twidth: clamp(360px, 98vw, 500px);\n\n\t}\n\n}\n\n\n\/* =========================================================\n   MIST\n========================================================= *\/\n\n.custom-fof-spray-mist {\n\n\tposition: absolute;\n\n\twidth: 110px;\n\theight: 110px;\n\n\tz-index: 5;\n\n\tpointer-events: none;\n\n\topacity: 0;\n\n\ttransform:\n\t\ttranslate(-50%, -50%);\n\n\ttransform-origin:\n\t\tcenter center;\n\n\tfilter: blur(9px);\n\n\tbackground:\n\t\tradial-gradient(\n\t\t\tcircle at center,\n\t\t\trgba(90,90,90,.22) 0%,\n\t\t\trgba(90,90,90,.12) 24%,\n\t\t\trgba(90,90,90,.05) 48%,\n\t\t\trgba(90,90,90,0) 78%\n\t\t);\n\n\twill-change:\n\t\tleft,\n\t\ttop,\n\t\topacity,\n\t\ttransform;\n\n}\n\n\n\/* =========================================================\n   REPLAY\n========================================================= *\/\n\n.custom-fof-spray-replay {\n\n\tposition: absolute;\n\n\tright: 30px;\n\tbottom: 30px;\n\n\tz-index: 20;\n\n\tpadding:\n\t\t12px 19px;\n\n\tborder: 0;\n\n\tborder-radius: 100px;\n\n\tbackground: #111;\n\n\tcolor: #fff;\n\n\tfont: inherit;\n\n\tfont-size: 13px;\n\n\tcursor: pointer;\n\n\topacity: 0;\n\n\ttransform:\n\t\ttranslateY(10px);\n\n\ttransition:\n\t\topacity .35s ease,\n\t\ttransform .35s ease;\n\n}\n\n\n.custom-fof-spray-logo.is-finished\n.custom-fof-spray-replay {\n\n\topacity: 1;\n\n\ttransform:\n\t\ttranslateY(0);\n\n}\n\n\n\/* =========================================================\n   V5.0 \u2014 MOBIEL\n========================================================= *\/\n\n@media (max-width: 767px) {\n\n\t.custom-fof-intro-inner {\n\n\t\tpadding:\n\t\t\t0 24px;\n\n\t}\n\n\n\t.custom-fof-intro-title {\n\n\t\tfont-size:\n\t\t\tclamp(24px, 7.6vw, 42px);\n\n\t}\n\n\t.custom-fof-intro-line-2,\n\t.custom-fof-intro-line-3 {\n\n\t\tmargin-top: .22em;\n\n\t}\n\n\n\t.custom-fof-intro-kicker {\n\n\t\tfont-size:\n\t\t\t11px;\n\n\t\tletter-spacing:\n\t\t\t.18em;\n\n\t}\n\n\n\t.custom-fof-spray-logo {\n\n\t\theight: 100svh;\n\t\tmin-height: 540px;\n\n\t}\n\n\n\t.custom-fof-spray-mist {\n\n\t\twidth: 82px;\n\t\theight: 82px;\n\n\t\tfilter: blur(7px);\n\n\t}\n\n\n\t.custom-fof-spray-replay {\n\n\t\tright: 16px;\n\t\tbottom: 16px;\n\n\t\tpadding: 10px 16px;\n\n\t\tfont-size: 12px;\n\n\t}\n\n}\n\n\n\/*\n * Kleine telefoons.\n *\/\n@media (max-width: 480px) {\n\n\t.custom-fof-spray-logo {\n\n\t\tmin-height: 520px;\n\n\t}\n\n\n\t.custom-fof-spray-can-image {\n\n\t\twidth: clamp(340px, 94vw, 460px);\n\n\t}\n\n}\n\n\n\/*\n * Mobiel liggend:\n * minder grote arm zodat de hand niet het hele logo bedekt.\n *\/\n@media (\n\tmax-width: 900px\n)\nand (\n\torientation: landscape\n)\nand (\n\tmax-height: 600px\n) {\n\n\t.custom-fof-spray-logo {\n\n\t\theight: 100svh;\n\t\tmin-height: 420px;\n\n\t}\n\n\n\t.custom-fof-spray-can-image {\n\n\t\twidth: clamp(420px, 67vw, 590px);\n\n\t}\n\n\n\t.custom-fof-spray-replay {\n\n\t\tright: 14px;\n\t\tbottom: 14px;\n\n\t}\n\n}\n\n\n\/*\n * Reduced motion:\n * JS toont direct het eindresultaat.\n *\/\n@media (prefers-reduced-motion: reduce) {\n\n\t.custom-fof-spray-can,\n\t.custom-fof-spray-mist {\n\n\t\tdisplay: none !important;\n\n\t}\n\n}\n\n<\/style>\n\n\n<script>\n\n(function () {\n\n\t'use strict';\n\n\n\t\/* =====================================================\n\t   ELEMENTEN\n\t===================================================== *\/\n\n\tconst hero =\n\t\tdocument.querySelector(\n\t\t\t'.custom-fof-spray-logo'\n\t\t);\n\n\tif (!hero) return;\n\n\n\tconst intro =\n\t\thero.querySelector(\n\t\t\t'.custom-fof-intro'\n\t\t);\n\n\n\tconst sourceSvg =\n\t\thero.querySelector(\n\t\t\t'.custom-fof-logo-source'\n\t\t);\n\n\n\tconst resultCanvas =\n\t\thero.querySelector(\n\t\t\t'.custom-fof-spray-result'\n\t\t);\n\n\n\tconst wetCanvas =\n\t\thero.querySelector(\n\t\t\t'.custom-fof-spray-wet'\n\t\t);\n\n\n\tconst particleCanvas =\n\t\thero.querySelector(\n\t\t\t'.custom-fof-spray-particles'\n\t\t);\n\n\n\tconst resultCtx =\n\t\tresultCanvas.getContext('2d');\n\n\n\tconst wetCtx =\n\t\twetCanvas.getContext('2d');\n\n\n\tconst particleCtx =\n\t\tparticleCanvas.getContext('2d');\n\n\n\tconst sprayCan =\n\t\thero.querySelector(\n\t\t\t'.custom-fof-spray-can'\n\t\t);\n\n\n\tconst sprayCanImage =\n\t\thero.querySelector(\n\t\t\t'.custom-fof-spray-can-image'\n\t\t);\n\n\n\tconst mist =\n\t\thero.querySelector(\n\t\t\t'.custom-fof-spray-mist'\n\t\t);\n\n\n\tconst replay =\n\t\thero.querySelector(\n\t\t\t'.custom-fof-spray-replay'\n\t\t);\n\n\n\t\/* =====================================================\n\t   INSTELLINGEN\n\t===================================================== *\/\n\n\tconst SETTINGS = {\n\n\t\t\/* =================================================\n\t\t   LOGO\n\t\t================================================= *\/\n\n\t\tlogoWidthDesktop: 1050,\n\n\t\tlogoMobileWidth: 0.93,\n\n\t\t\/*\n\t\t * Op mobiel iets hoger in beeld.\n\t\t * Waarde is een fractie van de hero-hoogte.\n\t\t *\/\n\t\tlogoMobileCenterY: 0.43,\n\n\n\t\t\/* =================================================\n\t\t   TIMING\n\t\t================================================= *\/\n\n\t\tdurationDesktop: 6200,\n\t\tdurationMobile: 6200,\n\n\t\t\/*\n\t\t * FIETS \u2192 O \u2192 FIT.\n\t\t * Grotere multiplier = meer tijd voor dat onderdeel.\n\t\t *\/\n\t\tgroupTime: {\n\t\t\tfiets: 0.88,\n\t\t\to: 0.96,\n\t\t\tfit: 0.89\n\t\t},\n\n\n\t\t\/* =================================================\n\t\t   SPRAY \u2014 DESKTOP\n\t\t================================================= *\/\n\n\t\tsprayRadiusDesktop: 44,\n\t\tcoreParticlesDesktop: 28,\n\t\tsoftParticlesDesktop: 10,\n\t\toversprayParticlesDesktop: 3,\n\n\n\t\t\/* =================================================\n\t\t   SPRAY \u2014 MOBIEL\n\t\t   Minder canvaswerk = hogere framerate.\n\t\t================================================= *\/\n\n\t\tsprayRadiusMobile: 36,\n\t\tcoreParticlesMobile: 17,\n\t\tsoftParticlesMobile: 5,\n\t\toversprayParticlesMobile: 1,\n\n\t\t\/*\n\t\t * V5.0.3 \u2014 subtielere zichtbare ruis buiten het logo.\n\t\t *\/\n\t\tsoftParticleOpacityMin: 0.012,\n\t\tsoftParticleOpacityMax: 0.038,\n\n\t\toversprayOpacityMin: 0.014,\n\t\toversprayOpacityMax: 0.045,\n\n\t\tsoftParticleSizeMin: 0.22,\n\t\tsoftParticleSizeMax: 0.95,\n\n\t\toverspraySizeMin: 0.28,\n\t\toverspraySizeMax: 0.82,\n\n\n\t\t\/* =================================================\n\t\t   NOZZLE\n\t\t================================================= *\/\n\n\t\tsprayDistanceDesktop: 92,\n\t\tsprayDistanceMobile: 54,\n\n\t\tnozzleYOffset: -2,\n\n\t\tbackNozzleLift: -10,\n\t\tbackNozzleForward: 0,\n\n\n\t\t\/* =================================================\n\t\t   VECTORPAD\n\t\t================================================= *\/\n\n\t\tsampleStepDesktop: 7,\n\t\tsampleStepMobile: 6,\n\n\t\ttracePassesDesktop: 2,\n\t\ttracePassesMobile: 2,\n\n\t\ttracePassOffsetDesktop: 7,\n\t\ttracePassOffsetMobile: 4,\n\n\t\tmoveGapWeight: 0.55,\n\n\t\tgroupPauseWeightDesktop: 56,\n\t\tgroupPauseWeightMobile: 46,\n\n\n\t\t\/* =================================================\n\t\t   ARM \u2014 BASIS\n\t\t================================================= *\/\n\n\t\tarmAnchorXDesktop: -0.07,\n\t\tarmAnchorYDesktop: 1.10,\n\n\t\t\/*\n\t\t * Op mobiel blijft meer van de mouw onder de viewport.\n\t\t *\/\n\t\tarmAnchorXMobile: -0.46,\n\t\tarmAnchorYMobile: 1.06,\n\n\t\t\/*\n\t\t * Punten binnen de PNG.\n\t\t *\/\n\t\tarmBaseX: 0.055,\n\t\tarmBaseY: 0.88,\n\n\t\tarmNozzleX: 0.865,\n\t\tarmNozzleY: 0.105,\n\n\n\t\t\/* =================================================\n\t\t   ARM \u2014 SCHAAL \/ ROTATIE\n\t\t================================================= *\/\n\n\t\tarmScaleMinDesktop: 0.72,\n\t\tarmScaleMaxDesktop: 1.06,\n\n\t\tarmScaleMinMobile: 0.56,\n\t\tarmScaleMaxMobile: 0.94,\n\n\t\tarmRotationMinDesktop: -24,\n\t\tarmRotationMaxDesktop: 22,\n\n\t\tarmRotationMinMobile: -19,\n\t\tarmRotationMaxMobile: 18,\n\n\n\t\t\/* =================================================\n\t\t   V5.0 \u2014 SMOOTHING\n\t\t   Lager = vloeiender \/ zachter.\n\t\t================================================= *\/\n\n\t\tarmFollowDesktop: 0.18,\n\t\tarmFollowMobile: 0.23,\n\n\t\tarmAnchorFollowDesktop: 0.16,\n\t\tarmAnchorFollowMobile: 0.27,\n\n\t\tarmScaleFollowDesktop: 0.14,\n\t\tarmScaleFollowMobile: 0.09,\n\n\t\tarmRotationFollowDesktop: 0.15,\n\t\tarmRotationFollowMobile: 0.15,\n\n\t\tarmWristFollowDesktop: 0.12,\n\t\tarmWristFollowMobile: 0.09,\n\n\n\t\t\/* =================================================\n\t\t   ARM \u2014 BEREIK\n\t\t================================================= *\/\n\n\t\tarmPreferredScaleDesktop: 0.95,\n\t\tarmPreferredScaleMobile: 0.79,\n\n\t\tarmAnchorMinXDesktop: -0.12,\n\t\tarmAnchorMaxXDesktop: 0.72,\n\n\t\tarmAnchorMinXMobile: -0.68,\n\t\tarmAnchorMaxXMobile: 0.28,\n\n\t\t\/*\n\t\t * V5.2.9:\n\t\t * Op mobiel koppelen we het onderste anker directer\n\t\t * aan de X-positie van de actieve letter.\n\t\t *\n\t\t * Hogere waarde = mouwbasis verder links van de nozzle.\n\t\t *\/\n\t\tarmMobileReachX: 0.72,\n\n\t\t\/*\n\t\t * V5.2.17 \u2014 verticale mobiele beweging.\n\t\t *\n\t\t * Tot nu toe stond het onderste arm-anker op mobiel\n\t\t * altijd op exact dezelfde Y-positie. Daardoor zag je\n\t\t * vooral horizontale beweging.\n\t\t *\n\t\t * Nu mag de hele arm subtiel omhoog\/omlaag meebewegen\n\t\t * met de actieve contour, terwijl de mouw nog steeds\n\t\t * onder de viewport blijft doorlopen.\n\t\t *\/\n\t\tarmMobileVerticalFollow: 0.42,\n\n\t\t\/*\n\t\t * Grenzen als fractie van de viewporthoogte.\n\t\t * 0.94 = arm-anker maximaal iets boven de onderrand.\n\t\t * 1.10 = arm-anker maximaal 10% onder de onderrand.\n\t\t *\/\n\t\tarmAnchorMinYMobile: 0.94,\n\t\tarmAnchorMaxYMobile: 1.10,\n\n\t\t\/*\n\t\t * Smoothing voor de verticale beweging.\n\t\t *\/\n\t\tarmVerticalFollowMobile: 0.22,\n\n\t\tarmReachSafety: 1.02,\n\n\n\t\t\/* =================================================\n\t\t   V5.1 \u2014 CINEMATISCHE REGIE\n\t\t================================================= *\/\n\n\t\t\/*\n\t\t * Entree: arm komt eerst rustig in beeld.\n\t\t *\/\n\t\tentranceDurationDesktop: 610,\n\t\tentranceDurationMobile: 560,\n\n\t\tentranceSettleDesktop: 70,\n\t\tentranceSettleMobile: 60,\n\n\t\t\/*\n\t\t * Korte spray-puff bij start van een actief spraydeel.\n\t\t *\/\n\t\tpuffParticlesDesktop: 28,\n\t\tpuffParticlesMobile: 16,\n\n\t\tpuffRadiusDesktop: 34,\n\t\tpuffRadiusMobile: 26,\n\n\t\t\/*\n\t\t * Natte verf:\n\t\t * tijdelijk donkerder bovenop net gespoten delen.\n\t\t *\/\n\t\twetOpacity: 0.18,\n\t\twetRadiusMultiplier: 0.62,\n\t\twetFadePerFrame: 0.016,\n\n\t\t\/*\n\t\t * Finale.\n\t\t *\/\n\t\tfinaleHold: 220,\n\t\tfinaleSharpDuration: 260,\n\t\tfinaleExitDuration: 900,\n\n\t\t\/*\n\t\t * V5.2.13 \u2014 na de spray-intro automatisch\n\t\t * de eerstvolgende Impreza\/WPBakery-rij omhoog schuiven.\n\t\t *\/\n\t\tautoAdvanceToNextRow: true,\n\n\t\t\/*\n\t\t * Even wachten tot de arm netjes is weggezakt.\n\t\t *\/\n\t\tautoAdvanceDelay: 650,\n\n\t\t\/*\n\t\t * Scrollanimatie in milliseconden.\n\t\t *\/\n\t\tautoAdvanceDuration: 950,\n\n\t\t\/*\n\t\t * V5.2.14 \u2014 sticky header correctie.\n\t\t *\n\t\t * Desktop sticky header: 100px\n\t\t * Mobiel sticky header: 60px\n\t\t *\/\n\t\tautoAdvanceOffsetDesktop: 100,\n\t\tautoAdvanceOffsetMobile: 60,\n\n\t\t\/*\n\t\t * V5.2.15:\n\t\t * automatische scroll alleen toestaan wanneer de pagina\n\t\t * bij laden\/reload echt bovenaan stond.\n\t\t *\/\n\t\tautoAdvanceTopThreshold: 12,\n\n\t\t\/*\n\t\t * V5.2.28 \u2014 TranslatePress\n\t\t * Bij een taalwissel op de homepage direct naar de\n\t\t * eerstvolgende rij onder de hero gaan.\n\t\t *\/\n\t\ttranslatePressSessionKey: 'fof-translatepress-next-row',\n\n\n\t\t\/* =================================================\n\t\t   V5.2 \u2014 GROENE INTRO TIMING\n\t\t================================================= *\/\n\n\t\tintroGreenHold: 420,\n\n\t\tintroTextIn: 420,\n\n\t\tintroLineGap: 420,\n\n\t\tintroLine3Gap: 420,\n\n\t\tintroTextHold: 520,\n\n\t\tintroWipeDuration: 720,\n\n\t\t\/*\n\t\t * Korte overlap: arm mag al n\u00e9t beginnen binnenkomen\n\t\t * terwijl de groene laag vrijwel weg is.\n\t\t *\/\n\t\tintroToArmOverlap: 100,\n\n\t\t\/*\n\t\t * V5.2.19 \u2014 de volledige homepage-animatie slechts\n\t\t * \u00e9\u00e9n keer per browsertab\/sessie tonen.\n\t\t *\/\n\t\tintroSessionKey: 'fof-home-animation-seen-v1',\n\n\t\t\/*\n\t\t * V5.2.1:\n\t\t * arm komt van onderen binnen, maar staat horizontaal\n\t\t * meteen op de juiste plek voor de eerste F van FIETS.\n\t\t * Daardoor geen sprint meer vanuit het midden naar links.\n\t\t *\/\n\t\tarmEntranceDropDesktop: 260,\n\t\tarmEntranceDropMobile: 120,\n\n\t\tarmEntranceScaleFactor: 0.84,\n\t\tarmEntranceRotationOffset: 7\n\n\t};\n\n\n\t\/* =====================================================\n\t   VARIABELEN\n\t===================================================== *\/\n\n\tlet width;\n\tlet height;\n\tlet dpr;\n\n\n\tlet logoX;\n\tlet logoY;\n\n\tlet logoWidth;\n\tlet logoHeight;\n\n\n\tlet logoImage = null;\n\n\n\tlet maskCanvas;\n\tlet maskCtx;\n\n\n\tlet sprayMask;\n\tlet sprayMaskCtx;\n\n\n\tlet animationFrame = null;\n\n\tlet startTime = null;\n\n\t\/*\n\t * V4.2: vooraf berekende vectorroute door het logo.\n\t *\/\n\tlet traceRoute = [];\n\tlet traceTotalWeight = 0;\n\n\n\t\/*\n\t * V4.6: zachte interpolatie van de visuele hand\/nozzle.\n\t *\/\n\tlet armNozzleX = null;\n\tlet armNozzleY = null;\n\n\tlet armAnchorVisualX = null;\n\tlet armAnchorVisualY = null;\n\tlet armScaleVisual = null;\n\tlet armRotationVisual = null;\n\tlet armWristVisual = 0;\n\n\tlet animationFrameCount = 0;\n\n\tlet lastSprayState = false;\n\tlet lastSprayGroup = null;\n\n\tlet entranceComplete = false;\n\n\t\/*\n\t * V5.2.15 \u2014 auto-scroll status.\n\t *\/\n\tlet pageStartedAtTop = true;\n\tlet userScrolledAfterIntro = false;\n\tlet ignoreScrollTracking = false;\n\n\n\t\/* =====================================================\n\t   HELPERS\n\t===================================================== *\/\n\n\tfunction random(min, max) {\n\n\t\treturn (\n\t\t\tMath.random() *\n\t\t\t(max - min)\n\t\t) + min;\n\n\t}\n\n\tfunction clamp(value, min, max) {\n\t\treturn Math.min(Math.max(value, min), max);\n\t}\n\n\n\tfunction lerp(a, b, t) {\n\t\treturn a + (b - a) * t;\n\t}\n\n\n\tfunction easeInOutSine(t) {\n\t\treturn -(Math.cos(Math.PI * t) - 1) \/ 2;\n\t}\n\n\n\tfunction easeOutCubic(t) {\n\t\treturn 1 - Math.pow(1 - t, 3);\n\t}\n\n\n\tfunction isMobile() {\n\n\t\treturn width < 768;\n\n\t}\n\n\n\tfunction getDuration() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.durationMobile\n\t\t\t: SETTINGS.durationDesktop;\n\n\t}\n\n\tfunction getAutoAdvanceOffset() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.autoAdvanceOffsetMobile\n\t\t\t: SETTINGS.autoAdvanceOffsetDesktop;\n\n\t}\n\n\tfunction getEntranceDuration() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.entranceDurationMobile\n\t\t\t: SETTINGS.entranceDurationDesktop;\n\n\t}\n\n\n\tfunction getEntranceSettle() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.entranceSettleMobile\n\t\t\t: SETTINGS.entranceSettleDesktop;\n\n\t}\n\n\n\tfunction getPuffParticles() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.puffParticlesMobile\n\t\t\t: SETTINGS.puffParticlesDesktop;\n\n\t}\n\n\n\tfunction getPuffRadius() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.puffRadiusMobile\n\t\t\t: SETTINGS.puffRadiusDesktop;\n\n\t}\n\n\n\tfunction getSprayRadius() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.sprayRadiusMobile\n\t\t\t: SETTINGS.sprayRadiusDesktop;\n\n\t}\n\n\n\tfunction getCoreParticles() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.coreParticlesMobile\n\t\t\t: SETTINGS.coreParticlesDesktop;\n\n\t}\n\n\n\tfunction getSoftParticles() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.softParticlesMobile\n\t\t\t: SETTINGS.softParticlesDesktop;\n\n\t}\n\n\n\tfunction getOversprayParticles() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.oversprayParticlesMobile\n\t\t\t: SETTINGS.oversprayParticlesDesktop;\n\n\t}\n\n\n\tfunction getSampleStep() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.sampleStepMobile\n\t\t\t: SETTINGS.sampleStepDesktop;\n\n\t}\n\n\n\tfunction getTracePasses() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.tracePassesMobile\n\t\t\t: SETTINGS.tracePassesDesktop;\n\n\t}\n\n\n\tfunction getTracePassOffset() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.tracePassOffsetMobile\n\t\t\t: SETTINGS.tracePassOffsetDesktop;\n\n\t}\n\n\n\tfunction getGroupPauseWeight() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.groupPauseWeightMobile\n\t\t\t: SETTINGS.groupPauseWeightDesktop;\n\n\t}\n\n\n\tfunction getArmScaleMin() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.armScaleMinMobile\n\t\t\t: SETTINGS.armScaleMinDesktop;\n\n\t}\n\n\n\tfunction getArmScaleMax() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.armScaleMaxMobile\n\t\t\t: SETTINGS.armScaleMaxDesktop;\n\n\t}\n\n\n\tfunction getArmRotationMin() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.armRotationMinMobile\n\t\t\t: SETTINGS.armRotationMinDesktop;\n\n\t}\n\n\n\tfunction getArmRotationMax() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.armRotationMaxMobile\n\t\t\t: SETTINGS.armRotationMaxDesktop;\n\n\t}\n\n\n\tfunction getArmFollow() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.armFollowMobile\n\t\t\t: SETTINGS.armFollowDesktop;\n\n\t}\n\n\n\tfunction getArmAnchorFollow() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.armAnchorFollowMobile\n\t\t\t: SETTINGS.armAnchorFollowDesktop;\n\n\t}\n\n\n\tfunction getArmScaleFollow() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.armScaleFollowMobile\n\t\t\t: SETTINGS.armScaleFollowDesktop;\n\n\t}\n\n\n\tfunction getArmRotationFollow() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.armRotationFollowMobile\n\t\t\t: SETTINGS.armRotationFollowDesktop;\n\n\t}\n\n\n\tfunction getArmWristFollow() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.armWristFollowMobile\n\t\t\t: SETTINGS.armWristFollowDesktop;\n\n\t}\n\n\n\tfunction getArmPreferredScale() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.armPreferredScaleMobile\n\t\t\t: SETTINGS.armPreferredScaleDesktop;\n\n\t}\n\n\n\tfunction getArmAnchorMinX() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.armAnchorMinXMobile\n\t\t\t: SETTINGS.armAnchorMinXDesktop;\n\n\t}\n\n\n\tfunction getArmAnchorMaxX() {\n\n\t\treturn isMobile()\n\t\t\t? SETTINGS.armAnchorMaxXMobile\n\t\t\t: SETTINGS.armAnchorMaxXDesktop;\n\n\t}\n\n\n\t\/* =====================================================\n\t   CANVAS SIZE\n\t===================================================== *\/\n\n\tfunction resize() {\n\n\t\tconst rect =\n\t\t\thero.getBoundingClientRect();\n\n\n\t\twidth =\n\t\t\trect.width;\n\n\n\t\theight =\n\t\t\trect.height;\n\n\n\t\tdpr =\n\t\t\tMath.min(\n\t\t\t\twindow.devicePixelRatio || 1,\n\t\t\t\twidth < 768\n\t\t\t\t\t? 1.5\n\t\t\t\t\t: 2\n\t\t\t);\n\n\n\t\t[\n\t\t\tresultCanvas,\n\t\t\twetCanvas,\n\t\t\tparticleCanvas\n\t\t].forEach(function (canvas) {\n\n\t\t\tcanvas.width =\n\t\t\t\twidth * dpr;\n\n\n\t\t\tcanvas.height =\n\t\t\t\theight * dpr;\n\n\n\t\t\tcanvas.style.width =\n\t\t\t\twidth + 'px';\n\n\n\t\t\tcanvas.style.height =\n\t\t\t\theight + 'px';\n\n\t\t});\n\n\n\t\tresultCtx.setTransform(\n\t\t\tdpr, 0, 0, dpr, 0, 0\n\t\t);\n\n\n\t\twetCtx.setTransform(\n\t\t\tdpr, 0, 0, dpr, 0, 0\n\t\t);\n\n\n\t\tparticleCtx.setTransform(\n\t\t\tdpr, 0, 0, dpr, 0, 0\n\t\t);\n\n\n\t\tcalculateLogoSize();\n\n\t\tcreateMaskCanvases();\n\n\t}\n\n\n\t\/* =====================================================\n\t   LOGO AFMETING\n\t===================================================== *\/\n\n\tfunction calculateLogoSize() {\n\n\t\tconst aspect =\n\t\t\t395.52 \/ 97.25;\n\n\n\t\tif (width < 768) {\n\n\t\t\tlogoWidth =\n\t\t\t\twidth *\n\t\t\t\tSETTINGS.logoMobileWidth;\n\n\t\t}\n\t\telse {\n\n\t\t\tlogoWidth =\n\t\t\t\tMath.min(\n\t\t\t\t\tSETTINGS.logoWidthDesktop,\n\t\t\t\t\twidth * .78\n\t\t\t\t);\n\n\t\t}\n\n\n\t\tlogoHeight =\n\t\t\tlogoWidth \/\n\t\t\taspect;\n\n\n\t\tlogoX =\n\t\t\t(width - logoWidth) \/ 2;\n\n\n\t\tif (width < 768) {\n\n\t\t\tlogoY =\n\t\t\t\t(\n\t\t\t\t\theight *\n\t\t\t\t\tSETTINGS.logoMobileCenterY\n\t\t\t\t) -\n\t\t\t\t(\n\t\t\t\t\tlogoHeight \/\n\t\t\t\t\t2\n\t\t\t\t);\n\n\t\t}\n\t\telse {\n\n\t\t\tlogoY =\n\t\t\t\t(height - logoHeight) \/ 2;\n\n\t\t}\n\n\t}\n\n\n\t\/* =====================================================\n\t   OFFSCREEN CANVASSEN\n\t===================================================== *\/\n\n\tfunction createMaskCanvases() {\n\n\t\tmaskCanvas =\n\t\t\tdocument.createElement(\n\t\t\t\t'canvas'\n\t\t\t);\n\n\n\t\tmaskCanvas.width =\n\t\t\twidth * dpr;\n\n\n\t\tmaskCanvas.height =\n\t\t\theight * dpr;\n\n\n\t\tmaskCtx =\n\t\t\tmaskCanvas.getContext(\n\t\t\t\t'2d'\n\t\t\t);\n\n\n\t\tmaskCtx.setTransform(\n\t\t\tdpr, 0, 0, dpr, 0, 0\n\t\t);\n\n\n\t\tsprayMask =\n\t\t\tdocument.createElement(\n\t\t\t\t'canvas'\n\t\t\t);\n\n\n\t\tsprayMask.width =\n\t\t\twidth * dpr;\n\n\n\t\tsprayMask.height =\n\t\t\theight * dpr;\n\n\n\t\tsprayMaskCtx =\n\t\t\tsprayMask.getContext(\n\t\t\t\t'2d'\n\t\t\t);\n\n\n\t\tsprayMaskCtx.setTransform(\n\t\t\tdpr, 0, 0, dpr, 0, 0\n\t\t);\n\n\n\t\tif (logoImage) {\n\n\t\t\tdrawOriginalLogo();\n\n\t\t\tcreateTraceRoute();\n\n\t\t}\n\n\t}\n\n\n\t\/* =====================================================\n\t   SVG NAAR IMAGE\n\t===================================================== *\/\n\n\tfunction loadLogo() {\n\n\t\treturn new Promise(\n\t\t\tfunction (resolve) {\n\n\t\t\t\tconst serializer =\n\t\t\t\t\tnew XMLSerializer();\n\n\n\t\t\t\tlet svgString =\n\t\t\t\t\tserializer.serializeToString(\n\t\t\t\t\t\tsourceSvg\n\t\t\t\t\t);\n\n\n\t\t\t\t\/*\n\t\t\t\t * Hidden CSS verwijderen zodat\n\t\t\t\t * de afbeelding zelf gewoon zichtbaar is.\n\t\t\t\t *\/\n\n\t\t\t\tsvgString =\n\t\t\t\t\tsvgString.replace(\n\t\t\t\t\t\t\/class=\"custom-fof-logo-source\"\/,\n\t\t\t\t\t\t''\n\t\t\t\t\t);\n\n\n\t\t\t\tconst blob =\n\t\t\t\t\tnew Blob(\n\t\t\t\t\t\t[svgString],\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\ttype:\n\t\t\t\t\t\t\t\t'image\/svg+xml;charset=utf-8'\n\t\t\t\t\t\t}\n\t\t\t\t\t);\n\n\n\t\t\t\tconst url =\n\t\t\t\t\tURL.createObjectURL(\n\t\t\t\t\t\tblob\n\t\t\t\t\t);\n\n\n\t\t\t\tconst image =\n\t\t\t\t\tnew Image();\n\n\n\t\t\t\timage.onload =\n\t\t\t\t\tfunction () {\n\n\t\t\t\t\t\tURL.revokeObjectURL(\n\t\t\t\t\t\t\turl\n\t\t\t\t\t\t);\n\n\n\t\t\t\t\t\tlogoImage =\n\t\t\t\t\t\t\timage;\n\n\n\t\t\t\t\t\tresolve();\n\n\t\t\t\t\t};\n\n\n\t\t\t\timage.src =\n\t\t\t\t\turl;\n\n\t\t\t}\n\t\t);\n\n\t}\n\n\n\t\/* =====================================================\n\t   ORIGINEEL LOGO OFFSCREEN\n\t===================================================== *\/\n\n\tfunction drawOriginalLogo() {\n\n\t\tmaskCtx.clearRect(\n\t\t\t0,\n\t\t\t0,\n\t\t\twidth,\n\t\t\theight\n\t\t);\n\n\n\t\tmaskCtx.drawImage(\n\t\t\tlogoImage,\n\t\t\tlogoX,\n\t\t\tlogoY,\n\t\t\tlogoWidth,\n\t\t\tlogoHeight\n\t\t);\n\n\t}\n\n\n\t\/* =====================================================\n\t   CORE SPRAY IN MASK\n\t===================================================== *\/\n\n\tfunction sprayMaskAt(x, y) {\n\n\t\t\/*\n\t\t * Grote zachte kern.\n\t\t *\/\n\n\t\tconst gradient =\n\t\t\tsprayMaskCtx.createRadialGradient(\n\t\t\t\tx,\n\t\t\t\ty,\n\t\t\t\t0,\n\n\t\t\t\tx,\n\t\t\t\ty,\n\t\t\t\tgetSprayRadius()\n\t\t\t);\n\n\n\t\tgradient.addColorStop(\n\t\t\t0,\n\t\t\t'rgba(255,255,255,.40)'\n\t\t);\n\n\n\t\tgradient.addColorStop(\n\t\t\t.32,\n\t\t\t'rgba(255,255,255,.22)'\n\t\t);\n\n\n\t\tgradient.addColorStop(\n\t\t\t.72,\n\t\t\t'rgba(255,255,255,.05)'\n\t\t);\n\n\n\t\tgradient.addColorStop(\n\t\t\t1,\n\t\t\t'rgba(255,255,255,0)'\n\t\t);\n\n\n\t\tsprayMaskCtx.fillStyle =\n\t\t\tgradient;\n\n\n\t\tsprayMaskCtx.beginPath();\n\n\n\t\tsprayMaskCtx.arc(\n\t\t\tx,\n\t\t\ty,\n\t\t\tgetSprayRadius(),\n\t\t\t0,\n\t\t\tMath.PI * 2\n\t\t);\n\n\n\t\tsprayMaskCtx.fill();\n\n\n\t\t\/*\n\t\t * Core particles\n\t\t *\/\n\n\t\tfor (\n\t\t\tlet i = 0;\n\t\t\ti < getCoreParticles();\n\t\t\ti++\n\t\t) {\n\n\t\t\tconst angle =\n\t\t\t\tMath.random() *\n\t\t\t\tMath.PI *\n\t\t\t\t2;\n\n\n\t\t\tconst distance =\n\t\t\t\tMath.pow(\n\t\t\t\t\tMath.random(),\n\t\t\t\t\t1.8\n\t\t\t\t) *\n\t\t\t\tgetSprayRadius() *\n\t\t\t\t.55;\n\n\n\t\t\tconst px =\n\t\t\t\tx +\n\t\t\t\tMath.cos(angle) *\n\t\t\t\tdistance;\n\n\n\t\t\tconst py =\n\t\t\t\ty +\n\t\t\t\tMath.sin(angle) *\n\t\t\t\tdistance;\n\n\n\t\t\tsprayMaskCtx.beginPath();\n\n\n\t\t\tsprayMaskCtx.arc(\n\t\t\t\tpx,\n\t\t\t\tpy,\n\t\t\t\trandom(1, 5),\n\t\t\t\t0,\n\t\t\t\tMath.PI * 2\n\t\t\t);\n\n\n\t\t\tsprayMaskCtx.fillStyle =\n\t\t\t\t`rgba(\n\t\t\t\t\t255,\n\t\t\t\t\t255,\n\t\t\t\t\t255,\n\t\t\t\t\t${random(.15,.55)}\n\t\t\t\t)`;\n\n\n\t\t\tsprayMaskCtx.fill();\n\n\t\t}\n\n\t}\n\n\n\t\/* =====================================================\n\t   V5.1 \u2014 NATTE VERF\n\t===================================================== *\/\n\n\tfunction drawWetPaint(x, y) {\n\n\t\tconst radius =\n\t\t\tgetSprayRadius() *\n\t\t\tSETTINGS.wetRadiusMultiplier;\n\n\n\t\tconst gradient =\n\t\t\twetCtx.createRadialGradient(\n\t\t\t\tx,\n\t\t\t\ty,\n\t\t\t\t0,\n\n\t\t\t\tx,\n\t\t\t\ty,\n\t\t\t\tradius\n\t\t\t);\n\n\n\t\tgradient.addColorStop(\n\t\t\t0,\n\t\t\t`rgba(\n\t\t\t\t20,\n\t\t\t\t20,\n\t\t\t\t20,\n\t\t\t\t${SETTINGS.wetOpacity}\n\t\t\t)`\n\t\t);\n\n\n\t\tgradient.addColorStop(\n\t\t\t.65,\n\t\t\t`rgba(\n\t\t\t\t20,\n\t\t\t\t20,\n\t\t\t\t20,\n\t\t\t\t${SETTINGS.wetOpacity * .42}\n\t\t\t)`\n\t\t);\n\n\n\t\tgradient.addColorStop(\n\t\t\t1,\n\t\t\t'rgba(20,20,20,0)'\n\t\t);\n\n\n\t\twetCtx.fillStyle =\n\t\t\tgradient;\n\n\n\t\twetCtx.beginPath();\n\n\n\t\twetCtx.arc(\n\t\t\tx,\n\t\t\ty,\n\t\t\tradius,\n\t\t\t0,\n\t\t\tMath.PI * 2\n\t\t);\n\n\n\t\twetCtx.fill();\n\n\t}\n\n\n\tfunction fadeWetPaint() {\n\n\t\twetCtx.save();\n\n\t\twetCtx.globalCompositeOperation =\n\t\t\t'destination-out';\n\n\n\t\twetCtx.fillStyle =\n\t\t\t`rgba(\n\t\t\t\t0,\n\t\t\t\t0,\n\t\t\t\t0,\n\t\t\t\t${SETTINGS.wetFadePerFrame}\n\t\t\t)`;\n\n\n\t\twetCtx.fillRect(\n\t\t\t0,\n\t\t\t0,\n\t\t\twidth,\n\t\t\theight\n\t\t);\n\n\n\t\twetCtx.restore();\n\n\t}\n\n\n\t\/* =====================================================\n\t   V5.1 \u2014 SPRAY-PUFF\n\t===================================================== *\/\n\n\tfunction sprayPuff(x, y) {\n\n\t\tconst count =\n\t\t\tgetPuffParticles();\n\n\n\t\tconst radius =\n\t\t\tgetPuffRadius();\n\n\n\t\tfor (\n\t\t\tlet i = 0;\n\t\t\ti < count;\n\t\t\ti++\n\t\t) {\n\n\t\t\tconst angle =\n\t\t\t\tMath.random() *\n\t\t\t\tMath.PI *\n\t\t\t\t2;\n\n\n\t\t\tconst distance =\n\t\t\t\tMath.pow(\n\t\t\t\t\tMath.random(),\n\t\t\t\t\t1.7\n\t\t\t\t) *\n\t\t\t\tradius;\n\n\n\t\t\tconst px =\n\t\t\t\tx +\n\t\t\t\tMath.cos(angle) *\n\t\t\t\tdistance;\n\n\n\t\t\tconst py =\n\t\t\t\ty +\n\t\t\t\tMath.sin(angle) *\n\t\t\t\tdistance;\n\n\n\t\t\tparticleCtx.beginPath();\n\n\n\t\t\tparticleCtx.arc(\n\t\t\t\tpx,\n\t\t\t\tpy,\n\t\t\t\trandom(\n\t\t\t\t\t.6,\n\t\t\t\t\t2.0\n\t\t\t\t),\n\t\t\t\t0,\n\t\t\t\tMath.PI * 2\n\t\t\t);\n\n\n\t\t\tparticleCtx.fillStyle =\n\t\t\t\t`rgba(\n\t\t\t\t\t70,\n\t\t\t\t\t70,\n\t\t\t\t\t70,\n\t\t\t\t\t${random(.035,.10)}\n\t\t\t\t)`;\n\n\n\t\t\tparticleCtx.fill();\n\n\t\t}\n\n\n\t\t\/*\n\t\t * Ook iets extra verfdekking bij de start.\n\t\t *\/\n\t\tfor (\n\t\t\tlet i = 0;\n\t\t\ti < 4;\n\t\t\ti++\n\t\t) {\n\n\t\t\tsprayMaskAt(\n\t\t\t\tx +\n\t\t\t\t\trandom(-2.5,2.5),\n\n\t\t\t\ty +\n\t\t\t\t\trandom(-2.5,2.5)\n\t\t\t);\n\n\t\t}\n\n\t}\n\n\n\t\/* =====================================================\n\t   OVERSPRAY ZICHTBAAR BUITEN LOGO\n\t===================================================== *\/\n\n\tfunction drawOverspray(x, y) {\n\n\t\t\/*\n\t\t * V5.0.3\n\t\t *\n\t\t * Zichtbare aerosol buiten het logo blijft aanwezig,\n\t\t * maar is fijner, transparanter en dichter bij het\n\t\t * daadwerkelijke spraypunt.\n\t\t *\/\n\n\t\tfor (\n\t\t\tlet i = 0;\n\t\t\ti < getSoftParticles();\n\t\t\ti++\n\t\t) {\n\n\t\t\tconst angle =\n\t\t\t\tMath.random() *\n\t\t\t\tMath.PI *\n\t\t\t\t2;\n\n\n\t\t\t\/*\n\t\t\t * Minder grote verspreiding dan voorheen.\n\t\t\t *\/\n\t\t\tconst distance =\n\t\t\t\trandom(\n\t\t\t\t\t12,\n\t\t\t\t\tgetSprayRadius() *\n\t\t\t\t\t0.78\n\t\t\t\t);\n\n\n\t\t\tconst px =\n\t\t\t\tx +\n\t\t\t\tMath.cos(angle) *\n\t\t\t\tdistance;\n\n\n\t\t\tconst py =\n\t\t\t\ty +\n\t\t\t\tMath.sin(angle) *\n\t\t\t\tdistance;\n\n\n\t\t\tparticleCtx.beginPath();\n\n\n\t\t\tparticleCtx.arc(\n\t\t\t\tpx,\n\t\t\t\tpy,\n\t\t\t\trandom(\n\t\t\t\t\tSETTINGS.softParticleSizeMin,\n\t\t\t\t\tSETTINGS.softParticleSizeMax\n\t\t\t\t),\n\t\t\t\t0,\n\t\t\t\tMath.PI * 2\n\t\t\t);\n\n\n\t\t\tparticleCtx.fillStyle =\n\t\t\t\t`rgba(\n\t\t\t\t\t70,\n\t\t\t\t\t70,\n\t\t\t\t\t70,\n\t\t\t\t\t${random(\n\t\t\t\t\t\tSETTINGS.softParticleOpacityMin,\n\t\t\t\t\t\tSETTINGS.softParticleOpacityMax\n\t\t\t\t\t)}\n\t\t\t\t)`;\n\n\n\t\t\tparticleCtx.fill();\n\n\t\t}\n\n\n\t\t\/*\n\t\t * Nog maar enkele losse spetters.\n\t\t *\/\n\t\tfor (\n\t\t\tlet i = 0;\n\t\t\ti < getOversprayParticles();\n\t\t\ti++\n\t\t) {\n\n\t\t\tconst angle =\n\t\t\t\tMath.random() *\n\t\t\t\tMath.PI *\n\t\t\t\t2;\n\n\n\t\t\tconst distance =\n\t\t\t\trandom(\n\t\t\t\t\tgetSprayRadius() *\n\t\t\t\t\t0.52,\n\n\t\t\t\t\tgetSprayRadius() *\n\t\t\t\t\t0.90\n\t\t\t\t);\n\n\n\t\t\tconst px =\n\t\t\t\tx +\n\t\t\t\tMath.cos(angle) *\n\t\t\t\tdistance;\n\n\n\t\t\tconst py =\n\t\t\t\ty +\n\t\t\t\tMath.sin(angle) *\n\t\t\t\tdistance;\n\n\n\t\t\tparticleCtx.beginPath();\n\n\n\t\t\tparticleCtx.arc(\n\t\t\t\tpx,\n\t\t\t\tpy,\n\t\t\t\trandom(\n\t\t\t\t\tSETTINGS.overspraySizeMin,\n\t\t\t\t\tSETTINGS.overspraySizeMax\n\t\t\t\t),\n\t\t\t\t0,\n\t\t\t\tMath.PI * 2\n\t\t\t);\n\n\n\t\t\tparticleCtx.fillStyle =\n\t\t\t\t`rgba(\n\t\t\t\t\t70,\n\t\t\t\t\t70,\n\t\t\t\t\t70,\n\t\t\t\t\t${random(\n\t\t\t\t\t\tSETTINGS.oversprayOpacityMin,\n\t\t\t\t\t\tSETTINGS.oversprayOpacityMax\n\t\t\t\t\t)}\n\t\t\t\t)`;\n\n\n\t\t\tparticleCtx.fill();\n\n\t\t}\n\n\t}\n\n\n\t\/* =====================================================\n\t   LOGO TONEN VIA SPRAYMASK\n\t===================================================== *\/\n\n\tfunction renderRevealedLogo() {\n\n\t\tresultCtx.clearRect(\n\t\t\t0,\n\t\t\t0,\n\t\t\twidth,\n\t\t\theight\n\t\t);\n\n\n\t\t\/*\n\t\t * Eerst originele logo.\n\t\t *\/\n\n\t\tresultCtx.drawImage(\n\t\t\tmaskCanvas,\n\t\t\t0,\n\t\t\t0,\n\t\t\twidth,\n\t\t\theight\n\t\t);\n\n\n\t\t\/*\n\t\t * Daarna sprayMask als alpha-mask.\n\t\t *\/\n\n\t\tresultCtx.globalCompositeOperation =\n\t\t\t'destination-in';\n\n\n\t\tresultCtx.drawImage(\n\t\t\tsprayMask,\n\t\t\t0,\n\t\t\t0,\n\t\t\twidth,\n\t\t\theight\n\t\t);\n\n\n\t\tresultCtx.globalCompositeOperation =\n\t\t\t'source-over';\n\n\t}\n\n\n\t\/* =====================================================\n\t   SPRAYCAN\n\t===================================================== *\/\n\n\tfunction moveCan(\n\t\tpaintX,\n\t\tpaintY,\n\t\tdirection,\n\t\twrist,\n\t\tsprayStrength\n\t) {\n\n\t\tconst sprayDistance =\n\t\t\twidth < 768\n\t\t\t\t? SETTINGS.sprayDistanceMobile\n\t\t\t\t: SETTINGS.sprayDistanceDesktop;\n\n\n\t\tconst targetNozzleX =\n\t\t\tpaintX +\n\t\t\tsprayDistance +\n\t\t\tSETTINGS.backNozzleForward;\n\n\n\t\tconst targetNozzleY =\n\t\t\tpaintY +\n\t\t\tSETTINGS.nozzleYOffset +\n\t\t\tSETTINGS.backNozzleLift;\n\n\n\t\t\/*\n\t\t * V4.9:\n\t\t * de nozzle van de arm volgt het spraypad vloeiender,\n\t\t * zodat de arm minder hoekig over lettercontouren gaat.\n\t\t *\/\n\t\tif (\n\t\t\tarmNozzleX === null ||\n\t\t\tarmNozzleY === null\n\t\t) {\n\n\t\t\tarmNozzleX =\n\t\t\t\ttargetNozzleX;\n\n\t\t\tarmNozzleY =\n\t\t\t\ttargetNozzleY;\n\n\t\t}\n\t\telse {\n\n\t\t\tarmNozzleX =\n\t\t\t\tlerp(\n\t\t\t\t\tarmNozzleX,\n\t\t\t\t\ttargetNozzleX,\n\t\t\t\t\tgetArmFollow()\n\t\t\t\t);\n\n\n\t\t\tarmNozzleY =\n\t\t\t\tlerp(\n\t\t\t\t\tarmNozzleY,\n\t\t\t\t\ttargetNozzleY,\n\t\t\t\t\tgetArmFollow()\n\t\t\t\t);\n\n\t\t}\n\n\n\t\tconst baseAnchorY =\n\t\t\twidth < 768\n\t\t\t\t? height *\n\t\t\t\t\tSETTINGS.armAnchorYMobile\n\t\t\t\t: height *\n\t\t\t\t\tSETTINGS.armAnchorYDesktop;\n\n\n\t\t\/*\n\t\t * V5.2.17:\n\t\t * desktop blijft verticaal verankerd.\n\t\t * mobiel mag subtiel omhoog\/omlaag meebewegen.\n\t\t *\/\n\t\tlet targetAnchorY =\n\t\t\tbaseAnchorY;\n\n\n\t\tif (width < 768) {\n\n\t\t\tconst logoCenterY =\n\t\t\t\tlogoY +\n\t\t\t\tlogoHeight \/ 2;\n\n\n\t\t\tconst verticalShift =\n\t\t\t\t(\n\t\t\t\t\tarmNozzleY -\n\t\t\t\t\tlogoCenterY\n\t\t\t\t) *\n\t\t\t\tSETTINGS.armMobileVerticalFollow;\n\n\n\t\t\ttargetAnchorY =\n\t\t\t\tbaseAnchorY +\n\t\t\t\tverticalShift;\n\n\n\t\t\ttargetAnchorY =\n\t\t\t\tclamp(\n\t\t\t\t\ttargetAnchorY,\n\t\t\t\t\theight *\n\t\t\t\t\t\tSETTINGS.armAnchorMinYMobile,\n\t\t\t\t\theight *\n\t\t\t\t\t\tSETTINGS.armAnchorMaxYMobile\n\t\t\t\t);\n\n\t\t}\n\n\n\t\tif (\n\t\t\tarmAnchorVisualY === null\n\t\t) {\n\n\t\t\tarmAnchorVisualY =\n\t\t\t\ttargetAnchorY;\n\n\t\t}\n\t\telse {\n\n\t\t\tarmAnchorVisualY =\n\t\t\t\tlerp(\n\t\t\t\t\tarmAnchorVisualY,\n\t\t\t\t\ttargetAnchorY,\n\t\t\t\t\twidth < 768\n\t\t\t\t\t\t? SETTINGS.armVerticalFollowMobile\n\t\t\t\t\t\t: 1\n\t\t\t\t);\n\n\t\t}\n\n\n\t\tconst anchorY =\n\t\t\tarmAnchorVisualY;\n\n\n\t\tconst imageWidth =\n\t\t\tsprayCanImage.offsetWidth;\n\n\n\t\tconst imageHeight =\n\t\t\tsprayCanImage.offsetHeight;\n\n\n\t\tif (\n\t\t\t!imageWidth ||\n\t\t\t!imageHeight\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\n\t\tconst baseLocalX =\n\t\t\timageWidth *\n\t\t\tSETTINGS.armBaseX;\n\n\n\t\tconst baseLocalY =\n\t\t\timageHeight *\n\t\t\tSETTINGS.armBaseY;\n\n\n\t\tconst nozzleLocalX =\n\t\t\timageWidth *\n\t\t\tSETTINGS.armNozzleX;\n\n\n\t\tconst nozzleLocalY =\n\t\t\timageHeight *\n\t\t\tSETTINGS.armNozzleY;\n\n\n\t\tconst nativeDX =\n\t\t\tnozzleLocalX -\n\t\t\tbaseLocalX;\n\n\n\t\tconst nativeDY =\n\t\t\tnozzleLocalY -\n\t\t\tbaseLocalY;\n\n\n\t\tconst nativeDistance =\n\t\t\tMath.hypot(\n\t\t\t\tnativeDX,\n\t\t\t\tnativeDY\n\t\t\t);\n\n\n\t\tconst nativeAngle =\n\t\t\tMath.atan2(\n\t\t\t\tnativeDY,\n\t\t\t\tnativeDX\n\t\t\t);\n\n\n\t\tconst desiredDY =\n\t\t\tarmNozzleY -\n\t\t\tanchorY;\n\n\n\t\tlet targetScale =\n\t\t\tgetArmPreferredScale();\n\n\n\t\tconst minimumReach =\n\t\t\tMath.abs(\n\t\t\t\tdesiredDY\n\t\t\t) *\n\t\t\tSETTINGS.armReachSafety;\n\n\n\t\tconst minimumScale =\n\t\t\tminimumReach \/\n\t\t\tnativeDistance;\n\n\n\t\ttargetScale =\n\t\t\tMath.max(\n\t\t\t\ttargetScale,\n\t\t\t\tminimumScale\n\t\t\t);\n\n\n\t\ttargetScale =\n\t\t\tclamp(\n\t\t\t\ttargetScale,\n\t\t\t\tgetArmScaleMin(),\n\t\t\t\tgetArmScaleMax()\n\t\t\t);\n\n\n\t\tconst reach =\n\t\t\tnativeDistance *\n\t\t\ttargetScale;\n\n\n\t\tconst horizontalReach =\n\t\t\tMath.sqrt(\n\t\t\t\tMath.max(\n\t\t\t\t\t0,\n\t\t\t\t\treach * reach -\n\t\t\t\t\tdesiredDY * desiredDY\n\t\t\t\t)\n\t\t\t);\n\n\n\t\tlet targetAnchorX;\n\n\n\t\tif (width < 768) {\n\n\t\t\t\/*\n\t\t\t * V5.2.9 \u2014 MOBIEL\n\t\t\t *\n\t\t\t * De oude geometrische berekening kwam op smalle\n\t\t\t * schermen bijna altijd tegen dezelfde clamp aan.\n\t\t\t * Daardoor bleef de arm onderin vrijwel stilstaan.\n\t\t\t *\n\t\t\t * Nu volgt het onderste arm-anker rechtstreeks de\n\t\t\t * horizontale positie van de actieve letter.\n\t\t\t * De Y-positie blijft nog steeds vast onderaan.\n\t\t\t *\/\n\t\t\ttargetAnchorX =\n\t\t\t\tarmNozzleX -\n\t\t\t\t(\n\t\t\t\t\twidth *\n\t\t\t\t\tSETTINGS.armMobileReachX\n\t\t\t\t);\n\n\t\t}\n\t\telse {\n\n\t\t\ttargetAnchorX =\n\t\t\t\tarmNozzleX -\n\t\t\t\thorizontalReach;\n\n\t\t}\n\n\n\t\ttargetAnchorX =\n\t\t\tclamp(\n\t\t\t\ttargetAnchorX,\n\t\t\t\twidth *\n\t\t\t\t\tgetArmAnchorMinX(),\n\t\t\t\twidth *\n\t\t\t\t\tgetArmAnchorMaxX()\n\t\t\t);\n\n\n\t\tconst desiredDX =\n\t\t\tarmNozzleX -\n\t\t\ttargetAnchorX;\n\n\n\t\tconst desiredDistance =\n\t\t\tMath.hypot(\n\t\t\t\tdesiredDX,\n\t\t\t\tdesiredDY\n\t\t\t);\n\n\n\t\ttargetScale =\n\t\t\tclamp(\n\t\t\t\tdesiredDistance \/\n\t\t\t\t\tnativeDistance,\n\t\t\t\tgetArmScaleMin(),\n\t\t\t\tgetArmScaleMax()\n\t\t\t);\n\n\n\t\tconst desiredAngle =\n\t\t\tMath.atan2(\n\t\t\t\tdesiredDY,\n\t\t\t\tdesiredDX\n\t\t\t);\n\n\n\t\t\/*\n\t\t * Pols en rotatie \u00f3\u00f3k gladstrijken.\n\t\t *\/\n\t\tarmWristVisual =\n\t\t\tlerp(\n\t\t\t\tarmWristVisual,\n\t\t\t\twrist,\n\t\t\t\tgetArmWristFollow()\n\t\t\t);\n\n\n\t\tlet targetRotation =\n\t\t\t(\n\t\t\t\tdesiredAngle -\n\t\t\t\tnativeAngle\n\t\t\t) *\n\t\t\t180 \/\n\t\t\tMath.PI;\n\n\n\t\ttargetRotation +=\n\t\t\tarmWristVisual *\n\t\t\t0.34;\n\n\n\t\ttargetRotation +=\n\t\t\tdirection > 0\n\t\t\t\t? -0.25\n\t\t\t\t: 0.25;\n\n\n\t\ttargetRotation =\n\t\t\tclamp(\n\t\t\t\ttargetRotation,\n\t\t\t\tgetArmRotationMin(),\n\t\t\t\tgetArmRotationMax()\n\t\t\t);\n\n\n\t\tif (\n\t\t\tarmAnchorVisualX === null\n\t\t) {\n\t\t\tarmAnchorVisualX =\n\t\t\t\ttargetAnchorX;\n\t\t}\n\t\telse {\n\n\t\t\tarmAnchorVisualX =\n\t\t\t\tlerp(\n\t\t\t\t\tarmAnchorVisualX,\n\t\t\t\t\ttargetAnchorX,\n\t\t\t\t\tgetArmAnchorFollow()\n\t\t\t\t);\n\n\t\t}\n\n\n\t\tif (\n\t\t\tarmScaleVisual === null\n\t\t) {\n\t\t\tarmScaleVisual =\n\t\t\t\ttargetScale;\n\t\t}\n\t\telse {\n\n\t\t\tarmScaleVisual =\n\t\t\t\tlerp(\n\t\t\t\t\tarmScaleVisual,\n\t\t\t\t\ttargetScale,\n\t\t\t\t\tgetArmScaleFollow()\n\t\t\t\t);\n\n\t\t}\n\n\n\t\tif (\n\t\t\tarmRotationVisual === null\n\t\t) {\n\t\t\tarmRotationVisual =\n\t\t\t\ttargetRotation;\n\t\t}\n\t\telse {\n\n\t\t\tarmRotationVisual =\n\t\t\t\tlerp(\n\t\t\t\t\tarmRotationVisual,\n\t\t\t\t\ttargetRotation,\n\t\t\t\t\tgetArmRotationFollow()\n\t\t\t\t);\n\n\t\t}\n\n\n\t\tsprayCanImage.style.left =\n\t\t\t(-baseLocalX) +\n\t\t\t'px';\n\n\n\t\tsprayCanImage.style.top =\n\t\t\t(-baseLocalY) +\n\t\t\t'px';\n\n\n\t\tsprayCan.style.transform =\n\t\t\t`\n\t\t\ttranslate3d(\n\t\t\t\t${armAnchorVisualX}px,\n\t\t\t\t${anchorY}px,\n\t\t\t\t0\n\t\t\t)\n\n\t\t\trotate(\n\t\t\t\t${armRotationVisual}deg\n\t\t\t)\n\n\t\t\tscale(\n\t\t\t\t${armScaleVisual}\n\t\t\t)\n\t\t\t`;\n\n\n\t\tmist.style.left =\n\t\t\ttargetNozzleX +\n\t\t\t'px';\n\n\n\t\tmist.style.top =\n\t\t\ttargetNozzleY +\n\t\t\t'px';\n\n\n\t\tmist.style.transform =\n\t\t\t`\n\t\t\ttranslate(-50%, -50%)\n\t\t\tscale(\n\t\t\t\t${0.90 + (sprayStrength * 0.18)}\n\t\t\t)\n\t\t\t`;\n\n\n\t\tmist.style.opacity =\n\t\t\tString(\n\t\t\t\t0.24 +\n\t\t\t\t(sprayStrength * 0.26)\n\t\t\t);\n\n\t}\n\n\t\/* =====================================================\n\t   V4.2 \u2014 ROUTE VOLGT DE ECHTE SVG-VORMEN\n\t===================================================== *\/\n\n\tfunction svgPointToScreen(point) {\n\n\t\tconst viewBox =\n\t\t\tsourceSvg.viewBox.baseVal;\n\n\n\t\tconst scaleX =\n\t\t\tlogoWidth \/\n\t\t\tviewBox.width;\n\n\n\t\tconst scaleY =\n\t\t\tlogoHeight \/\n\t\t\tviewBox.height;\n\n\n\t\treturn {\n\n\t\t\tx:\n\t\t\t\tlogoX +\n\t\t\t\t(point.x - viewBox.x) *\n\t\t\t\tscaleX,\n\n\t\t\ty:\n\t\t\t\tlogoY +\n\t\t\t\t(point.y - viewBox.y) *\n\t\t\t\tscaleY\n\n\t\t};\n\n\t}\n\n\n\tfunction getGeometryElements() {\n\n\t\treturn Array.from(\n\t\t\tsourceSvg.querySelectorAll(\n\t\t\t\t'path, polygon, polyline, rect, circle, ellipse, line'\n\t\t\t)\n\t\t).filter(function (element) {\n\n\t\t\tif (\n\t\t\t\ttypeof element.getTotalLength !==\n\t\t\t\t'function'\n\t\t\t) {\n\t\t\t\treturn false;\n\t\t\t}\n\n\n\t\t\tconst fill =\n\t\t\t\telement.getAttribute('fill');\n\n\n\t\t\tconst stroke =\n\t\t\t\telement.getAttribute('stroke');\n\n\n\t\t\t\/*\n\t\t\t * We nemen alleen echte zichtbare logo-elementen.\n\t\t\t *\/\n\t\t\treturn !(\n\t\t\t\tfill === 'none' &&\n\t\t\t\t(!stroke || stroke === 'none')\n\t\t\t);\n\n\t\t});\n\n\t}\n\n\n\tfunction createTraceRoute() {\n\n\t\ttraceRoute = [];\n\t\ttraceTotalWeight = 0;\n\n\n\t\tconst allElements =\n\t\t\tgetGeometryElements();\n\n\n\t\t\/*\n\t\t * De SVG staat intern niet in leesvolgorde:\n\t\t * de groene O-elementen komen v\u00f3\u00f3r FIETS.\n\t\t *\n\t\t * Daarom leggen we voor dit specifieke logo de volgorde vast:\n\t\t *\n\t\t * 3,4,5,6 = FIETS\n\t\t * 1,2,0   = O + groene verbindingsvormen\n\t\t * 7,8     = FIT\n\t\t *\/\n\t\tconst groups = [\n\n\t\t\t{\n\t\t\t\tname: 'fiets',\n\t\t\t\tindices: [3, 4, 5, 6]\n\t\t\t},\n\n\t\t\t{\n\t\t\t\tname: 'o',\n\t\t\t\tindices: [1, 2, 0]\n\t\t\t},\n\n\t\t\t{\n\t\t\t\tname: 'fit',\n\t\t\t\tindices: [7, 8]\n\t\t\t}\n\n\t\t];\n\n\n\t\tlet previousEnd =\n\t\t\tnull;\n\n\n\t\tfunction addTravel(\n\t\t\tfrom,\n\t\t\tto,\n\t\t\tisGroupChange\n\t\t) {\n\n\t\t\tif (\n\t\t\t\t!from ||\n\t\t\t\t!to\n\t\t\t) {\n\t\t\t\treturn;\n\t\t\t}\n\n\n\t\t\tconst travelDistance =\n\t\t\t\tMath.hypot(\n\t\t\t\t\tto.x - from.x,\n\t\t\t\t\tto.y - from.y\n\t\t\t\t);\n\n\n\t\t\ttraceRoute.push({\n\n\t\t\t\ttype:\n\t\t\t\t\tisGroupChange\n\t\t\t\t\t\t? 'group-move'\n\t\t\t\t\t\t: 'move',\n\n\t\t\t\tfrom: {\n\t\t\t\t\tx: from.x,\n\t\t\t\t\ty: from.y\n\t\t\t\t},\n\n\t\t\t\tto: {\n\t\t\t\t\tx: to.x,\n\t\t\t\t\ty: to.y\n\t\t\t\t},\n\n\t\t\t\tweight:\n\t\t\t\t\tMath.max(\n\t\t\t\t\t\t18,\n\t\t\t\t\t\ttravelDistance *\n\t\t\t\t\t\tSETTINGS.moveGapWeight\n\t\t\t\t\t) +\n\t\t\t\t\t(\n\t\t\t\t\t\tisGroupChange\n\t\t\t\t\t\t\t? getGroupPauseWeight()\n\t\t\t\t\t\t\t: 0\n\t\t\t\t\t)\n\n\t\t\t});\n\n\t\t}\n\n\n\t\tgroups.forEach(\n\t\t\tfunction (group, groupIndex) {\n\n\t\t\t\tlet isFirstElementOfGroup =\n\t\t\t\t\ttrue;\n\n\n\t\t\t\tgroup.indices.forEach(\n\t\t\t\t\tfunction (elementIndex) {\n\n\t\t\t\t\t\tconst element =\n\t\t\t\t\t\t\tallElements[\n\t\t\t\t\t\t\t\telementIndex\n\t\t\t\t\t\t\t];\n\n\n\t\t\t\t\t\tif (!element) {\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\n\n\t\t\t\t\t\tlet length = 0;\n\n\n\t\t\t\t\t\ttry {\n\n\t\t\t\t\t\t\tlength =\n\t\t\t\t\t\t\t\telement.getTotalLength();\n\n\t\t\t\t\t\t}\n\t\t\t\t\t\tcatch (error) {\n\n\t\t\t\t\t\t\treturn;\n\n\t\t\t\t\t\t}\n\n\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t!length ||\n\t\t\t\t\t\t\tlength < 1\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\n\n\t\t\t\t\t\tconst sampleCount =\n\t\t\t\t\t\t\tMath.max(\n\t\t\t\t\t\t\t\t12,\n\t\t\t\t\t\t\t\tMath.ceil(\n\t\t\t\t\t\t\t\t\tlength \/\n\t\t\t\t\t\t\t\t\tgetSampleStep()\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t);\n\n\n\t\t\t\t\t\tfor (\n\t\t\t\t\t\t\tlet pass = 0;\n\t\t\t\t\t\t\tpass < getTracePasses();\n\t\t\t\t\t\t\tpass++\n\t\t\t\t\t\t) {\n\n\t\t\t\t\t\t\tconst centeredPass =\n\t\t\t\t\t\t\t\tpass -\n\t\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\t\tgetTracePasses() -\n\t\t\t\t\t\t\t\t\t1\n\t\t\t\t\t\t\t\t) \/\n\t\t\t\t\t\t\t\t2;\n\n\n\t\t\t\t\t\t\tconst normalOffset =\n\t\t\t\t\t\t\t\tcenteredPass *\n\t\t\t\t\t\t\t\tgetTracePassOffset();\n\n\n\t\t\t\t\t\t\tconst points = [];\n\n\n\t\t\t\t\t\t\tfor (\n\t\t\t\t\t\t\t\tlet i = 0;\n\t\t\t\t\t\t\t\ti <= sampleCount;\n\t\t\t\t\t\t\t\ti++\n\t\t\t\t\t\t\t) {\n\n\t\t\t\t\t\t\t\tconst distance =\n\t\t\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\t\t\ti \/\n\t\t\t\t\t\t\t\t\t\tsampleCount\n\t\t\t\t\t\t\t\t\t) *\n\t\t\t\t\t\t\t\t\tlength;\n\n\n\t\t\t\t\t\t\t\tconst localPoint =\n\t\t\t\t\t\t\t\t\telement.getPointAtLength(\n\t\t\t\t\t\t\t\t\t\tdistance\n\t\t\t\t\t\t\t\t\t);\n\n\n\t\t\t\t\t\t\t\tconst beforePoint =\n\t\t\t\t\t\t\t\t\telement.getPointAtLength(\n\t\t\t\t\t\t\t\t\t\tMath.max(\n\t\t\t\t\t\t\t\t\t\t\t0,\n\t\t\t\t\t\t\t\t\t\t\tdistance - 1\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t);\n\n\n\t\t\t\t\t\t\t\tconst afterPoint =\n\t\t\t\t\t\t\t\t\telement.getPointAtLength(\n\t\t\t\t\t\t\t\t\t\tMath.min(\n\t\t\t\t\t\t\t\t\t\t\tlength,\n\t\t\t\t\t\t\t\t\t\t\tdistance + 1\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t);\n\n\n\t\t\t\t\t\t\t\tconst screenPoint =\n\t\t\t\t\t\t\t\t\tsvgPointToScreen(\n\t\t\t\t\t\t\t\t\t\tlocalPoint\n\t\t\t\t\t\t\t\t\t);\n\n\n\t\t\t\t\t\t\t\tconst beforeScreen =\n\t\t\t\t\t\t\t\t\tsvgPointToScreen(\n\t\t\t\t\t\t\t\t\t\tbeforePoint\n\t\t\t\t\t\t\t\t\t);\n\n\n\t\t\t\t\t\t\t\tconst afterScreen =\n\t\t\t\t\t\t\t\t\tsvgPointToScreen(\n\t\t\t\t\t\t\t\t\t\tafterPoint\n\t\t\t\t\t\t\t\t\t);\n\n\n\t\t\t\t\t\t\t\tconst dx =\n\t\t\t\t\t\t\t\t\tafterScreen.x -\n\t\t\t\t\t\t\t\t\tbeforeScreen.x;\n\n\n\t\t\t\t\t\t\t\tconst dy =\n\t\t\t\t\t\t\t\t\tafterScreen.y -\n\t\t\t\t\t\t\t\t\tbeforeScreen.y;\n\n\n\t\t\t\t\t\t\t\tconst tangentLength =\n\t\t\t\t\t\t\t\t\tMath.hypot(\n\t\t\t\t\t\t\t\t\t\tdx,\n\t\t\t\t\t\t\t\t\t\tdy\n\t\t\t\t\t\t\t\t\t) || 1;\n\n\n\t\t\t\t\t\t\t\tconst nx =\n\t\t\t\t\t\t\t\t\t-dy \/\n\t\t\t\t\t\t\t\t\ttangentLength;\n\n\n\t\t\t\t\t\t\t\tconst ny =\n\t\t\t\t\t\t\t\t\tdx \/\n\t\t\t\t\t\t\t\t\ttangentLength;\n\n\n\t\t\t\t\t\t\t\tpoints.push({\n\n\t\t\t\t\t\t\t\t\tx:\n\t\t\t\t\t\t\t\t\t\tscreenPoint.x +\n\t\t\t\t\t\t\t\t\t\tnx *\n\t\t\t\t\t\t\t\t\t\tnormalOffset,\n\n\t\t\t\t\t\t\t\t\ty:\n\t\t\t\t\t\t\t\t\t\tscreenPoint.y +\n\t\t\t\t\t\t\t\t\t\tny *\n\t\t\t\t\t\t\t\t\t\tnormalOffset,\n\n\t\t\t\t\t\t\t\t\tdx: dx,\n\t\t\t\t\t\t\t\t\tdy: dy\n\n\t\t\t\t\t\t\t\t});\n\n\t\t\t\t\t\t\t}\n\n\n\t\t\t\t\t\t\t\/*\n\t\t\t\t\t\t\t * Om-en-om terugspuiten:\n\t\t\t\t\t\t\t * voorkomt grote onnatuurlijke sprongen.\n\t\t\t\t\t\t\t *\/\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tpass % 2 === 1\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tpoints.reverse();\n\t\t\t\t\t\t\t}\n\n\n\t\t\t\t\t\t\tif (!points.length) {\n\t\t\t\t\t\t\t\tcontinue;\n\t\t\t\t\t\t\t}\n\n\n\t\t\t\t\t\t\tconst startPoint =\n\t\t\t\t\t\t\t\tpoints[0];\n\n\n\t\t\t\t\t\t\tif (previousEnd) {\n\n\t\t\t\t\t\t\t\taddTravel(\n\t\t\t\t\t\t\t\t\tpreviousEnd,\n\t\t\t\t\t\t\t\t\tstartPoint,\n\t\t\t\t\t\t\t\t\tisFirstElementOfGroup &&\n\t\t\t\t\t\t\t\t\tgroupIndex > 0\n\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t}\n\n\n\t\t\t\t\t\t\tfor (\n\t\t\t\t\t\t\t\tlet i = 1;\n\t\t\t\t\t\t\t\ti < points.length;\n\t\t\t\t\t\t\t\ti++\n\t\t\t\t\t\t\t) {\n\n\t\t\t\t\t\t\t\tconst a =\n\t\t\t\t\t\t\t\t\tpoints[i - 1];\n\n\n\t\t\t\t\t\t\t\tconst b =\n\t\t\t\t\t\t\t\t\tpoints[i];\n\n\n\t\t\t\t\t\t\t\tconst segmentLength =\n\t\t\t\t\t\t\t\t\tMath.hypot(\n\t\t\t\t\t\t\t\t\t\tb.x - a.x,\n\t\t\t\t\t\t\t\t\t\tb.y - a.y\n\t\t\t\t\t\t\t\t\t);\n\n\n\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\tsegmentLength <\n\t\t\t\t\t\t\t\t\t0.5\n\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\tcontinue;\n\t\t\t\t\t\t\t\t}\n\n\n\t\t\t\t\t\t\t\ttraceRoute.push({\n\n\t\t\t\t\t\t\t\t\ttype: 'spray',\n\n\t\t\t\t\t\t\t\t\tgroup:\n\t\t\t\t\t\t\t\t\t\tgroup.name,\n\n\t\t\t\t\t\t\t\t\tfrom: a,\n\t\t\t\t\t\t\t\t\tto: b,\n\n\t\t\t\t\t\t\t\t\tweight:\n\t\t\t\t\t\t\t\t\t\tsegmentLength\n\n\t\t\t\t\t\t\t\t});\n\n\t\t\t\t\t\t\t}\n\n\n\t\t\t\t\t\t\tpreviousEnd =\n\t\t\t\t\t\t\t\tpoints[\n\t\t\t\t\t\t\t\t\tpoints.length - 1\n\t\t\t\t\t\t\t\t];\n\n\n\t\t\t\t\t\t\tisFirstElementOfGroup =\n\t\t\t\t\t\t\t\tfalse;\n\n\t\t\t\t\t\t}\n\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t}\n\t\t);\n\n\n\t\ttraceTotalWeight =\n\t\t\ttraceRoute.reduce(\n\t\t\t\tfunction (sum, segment) {\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\tsum +\n\t\t\t\t\t\tsegment.weight\n\t\t\t\t\t);\n\n\t\t\t\t},\n\t\t\t\t0\n\t\t\t);\n\n\t}\n\n\n\tfunction getPosition(progress) {\n\n\t\tif (\n\t\t\t!traceRoute.length ||\n\t\t\t!traceTotalWeight\n\t\t) {\n\n\t\t\t\/*\n\t\t\t * Veilige fallback naar het midden.\n\t\t\t *\/\n\t\t\treturn {\n\n\t\t\t\tx:\n\t\t\t\t\tlogoX +\n\t\t\t\t\tlogoWidth \/ 2,\n\n\t\t\t\ty:\n\t\t\t\t\tlogoY +\n\t\t\t\t\tlogoHeight \/ 2,\n\n\t\t\t\tdirection: 1,\n\n\t\t\t\tsprayStrength: 0,\n\n\t\t\t\twrist: 0,\n\n\t\t\t\tisSpraying: false\n\n\t\t\t};\n\n\t\t}\n\n\n\t\tconst targetWeight =\n\t\t\tprogress *\n\t\t\ttraceTotalWeight;\n\n\n\t\tlet accumulated =\n\t\t\t0;\n\n\n\t\tlet segment =\n\t\t\ttraceRoute[\n\t\t\t\ttraceRoute.length - 1\n\t\t\t];\n\n\n\t\tlet localProgress =\n\t\t\t1;\n\n\n\t\tfor (\n\t\t\tlet i = 0;\n\t\t\ti < traceRoute.length;\n\t\t\ti++\n\t\t) {\n\n\t\t\tconst candidate =\n\t\t\t\ttraceRoute[i];\n\n\n\t\t\tif (\n\t\t\t\taccumulated +\n\t\t\t\tcandidate.weight >=\n\t\t\t\ttargetWeight\n\t\t\t) {\n\n\t\t\t\tsegment =\n\t\t\t\t\tcandidate;\n\n\n\t\t\t\tlocalProgress =\n\t\t\t\t\t(\n\t\t\t\t\t\ttargetWeight -\n\t\t\t\t\t\taccumulated\n\t\t\t\t\t) \/\n\t\t\t\t\tcandidate.weight;\n\n\n\t\t\t\tbreak;\n\n\t\t\t}\n\n\n\t\t\taccumulated +=\n\t\t\t\tcandidate.weight;\n\n\t\t}\n\n\n\t\tlocalProgress =\n\t\t\tclamp(\n\t\t\t\tlocalProgress,\n\t\t\t\t0,\n\t\t\t\t1\n\t\t\t);\n\n\n\t\t\/*\n\t\t * Tijdens actieve spray gebruiken we een zachte ease.\n\t\t * Reissprongen blijven iets sneller.\n\t\t *\/\n\t\t\/*\n\t\t * Belangrijk voor een natuurlijke beweging:\n\t\t * GEEN easing per klein vectorsegment.\n\t\t * Anders versnelt\/vertraagt de hand tientallen keren per letter.\n\t\t *\/\n\t\tlet t =\n\t\t\tlocalProgress;\n\n\n\t\t\/*\n\t\t * Bij de overgang FIETS -> O en O -> FIT:\n\t\t * eerst even loslaten, dan rustig verplaatsen.\n\t\t *\/\n\t\tif (\n\t\t\tsegment.type ===\n\t\t\t'group-move'\n\t\t) {\n\n\t\t\tconst hold =\n\t\t\t\t0.24;\n\n\n\t\t\tif (\n\t\t\t\tlocalProgress <\n\t\t\t\thold\n\t\t\t) {\n\n\t\t\t\tt = 0;\n\n\t\t\t}\n\t\t\telse {\n\n\t\t\t\tconst travelT =\n\t\t\t\t\t(\n\t\t\t\t\t\tlocalProgress -\n\t\t\t\t\t\thold\n\t\t\t\t\t) \/\n\t\t\t\t\t(\n\t\t\t\t\t\t1 -\n\t\t\t\t\t\thold\n\t\t\t\t\t);\n\n\n\t\t\t\tt =\n\t\t\t\t\teaseInOutSine(\n\t\t\t\t\t\ttravelT\n\t\t\t\t\t);\n\n\t\t\t}\n\n\t\t}\n\t\telse if (\n\t\t\tsegment.type ===\n\t\t\t'move'\n\t\t) {\n\n\t\t\tt =\n\t\t\t\teaseInOutSine(\n\t\t\t\t\tlocalProgress\n\t\t\t\t);\n\n\t\t}\n\n\n\t\tlet x =\n\t\t\tlerp(\n\t\t\t\tsegment.from.x,\n\t\t\t\tsegment.to.x,\n\t\t\t\tt\n\t\t\t);\n\n\n\t\tlet y =\n\t\t\tlerp(\n\t\t\t\tsegment.from.y,\n\t\t\t\tsegment.to.y,\n\t\t\t\tt\n\t\t\t);\n\n\n\t\tconst dx =\n\t\t\tsegment.to.x -\n\t\t\tsegment.from.x;\n\n\n\t\tconst dy =\n\t\t\tsegment.to.y -\n\t\t\tsegment.from.y;\n\n\n\t\tconst direction =\n\t\t\tdx >= 0\n\t\t\t\t? 1\n\t\t\t\t: -1;\n\n\n\t\tconst isSpraying =\n\t\t\tsegment.type ===\n\t\t\t'spray';\n\n\n\t\t\/*\n\t\t * Kleine hand-onrust alleen tijdens echt spuiten.\n\t\t *\/\n\t\tif (isSpraying) {\n\n\t\t\tx +=\n\t\t\t\tMath.sin(\n\t\t\t\t\tprogress *\n\t\t\t\t\tMath.PI *\n\t\t\t\t\t9\n\t\t\t\t) *\n\t\t\t\t0.22;\n\n\n\t\t\ty +=\n\t\t\t\tMath.sin(\n\t\t\t\t\tprogress *\n\t\t\t\t\tMath.PI *\n\t\t\t\t\t7\n\t\t\t\t) *\n\t\t\t\t0.30;\n\n\t\t}\n\n\n\t\t\/*\n\t\t * Pols reageert subtiel op de bewegingsrichting van het vectorpad.\n\t\t *\/\n\t\tconst tangentAngle =\n\t\t\tMath.atan2(\n\t\t\t\tdy,\n\t\t\t\tdx\n\t\t\t) *\n\t\t\t180 \/\n\t\t\tMath.PI;\n\n\n\t\tconst wrist =\n\t\t\tclamp(\n\t\t\t\ttangentAngle *\n\t\t\t\t0.045,\n\t\t\t\t-2.2,\n\t\t\t\t2.2\n\t\t\t) +\n\t\t\t(\n\t\t\t\tisSpraying\n\t\t\t\t\t? Math.sin(\n\t\t\t\t\t\tprogress *\n\t\t\t\t\t\tMath.PI *\n\t\t\t\t\t\t5\n\t\t\t\t\t) *\n\t\t\t\t\t0.14\n\t\t\t\t\t: 0\n\t\t\t);\n\n\n\t\tconst sprayStrength =\n\t\t\tisSpraying\n\t\t\t\t? 0.90 +\n\t\t\t\t\t(\n\t\t\t\t\t\t(\n\t\t\t\t\t\t\tMath.sin(\n\t\t\t\t\t\t\t\tprogress *\n\t\t\t\t\t\t\t\tMath.PI *\n\t\t\t\t\t\t\t\t23\n\t\t\t\t\t\t\t) +\n\t\t\t\t\t\t\t1\n\t\t\t\t\t\t) \/\n\t\t\t\t\t\t2\n\t\t\t\t\t) *\n\t\t\t\t\t0.10\n\t\t\t\t: 0;\n\n\n\t\treturn {\n\n\t\t\tx: x,\n\t\t\ty: y,\n\n\t\t\tdirection:\n\t\t\t\tdirection,\n\n\t\t\tsprayStrength:\n\t\t\t\tsprayStrength,\n\n\t\t\twrist:\n\t\t\t\twrist,\n\n\t\t\tisSpraying:\n\t\t\t\tisSpraying,\n\n\t\t\tgroup:\n\t\t\t\tsegment.group || null\n\n\t\t};\n\n\t}\n\n\n\t\/* =====================================================\n\t   ANIMATION\n\t===================================================== *\/\n\n\tfunction animate(time) {\n\n\t\tanimationFrameCount++;\n\n\t\tfadeWetPaint();\n\n\t\tif (!startTime) {\n\t\t\tstartTime = time;\n\t\t}\n\n\n\t\tconst elapsed =\n\t\t\ttime -\n\t\t\tstartTime;\n\n\n\t\tlet progress =\n\t\t\telapsed \/\n\t\t\tgetDuration();\n\n\n\t\tprogress =\n\t\t\tMath.min(\n\t\t\t\tprogress,\n\t\t\t\t1\n\t\t\t);\n\n\n\t\tconst position =\n\t\t\tgetPosition(\n\t\t\t\tprogress\n\t\t\t);\n\n\n\t\t\/*\n\t\t * Start-puff bij begin van een nieuw actief spraydeel.\n\t\t *\/\n\t\tif (\n\t\t\tposition.isSpraying &&\n\t\t\t(\n\t\t\t\t!lastSprayState ||\n\t\t\t\tposition.group !==\n\t\t\t\t\tlastSprayGroup\n\t\t\t)\n\t\t) {\n\n\t\t\tsprayPuff(\n\t\t\t\tposition.x,\n\t\t\t\tposition.y\n\t\t\t);\n\n\t\t}\n\n\n\t\tlastSprayState =\n\t\t\tposition.isSpraying;\n\n\n\t\tlastSprayGroup =\n\t\t\tposition.isSpraying\n\t\t\t\t? position.group\n\t\t\t\t: lastSprayGroup;\n\n\n\t\tmoveCan(\n\t\t\tposition.x,\n\t\t\tposition.y,\n\t\t\tposition.direction,\n\t\t\tposition.wrist,\n\t\t\tposition.sprayStrength\n\t\t);\n\n\n\t\t\/*\n\t\t * Meer dekking tijdens actieve spray,\n\t\t * minder tijdens de overgang.\n\t\t *\/\n\t\tconst sprayBursts =\n\t\t\twidth < 768\n\t\t\t\t? (\n\t\t\t\t\tposition.sprayStrength > 0.7\n\t\t\t\t\t\t? 2\n\t\t\t\t\t\t: 1\n\t\t\t\t)\n\t\t\t\t: (\n\t\t\t\t\tposition.sprayStrength > 0.7\n\t\t\t\t\t\t? 3\n\t\t\t\t\t\t: 1\n\t\t\t\t);\n\n\n\t\tfor (\n\t\t\tlet i = 0;\n\t\t\ti < sprayBursts;\n\t\t\ti++\n\t\t) {\n\n\t\t\tconst spread =\n\t\t\t\tposition.sprayStrength > 0.7\n\t\t\t\t\t? 3\n\t\t\t\t\t: 1.5;\n\n\n\t\t\tsprayMaskAt(\n\t\t\t\tposition.x +\n\t\t\t\trandom(\n\t\t\t\t\t-spread,\n\t\t\t\t\tspread\n\t\t\t\t),\n\n\t\t\t\tposition.y +\n\t\t\t\trandom(\n\t\t\t\t\t-spread,\n\t\t\t\t\tspread\n\t\t\t\t)\n\t\t\t);\n\n\t\t}\n\n\n\t\tif (\n\t\t\tposition.sprayStrength >\n\t\t\t0.60 &&\n\t\t\t(\n\t\t\t\t(\n\t\t\t\t\twidth >= 768 &&\n\t\t\t\t\tanimationFrameCount % 2 === 0\n\t\t\t\t) ||\n\t\t\t\t(\n\t\t\t\t\twidth < 768 &&\n\t\t\t\t\tanimationFrameCount % 3 === 0\n\t\t\t\t)\n\t\t\t)\n\t\t) {\n\n\t\t\tdrawOverspray(\n\t\t\t\tposition.x +\n\t\t\t\t\trandom(\n\t\t\t\t\t\t-1.5,\n\t\t\t\t\t\t1.5\n\t\t\t\t\t),\n\n\t\t\t\tposition.y +\n\t\t\t\t\trandom(\n\t\t\t\t\t\t-1.5,\n\t\t\t\t\t\t1.5\n\t\t\t\t\t)\n\t\t\t);\n\n\t\t}\n\n\n\t\trenderRevealedLogo();\n\n\n\t\tif (\n\t\t\tprogress <\n\t\t\t1\n\t\t) {\n\n\t\t\tanimationFrame =\n\t\t\t\trequestAnimationFrame(\n\t\t\t\t\tanimate\n\t\t\t\t);\n\n\t\t}\n\t\telse {\n\n\t\t\tfinish();\n\n\t\t}\n\n\t}\n\n\n\t\/* =====================================================\n\t   V5.2.13 \u2014 VOLGENDE RIJ OMHOOG SCHUIVEN\n\t===================================================== *\/\n\n\tfunction getNextPageRow() {\n\n\t\t\/*\n\t\t * Impreza gebruikt normaal .l-section.\n\t\t * Als de animatie in een andere WPBakery-structuur staat,\n\t\t * hebben we een paar veilige fallbacks.\n\t\t *\/\n\t\tconst currentRow =\n\t\t\thero.closest('.l-section') ||\n\t\t\thero.closest('.vc_row') ||\n\t\t\thero.closest('.wpb_row') ||\n\t\t\thero.parentElement;\n\n\n\t\tif (!currentRow) {\n\t\t\treturn null;\n\t\t}\n\n\n\t\tlet nextRow =\n\t\t\tcurrentRow.nextElementSibling;\n\n\n\t\t\/*\n\t\t * Sla eventueel lege\/script\/style nodes over.\n\t\t *\/\n\t\twhile (\n\t\t\tnextRow &&\n\t\t\t(\n\t\t\t\tnextRow.tagName === 'SCRIPT' ||\n\t\t\t\tnextRow.tagName === 'STYLE'\n\t\t\t)\n\t\t) {\n\n\t\t\tnextRow =\n\t\t\t\tnextRow.nextElementSibling;\n\n\t\t}\n\n\n\t\treturn nextRow;\n\n\t}\n\n\n\tfunction easeInOutCubicScroll(t) {\n\n\t\treturn t < 0.5\n\t\t\t? 4 * t * t * t\n\t\t\t: 1 - Math.pow(-2 * t + 2, 3) \/ 2;\n\n\t}\n\n\n\tfunction scrollNextRowIntoView() {\n\n\t\tif (\n\t\t\t!SETTINGS.autoAdvanceToNextRow\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\n\t\t\/*\n\t\t * V5.2.15:\n\t\t * alleen automatisch doorscrollen wanneer:\n\t\t * 1. de bezoeker bij het laden bovenaan stond;\n\t\t * 2. de bezoeker daarna niet zelf heeft gescrold.\n\t\t *\/\n\t\tif (\n\t\t\t!pageStartedAtTop ||\n\t\t\tuserScrolledAfterIntro\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\n\t\tconst nextRow =\n\t\t\tgetNextPageRow();\n\n\n\t\tif (!nextRow) {\n\t\t\treturn;\n\t\t}\n\n\n\t\tif (prefersReducedMotion()) {\n\n\t\t\twindow.scrollTo(\n\t\t\t\t0,\n\t\t\t\tnextRow.getBoundingClientRect().top +\n\t\t\t\twindow.pageYOffset -\n\t\t\t\tgetAutoAdvanceOffset()\n\t\t\t);\n\n\t\t\treturn;\n\n\t\t}\n\n\n\t\tignoreScrollTracking =\n\t\t\ttrue;\n\n\n\t\tconst startY =\n\t\t\twindow.pageYOffset;\n\n\n\t\tconst targetY =\n\t\t\tnextRow.getBoundingClientRect().top +\n\t\t\tstartY -\n\t\t\tgetAutoAdvanceOffset();\n\n\n\t\tconst distance =\n\t\t\ttargetY -\n\t\t\tstartY;\n\n\n\t\tconst startTime =\n\t\t\tperformance.now();\n\n\n\t\tfunction frame(now) {\n\n\t\t\tconst elapsed =\n\t\t\t\tnow -\n\t\t\t\tstartTime;\n\n\n\t\t\tconst progress =\n\t\t\t\tclamp(\n\t\t\t\t\telapsed \/\n\t\t\t\t\t\tSETTINGS.autoAdvanceDuration,\n\t\t\t\t\t0,\n\t\t\t\t\t1\n\t\t\t\t);\n\n\n\t\t\tconst eased =\n\t\t\t\teaseInOutCubicScroll(\n\t\t\t\t\tprogress\n\t\t\t\t);\n\n\n\t\t\twindow.scrollTo(\n\t\t\t\t0,\n\t\t\t\tstartY +\n\t\t\t\t\tdistance *\n\t\t\t\t\teased\n\t\t\t);\n\n\n\t\t\tif (progress < 1) {\n\n\t\t\t\trequestAnimationFrame(\n\t\t\t\t\tframe\n\t\t\t\t);\n\n\t\t\t}\n\t\t\telse {\n\n\t\t\t\trequestAnimationFrame(\n\t\t\t\t\tfunction () {\n\n\t\t\t\t\t\tignoreScrollTracking =\n\t\t\t\t\t\t\tfalse;\n\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t}\n\n\t\t}\n\n\n\t\trequestAnimationFrame(\n\t\t\tframe\n\t\t);\n\n\t}\n\n\n\t\/* =====================================================\n\t   EINDE\n\n\t   Zorgt dat uiteindelijk exact het volledige\n\t   originele logo zichtbaar is.\n\t===================================================== *\/\n\n\tfunction finish() {\n\n\t\tmist.style.opacity =\n\t\t\t'0';\n\n\n\t\thero.classList.add(\n\t\t\t'is-finishing'\n\t\t);\n\n\n\t\t\/*\n\t\t * Kort vasthouden zodat de laatste spray \"landt\".\n\t\t *\/\n\t\tsetTimeout(\n\t\t\tfunction () {\n\n\t\t\t\t\/*\n\t\t\t\t * Ruis weg.\n\t\t\t\t *\/\n\t\t\t\tparticleCtx.clearRect(\n\t\t\t\t\t0,\n\t\t\t\t\t0,\n\t\t\t\t\twidth,\n\t\t\t\t\theight\n\t\t\t\t);\n\n\n\t\t\t\t\/*\n\t\t\t\t * Natte laag wegfaden via CSS.\n\t\t\t\t *\/\n\t\t\t\twetCanvas.style.opacity =\n\t\t\t\t\t'0';\n\n\n\t\t\t\t\/*\n\t\t\t\t * Origineel logo volledig strak tonen.\n\t\t\t\t *\/\n\t\t\t\tresultCtx.clearRect(\n\t\t\t\t\t0,\n\t\t\t\t\t0,\n\t\t\t\t\twidth,\n\t\t\t\t\theight\n\t\t\t\t);\n\n\n\t\t\t\tresultCtx.drawImage(\n\t\t\t\t\tmaskCanvas,\n\t\t\t\t\t0,\n\t\t\t\t\t0,\n\t\t\t\t\twidth,\n\t\t\t\t\theight\n\t\t\t\t);\n\n\n\t\t\t\thero.classList.add(\n\t\t\t\t\t'is-finished'\n\t\t\t\t);\n\n\n\t\t\t\tconst baseAnchorX =\n\t\t\t\t\twidth < 768\n\t\t\t\t\t\t? width *\n\t\t\t\t\t\t\tSETTINGS.armAnchorXMobile\n\t\t\t\t\t\t: width *\n\t\t\t\t\t\t\tSETTINGS.armAnchorXDesktop;\n\n\n\t\t\t\tconst anchorX =\n\t\t\t\t\tbaseAnchorX;\n\n\n\t\t\t\tconst anchorY =\n\t\t\t\t\twidth < 768\n\t\t\t\t\t\t? height *\n\t\t\t\t\t\t\tSETTINGS.armAnchorYMobile\n\t\t\t\t\t\t: height *\n\t\t\t\t\t\t\tSETTINGS.armAnchorYDesktop;\n\n\n\t\t\t\t\/*\n\t\t\t\t * Arm zakt rustig terug.\n\t\t\t\t *\/\n\t\t\t\tsprayCan.style.transition =\n\t\t\t\t\t`\n\t\t\t\t\ttransform\n\t\t\t\t\t${SETTINGS.finaleExitDuration \/ 1000}s\n\t\t\t\t\tcubic-bezier(.4,0,.2,1)\n\t\t\t\t\t`;\n\n\n\t\t\t\tsprayCan.style.transform =\n\t\t\t\t\t`\n\t\t\t\t\ttranslate3d(\n\t\t\t\t\t\t${anchorX}px,\n\t\t\t\t\t\t${anchorY}px,\n\t\t\t\t\t\t0\n\t\t\t\t\t)\n\n\t\t\t\t\trotate(22deg)\n\n\t\t\t\t\tscale(.76)\n\t\t\t\t\t`;\n\n\n\t\t\t\t\/*\n\t\t\t\t * V5.2.26:\n\t\t\t\t * De volledige sprayanimatie is nu klaar.\n\t\t\t\t * Vanaf dit moment mag Complianz zichtbaar worden.\n\t\t\t\t *\/\n\t\t\t\tdocument.documentElement.classList.add(\n\t\t\t\t\t'fof-animation-complete'\n\t\t\t\t);\n\n\n\t\t\t\t\/*\n\t\t\t\t * Daarna schuift de volgende rij vanzelf omhoog.\n\t\t\t\t *\/\n\t\t\t\tsetTimeout(\n\t\t\t\t\tscrollNextRowIntoView,\n\t\t\t\t\tSETTINGS.autoAdvanceDelay\n\t\t\t\t);\n\n\t\t\t},\n\t\t\tSETTINGS.finaleHold\n\t\t);\n\n\t}\n\n\n\t\/* =====================================================\n\t   RESET\n\t===================================================== *\/\n\n\tfunction reset() {\n\n\t\t\/*\n\t\t * V5.2.24:\n\t\t * animatielaag blijft nog verborgen totdat:\n\t\t * - canvassen zijn geleegd;\n\t\t * - eerste letterpositie is berekend;\n\t\t * - arm exact in zijn entree-startpose staat.\n\t\t *\/\n\t\thero.classList.remove(\n\t\t\t'custom-fof-animation-ready'\n\t\t);\n\n\n\t\tcancelAnimationFrame(\n\t\t\tanimationFrame\n\t\t);\n\n\n\t\t\/*\n\t\t * V5.2.2:\n\t\t * voorkom dat de browser \u00e9\u00e9n frame lang de default\n\t\t * afbeelding midden\/in de hero toont.\n\t\t *\/\n\t\tsprayCan.style.opacity =\n\t\t\t'0';\n\n\n\t\thero.classList.remove(\n\t\t\t'is-finished'\n\t\t);\n\n\n\t\thero.classList.remove(\n\t\t\t'is-finishing'\n\t\t);\n\n\n\t\twetCanvas.style.opacity =\n\t\t\t'';\n\n\n\t\tstartTime =\n\t\t\tnull;\n\n\n\t\tresultCtx.clearRect(\n\t\t\t0,\n\t\t\t0,\n\t\t\twidth,\n\t\t\theight\n\t\t);\n\n\n\t\twetCtx.clearRect(\n\t\t\t0,\n\t\t\t0,\n\t\t\twidth,\n\t\t\theight\n\t\t);\n\n\n\t\tparticleCtx.clearRect(\n\t\t\t0,\n\t\t\t0,\n\t\t\twidth,\n\t\t\theight\n\t\t);\n\n\n\t\tsprayMaskCtx.clearRect(\n\t\t\t0,\n\t\t\t0,\n\t\t\twidth,\n\t\t\theight\n\t\t);\n\n\n\t\tconst first =\n\t\t\tgetPosition(0);\n\n\n\t\t\/*\n\t\t * Nieuwe run: smoothing opnieuw starten.\n\t\t *\/\n\t\tarmNozzleX = null;\n\t\tarmNozzleY = null;\n\t\tarmAnchorVisualX = null;\n\t\tarmAnchorVisualY = null;\n\t\tarmScaleVisual = null;\n\t\tarmRotationVisual = null;\n\t\tarmWristVisual = 0;\n\t\tanimationFrameCount = 0;\n\n\t\tlastSprayState = false;\n\t\tlastSprayGroup = null;\n\t\tentranceComplete = false;\n\n\n\t\t\/*\n\t\t * =================================================\n\t\t * V5.2.1 \u2014 ENTREE ZONDER HORIZONTALE SPRINT\n\t\t * =================================================\n\t\t *\n\t\t * Eerst berekenen we exact de uiteindelijke armpositie\n\t\t * voor het eerste punt van FIETS.\n\t\t *\n\t\t * Vervolgens plaatsen we de arm RECHT ONDER die positie.\n\t\t * Hij hoeft dus alleen omhoog te komen en niet eerst\n\t\t * vanuit het midden naar links te schieten.\n\t\t *\/\n\n\t\tsprayCan.style.transition =\n\t\t\t'none';\n\n\n\t\t\/*\n\t\t * Initialiseer de echte doelpose voor de eerste F.\n\t\t *\/\n\t\tmoveCan(\n\t\t\tfirst.x,\n\t\t\tfirst.y,\n\t\t\tfirst.direction,\n\t\t\tfirst.wrist,\n\t\t\t0\n\t\t);\n\n\n\t\t\/*\n\t\t * Geen spraymist tijdens de entree.\n\t\t *\/\n\t\tmist.style.opacity =\n\t\t\t'0';\n\n\n\t\tconst entranceAnchorX =\n\t\t\tarmAnchorVisualX;\n\n\n\t\tconst entranceAnchorY =\n\t\t\tarmAnchorVisualY !== null\n\t\t\t\t? armAnchorVisualY\n\t\t\t\t: (\n\t\t\t\t\twidth < 768\n\t\t\t\t\t\t? height *\n\t\t\t\t\t\t\tSETTINGS.armAnchorYMobile\n\t\t\t\t\t\t: height *\n\t\t\t\t\t\t\tSETTINGS.armAnchorYDesktop\n\t\t\t\t);\n\n\n\t\tconst entranceTargetScale =\n\t\t\tarmScaleVisual;\n\n\n\t\tconst entranceTargetRotation =\n\t\t\tarmRotationVisual;\n\n\n\t\tconst entranceDrop =\n\t\t\twidth < 768\n\t\t\t\t? SETTINGS.armEntranceDropMobile\n\t\t\t\t: SETTINGS.armEntranceDropDesktop;\n\n\n\t\t\/*\n\t\t * Startpositie:\n\t\t * exact dezelfde X als eerste spraypunt,\n\t\t * alleen lager, iets kleiner en iets verder teruggedraaid.\n\t\t *\/\n\t\tsprayCan.style.transform =\n\t\t\t`\n\t\t\ttranslate3d(\n\t\t\t\t${entranceAnchorX}px,\n\t\t\t\t${entranceAnchorY + entranceDrop}px,\n\t\t\t\t0\n\t\t\t)\n\n\t\t\trotate(\n\t\t\t\t${entranceTargetRotation +\n\t\t\t\t\tSETTINGS.armEntranceRotationOffset}deg\n\t\t\t)\n\n\t\t\tscale(\n\t\t\t\t${entranceTargetScale *\n\t\t\t\t\tSETTINGS.armEntranceScaleFactor}\n\t\t\t)\n\t\t\t`;\n\n\n\t\t\/*\n\t\t * V5.2.24:\n\t\t * Nu pas is de volledige startsituatie correct.\n\t\t * Tot dit moment waren logo\/canvas\/arm volledig verborgen.\n\t\t *\/\n\t\thero.classList.add(\n\t\t\t'custom-fof-animation-ready'\n\t\t);\n\n\n\t\t\/*\n\t\t * Eerst layout laten verwerken, daarna pas de arm zelf\n\t\t * zichtbaar maken. Hierdoor kan er geen oud canvasframe\n\t\t * of half getekend logo v\u00f3\u00f3r de entree verschijnen.\n\t\t *\/\n\t\trequestAnimationFrame(\n\t\t\tfunction () {\n\n\t\t\t\trequestAnimationFrame(\n\t\t\t\t\tfunction () {\n\n\t\t\t\t\t\tsprayCan.style.opacity =\n\t\t\t\t\t\t\t'1';\n\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t}\n\t\t);\n\n\n\t\tsetTimeout(\n\t\t\tfunction () {\n\n\t\t\t\tsprayCan.style.transition =\n\t\t\t\t\t`\n\t\t\t\t\ttransform\n\t\t\t\t\t${getEntranceDuration() \/ 1000}s\n\t\t\t\t\tcubic-bezier(.22,1,.36,1)\n\t\t\t\t\t`;\n\n\n\t\t\t\t\/*\n\t\t\t\t * Alleen omhoog naar exact dezelfde eerste pose.\n\t\t\t\t *\/\n\t\t\t\tsprayCan.style.transform =\n\t\t\t\t\t`\n\t\t\t\t\ttranslate3d(\n\t\t\t\t\t\t${entranceAnchorX}px,\n\t\t\t\t\t\t${entranceAnchorY}px,\n\t\t\t\t\t\t0\n\t\t\t\t\t)\n\n\t\t\t\t\trotate(\n\t\t\t\t\t\t${entranceTargetRotation}deg\n\t\t\t\t\t)\n\n\t\t\t\t\tscale(\n\t\t\t\t\t\t${entranceTargetScale}\n\t\t\t\t\t)\n\t\t\t\t\t`;\n\n\t\t\t},\n\t\t\t40\n\t\t);\n\n\n\t\tsetTimeout(\n\t\t\tfunction () {\n\n\t\t\t\tsprayCan.style.transition =\n\t\t\t\t\t'none';\n\n\n\t\t\t\t\/*\n\t\t\t\t * Houd de smoothing-state gelijk aan de pose\n\t\t\t\t * waar de entree zojuist ge\u00ebindigd is.\n\t\t\t\t *\/\n\t\t\t\tarmAnchorVisualX =\n\t\t\t\t\tentranceAnchorX;\n\n\t\t\t\tarmAnchorVisualY =\n\t\t\t\t\tentranceAnchorY;\n\n\t\t\t\tarmScaleVisual =\n\t\t\t\t\tentranceTargetScale;\n\n\t\t\t\tarmRotationVisual =\n\t\t\t\t\tentranceTargetRotation;\n\n\n\t\t\t\tanimationFrame =\n\t\t\t\t\trequestAnimationFrame(\n\t\t\t\t\t\tanimate\n\t\t\t\t\t);\n\n\t\t\t},\n\t\t\tgetEntranceDuration() +\n\t\t\tgetEntranceSettle()\n\t\t);\n\n\t}\n\n\n\t\/* =====================================================\n\t   EVENTS\n\t===================================================== *\/\n\n\treplay.addEventListener(\n\t\t'click',\n\t\treset\n\t);\n\n\n\tlet resizeTimer = null;\n\n\n\twindow.addEventListener(\n\t\t'resize',\n\t\tfunction () {\n\n\t\t\tclearTimeout(\n\t\t\t\tresizeTimer\n\t\t\t);\n\n\n\t\t\tresizeTimer =\n\t\t\t\tsetTimeout(\n\t\t\t\t\tfunction () {\n\n\t\t\t\t\t\t\/*\n\t\t\t\t\t\t * V5.2.25 \u2014 BELANGRIJK\n\t\t\t\t\t\t *\n\t\t\t\t\t\t * Een resize mag de animatie NOOIT opnieuw starten.\n\t\t\t\t\t\t *\n\t\t\t\t\t\t * Het locken\/ontgrendelen van de pagina,\n\t\t\t\t\t\t * scrollbar-wijzigingen en mobiele browserbalken\n\t\t\t\t\t\t * kunnen tijdens de eerste load een resize-event\n\t\t\t\t\t\t * veroorzaken. In eerdere versies riep dat reset()\n\t\t\t\t\t\t * aan, waardoor je precies dit zag:\n\t\t\t\t\t\t *\n\t\t\t\t\t\t * groen \u2192 animatie start \u2192 arm schiet terug \u2192\n\t\t\t\t\t\t * animatie begint opnieuw.\n\t\t\t\t\t\t *\n\t\t\t\t\t\t * Tijdens intro of lopende animatie doen we daarom\n\t\t\t\t\t\t * helemaal niets met resize.\n\t\t\t\t\t\t *\/\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t!hero.classList.contains(\n\t\t\t\t\t\t\t\t'is-finished'\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t) {\n\n\t\t\t\t\t\t\treturn;\n\n\t\t\t\t\t\t}\n\n\n\t\t\t\t\t\t\/*\n\t\t\t\t\t\t * Alleen wanneer de animatie volledig klaar is,\n\t\t\t\t\t\t * mag de geometrie worden bijgewerkt.\n\t\t\t\t\t\t *\/\n\t\t\t\t\t\tresize();\n\n\t\t\t\t\t\tdrawOriginalLogo();\n\n\t\t\t\t\t\tcreateTraceRoute();\n\n\n\t\t\t\t\t\t\/*\n\t\t\t\t\t\t * Na resize de nette eindstaat opnieuw tekenen.\n\t\t\t\t\t\t *\/\n\t\t\t\t\t\tresultCtx.clearRect(\n\t\t\t\t\t\t\t0,\n\t\t\t\t\t\t\t0,\n\t\t\t\t\t\t\twidth,\n\t\t\t\t\t\t\theight\n\t\t\t\t\t\t);\n\n\n\t\t\t\t\t\tresultCtx.drawImage(\n\t\t\t\t\t\t\tmaskCanvas,\n\t\t\t\t\t\t\t0,\n\t\t\t\t\t\t\t0,\n\t\t\t\t\t\t\twidth,\n\t\t\t\t\t\t\theight\n\t\t\t\t\t\t);\n\n\t\t\t\t\t},\n\t\t\t\t\t220\n\t\t\t\t);\n\n\t\t}\n\t);\n\n\n\t\/* =====================================================\n\t   V5.2.27 \u2014 COMPLIANZ ROBUUST VERBERGEN\n\t===================================================== *\/\n\n\tlet complianzObserver =\n\t\tnull;\n\n\n\tfunction getComplianzElements() {\n\n\t\treturn document.querySelectorAll(\n\t\t\t[\n\t\t\t\t'#cmplz-cookiebanner-container',\n\t\t\t\t'.cmplz-cookiebanner-container',\n\t\t\t\t'.cmplz-cookiebanner',\n\t\t\t\t'.cmplz-manage-consent'\n\t\t\t].join(',')\n\t\t);\n\n\t}\n\n\n\tfunction forceHideComplianz() {\n\n\t\tdocument.documentElement.classList.add(\n\t\t\t'fof-animation-running'\n\t\t);\n\n\t\tdocument.documentElement.classList.remove(\n\t\t\t'fof-animation-complete'\n\t\t);\n\n\n\t\tgetComplianzElements().forEach(\n\t\t\tfunction (element) {\n\n\t\t\t\telement.style.setProperty(\n\t\t\t\t\t'visibility',\n\t\t\t\t\t'hidden',\n\t\t\t\t\t'important'\n\t\t\t\t);\n\n\t\t\t\telement.style.setProperty(\n\t\t\t\t\t'opacity',\n\t\t\t\t\t'0',\n\t\t\t\t\t'important'\n\t\t\t\t);\n\n\t\t\t\telement.style.setProperty(\n\t\t\t\t\t'pointer-events',\n\t\t\t\t\t'none',\n\t\t\t\t\t'important'\n\t\t\t\t);\n\n\t\t\t}\n\t\t);\n\n\n\t\t\/*\n\t\t * Complianz plaatst de banner soms pas later.\n\t\t * Deze observer pakt ook zo'n later toegevoegd element.\n\t\t *\/\n\t\tif (\n\t\t\t!complianzObserver &&\n\t\t\tdocument.documentElement\n\t\t) {\n\n\t\t\tcomplianzObserver =\n\t\t\t\tnew MutationObserver(\n\t\t\t\t\tfunction () {\n\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tdocument.documentElement.classList.contains(\n\t\t\t\t\t\t\t\t'fof-animation-running'\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t) {\n\n\t\t\t\t\t\t\tgetComplianzElements().forEach(\n\t\t\t\t\t\t\t\tfunction (element) {\n\n\t\t\t\t\t\t\t\t\telement.style.setProperty(\n\t\t\t\t\t\t\t\t\t\t'visibility',\n\t\t\t\t\t\t\t\t\t\t'hidden',\n\t\t\t\t\t\t\t\t\t\t'important'\n\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\telement.style.setProperty(\n\t\t\t\t\t\t\t\t\t\t'opacity',\n\t\t\t\t\t\t\t\t\t\t'0',\n\t\t\t\t\t\t\t\t\t\t'important'\n\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\telement.style.setProperty(\n\t\t\t\t\t\t\t\t\t\t'pointer-events',\n\t\t\t\t\t\t\t\t\t\t'none',\n\t\t\t\t\t\t\t\t\t\t'important'\n\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t}\n\n\t\t\t\t\t}\n\t\t\t\t);\n\n\n\t\t\tcomplianzObserver.observe(\n\t\t\t\tdocument.documentElement,\n\t\t\t\t{\n\t\t\t\t\tchildList: true,\n\t\t\t\t\tsubtree: true\n\t\t\t\t}\n\t\t\t);\n\n\t\t}\n\n\t}\n\n\n\tfunction releaseComplianz() {\n\n\t\tdocument.documentElement.classList.remove(\n\t\t\t'fof-animation-running'\n\t\t);\n\n\t\treleaseComplianz();\n\n\n\t\tif (complianzObserver) {\n\n\t\t\tcomplianzObserver.disconnect();\n\n\t\t\tcomplianzObserver =\n\t\t\t\tnull;\n\n\t\t}\n\n\n\t\tgetComplianzElements().forEach(\n\t\t\tfunction (element) {\n\n\t\t\t\telement.style.removeProperty(\n\t\t\t\t\t'visibility'\n\t\t\t\t);\n\n\t\t\t\telement.style.removeProperty(\n\t\t\t\t\t'opacity'\n\t\t\t\t);\n\n\t\t\t\telement.style.removeProperty(\n\t\t\t\t\t'pointer-events'\n\t\t\t\t);\n\n\t\t\t}\n\t\t);\n\n\t}\n\n\n\t\/* =====================================================\n\t   V5.2.30 \u2014 TRANSLATEPRESS TAALWISSEL NAAR VOLGENDE RIJ ZONDER HASH\n\t===================================================== *\/\n\n\tfunction isTranslatePressLanguageLink(link) {\n\n\t\tif (!link) {\n\t\t\treturn false;\n\t\t}\n\n\n\t\treturn Boolean(\n\t\t\tlink.closest(\n\t\t\t\t[\n\t\t\t\t\t'.trp-language-switcher',\n\t\t\t\t\t'.trp-language-switcher-container',\n\t\t\t\t\t'.trp-block-container',\n\t\t\t\t\t'.trp-language-item',\n\t\t\t\t\t'.trp-ls-shortcode-language',\n\t\t\t\t\t'.trp-switcher-dropdown-list',\n\t\t\t\t\t'.menu-item-object-language_switcher',\n\t\t\t\t\t'.trp-language-switcher-menu'\n\t\t\t\t].join(',')\n\t\t\t)\n\t\t);\n\n\t}\n\n\n\tfunction prepareTranslatePressTargetUrl(url) {\n\n\t\ttry {\n\n\t\t\tconst parsed =\n\t\t\t\tnew URL(\n\t\t\t\t\turl,\n\t\t\t\t\twindow.location.href\n\t\t\t\t);\n\n\n\t\t\tif (\n\t\t\t\tparsed.origin !==\n\t\t\t\t\twindow.location.origin\n\t\t\t) {\n\n\t\t\t\treturn url;\n\n\t\t\t}\n\n\n\t\t\t\/*\n\t\t\t * Geen #fof-next-row in de zichtbare URL.\n\t\t\t * De doelactie wordt tijdelijk via sessionStorage\n\t\t\t * doorgegeven aan de nieuwe taalpagina.\n\t\t\t *\/\n\t\t\tparsed.hash =\n\t\t\t\t'';\n\n\n\t\t\ttry {\n\n\t\t\t\tsessionStorage.setItem(\n\t\t\t\t\tSETTINGS.translatePressSessionKey,\n\t\t\t\t\t'1'\n\t\t\t\t);\n\n\t\t\t}\n\t\t\tcatch (e) {}\n\n\n\t\t\treturn parsed.toString();\n\n\t\t}\n\t\tcatch (e) {\n\n\t\t\treturn url;\n\n\t\t}\n\n\t}\n\n\n\tdocument.addEventListener(\n\t\t'click',\n\t\tfunction (event) {\n\n\t\t\tconst link =\n\t\t\t\tevent.target.closest(\n\t\t\t\t\t'a[href]'\n\t\t\t\t);\n\n\n\t\t\tif (\n\t\t\t\t!link ||\n\t\t\t\t!isTranslatePressLanguageLink(\n\t\t\t\t\tlink\n\t\t\t\t)\n\t\t\t) {\n\n\t\t\t\treturn;\n\n\t\t\t}\n\n\n\t\t\tconst currentPath =\n\t\t\t\twindow.location.pathname\n\t\t\t\t\t.replace(\n\t\t\t\t\t\t\/\\\/+$\/,\n\t\t\t\t\t\t'\/'\n\t\t\t\t\t);\n\n\n\t\t\t\/*\n\t\t\t * NL-home en vertaalde homes zoals\n\t\t\t * \/en\/, \/de\/, \/fr\/, \/es\/.\n\t\t\t *\/\n\t\t\tconst isHomepage =\n\t\t\t\t\/^\\\/(?:[a-z]{2}(?:-[a-z]{2})?\\\/)?$\/i\n\t\t\t\t\t.test(\n\t\t\t\t\t\tcurrentPath\n\t\t\t\t\t);\n\n\n\t\t\tif (!isHomepage) {\n\t\t\t\treturn;\n\t\t\t}\n\n\n\t\t\tconst href =\n\t\t\t\tlink.getAttribute(\n\t\t\t\t\t'href'\n\t\t\t\t);\n\n\n\t\t\tif (\n\t\t\t\t!href ||\n\t\t\t\thref === '#'\n\t\t\t) {\n\n\t\t\t\treturn;\n\n\t\t\t}\n\n\n\t\t\t\/*\n\t\t\t * De hero is al gezien. Bij de nieuwe taal\n\t\t\t * hoeft hij niet opnieuw te spelen.\n\t\t\t *\/\n\t\t\tmarkHomepageAnimationSeen();\n\n\n\t\t\tconst targetUrl =\n\t\t\t\tprepareTranslatePressTargetUrl(\n\t\t\t\t\thref\n\t\t\t\t);\n\n\n\t\t\tevent.preventDefault();\n\n\n\t\t\twindow.location.href =\n\t\t\t\ttargetUrl;\n\n\t\t},\n\t\ttrue\n\t);\n\n\n\t\/* =====================================================\n\t   V5.2.30 \u2014 TRANSLATEPRESS VOLGENDE RIJ ZONDER HASH\n\t===================================================== *\/\n\n\tasync function handleTranslatePressNextRowLanding() {\n\n\t\tlet shouldGoToNextRow =\n\t\t\tfalse;\n\n\n\t\ttry {\n\n\t\t\tshouldGoToNextRow =\n\t\t\t\tsessionStorage.getItem(\n\t\t\t\t\tSETTINGS.translatePressSessionKey\n\t\t\t\t) === '1';\n\n\t\t}\n\t\tcatch (e) {}\n\n\n\t\tif (\n\t\t\t!shouldGoToNextRow &&\n\t\t\tdocument.documentElement.classList.contains(\n\t\t\t\t'custom-fof-translate-return'\n\t\t\t)\n\t\t) {\n\n\t\t\tshouldGoToNextRow =\n\t\t\t\ttrue;\n\n\t\t}\n\n\n\t\tif (!shouldGoToNextRow) {\n\t\t\treturn false;\n\t\t}\n\n\n\t\t\/*\n\t\t * Cruciaal: de doelpagina blijft onzichtbaar totdat\n\t\t * de juiste rij daadwerkelijk gepositioneerd is.\n\t\t *\/\n\t\tdocument.documentElement.classList.add(\n\t\t\t'custom-fof-translate-return'\n\t\t);\n\n\n\t\ttry {\n\n\t\t\tsessionStorage.removeItem(\n\t\t\t\tSETTINGS.translatePressSessionKey\n\t\t\t);\n\n\t\t}\n\t\tcatch (e) {}\n\n\n\t\tmarkHomepageAnimationSeen();\n\n\n\t\t\/*\n\t\t * Wacht indien nodig tot de volledige DOM klaar is.\n\t\t *\/\n\t\tif (\n\t\t\tdocument.readyState === 'loading'\n\t\t) {\n\n\t\t\tawait new Promise(\n\t\t\t\tfunction (resolve) {\n\n\t\t\t\t\tdocument.addEventListener(\n\t\t\t\t\t\t'DOMContentLoaded',\n\t\t\t\t\t\tresolve,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tonce: true\n\t\t\t\t\t\t}\n\t\t\t\t\t);\n\n\t\t\t\t}\n\t\t\t);\n\n\t\t}\n\n\n\t\t\/*\n\t\t * Twee frames geven Impreza\/WPBakery tijd om de\n\t\t * sectie-layout definitief te berekenen.\n\t\t *\/\n\t\tawait new Promise(\n\t\t\tfunction (resolve) {\n\n\t\t\t\trequestAnimationFrame(\n\t\t\t\t\tfunction () {\n\n\t\t\t\t\t\trequestAnimationFrame(\n\t\t\t\t\t\t\tresolve\n\t\t\t\t\t\t);\n\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t}\n\t\t);\n\n\n\t\tconst nextRow =\n\t\t\tgetNextPageRow();\n\n\n\t\tif (nextRow) {\n\n\t\t\tconst oldScrollBehavior =\n\t\t\t\tdocument.documentElement.style.scrollBehavior;\n\n\n\t\t\tdocument.documentElement.style.scrollBehavior =\n\t\t\t\t'auto';\n\n\n\t\t\twindow.scrollTo(\n\t\t\t\t0,\n\t\t\t\tnextRow.getBoundingClientRect().top +\n\t\t\t\t\twindow.pageYOffset -\n\t\t\t\t\tgetAutoAdvanceOffset()\n\t\t\t);\n\n\n\t\t\tdocument.documentElement.style.scrollBehavior =\n\t\t\t\toldScrollBehavior;\n\n\t\t}\n\n\n\t\t\/*\n\t\t * Nog \u00e9\u00e9n paint wachten nadat scrollTop is gezet.\n\t\t * Pas daarna de pagina tonen.\n\t\t *\/\n\t\tawait new Promise(\n\t\t\tfunction (resolve) {\n\n\t\t\t\trequestAnimationFrame(\n\t\t\t\t\tfunction () {\n\n\t\t\t\t\t\trequestAnimationFrame(\n\t\t\t\t\t\t\tresolve\n\t\t\t\t\t\t);\n\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t}\n\t\t);\n\n\n\t\tdocument.documentElement.classList.remove(\n\t\t\t'custom-fof-translate-return'\n\t\t);\n\n\n\t\t\/*\n\t\t * TRUE betekent: dit was een taalwissel.\n\t\t * init() moet nu stoppen en de hero dus NIET initialiseren.\n\t\t *\/\n\t\treturn true;\n\n\t}\n\n\n\t\/* =====================================================\n\t   V5.2.23 \u2014 ANKER TERUGKEER ZONDER HERO-FLASH\n\t===================================================== *\/\n\n\tfunction revealHashReturnAfterPositioning() {\n\n\t\t\/*\n\t\t * V5.2.25:\n\t\t * Deze class wordt idealiter al in <head> gezet door de\n\t\t * aparte preflight-snippet. Daardoor is de body verborgen\n\t\t * v\u00f3\u00f3r de allereerste browser-paint.\n\t\t *\/\n\t\tif (\n\t\t\t!document.documentElement.classList.contains(\n\t\t\t\t'custom-fof-hash-return'\n\t\t\t)\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\n\t\tfunction positionAndReveal() {\n\n\t\t\tlet target =\n\t\t\t\tnull;\n\n\n\t\t\ttry {\n\n\t\t\t\ttarget =\n\t\t\t\t\tdocument.querySelector(\n\t\t\t\t\t\twindow.location.hash\n\t\t\t\t\t);\n\n\t\t\t}\n\t\t\tcatch (e) {}\n\n\n\t\t\tif (target) {\n\n\t\t\t\t\/*\n\t\t\t\t * Geen smooth scroll hier: het moet v\u00f3\u00f3r de reveal\n\t\t\t\t * direct op de juiste sectie staan.\n\t\t\t\t *\/\n\t\t\t\tconst oldScrollBehavior =\n\t\t\t\t\tdocument.documentElement.style.scrollBehavior;\n\n\n\t\t\t\tdocument.documentElement.style.scrollBehavior =\n\t\t\t\t\t'auto';\n\n\n\t\t\t\ttarget.scrollIntoView(\n\t\t\t\t\t{\n\t\t\t\t\t\tblock: 'start',\n\t\t\t\t\t\tinline: 'nearest'\n\t\t\t\t\t}\n\t\t\t\t);\n\n\n\t\t\t\t\/*\n\t\t\t\t * Sticky header correctie:\n\t\t\t\t * desktop 100px \/ mobiel 60px.\n\t\t\t\t *\/\n\t\t\t\twindow.scrollBy(\n\t\t\t\t\t0,\n\t\t\t\t\t-getAutoAdvanceOffset()\n\t\t\t\t);\n\n\n\t\t\t\tdocument.documentElement.style.scrollBehavior =\n\t\t\t\t\toldScrollBehavior;\n\n\t\t\t}\n\n\n\t\t\trequestAnimationFrame(\n\t\t\t\tfunction () {\n\n\t\t\t\t\tdocument.documentElement.classList.remove(\n\t\t\t\t\t\t'custom-fof-hash-return'\n\t\t\t\t\t);\n\n\t\t\t\t}\n\t\t\t);\n\n\t\t}\n\n\n\t\tif (\n\t\t\tdocument.readyState ===\n\t\t\t'loading'\n\t\t) {\n\n\t\t\tdocument.addEventListener(\n\t\t\t\t'DOMContentLoaded',\n\t\t\t\tfunction () {\n\n\t\t\t\t\trequestAnimationFrame(\n\t\t\t\t\t\tpositionAndReveal\n\t\t\t\t\t);\n\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tonce: true\n\t\t\t\t}\n\t\t\t);\n\n\t\t}\n\t\telse {\n\n\t\t\trequestAnimationFrame(\n\t\t\t\tpositionAndReveal\n\t\t\t);\n\n\t\t}\n\n\t}\n\n\n\t\/* =====================================================\n\t   V5.2.20 \u2014 RELOAD DETECTIE\n\t===================================================== *\/\n\n\tfunction isReloadNavigation() {\n\n\t\ttry {\n\n\t\t\tconst navEntries =\n\t\t\t\tperformance.getEntriesByType(\n\t\t\t\t\t'navigation'\n\t\t\t\t);\n\n\n\t\t\tif (\n\t\t\t\tnavEntries &&\n\t\t\t\tnavEntries.length\n\t\t\t) {\n\n\t\t\t\treturn navEntries[0].type ===\n\t\t\t\t\t'reload';\n\n\t\t\t}\n\n\t\t}\n\t\tcatch (e) {}\n\n\n\t\t\/*\n\t\t * Fallback voor oudere browsers.\n\t\t *\/\n\t\ttry {\n\n\t\t\tif (\n\t\t\t\tperformance.navigation &&\n\t\t\t\ttypeof performance.navigation.type !==\n\t\t\t\t\t'undefined'\n\t\t\t) {\n\n\t\t\t\treturn (\n\t\t\t\t\tperformance.navigation.type ===\n\t\t\t\t\t1\n\t\t\t\t);\n\n\t\t\t}\n\n\t\t}\n\t\tcatch (e) {}\n\n\n\t\treturn false;\n\n\t}\n\n\n\t\/* =====================================================\n\t   V5.2.19 \u2014 INTRO SLECHTS EEN KEER PER SESSIE\n\t===================================================== *\/\n\n\tfunction hasSeenHomepageAnimation() {\n\n\t\ttry {\n\n\t\t\treturn sessionStorage.getItem(\n\t\t\t\tSETTINGS.introSessionKey\n\t\t\t) === '1';\n\n\t\t}\n\t\tcatch (e) {\n\n\t\t\treturn false;\n\n\t\t}\n\n\t}\n\n\n\tfunction markHomepageAnimationSeen() {\n\n\t\ttry {\n\n\t\t\tsessionStorage.setItem(\n\t\t\t\tSETTINGS.introSessionKey,\n\t\t\t\t'1'\n\t\t\t);\n\n\t\t}\n\t\tcatch (e) {}\n\n\t}\n\n\n\tfunction showFinalHomepageState() {\n\n\t\t\/*\n\t\t * Geen groene intro, geen arm en geen automatische scroll.\n\t\t * Meteen de normale hero met het volledige logo tonen.\n\t\t *\/\n\t\thero.classList.add(\n\t\t\t'is-intro-done',\n\t\t\t'is-finished'\n\t\t);\n\n\n\t\tdocument.documentElement.classList.remove(\n\t\t\t'custom-fof-intro-preflight',\n\t\t\t'custom-fof-first-intro'\n\t\t);\n\n\n\t\thero.classList.remove(\n\t\t\t'is-intro-text',\n\t\t\t'is-intro-line1',\n\t\t\t'is-intro-line2',\n\t\t\t'is-intro-line3',\n\t\t\t'is-intro-wipe'\n\t\t);\n\n\n\t\tresultCtx.clearRect(\n\t\t\t0,\n\t\t\t0,\n\t\t\twidth,\n\t\t\theight\n\t\t);\n\n\n\t\tresultCtx.drawImage(\n\t\t\tmaskCanvas,\n\t\t\t0,\n\t\t\t0,\n\t\t\twidth,\n\t\t\theight\n\t\t);\n\n\n\t\tsprayCan.style.opacity =\n\t\t\t'0';\n\n\n\t\t\/*\n\t\t * Pas nu zichtbaar maken: de correcte eindstaat staat al klaar.\n\t\t * Hierdoor is er geen kort oud\/logo-frame bij terugnavigeren.\n\t\t *\/\n\t\thero.classList.add(\n\t\t\t'custom-fof-animation-ready'\n\t\t);\n\n\n\t\t\/*\n\t\t * Animatie wordt overgeslagen, dus Complianz mag\n\t\t * direct normaal zichtbaar zijn.\n\t\t *\/\n\t\t\t\treleaseComplianz();\n\n\n\t\tunlockPageAfterIntro();\n\n\t}\n\n\n\t\/* =====================================================\n\t   V5.2.15 \u2014 AUTO-SCROLL VOORWAARDE\n\t===================================================== *\/\n\n\tfunction rememberInitialScrollPosition() {\n\n\t\tpageStartedAtTop =\n\t\t\twindow.pageYOffset <=\n\t\t\tSETTINGS.autoAdvanceTopThreshold;\n\n\n\t\tuserScrolledAfterIntro =\n\t\t\tfalse;\n\n\t}\n\n\n\tfunction markUserHasScrolled() {\n\n\t\tif (ignoreScrollTracking) {\n\t\t\treturn;\n\t\t}\n\n\n\t\t\/*\n\t\t * Alleen relevant n\u00e1 de fullscreen intro.\n\t\t *\/\n\t\tif (\n\t\t\thero.classList.contains(\n\t\t\t\t'is-intro-done'\n\t\t\t)\n\t\t) {\n\n\t\t\tuserScrolledAfterIntro =\n\t\t\t\ttrue;\n\n\t\t}\n\n\t}\n\n\n\twindow.addEventListener(\n\t\t'scroll',\n\t\tmarkUserHasScrolled,\n\t\t{\n\t\t\tpassive: true\n\t\t}\n\t);\n\n\n\t\/* =====================================================\n\t   V5.2.12 \u2014 PAGE LOCK + SCROLL TOP\n\t===================================================== *\/\n\n\tfunction lockPageForIntro() {\n\n\t\tignoreScrollTracking =\n\t\t\ttrue;\n\n\n\t\tdocument.documentElement.classList.add(\n\t\t\t'custom-fof-intro-lock'\n\t\t);\n\n\t\tdocument.body.classList.add(\n\t\t\t'custom-fof-intro-lock'\n\t\t);\n\n\n\t\ttry {\n\n\t\t\tif ('scrollRestoration' in history) {\n\t\t\t\thistory.scrollRestoration =\n\t\t\t\t\t'manual';\n\t\t\t}\n\n\t\t}\n\t\tcatch (e) {}\n\n\n\t\twindow.scrollTo(\n\t\t\t0,\n\t\t\t0\n\t\t);\n\n\n\t\trequestAnimationFrame(\n\t\t\tfunction () {\n\n\t\t\t\twindow.scrollTo(\n\t\t\t\t\t0,\n\t\t\t\t\t0\n\t\t\t\t);\n\n\t\t\t\trequestAnimationFrame(\n\t\t\t\t\tfunction () {\n\n\t\t\t\t\t\twindow.scrollTo(\n\t\t\t\t\t\t\t0,\n\t\t\t\t\t\t\t0\n\t\t\t\t\t\t);\n\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t}\n\t\t);\n\n\t}\n\n\n\tfunction unlockPageAfterIntro() {\n\n\t\tdocument.documentElement.classList.remove(\n\t\t\t'custom-fof-intro-lock'\n\t\t);\n\n\t\tdocument.body.classList.remove(\n\t\t\t'custom-fof-intro-lock'\n\t\t);\n\n\t\ttry {\n\n\t\t\tif ('scrollRestoration' in history) {\n\t\t\t\thistory.scrollRestoration =\n\t\t\t\t\t'auto';\n\t\t\t}\n\n\t\t}\n\t\tcatch (e) {}\n\n\n\t\trequestAnimationFrame(\n\t\t\tfunction () {\n\n\t\t\t\trequestAnimationFrame(\n\t\t\t\t\tfunction () {\n\n\t\t\t\t\t\tignoreScrollTracking =\n\t\t\t\t\t\t\tfalse;\n\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t}\n\t\t);\n\n\t}\n\n\n\t\/* =====================================================\n\t   V5.2 \u2014 INTRO\n\t===================================================== *\/\n\n\tfunction wait(ms) {\n\n\t\treturn new Promise(\n\t\t\tfunction (resolve) {\n\n\t\t\t\tsetTimeout(\n\t\t\t\t\tresolve,\n\t\t\t\t\tms\n\t\t\t\t);\n\n\t\t\t}\n\t\t);\n\n\t}\n\n\n\tasync function runIntro() {\n\n\t\tif (!intro) {\n\t\t\treturn;\n\t\t}\n\n\n\t\thero.classList.remove(\n\t\t\t'is-intro-text',\n\t\t\t'is-intro-line1',\n\t\t\t'is-intro-line2',\n\t\t\t'is-intro-line3',\n\t\t\t'is-intro-wipe',\n\t\t\t'is-intro-done'\n\t\t);\n\n\n\t\t\/*\n\t\t * Eerst alleen groen.\n\t\t *\/\n\t\tawait wait(\n\t\t\tSETTINGS.introGreenHold\n\t\t);\n\n\n\t\t\/*\n\t\t * Tekstcontainer verschijnt.\n\t\t *\/\n\t\thero.classList.add(\n\t\t\t'is-intro-text'\n\t\t);\n\n\n\t\t\/*\n\t\t * Eerst regel 1.\n\t\t *\/\n\t\thero.classList.add(\n\t\t\t'is-intro-line1'\n\t\t);\n\n\n\t\tawait wait(\n\t\t\tSETTINGS.introTextIn\n\t\t);\n\n\n\t\t\/*\n\t\t * Daarna regel 2.\n\t\t *\/\n\t\thero.classList.add(\n\t\t\t'is-intro-line2'\n\t\t);\n\n\n\t\tawait wait(\n\t\t\tSETTINGS.introLineGap\n\t\t);\n\n\n\t\t\/*\n\t\t * Als derde: Waarde cre\u00ebren.\n\t\t *\/\n\t\thero.classList.add(\n\t\t\t'is-intro-line3'\n\t\t);\n\n\n\t\tawait wait(\n\t\t\tSETTINGS.introLine3Gap +\n\t\t\tSETTINGS.introTextHold\n\t\t);\n\n\n\t\t\/*\n\t\t * Groene layer schuift omhoog.\n\t\t *\/\n\t\thero.classList.add(\n\t\t\t'is-intro-wipe'\n\t\t);\n\n\n\t\tawait wait(\n\t\t\tMath.max(\n\t\t\t\t0,\n\t\t\t\tSETTINGS.introWipeDuration -\n\t\t\t\tSETTINGS.introToArmOverlap\n\t\t\t)\n\t\t);\n\n\t}\n\n\n\tfunction finishIntro() {\n\n\t\thero.classList.add(\n\t\t\t'is-intro-done'\n\t\t);\n\n\n\t\tdocument.documentElement.classList.remove(\n\t\t\t'custom-fof-intro-preflight',\n\t\t\t'custom-fof-first-intro'\n\t\t);\n\n\n\t\tunlockPageAfterIntro();\n\n\t}\n\n\n\t\/* =====================================================\n\t   V5.0 \u2014 REDUCED MOTION\n\t===================================================== *\/\n\n\tfunction prefersReducedMotion() {\n\n\t\treturn window.matchMedia &&\n\t\t\twindow.matchMedia(\n\t\t\t\t'(prefers-reduced-motion: reduce)'\n\t\t\t).matches;\n\n\t}\n\n\n\t\/* =====================================================\n\t   INIT\n\t===================================================== *\/\n\n\tasync function init() {\n\n\t\t\/*\n\t\t * V5.2.27:\n\t\t * Complianz direct verbergen en ook later ingevoegde\n\t\t * banner-elementen blijven onderscheppen.\n\t\t *\/\n\t\tforceHideComplianz();\n\n\n\t\t\/*\n\t\t * V5.2.34:\n\t\t * Bij een TranslatePress-taalwissel eerst volledig\n\t\t * positioneren naar de rij onder de hero.\n\t\t *\n\t\t * Daarna stoppen we init() helemaal. Zo kan de hero\n\t\t * op de doelpagina niet tussendoor initialiseren,\n\t\t * tekenen of \u00e9\u00e9n frame zichtbaar worden.\n\t\t *\/\n\t\tconst translatePressLanding =\n\t\t\tawait handleTranslatePressNextRowLanding();\n\n\n\t\tif (translatePressLanding) {\n\n\t\t\t\/*\n\t\t\t * Geen hero-init, geen canvas-tekening,\n\t\t\t * geen groene intro en geen animatielogo.\n\t\t\t *\n\t\t\t * Complianz mag op deze pagina wel direct terug.\n\t\t\t *\/\n\t\t\treleaseComplianz();\n\n\t\t\treturn;\n\n\t\t}\n\n\n\t\t\/*\n\t\t * V5.2.23:\n\t\t * bij terugkeer naar #over-ons \/ ander homepage-anker\n\t\t * eerst de juiste scrollpositie toepassen en pas daarna\n\t\t * de pagina zichtbaar maken.\n\t\t *\/\n\t\trevealHashReturnAfterPositioning();\n\n\n\t\t\/*\n\t\t * V5.2.15:\n\t\t * oorspronkelijke scrollpositie bewaren v\u00f3\u00f3rdat\n\t\t * de intro eventueel scrollTop 0 afdwingt.\n\t\t *\/\n\t\trememberInitialScrollPosition();\n\n\n\t\t\/*\n\t\t * Extra bescherming tegen een eerste-frame flash.\n\t\t *\/\n\t\tsprayCan.style.opacity =\n\t\t\t'0';\n\n\n\t\t\/*\n\t\t * Eerst canvas\/logo voorbereiden. Dit hebben we ook nodig\n\t\t * wanneer we de animatie bij een terugkerend bezoek overslaan.\n\t\t *\/\n\t\tresize();\n\n\t\tawait loadLogo();\n\n\t\tdrawOriginalLogo();\n\n\t\tcreateTraceRoute();\n\n\n\t\t\/*\n\t\t * V5.2.20:\n\t\t * Normaal tonen we de intro slechts \u00e9\u00e9n keer per sessie.\n\t\t * Maar wanneer de homepage expliciet wordt ververst\n\t\t * (browser refresh \/ Ctrl+R \/ reload), moet de volledige\n\t\t * intro juist WEL opnieuw afspelen.\n\t\t *\/\n\t\tconst isReloadVisit =\n\t\t\tisReloadNavigation();\n\n\n\t\tif (\n\t\t\thasSeenHomepageAnimation() &&\n\t\t\t!isReloadVisit\n\t\t) {\n\n\t\t\tshowFinalHomepageState();\n\n\t\t\treturn;\n\n\t\t}\n\n\n\t\t\/*\n\t\t * Vanaf dit moment geldt deze sessie als 'gezien'.\n\t\t * Ook als iemand tijdens de animatie naar een andere pagina klikt,\n\t\t * wordt hij bij terugkomst niet opnieuw afgespeeld.\n\t\t *\n\t\t * Bij een reload mag de animatie opnieuw lopen; dat is prima.\n\t\t *\/\n\t\tmarkHomepageAnimationSeen();\n\n\n\t\t\/*\n\t\t * Alleen bij de eerste weergave van deze sessie\n\t\t * de pagina voor de fullscreen intro locken.\n\t\t *\/\n\t\tlockPageForIntro();\n\n\n\t\tif (prefersReducedMotion()) {\n\n\t\t\tshowFinalHomepageState();\n\n\t\t\treturn;\n\n\t\t}\n\n\n\t\t\/*\n\t\t * V5.2.24:\n\t\t * v\u00f3\u00f3r het groene scherm eindigt moeten alle zichtbare\n\t\t * animatiecanvassen gegarandeerd leeg zijn.\n\t\t *\/\n\t\tresultCtx.clearRect(\n\t\t\t0,\n\t\t\t0,\n\t\t\twidth,\n\t\t\theight\n\t\t);\n\n\t\twetCtx.clearRect(\n\t\t\t0,\n\t\t\t0,\n\t\t\twidth,\n\t\t\theight\n\t\t);\n\n\t\tparticleCtx.clearRect(\n\t\t\t0,\n\t\t\t0,\n\t\t\twidth,\n\t\t\theight\n\t\t);\n\n\t\tsprayMaskCtx.clearRect(\n\t\t\t0,\n\t\t\t0,\n\t\t\twidth,\n\t\t\theight\n\t\t);\n\n\n\t\thero.classList.remove(\n\t\t\t'custom-fof-animation-ready'\n\t\t);\n\n\n\t\t\/*\n\t\t * Eerst groene merkintro.\n\t\t *\/\n\t\tawait runIntro();\n\n\n\t\t\/*\n\t\t * Daarna begint de bestaande arm\/spray-entree.\n\t\t *\/\n\t\treset();\n\n\n\t\t\/*\n\t\t * Zodra de wipe volledig klaar is, laag verbergen.\n\t\t *\/\n\t\tsetTimeout(\n\t\t\tfinishIntro,\n\t\t\tSETTINGS.introToArmOverlap +\n\t\t\t80\n\t\t);\n\n\t}\n\n\n\twindow.addEventListener(\n\t\t'pageshow',\n\t\tfunction () {\n\n\t\t\tif (\n\t\t\t\tdocument.documentElement.classList.contains(\n\t\t\t\t\t'custom-fof-intro-lock'\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\twindow.scrollTo(\n\t\t\t\t\t0,\n\t\t\t\t\t0\n\t\t\t\t);\n\t\t\t}\n\n\t\t}\n\t);\n\n\n\tinit();\n\n})();\n<\/script><\/div><\/div><\/div><\/div><\/div><\/div><\/section><section class=\"l-section wpb_row height_medium\"><div class=\"l-section-h i-cf\"><div class=\"g-cols vc_row via_flex valign_top type_default stacking_default\"><div class=\"vc_col-sm-12 wpb_column vc_column_container\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><div class=\"g-cols wpb_row us_custom_e4d40b41 fof-usps us_animate_this via_flex valign_top type_default stacking_default\"><div class=\"vc_col-sm-3 wpb_column vc_column_container\"><div class=\"vc_column-inner us_custom_2a8b70d4\"><div class=\"wpb_wrapper\"><div class=\"w-iconbox iconpos_left style_default color_primary align_none\"><div class=\"w-iconbox-icon\" style=\"font-size:3rem;\"><i class=\"fal fa-industry-alt\"><\/i><\/div><div class=\"w-iconbox-meta\"><h4 class=\"w-iconbox-title\">Directe inkoop<\/h4><div class=\"w-iconbox-text\"><p>Rechtstreeks bij de fabrikant voor de laagste prijs<\/p>\n<\/div><\/div><\/div><\/div><\/div><\/div><div class=\"vc_col-sm-3 wpb_column vc_column_container\"><div class=\"vc_column-inner us_custom_2a8b70d4\"><div class=\"wpb_wrapper\"><div class=\"w-iconbox iconpos_left style_default color_primary align_none\"><div class=\"w-iconbox-icon\" style=\"font-size:3rem;\"><i class=\"fal fa-warehouse-alt\"><\/i><\/div><div class=\"w-iconbox-meta\"><h4 class=\"w-iconbox-title\">Eigen magazijnen<\/h4><div class=\"w-iconbox-text\"><p>Moderne faciliteiten en optimaal voorraadbeheer.<\/p>\n<\/div><\/div><\/div><\/div><\/div><\/div><div class=\"vc_col-sm-3 wpb_column vc_column_container\"><div class=\"vc_column-inner us_custom_2a8b70d4\"><div class=\"wpb_wrapper\"><div class=\"w-iconbox iconpos_left style_default color_primary align_none\"><div class=\"w-iconbox-icon\" style=\"font-size:3rem;\"><i class=\"fal fa-expand\"><\/i><\/div><div class=\"w-iconbox-meta\"><h4 class=\"w-iconbox-title\">Snel &amp; flexibel<\/h4><div class=\"w-iconbox-text\"><p>Korte lijnen, snel schakelen en effici\u00ebnt leveren.<\/p>\n<\/div><\/div><\/div><\/div><\/div><\/div><div class=\"vc_col-sm-3 wpb_column vc_column_container\"><div class=\"vc_column-inner us_custom_2a8b70d4\"><div class=\"wpb_wrapper\"><div class=\"w-iconbox iconpos_left style_default color_primary align_none\"><div class=\"w-iconbox-icon\" style=\"font-size:3rem;\"><i class=\"fal fa-plus-octagon\"><\/i><\/div><div class=\"w-iconbox-meta\"><h4 class=\"w-iconbox-title\">Partner in groei<\/h4><div class=\"w-iconbox-text\"><p>Meedenken, meebewegen en samen groeien.<\/p>\n<\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/section><section class=\"l-section wpb_row height_medium\" id=\"over-ons\"><div class=\"l-section-h i-cf\"><div class=\"g-cols vc_row via_flex valign_middle type_default stacking_default\"><div class=\"vc_col-sm-4 wpb_column vc_column_container\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><div class=\"wpb_text_column us_custom_91e6389b us_animate_this\"><div class=\"wpb_wrapper\"><h1><span style=\"color: #636365;\"><span style=\"color: #5f5f61;\">Kwaliteit inkopen.<\/span><br \/>\n<\/span><span style=\"color: #5f5f61;\">Betrouwbaar leveren.<\/span><br data-start=\"346\" data-end=\"349\" \/><span style=\"color: #34872d;\">Waarde cre\u00ebren.<\/span><\/h1>\n<\/div><\/div><div class=\"w-separator size_medium\"><\/div><div class=\"wpb_text_column us_custom_2f840841 us_animate_this\"><div class=\"wpb_wrapper\"><p>Fiets-O-Fit is een internationaal opererende importeur en distributeur die zich richt op de levering aan grootwinkelbedrijven en retailorganisaties in Europa.\u00a0Onze producten voor de doe-het-zelf- en automotivebranche zijn verkrijgbaar in ruim 3.400 winkels verspreid over heel Europa. Binnen ons assortiment zijn we marktleider in West-Europa.<\/p>\n<p>Met logistiek en warehousing in eigen beheer zijn wij zeer flexibel en kunnen wij waar dan ook in Europa snel en effici\u00ebnt leveren. Ons jarenlang opgebouwde internationale netwerk van leveranciers en producenten stelt ons in staat snel te schakelen en toegang te bieden tot grote, kwalitatief hoogwaardige en betrouwbare partijen.<\/p>\n<p>Doordat Fiets-O-Fit rechtstreeks en op grote schaal bij de bron inkoopt, zijn wij in staat snel te leveren en tegelijkertijd de scherpste prijzen te garanderen.<\/p>\n<\/div><\/div><div class=\"w-separator size_medium\"><\/div><\/div><\/div><\/div><div class=\"vc_col-sm-8 wpb_column vc_column_container\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><div class=\"w-html us_custom_03555de4 us_animate_this\"><div class=\"fof-hero-visual fof-hero-visual--mosaic\">\n\n\t<svg\n\t\tviewBox=\"0 0 1200 620\"\n\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\"\n\t\trole=\"img\"\n\t\taria-label=\"Fiets-O-Fit transport, samenwerking en warehousing\"\n\t>\n\n\t\t<defs>\n\n\t\t\t<!-- LINKS BOVEN - HANDSHAKE -->\n\t\t\t<clipPath id=\"fof-clip-handshake\">\n\t\t\t\t<path d=\"\n\t\t\t\t\tM 170 10\n\t\t\t\t\tL 540 10\n\t\t\t\t\tQ 554 10 550 24\n\t\t\t\t\tL 482 288\n\t\t\t\t\tQ 478 302 464 302\n\t\t\t\t\tL 100 302\n\t\t\t\t\tQ 86 302 90 288\n\t\t\t\t\tL 158 24\n\t\t\t\t\tQ 162 10 170 10\n\t\t\t\t\tZ\n\t\t\t\t\"\/>\n\t\t\t<\/clipPath>\n\n\n\t\t\t<!-- LINKS ONDER - TRUCK -->\n\t\t\t<clipPath id=\"fof-clip-truck\">\n\t\t\t\t<path d=\"\n\t\t\t\t\tM 92 312\n\t\t\t\t\tL 462 312\n\t\t\t\t\tQ 476 312 472 326\n\t\t\t\t\tL 404 596\n\t\t\t\t\tQ 400 610 386 610\n\t\t\t\t\tL 22 610\n\t\t\t\t\tQ 8 610 12 596\n\t\t\t\t\tL 80 326\n\t\t\t\t\tQ 84 312 92 312\n\t\t\t\t\tZ\n\t\t\t\t\"\/>\n\t\t\t<\/clipPath>\n\n\n\t\t\t<!-- MIDDEN - GROOT -->\n\t\t\t<clipPath id=\"fof-clip-middle\">\n\t\t\t\t<path d=\"\n\t\t\t\t\tM 572 10\n\t\t\t\t\tL 904 10\n\t\t\t\t\tQ 918 10 914 24\n\t\t\t\t\tL 766 596\n\t\t\t\t\tQ 762 610 748 610\n\t\t\t\t\tL 426 610\n\t\t\t\t\tQ 412 610 416 596\n\t\t\t\t\tL 560 24\n\t\t\t\t\tQ 564 10 572 10\n\t\t\t\t\tZ\n\t\t\t\t\"\/>\n\t\t\t<\/clipPath>\n\n\n\t\t\t<!-- RECHTS - GROOT -->\n\t\t\t<clipPath id=\"fof-clip-right\">\n\t\t\t\t<path d=\"\n\t\t\t\t\tM 936 10\n\t\t\t\t\tL 1184 10\n\t\t\t\t\tQ 1198 10 1198 24\n\t\t\t\t\tL 1198 596\n\t\t\t\t\tQ 1198 610 1184 610\n\t\t\t\t\tL 790 610\n\t\t\t\t\tQ 776 610 780 596\n\t\t\t\t\tL 924 24\n\t\t\t\t\tQ 928 10 936 10\n\t\t\t\t\tZ\n\t\t\t\t\"\/>\n\t\t\t<\/clipPath>\n\n\t\t<\/defs>\n\n\n\t\t<!-- HANDSHAKE -->\n\t\t<image\n\t\t\thref=\"https:\/\/fiets-o-fit.nl\/wp-content\/uploads\/2026\/08\/Handshake-Fiets-O-Fit.webp\"\n\t\t\tx=\"80\"\n\t\t\ty=\"10\"\n\t\t\twidth=\"480\"\n\t\t\theight=\"292\"\n\t\t\tpreserveAspectRatio=\"xMidYMid slice\"\n\t\t\tclip-path=\"url(#fof-clip-handshake)\"\n\t\t\/>\n\n\n\t\t<!-- TRUCK -->\n\t\t<image\n\t\t\thref=\"https:\/\/fiets-o-fit.nl\/wp-content\/uploads\/2026\/08\/Fiets-O-Fit-importeur-automotive-branche.webp\"\n\t\t\tx=\"0\"\n\t\t\ty=\"312\"\n\t\t\twidth=\"490\"\n\t\t\theight=\"298\"\n\t\t\tpreserveAspectRatio=\"xMidYMid slice\"\n\t\t\tclip-path=\"url(#fof-clip-truck)\"\n\t\t\/>\n\n\n\t\t<!-- MIDDEN MAGAZIJN -->\n\t\t<image\n\t\t\thref=\"https:\/\/fiets-o-fit.nl\/wp-content\/uploads\/2026\/08\/Warehousing-eigen-beheer-Fiets-O-Fit.webp\"\n\t\t\tx=\"407\"\n\t\t\ty=\"10\"\n\t\t\twidth=\"520\"\n\t\t\theight=\"600\"\n\t\t\tpreserveAspectRatio=\"xMidYMid slice\"\n\t\t\tclip-path=\"url(#fof-clip-middle)\"\n\t\t\/>\n\n\n\t\t<!-- RECHTS MAGAZIJN -->\n\t\t<image\n\t\t\thref=\"https:\/\/fiets-o-fit.nl\/wp-content\/uploads\/2026\/08\/warehouse-racking-kopie.webp\"\n\t\t\tx=\"774\"\n\t\t\ty=\"10\"\n\t\t\twidth=\"426\"\n\t\t\theight=\"600\"\n\t\t\tpreserveAspectRatio=\"xMidYMid slice\"\n\t\t\tclip-path=\"url(#fof-clip-right)\"\n\t\t\/>\n\n\t<\/svg>\n\n<\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/section><section class=\"l-section wpb_row fof-info-slant height_large\"><div class=\"l-section-h i-cf\"><div class=\"g-cols vc_row via_flex valign_top type_default stacking_default\" style=\"--additional-gap:1.5rem;\"><div class=\"vc_col-sm-6 wpb_column vc_column_container\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><h4 class=\"w-text\"><span class=\"w-text-h\"><span class=\"w-text-value\">Veiligheidsinformatiebladen<\/span><\/span><\/h4><div class=\"w-iconbox iconpos_left style_default color_primary align_none no_text\"><a href=\"https:\/\/fiets-o-fit.nl\/#contact\" class=\"w-iconbox-link\" aria-label=\"Veiligheidsinformatiebladen worden u op verzoek toegezonden\"><div class=\"w-iconbox-icon\" style=\"font-size:2rem;\"><i class=\"far fa-arrow-right\"><\/i><\/div><\/a><div class=\"w-iconbox-meta\"><div class=\"w-iconbox-title\"><a href=\"https:\/\/fiets-o-fit.nl\/#contact\" class=\"w-iconbox-link\" aria-label=\"Veiligheidsinformatiebladen worden u op verzoek toegezonden\">Veiligheidsinformatiebladen worden u op verzoek toegezonden<\/a><\/div><\/div><\/div><div class=\"w-separator size_large\"><\/div><h4 class=\"w-text\"><span class=\"w-text-h\"><span class=\"w-text-value\">Productinformatie conform Verordening (EG) Nr. 648\/2004 betreffende detergentia<\/span><\/span><\/h4><div class=\"w-iconbox iconpos_left style_default color_primary align_none no_text\"><a href=\"https:\/\/fiets-o-fit.nl\/detergenten-gegevensbladen\/\" class=\"w-iconbox-link\" aria-label=\"Detergenten Gegevensbladen (PDF)\"><div class=\"w-iconbox-icon\" style=\"font-size:2rem;\"><i class=\"far fa-arrow-right\"><\/i><\/div><\/a><div class=\"w-iconbox-meta\"><div class=\"w-iconbox-title\"><a href=\"https:\/\/fiets-o-fit.nl\/detergenten-gegevensbladen\/\" class=\"w-iconbox-link\" aria-label=\"Detergenten Gegevensbladen (PDF)\">Detergenten Gegevensbladen (PDF)<\/a><\/div><\/div><\/div><\/div><\/div><\/div><div class=\"vc_col-sm-6 wpb_column vc_column_container\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><\/div><\/div><\/div><\/div><\/div><\/section><section class=\"l-section wpb_row height_huge\" id=\"contact\"><div class=\"l-section-h i-cf\"><div class=\"g-cols vc_row via_flex valign_top type_default stacking_default\"><div class=\"vc_col-sm-12 wpb_column vc_column_container\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><div class=\"wpb_text_column us_custom_e93d73c3\"><div class=\"wpb_wrapper\"><h2><span style=\"color: #5f5f61;\"><strong>Contact<span class=\"fof-mobile-break\"><\/span><br \/>\n<span style=\"color: #34872d;\">Fiets-O-Fit B.V.<\/span><br \/>\n<\/strong><br \/>\n<\/span><\/h2>\n<\/div><\/div><div class=\"w-separator size_medium\"><\/div><div class=\"g-cols wpb_row us_custom_61a3f1f0 via_flex valign_top type_default stacking_default\"><div class=\"vc_col-sm-4 wpb_column vc_column_container\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><div class=\"w-text us_custom_d2a4e840\"><span class=\"w-text-h\"><span class=\"w-text-value\">E-MAIL<\/span><\/span><\/div><div class=\"w-text us_custom_9de87d4e\"><a href=\"mailto:info@fiets-o-fit.nl\" class=\"w-text-h\"><span class=\"w-text-value\">info@fiets-o-fit.nl<\/span><\/a><\/div><\/div><\/div><\/div><div class=\"vc_col-sm-4 wpb_column vc_column_container\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><div class=\"w-text us_custom_d2a4e840\"><span class=\"w-text-h\"><span class=\"w-text-value\">TELEFOON<\/span><\/span><\/div><div class=\"w-text us_custom_9de87d4e\"><a href=\"tel:+31 (0) 515 41 11 34\" class=\"w-text-h\"><span class=\"w-text-value\">+31 (0) 515 41 11 34<\/span><\/a><\/div><\/div><\/div><\/div><div class=\"vc_col-sm-4 wpb_column vc_column_container\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><div class=\"w-text us_custom_d2a4e840\"><span class=\"w-text-h\"><span class=\"w-text-value\">ADRES<\/span><\/span><\/div><div class=\"w-text us_custom_9de87d4e hide_on_tablets hide_on_mobiles\"><a target=\"_blank\" href=\"https:\/\/www.google.com\/maps\/dir\/\/Eastwei+4a,+8625+HV+Oppenhuizen\/\" class=\"w-text-h\"><span class=\"w-text-value\">Eastwei 4a &#8211; 8625 HV Oppenhuizen<\/span><\/a><\/div><div class=\"w-text us_custom_9de87d4e hide_on_default hide_on_laptops\"><a target=\"_blank\" href=\"https:\/\/www.google.com\/maps\/dir\/\/Eastwei+4a,+8625+HV+Oppenhuizen\/\" class=\"w-text-h\"><span class=\"w-text-value\">Eastwei 4a<br \/>\n8625 HV Oppenhuizen<\/span><\/a><\/div><\/div><\/div><\/div><\/div><div class=\"w-separator size_large\"><\/div><div class=\"g-cols wpb_row us_custom_5e6096b6 via_flex valign_top type_default stacking_default equal_height\"><div class=\"vc_col-sm-6 wpb_column vc_column_container\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><script>\nvar gform;gform||(document.addEventListener(\"gform_main_scripts_loaded\",function(){gform.scriptsLoaded=!0}),document.addEventListener(\"gform\/theme\/scripts_loaded\",function(){gform.themeScriptsLoaded=!0}),window.addEventListener(\"DOMContentLoaded\",function(){gform.domLoaded=!0}),gform={domLoaded:!1,scriptsLoaded:!1,themeScriptsLoaded:!1,isFormEditor:()=>\"function\"==typeof InitializeEditor,callIfLoaded:function(o){return!(!gform.domLoaded||!gform.scriptsLoaded||!gform.themeScriptsLoaded&&!gform.isFormEditor()||(gform.isFormEditor()&&console.warn(\"The use of gform.initializeOnLoaded() is deprecated in the form editor context and will be removed in Gravity Forms 3.1.\"),o(),0))},initializeOnLoaded:function(o){gform.callIfLoaded(o)||(document.addEventListener(\"gform_main_scripts_loaded\",()=>{gform.scriptsLoaded=!0,gform.callIfLoaded(o)}),document.addEventListener(\"gform\/theme\/scripts_loaded\",()=>{gform.themeScriptsLoaded=!0,gform.callIfLoaded(o)}),window.addEventListener(\"DOMContentLoaded\",()=>{gform.domLoaded=!0,gform.callIfLoaded(o)}))},hooks:{action:{},filter:{}},addAction:function(o,r,e,t){gform.addHook(\"action\",o,r,e,t)},addFilter:function(o,r,e,t){gform.addHook(\"filter\",o,r,e,t)},doAction:function(o){gform.doHook(\"action\",o,arguments)},applyFilters:function(o){return gform.doHook(\"filter\",o,arguments)},removeAction:function(o,r){gform.removeHook(\"action\",o,r)},removeFilter:function(o,r,e){gform.removeHook(\"filter\",o,r,e)},addHook:function(o,r,e,t,n){null==gform.hooks[o][r]&&(gform.hooks[o][r]=[]);var d=gform.hooks[o][r];null==n&&(n=r+\"_\"+d.length),gform.hooks[o][r].push({tag:n,callable:e,priority:t=null==t?10:t})},doHook:function(r,o,e){var t;if(e=Array.prototype.slice.call(e,1),null!=gform.hooks[r][o]&&((o=gform.hooks[r][o]).sort(function(o,r){return o.priority-r.priority}),o.forEach(function(o){\"function\"!=typeof(t=o.callable)&&(t=window[t]),\"action\"==r?t.apply(null,e):e[0]=t.apply(null,e)})),\"filter\"==r)return e[0]},removeHook:function(o,r,t,n){var e;null!=gform.hooks[o][r]&&(e=(e=gform.hooks[o][r]).filter(function(o,r,e){return!!(null!=n&&n!=o.tag||null!=t&&t!=o.priority)}),gform.hooks[o][r]=e)}});\n<\/script>\n\n                <div class='gf_browser_gecko gform_wrapper gravity-theme gform-theme--no-framework' data-form-theme='gravity-theme' data-form-index='0' id='gform_wrapper_1' ><div id='gf_1' class='gform_anchor' tabindex='-1'><\/div>\n                        <div class='gform_heading'>\n\t\t\t\t\t\t\t<p class='gform_required_legend'>&quot;<span class=\"gfield_required gfield_required_asterisk\">*<\/span>&quot; se\u00f1ala los campos obligatorios<\/p>\n                        <\/div><form method='post' enctype='multipart\/form-data' target='gform_ajax_frame_1' id='gform_1'  action='\/es\/wp-json\/wp\/v2\/pages\/9384#gf_1' data-formid='1' novalidate><div class='gf_invisible ginput_recaptchav3'  data-tabindex='0'><input id=\"input_d6940e429b33b630150a5335bca4b629\" class=\"gfield_recaptcha_response\" type=\"hidden\" name=\"input_d6940e429b33b630150a5335bca4b629\" value=\"\"\/><\/div>\n                        <div class='gform-body gform_body'><div id='gform_fields_1' class='gform_fields top_label form_sublabel_above description_above validation_below'><div id=\"field_1_8\" class=\"gfield gfield--type-honeypot gform_validation_container field_sublabel_above gfield--has-description field_description_above field_validation_below gfield_visibility_visible\"  ><label class='gfield_label gform-field-label' for='input_1_8'><span class='gform-field-label__text'>URL<\/span><\/label><div class='gfield_description' id='gfield_description_1_8'>Este campo es un campo de validaci\u00f3n y debe quedar sin cambios.<\/div><div class='ginput_container'><input name='input_8' id='input_1_8' type='text' value='' autocomplete='new-password'\/><\/div><\/div><div id=\"field_1_5\" class=\"gfield gfield--type-text gfield--input-type-text gfield--width-full gfield_contains_required field_sublabel_above gfield--no-description field_description_above field_validation_below gfield_visibility_visible\"  ><label class='gfield_label gform-field-label' for='input_1_5'><span class='gform-field-label__text'>Bedrijf<\/span><span class=\"gfield_required\"><span class=\"gfield_required gfield_required_asterisk\">*<\/span><\/span><\/label><div class='ginput_container ginput_container_text'><input name='input_5' id='input_1_5' type='text' value='' class='large'     aria-required=\"true\" aria-invalid=\"false\"   \/><\/div><\/div><div id=\"field_1_4\" class=\"gfield gfield--type-text gfield--input-type-text gfield--width-full gfield_contains_required field_sublabel_above gfield--no-description field_description_above field_validation_below gfield_visibility_visible\"  ><label class='gfield_label gform-field-label' for='input_1_4'><span class='gform-field-label__text'>Naam<\/span><span class=\"gfield_required\"><span class=\"gfield_required gfield_required_asterisk\">*<\/span><\/span><\/label><div class='ginput_container ginput_container_text'><input name='input_4' id='input_1_4' type='text' value='' class='large'     aria-required=\"true\" aria-invalid=\"false\"   \/><\/div><\/div><div id=\"field_1_2\" class=\"gfield gfield--type-email gfield--input-type-email gfield_contains_required field_sublabel_hidden_label gfield--no-description field_description_above field_validation_below gfield_visibility_visible\"  ><label class='gfield_label gform-field-label' for='input_1_2'><span class='gform-field-label__text'>E-mail<\/span><span class=\"gfield_required\"><span class=\"gfield_required gfield_required_asterisk\">*<\/span><\/span><\/label><div class='ginput_container ginput_container_email'>\n                            <input name='input_2' id='input_1_2' type='email' value='' class='large'    aria-required=\"true\" aria-invalid=\"false\"  \/>\n                        <\/div><\/div><div id=\"field_1_6\" class=\"gfield gfield--type-phone gfield--input-type-phone gfield--phone-format-international gfield--width-full gfield_contains_required field_sublabel_above gfield--no-description field_description_above field_validation_below gfield_visibility_visible\"  ><label class='gfield_label gform-field-label' for='input_1_6'><span class='gform-field-label__text'>Telefoon<\/span><span class=\"gfield_required\"><span class=\"gfield_required gfield_required_asterisk\">*<\/span><\/span><\/label><div class='ginput_container ginput_container_phone'><input name='input_6' id='input_1_6' type='tel' value='' class='large'   aria-required=\"true\" aria-invalid=\"false\"    \/><\/div><\/div><div id=\"field_1_3\" class=\"gfield gfield--type-textarea gfield--input-type-textarea gfield_contains_required field_sublabel_above gfield--no-description field_description_above field_validation_below gfield_visibility_visible\"  ><label class='gfield_label gform-field-label' for='input_1_3'><span class='gform-field-label__text'>Bericht<\/span><span class=\"gfield_required\"><span class=\"gfield_required gfield_required_asterisk\">*<\/span><\/span><\/label><div class='ginput_container ginput_container_textarea'><textarea name='input_3' id='input_1_3' class='textarea medium'     aria-required=\"true\" aria-invalid=\"false\"   rows='10' cols='50'><\/textarea><\/div><\/div><div id=\"field_1_7\" class=\"gfield gfield--type-hidden gfield--input-type-hidden gfield--width-full gform_hidden field_sublabel_above gfield--no-description field_description_above field_validation_below gfield_visibility_visible\"  ><div class='ginput_container ginput_container_text'><input name='input_7' id='input_1_7' type='hidden' class='gform_hidden'  aria-invalid=\"false\" value='es_ES' \/><\/div><\/div><\/div><\/div>\n        <div class='gform-footer gform_footer top_label'> <button type='submit' id='gform_submit_button_1' class='gform_button button' onclick='gform.submission.handleButtonClick(this);' data-submission-type='submit' >Verzenden<\/button> <input type='hidden' name='gform_ajax' value='form_id=1&amp;title=&amp;description=&amp;tabindex=0&amp;theme=gravity-theme&amp;styles=[]&amp;hash=04cfcf7becaa8ca6357e9e7dc7548962' \/>\n            <input type='hidden' class='gform_hidden' name='gform_submission_method' data-js='gform_submission_method_1' value='iframe' \/>\n            <input type='hidden' class='gform_hidden' name='gform_theme' data-js='gform_theme_1' id='gform_theme_1' value='gravity-theme' \/>\n            <input type='hidden' class='gform_hidden' name='gform_style_settings' data-js='gform_style_settings_1' id='gform_style_settings_1' value='[]' \/>\n            <input type='hidden' class='gform_hidden' name='is_submit_1' value='1' \/>\n            <input type='hidden' class='gform_hidden' name='gform_submit' value='1' \/>\n            \n            <input type='hidden' class='gform_hidden' name='gform_currency' data-currency='EUR' value='B0iqxvqOSSTgaftumCNKkC2eyPBO14vG1JCFzo6asv1nPdc2rRdzcX0hAtTETbRtPNRB3q49BUH1ImJ9NDvtHN6NWzjReYgsJw0U\/Ep363QY3Ek=' \/>\n            <input type='hidden' class='gform_hidden' name='gform_unique_id' value='' \/>\n            <input type='hidden' class='gform_hidden' name='state_1' value='WyJ7XCJnZm9ybV9zdWJtaXNzaW9uX21ldGhvZFwiOltcIjA4MjIwNWRkMDk0YWExM2I0ZDY3ZWUwM2ZkNDBjNWE0XCIsXCJiNTBiZDQ1MWMyZTdkNjkwZjhlZjg1NTVhYTM0ZTgyZVwiLFwiZmVjNjZjYzI4Nzc4YTFhYjNjMTNlYzZiZDk0NzBlYmZcIl0sXCJnZm9ybV90aGVtZVwiOlwiYjU5OWMzYmJhYjczMzBiZGIyOTUwOThhOWJlMGYwZWNcIixcImdmb3JtX3N0eWxlX3NldHRpbmdzXCI6XCI5YTllZWJmYWUwNTdkMDExZWI1NTM1ZTc1YjY1YWM3N1wiLFwiZm9ybV9pZFwiOlwiYmVkZTc0ZTcyNTdmYzg3Zjc1MDI3NDQ3NDU3NjE0MzhcIixcInVybFwiOlwiY2EyMmZmMDkzMjMwZjFkM2JlZTgyZjRmYTZjNDE3MzBcIixcInN0YXRlX3RpbWVzdGFtcFwiOlwiZDRkNDI3YmZkZTMxZWY3NDU2NzFkMzhhNWYzOTY4YzlcIn0iLCIyZTNiM2I4MzgxY2UxYTZkMWNlOTZiOThjZTJlYmZkNCIsMTc4NzI2MjUxMV0=' \/>\n            <input type='hidden' autocomplete='off' class='gform_hidden' name='gform_target_page_number_1' id='gform_target_page_number_1' value='0' \/>\n            <input type='hidden' autocomplete='off' class='gform_hidden' name='gform_source_page_number_1' id='gform_source_page_number_1' value='1' \/>\n            <input type='hidden' name='gform_field_values' value='' \/>\n            \n        <\/div>\n                        <\/form>\n                        <\/div>\n\t\t                <iframe style='display:none;width:0px;height:0px;' src='about:blank' name='gform_ajax_frame_1' id='gform_ajax_frame_1' title='Este iframe contiene la l\u00f3gica necesaria para gestionar formularios con ajax activado.'><\/iframe>\n\t\t                <script>\ngform.initializeOnLoaded( function() {jQuery('#gform_ajax_frame_1').on('load',function(){var contents = jQuery(this).contents().find('*').html();var is_postback = contents.indexOf('GF_AJAX_POSTBACK') >= 0;if(!is_postback){return;}var form_content = jQuery(this).contents().find('#gform_wrapper_1');var is_confirmation = jQuery(this).contents().find('#gform_confirmation_wrapper_1').length > 0;var is_redirect = contents.indexOf('gformRedirect(){') >= 0;var is_form = form_content.length > 0 && ! is_redirect && ! is_confirmation;var mt = parseInt(jQuery('html').css('margin-top'), 10) + parseInt(jQuery('body').css('margin-top'), 10) + 100;if(is_form){jQuery('#gform_wrapper_1').html(form_content.html());if(form_content.hasClass('gform_validation_error')){jQuery('#gform_wrapper_1').addClass('gform_validation_error');} else {jQuery('#gform_wrapper_1').removeClass('gform_validation_error');}setTimeout( function() { \/* delay the scroll by 50 milliseconds to fix a bug in chrome *\/ jQuery(document).scrollTop(jQuery('#gform_wrapper_1').offset().top - mt); }, 50 );var current_page = jQuery('#gform_source_page_number_1').val();jQuery(document).trigger('gform_page_loaded', [1, current_page]);window['gf_submitting_1'] = false;}else if(!is_redirect){var confirmation_content = jQuery(this).contents().find('.GF_AJAX_POSTBACK').html();if(!confirmation_content){confirmation_content = contents;}jQuery('#gform_wrapper_1').replaceWith(confirmation_content);jQuery(document).scrollTop(jQuery('#gf_1').offset().top - mt);jQuery(document).trigger('gform_confirmation_loaded', [1]);window['gf_submitting_1'] = false;wp.a11y.speak(jQuery('#gform_confirmation_message_1').text());}else{jQuery('#gform_1').append(contents);if(window['gformRedirect']) {gformRedirect();}}jQuery(document).trigger(\"gform_pre_post_render\", [{ formId: \"1\", currentPage: \"current_page\", abort: function() { this.preventDefault(); } }]);        if (event && event.defaultPrevented) {                return;        }        const gformWrapperDiv = document.getElementById( \"gform_wrapper_1\" );        if ( gformWrapperDiv ) {            const visibilitySpan = document.createElement( \"span\" );            visibilitySpan.id = \"gform_visibility_test_1\";            gformWrapperDiv.insertAdjacentElement( \"afterend\", visibilitySpan );        }        const visibilityTestDiv = document.getElementById( \"gform_visibility_test_1\" );        let postRenderFired = false;        function triggerPostRender() {            if ( postRenderFired ) {                return;            }            postRenderFired = true;            gform.core.triggerPostRenderEvents( 1, current_page );            if ( visibilityTestDiv ) {                visibilityTestDiv.parentNode.removeChild( visibilityTestDiv );            }        }        function debounce( func, wait, immediate ) {            var timeout;            return function() {                var context = this, args = arguments;                var later = function() {                    timeout = null;                    if ( !immediate ) func.apply( context, args );                };                var callNow = immediate && !timeout;                clearTimeout( timeout );                timeout = setTimeout( later, wait );                if ( callNow ) func.apply( context, args );            };        }        const debouncedTriggerPostRender = debounce( function() {            triggerPostRender();        }, 200 );        if ( visibilityTestDiv && visibilityTestDiv.offsetParent === null ) {            const observer = new MutationObserver( ( mutations ) => {                mutations.forEach( ( mutation ) => {                    if ( mutation.type === 'attributes' && visibilityTestDiv.offsetParent !== null ) {                        debouncedTriggerPostRender();                        observer.disconnect();                    }                });            });            observer.observe( document.body, {                attributes: true,                childList: false,                subtree: true,                attributeFilter: [ 'style', 'class' ],            });        } else {            triggerPostRender();        }    } );} );\n<\/script>\n<\/div><\/div><\/div><div class=\"vc_col-sm-6 wpb_column vc_column_container\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><div class=\"w-map provider_osm us_custom_5a4d11db\" id=\"us_map_1\"><div class=\"w-map-inner\"><div class=\"w-map-json\" onclick='return {&quot;address&quot;:&quot;53.008178, 5.702695&quot;,&quot;disableDragging&quot;:1,&quot;disableZoom&quot;:1,&quot;hideControls&quot;:0,&quot;zoom&quot;:13,&quot;markers&quot;:[{&quot;address&quot;:&quot;53.008178, 5.702695&quot;,&quot;html&quot;:&quot;&quot;,&quot;infowindow&quot;:0}],&quot;icon&quot;:{&quot;url&quot;:&quot;https:\\\/\\\/fiets-o-fit.nl\\\/wp-content\\\/uploads\\\/2019\\\/05\\\/FOF_icon-150x141.png&quot;,&quot;size&quot;:[60,60]},&quot;style&quot;:&quot;https:\\\/\\\/{s}.basemaps.cartocdn.com\\\/light_all\\\/{z}\\\/{x}\\\/{y}{r}.png&quot;}'><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/section>\n","protected":false},"excerpt":{"rendered":"Kwaliteit inkopen. Betrouwbaar leveren. Waarde cre\u00ebren. Opnieuw Directe inkoopRechtstreeks bij de fabrikant voor de laagste prijs Eigen magazijnenModerne faciliteiten en optimaal voorraadbeheer. Snel &amp; flexibelKorte lijnen, snel schakelen en effici\u00ebnt leveren. Partner in groeiMeedenken, meebewegen en samen groeien. Kwaliteit inkopen. Betrouwbaar leveren.Waarde cre\u00ebren. Fiets-O-Fit is een internationaal opererende importeur en distributeur die zich richt op...","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-9384","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Importeur en distributeur doe-het-zelf &amp; automotive | Fiets-O-Fit<\/title>\n<meta name=\"description\" content=\"Fiets-O-Fit is importeur en distributeur voor de doe-het-zelf- en automotivebranche. Directe inkoop, eigen warehousing, scherpe prijzen en snelle levering.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/fiets-o-fit.nl\/es\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Importeur en distributeur doe-het-zelf &amp; automotive | Fiets-O-Fit\" \/>\n<meta property=\"og:description\" content=\"Fiets-O-Fit is importeur en distributeur voor de doe-het-zelf- en automotivebranche. Directe inkoop, eigen warehousing, scherpe prijzen en snelle levering.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/fiets-o-fit.nl\/es\/\" \/>\n<meta property=\"og:site_name\" content=\"Fiets-O-Fit\" \/>\n<meta property=\"article:modified_time\" content=\"2026-08-20T14:11:43+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minuto\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/fiets-o-fit.nl\\\/\",\"url\":\"https:\\\/\\\/fiets-o-fit.nl\\\/\",\"name\":\"Importeur en distributeur doe-het-zelf & automotive | Fiets-O-Fit\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/fiets-o-fit.nl\\\/#website\"},\"datePublished\":\"2026-08-13T08:47:13+00:00\",\"dateModified\":\"2026-08-20T14:11:43+00:00\",\"description\":\"Fiets-O-Fit is importeur en distributeur voor de doe-het-zelf- en automotivebranche. Directe inkoop, eigen warehousing, scherpe prijzen en snelle levering.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/fiets-o-fit.nl\\\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/fiets-o-fit.nl\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/fiets-o-fit.nl\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/fiets-o-fit.nl\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Home\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/fiets-o-fit.nl\\\/#website\",\"url\":\"https:\\\/\\\/fiets-o-fit.nl\\\/\",\"name\":\"Fiets-O-Fit\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/fiets-o-fit.nl\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Importeur en distributeur doe-het-zelf & automotive | Fiets-O-Fit","description":"Fiets-O-Fit is importeur en distributeur voor de doe-het-zelf- en automotivebranche. Directe inkoop, eigen warehousing, scherpe prijzen en snelle levering.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/fiets-o-fit.nl\/es\/","og_locale":"es_ES","og_type":"article","og_title":"Importeur en distributeur doe-het-zelf & automotive | Fiets-O-Fit","og_description":"Fiets-O-Fit is importeur en distributeur voor de doe-het-zelf- en automotivebranche. Directe inkoop, eigen warehousing, scherpe prijzen en snelle levering.","og_url":"https:\/\/fiets-o-fit.nl\/es\/","og_site_name":"Fiets-O-Fit","article_modified_time":"2026-08-20T14:11:43+00:00","twitter_card":"summary_large_image","twitter_misc":{"Tiempo de lectura":"1 minuto"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/fiets-o-fit.nl\/","url":"https:\/\/fiets-o-fit.nl\/","name":"Importeur en distributeur doe-het-zelf & automotive | Fiets-O-Fit","isPartOf":{"@id":"https:\/\/fiets-o-fit.nl\/#website"},"datePublished":"2026-08-13T08:47:13+00:00","dateModified":"2026-08-20T14:11:43+00:00","description":"Fiets-O-Fit is importeur en distributeur voor de doe-het-zelf- en automotivebranche. Directe inkoop, eigen warehousing, scherpe prijzen en snelle levering.","breadcrumb":{"@id":"https:\/\/fiets-o-fit.nl\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fiets-o-fit.nl\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/fiets-o-fit.nl\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/fiets-o-fit.nl\/"},{"@type":"ListItem","position":2,"name":"Home"}]},{"@type":"WebSite","@id":"https:\/\/fiets-o-fit.nl\/#website","url":"https:\/\/fiets-o-fit.nl\/","name":"Fiets-O-Fit","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/fiets-o-fit.nl\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"}]}},"_links":{"self":[{"href":"https:\/\/fiets-o-fit.nl\/es\/wp-json\/wp\/v2\/pages\/9384","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fiets-o-fit.nl\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/fiets-o-fit.nl\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/fiets-o-fit.nl\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fiets-o-fit.nl\/es\/wp-json\/wp\/v2\/comments?post=9384"}],"version-history":[{"count":136,"href":"https:\/\/fiets-o-fit.nl\/es\/wp-json\/wp\/v2\/pages\/9384\/revisions"}],"predecessor-version":[{"id":9599,"href":"https:\/\/fiets-o-fit.nl\/es\/wp-json\/wp\/v2\/pages\/9384\/revisions\/9599"}],"wp:attachment":[{"href":"https:\/\/fiets-o-fit.nl\/es\/wp-json\/wp\/v2\/media?parent=9384"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}