{"id":699,"date":"2026-09-02T11:52:36","date_gmt":"2026-09-02T09:52:36","guid":{"rendered":"https:\/\/dr-technics.com\/?page_id=699"},"modified":"2026-09-10T23:54:50","modified_gmt":"2026-09-10T21:54:50","slug":"home-test","status":"publish","type":"page","link":"https:\/\/dr-technics.com\/index.php\/home-test\/","title":{"rendered":"Home test"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"699\" class=\"elementor elementor-699\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-drxa100 elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"drxa100\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-drxb200\" data-id=\"drxb200\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-drxc300 elementor-widget elementor-widget-html\" data-id=\"drxc300\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div id=\"drx\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Montserrat:wght@600;700;800&family=Barlow:wght@400;500;600;700&display=swap\" rel=\"stylesheet\">\n<style>\n\/* Onderverdelingen per dienst, en foto's die enkel verschijnen als ze er zijn.\n   Alles op #drx, want zonder die sterkte drukt de opmaak van de pagina mijn\n   padding weg en valt het rode bolletje bovenop de eerste letter. *\/\n#drx .svc-subs{list-style:none;margin:12px 0 18px;padding:0;display:flex;flex-direction:column;gap:6px}\n#drx .svc-subs li{position:relative;padding-left:18px;margin:0;font-size:14px;line-height:1.45;color:#5a6069;overflow-wrap:anywhere}\n#drx .svc-subs li:before{content:\"\";position:absolute;left:0;top:8px;width:6px;height:6px;border-radius:50%;background:#e4022e}\n#drx .svc-fotos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 16px}\n#drx .svc-fotos:empty{display:none}\n#drx .svc-fotos .frame:not(.filled){display:none}\n#drx .svc-fotos .frame{border-radius:8px;overflow:hidden;aspect-ratio:4\/3}\n#drx .svc-fotos .frame img{width:100%;height:100%;object-fit:cover;display:block}\n@media (max-width:600px){ #drx .svc-fotos{grid-template-columns:repeat(2,1fr)} }\n\n\/* Zeven kaarten in een raster van vier geeft 4 en dan 3, en dat staat scheef.\n   Met flex loopt de laatste rij gecentreerd, zodat het bedoeld lijkt. *\/\n@media (max-width:1000px){ #drx .svc-grid > .card{flex-basis:calc(50% - 9px)} }\n\n\/* Vinkjes in plaats van bolletjes, zoals bij de rest van de site. *\/\n#drx .svc-subs li{display:flex;align-items:flex-start;gap:8px;padding-left:0}\n#drx .svc-subs li:before{content:none}\n#drx .svc-subs li svg{width:15px;height:15px;flex:none;margin-top:3px;color:#e4022e;stroke-width:2.5}\n#drx .svc-subs li span{min-width:0}\n#drx .svc-subs li.sub2{padding-left:23px;font-size:13.5px;color:#7a8089;gap:7px}\n#drx .svc-subs li.sub2:before{content:\"\";position:absolute;left:8px;top:10px;width:7px;height:1px;background:#c9ccd1}\n\n\/* De link onderaan een kaart is nu een echte link. *\/\n#drx a.more{text-decoration:none;cursor:pointer}\n#drx a.more:hover{text-decoration:underline}\n\n\/* Projecten: \u00e9\u00e9n grote foto, daaronder de kleintjes. Lege kleintjes tonen we\n   niet, want een rij lege kadertjes op een publieke site staat armoedig. *\/\n#drx .proj .pthumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:6px}\n#drx .proj .pthumbs:empty{display:none}\n#drx .proj .pthumbs .frame:not(.filled){display:none}\n#drx .proj .pthumbs .frame{border-radius:6px;overflow:hidden;aspect-ratio:4\/3;cursor:zoom-in}\n#drx .proj .pthumbs .frame img{width:100%;height:100%;object-fit:cover;display:block}\n#drx .proj .frame.pmain.filled{cursor:zoom-in}\n\n\/* Twee knoppen per fotovak: kiezen of wissen. *\/\n.drxadmin .ft2-kn{display:flex;gap:8px;flex-wrap:wrap}\n.drxadmin .ft2-kn .wis{background:#fff;border:1px solid #e8b4af;color:#b3372f}\n.drxadmin .ft2-kn .wis:hover{background:#fdf1f0}\n\n\/* Foto groot bekijken. Klein in de kaart, groot als je erop klikt, met pijlen\n   om door de foto's van die dienst te gaan. *\/\n#drx .svc-fotos .frame.filled{cursor:zoom-in}\n#drx-foto{position:fixed;inset:0;z-index:2147483100;display:none;align-items:center;justify-content:center;background:rgba(10,11,14,.92);padding:24px}\n#drx-foto.on{display:flex}\n#drx-foto img{max-width:min(1100px,92vw);max-height:86vh;border-radius:10px;display:block;box-shadow:0 20px 60px rgba(0,0,0,.5)}\n#drx-foto .fx,#drx-foto .fp,#drx-foto .fn{position:absolute;background:rgba(255,255,255,.12);border:0;color:#fff;width:46px;height:46px;border-radius:50%;font-size:22px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}\n#drx-foto .fx:hover,#drx-foto .fp:hover,#drx-foto .fn:hover{background:rgba(255,255,255,.24)}\n#drx-foto .fx{top:20px;right:22px}\n#drx-foto .fp{left:22px;top:50%;transform:translateY(-50%)}\n#drx-foto .fn{right:22px;top:50%;transform:translateY(-50%)}\n#drx-foto .ft{position:absolute;bottom:22px;left:0;right:0;text-align:center;color:#cfd2d6;font-size:14px}\n@media (max-width:560px){ #drx-foto .fp{left:8px} #drx-foto .fn{right:8px} }\n\n\/* Roosterkinderen mogen niet breder worden dan hun kader, anders schuift de\n   telefoon horizontaal. Dat was het geval bij de veelgestelde vragen. *\/\n#drx .faq > *, #drx .grid > *, #drx .wrap > *{min-width:0}\n#drx-faq{min-width:0;max-width:100%}\n#drx .acc-q{white-space:normal;text-align:left}\n#drx .acc-a p, #drx .card p{overflow-wrap:anywhere}\n\n\n#drx{\n  --ink-900:#0B0D10;--ink-800:#13161A;--ink-700:#1C2026;--ink-600:#2A2F36;--ink-500:#454C54;--ink-400:#6B747D;--ink-300:#98A1AA;--ink-200:#C7CDD3;--ink-100:#E4E7EA;--ink-050:#F4F5F6;--white:#fff;\n  --red-600:#C8022A;--red-500:#E4022E;--red-400:#EE3D5C;--red-050:#FDEDF0;\n  --blue-700:#004985;--blue-600:#00569D;--blue-050:#EBF3FA;\n  --brand:var(--red-500);--brand-hover:var(--red-600);--accent:var(--blue-600);\n  --heat:var(--red-500);--cool:var(--blue-600);\n  --text-strong:var(--ink-900);--text-body:var(--ink-700);--text-muted:var(--ink-400);--text-invert:#fff;--text-invert-muted:rgba(255,255,255,.64);--text-brand:var(--red-600);\n  --surface-page:#fff;--surface-subtle:var(--ink-050);--surface-dark:var(--ink-900);--surface-dark-raised:var(--ink-800);\n  --line:rgba(12,14,16,.10);--line-dark:rgba(255,255,255,.12);\n  --font-display:'Montserrat',system-ui,sans-serif;--font-body:'Barlow',system-ui,-apple-system,sans-serif;\n  --container:1200px;--gutter:24px;--section-y:96px;--section-y-tight:64px;\n  --radius-sm:3px;--radius-md:6px;--radius-lg:10px;--radius-xl:16px;--pill:999px;\n  font-family:var(--font-body);color:var(--text-body);background:var(--surface-page);font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased;\n}\n#drx *{box-sizing:border-box;margin:0;padding:0}\n#drx img{max-width:100%;display:block}\n#drx a{color:inherit;text-decoration:none}\n#drx .wrap{max-width:var(--container);margin:0 auto;padding:0 var(--gutter)}\n#drx .display{font-family:var(--font-display);font-weight:800;letter-spacing:.01em;line-height:1.06;text-transform:none}\n#drx h1,#drx h2,#drx h3{font-family:var(--font-display);font-weight:700;letter-spacing:.02em;line-height:1.16;color:var(--text-strong)}\n#drx .kicker{font-family:var(--font-body);font-weight:600;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-brand);display:inline-flex;align-items:center;gap:8px}\n#drx .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--font-body);font-weight:600;letter-spacing:.06em;font-size:15px;border-radius:var(--radius-md);padding:0 22px;height:54px;cursor:pointer;border:1.5px solid transparent;transition:.18s;white-space:nowrap}\n#drx .btn svg{width:18px;height:18px}\n#drx .btn-primary{background:var(--brand);color:#fff}\n#drx .btn-primary:hover{background:var(--brand-hover)}\n#drx .btn-ghost{background:transparent;color:var(--text-strong);border-color:var(--line)}\n#drx .btn-ghost.inv{color:#fff;border-color:var(--line-dark)}\n#drx .btn-ghost:hover{border-color:var(--brand)}\n#drx .btn-sm{height:46px;font-size:14px;padding:0 18px}\n#drx .ico{width:22px;height:22px;stroke-width:2;color:currentColor}\n\n\/* topbar *\/\n#drx .topbar{background:var(--ink-900);color:var(--text-invert-muted);border-bottom:1px solid var(--line-dark);font-size:13px}\n#drx .topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:42px}\n#drx .topbar .loc{display:inline-flex;align-items:center;gap:8px}\n#drx .topbar .loc svg{width:15px;height:15px;color:var(--brand)}\n#drx .topbar .soc{display:flex;gap:14px}\n#drx .topbar .soc a{display:inline-flex}\n#drx .topbar .soc svg{width:17px;height:17px;color:#fff;opacity:.85}\n\n\/* header *\/\n#drx .hdr{background:var(--ink-900);color:#fff;position:sticky;top:0;z-index:40}\n#drx .hdr .wrap{display:flex;align-items:center;justify-content:space-between;height:92px;gap:20px}\n#drx .brand{display:flex;align-items:center;gap:10px;flex:0 0 auto}\n#drx .brand .logo{width:104px;height:auto}\n#drx nav.main{display:flex;align-items:center;gap:34px;margin-left:8px}\n#drx nav.main a{font-weight:600;font-size:15px;color:#fff;position:relative;padding:6px 0;letter-spacing:.01em}\n#drx nav.main a.active{color:#fff}\n#drx nav.main a.active:after{content:\"\";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--brand)}\n#drx nav.main a:hover{color:var(--ink-200)}\n#drx .hdr-right{display:flex;align-items:center;gap:20px;margin-left:auto}\n#drx .hdr-phone{display:inline-flex;align-items:center;gap:9px;font-weight:700;color:#fff;font-size:17px;white-space:nowrap}\n#drx .hdr-phone svg{width:18px;height:18px;color:var(--brand)}\n#drx .burger{display:none;background:none;border:0;color:#fff;cursor:pointer;padding:6px}\n#drx .burger svg{width:28px;height:28px}\n#drx .mnav{display:none;position:fixed;inset:0;z-index:60;background:rgba(11,13,16,.98);flex-direction:column;padding:24px}\n#drx .mnav.open{display:flex}\n#drx .mnav .mtop{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}\n#drx .mnav .mtop .logo{width:104px}\n#drx .mnav a{color:#fff;font-family:var(--font-display);font-weight:700;font-size:26px;padding:14px 0;border-bottom:1px solid var(--line-dark)}\n#drx .mnav .mfoot{margin-top:auto;display:flex;flex-direction:column;gap:12px}\n#drx .mclose{background:none;border:0;color:#fff;cursor:pointer}\n#drx .mclose svg{width:30px;height:30px}\n\n\/* hero *\/\n#drx .hero{background:var(--ink-900);color:#fff;padding:72px 0 96px}\n#drx .hero .grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}\n#drx .hero h1{color:#fff;font-size:60px;line-height:1.04;margin:18px 0}\n#drx .hero .rule{width:96px;height:4px;background:linear-gradient(90deg,var(--red-500) 0 55%,var(--blue-600) 55% 100%);margin:8px 0 22px;border-radius:2px}\n#drx .hero .intro{color:var(--text-invert-muted);font-size:19px;max-width:520px;margin-bottom:26px}\n#drx .hero .cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:26px}\n#drx .hero .usps{display:flex;gap:22px;flex-wrap:wrap}\n#drx .hero .usps span{display:inline-flex;align-items:center;gap:8px;font-size:15px;color:var(--ink-200)}\n#drx .hero .usps svg{width:18px;height:18px;color:var(--brand)}\n#drx .frame{position:relative;border-radius:var(--radius-xl);overflow:hidden;background:var(--ink-700)}\n#drx .frame.r43{aspect-ratio:4\/3}\n#drx .frame.r11{aspect-ratio:1\/1}\n#drx .frame.r34{aspect-ratio:3\/4}\n#drx .frame img{width:100%;height:100%;object-fit:cover}\n#drx .frame .ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--ink-400)}\n#drx .frame .ph svg{width:34px;height:34px}\n#drx .frame.filled .ph{display:none}\n\n\/* sections *\/\n#drx section{padding:var(--section-y) 0}\n#drx .sec-dark{background:var(--surface-dark);color:#fff}\n#drx .sec-subtle{background:var(--surface-subtle)}\n#drx .sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:44px;flex-wrap:wrap}\n#drx .sec-head h2{font-size:34px}\n#drx .sec-head .kicker{margin-bottom:12px}\n#drx .sec-head .rule{width:64px;height:3px;background:linear-gradient(90deg,var(--red-500) 0 55%,var(--blue-600) 55% 100%);margin-top:14px;border-radius:2px}\n\n\/* services *\/\n#drx .svc-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:18px}\n#drx .svc-grid > .card{flex:0 1 calc(33.333% - 12px);min-width:250px}\n#drx .card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:26px 22px;display:flex;flex-direction:column;transition:.18s}\n#drx .card:hover{box-shadow:0 18px 40px -18px rgba(12,14,16,.28);transform:translateY(-2px)}\n#drx .card .cico{width:46px;height:46px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;margin-bottom:16px}\n#drx .card .cico svg{width:24px;height:24px}\n#drx .card .cico.heat{background:var(--red-050);color:var(--red-600)}\n#drx .card .cico.cool{background:var(--blue-050);color:var(--blue-600)}\n#drx .card h3{font-size:19px;margin-bottom:8px}\n#drx .card p{font-size:15px;color:var(--text-muted);line-height:1.55;margin-bottom:16px}\n#drx .card .more{margin-top:auto;font-weight:600;font-size:14px;color:var(--text-brand);display:inline-flex;align-items:center;gap:7px;letter-spacing:.04em}\n#drx .card .more svg{width:15px;height:15px}\n\n\/* over ons *\/\n#drx .about{display:grid;grid-template-columns:1fr 1.15fr;gap:56px;align-items:center}\n#drx .about .mini{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:22px}\n#drx .about .mini span{display:inline-flex;align-items:center;gap:11px;font-size:15px;color:var(--text-body)}\n#drx .about .mini svg{width:20px;height:20px;color:var(--accent);flex:0 0 auto}\n#drx .about h2{font-size:34px;margin:12px 0 14px}\n#drx .about .intro{color:var(--text-muted)}\n\n\/* cijferband *\/\n#drx .stats{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}\n#drx .stats .items{display:flex;gap:56px;flex-wrap:wrap}\n#drx .stats .n{font-family:var(--font-display);font-weight:800;font-size:44px;color:#fff;line-height:1}\n#drx .stats .l{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-invert-muted);margin-top:8px}\n#drx .stats .mark{width:120px;opacity:.9}\n\n\/* projecten *\/\n#drx .proj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}\n#drx .proj{border-radius:var(--radius-lg);overflow:hidden;background:#fff;border:1px solid var(--line)}\n#drx .proj .body{padding:16px 18px}\n#drx .tag{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.04em;padding:4px 10px;border-radius:var(--pill);margin-bottom:10px}\n#drx .tag.heat{background:var(--red-050);color:var(--red-600)}\n#drx .tag.cool{background:var(--blue-050);color:var(--blue-600)}\n#drx .proj h3{font-size:18px;margin-bottom:4px}\n#drx .proj .place{font-size:14px;color:var(--text-muted)}\n\n\/* faq *\/\n#drx .faq{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px;align-items:start}\n#drx .acc-item{border-bottom:1px solid var(--line)}\n#drx .acc-q{width:100%;text-align:left;background:none;border:0;cursor:pointer;font-family:var(--font-body);font-weight:600;font-size:18px;color:var(--text-strong);padding:22px 0;display:flex;justify-content:space-between;align-items:center;gap:16px}\n#drx .acc-q .pl{width:22px;height:22px;flex:0 0 auto;color:var(--text-brand);transition:.2s}\n#drx .acc-item.open .acc-q .pl{transform:rotate(45deg)}\n#drx .acc-a{max-height:0;overflow:hidden;transition:max-height .28s ease;color:var(--text-muted);font-size:16px}\n#drx .acc-item.open .acc-a{max-height:240px}\n#drx .acc-a p{padding:0 0 22px}\n\n\/* contact *\/\n#drx .contact{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}\n#drx .contact h2{color:#fff;font-size:34px;margin:12px 0 14px}\n#drx .contact .intro{color:var(--text-invert-muted);margin-bottom:22px}\n#drx .contact .note{font-size:14px;color:var(--text-invert-muted);margin-top:16px;line-height:1.6}\n#drx .form{background:var(--surface-dark-raised);border:1px solid var(--line-dark);border-radius:var(--radius-xl);padding:26px}\n#drx .form .fld{margin-bottom:14px}\n#drx .form label{display:block;font-size:13.5px;font-weight:600;color:#fff;margin-bottom:6px}\n#drx .form .req{color:var(--red-400)}\n#drx .form input,#drx .form select,#drx .form textarea{width:100%;background:rgba(255,255,255,.05);border:1px solid var(--line-dark);border-radius:var(--radius-md);padding:12px 14px;color:#fff;font:inherit;font-size:15px}\n#drx .form textarea{min-height:96px;resize:vertical;line-height:1.55}\n#drx .form input::placeholder,#drx .form textarea::placeholder{color:rgba(255,255,255,.4)}\n#drx .form input:focus,#drx .form select:focus,#drx .form textarea:focus{outline:none;border-color:var(--accent)}\n#drx .form .two{display:grid;grid-template-columns:1fr 1fr;gap:12px}\n#drx .form .send{width:100%;margin-top:6px}\n#drx .form .melding{display:none;margin-top:12px;font-size:14px;padding:11px 14px;border-radius:var(--radius-md)}\n#drx .form .melding.goed{display:block;background:rgba(44,122,75,.18);color:#8fe6ad}\n#drx .form .melding.fout{display:block;background:rgba(228,2,46,.16);color:#ffb3c0}\n\n\/* footer *\/\n#drx .ft{background:var(--ink-900);color:var(--text-invert-muted);padding:64px 0 28px}\n#drx .ft .top{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;padding-bottom:36px;border-bottom:1px solid var(--line-dark)}\n#drx .ft .logo{width:104px;margin-bottom:18px}\n#drx .ft p.slog{font-size:15px;max-width:340px;line-height:1.7}\n#drx .ft h4{color:#fff;font-family:var(--font-body);font-weight:700;font-size:14px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:16px}\n#drx .ft ul{list-style:none}\n#drx .ft li{margin-bottom:9px;font-size:15px}\n#drx .ft a:hover{color:#fff}\n#drx .ft .ci{display:flex;align-items:flex-start;gap:10px;margin-bottom:11px;font-size:15px}\n#drx .ft .ci svg{width:17px;height:17px;color:var(--brand);flex:0 0 auto;margin-top:3px}\n#drx .ft .bottom{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:22px;font-size:13.5px;flex-wrap:wrap}\n#drx .ft .soc{display:flex;gap:14px}\n#drx .ft .soc svg{width:18px;height:18px;color:#fff;opacity:.85}\n\n\/* contact herwerkt *\/\n#drx .contact-head{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:end}\n#drx .contact-head h2{color:#fff;font-size:44px;margin:12px 0 10px}\n#drx .contact-head .rule{width:96px;height:4px;background:linear-gradient(90deg,var(--red-500) 0 55%,var(--blue-600) 55% 100%);border-radius:2px;margin:6px 0 14px}\n#drx .contact-head .intro{color:var(--text-invert-muted);max-width:560px}\n#drx .cstrip{display:flex;flex-direction:column;gap:12px}\n#drx .cstrip .ci{display:flex;align-items:flex-start;gap:10px;color:var(--text-invert-muted);font-size:15.5px}\n#drx .cstrip .ci svg{width:18px;height:18px;color:var(--brand);flex:0 0 auto;margin-top:2px}\n#drx .formsec{background:var(--surface-page);padding:64px 0 96px}\n#drx .formgrid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}\n#drx .fstep{margin-bottom:36px}\n#drx .fstep .st{display:flex;align-items:center;gap:10px;margin-bottom:16px}\n#drx .fstep .st .num{width:26px;height:26px;border-radius:var(--pill);background:var(--ink-900);color:#fff;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;flex:0 0 auto}\n#drx .fstep .st h3{font-size:19px;font-family:var(--font-body);font-weight:700;color:var(--text-strong)}\n#drx .frow{display:grid;grid-template-columns:1fr 1fr;gap:16px}\n#drx .fld2{margin-bottom:0}\n#drx .fld2 label{display:block;font-size:13.5px;font-weight:600;color:var(--text-strong);margin-bottom:6px}\n#drx .fld2 .req{color:var(--red-500)}\n#drx .fld2 input,#drx .fld2 textarea{width:100%;background:#fff;border:1px solid var(--line);border-radius:var(--radius-md);padding:12px 14px;font:inherit;font-size:15px;color:var(--text-strong)}\n#drx .fld2 textarea{min-height:120px;resize:vertical;line-height:1.55}\n#drx .fld2 input:focus,#drx .fld2 textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(46,155,201,.18)}\n#drx .fld2 .hint{font-size:13px;color:var(--text-muted);margin-top:6px}\n#drx .chips{display:flex;flex-wrap:wrap;gap:10px}\n#drx .chip{font:inherit;font-size:14.5px;font-weight:600;border:1.5px solid var(--line);background:#fff;color:var(--text-body);border-radius:var(--pill);padding:9px 16px;cursor:pointer;transition:.15s}\n#drx .chip[aria-pressed=\"true\"]{border-color:var(--brand);background:var(--red-050);color:var(--red-600)}\n#drx .callout{border-radius:var(--radius-lg);padding:16px 18px;font-size:14.5px;line-height:1.55;display:flex;gap:11px;align-items:flex-start}\n#drx .callout svg{width:18px;height:18px;flex:0 0 auto;margin-top:2px}\n#drx .callout.green{background:var(--green-050);color:var(--ink-700);border:1px solid rgba(44,122,75,.25)}\n#drx .callout.green a{color:var(--green-600);font-weight:700}\n#drx .callout.green svg{color:var(--green-600)}\n#drx .callout.grey{background:var(--surface-subtle);color:var(--text-muted);border:1px solid var(--line)}\n#drx .callout.grey svg{color:var(--accent)}\n#drx .form-foot{margin-top:28px;display:flex;flex-direction:column;gap:10px;align-items:center}\n#drx .form-foot .btn{max-width:420px;width:100%}\n#drx .form-foot .cap{font-size:13px;color:var(--text-muted);text-align:center}\n#drx .btn:disabled{opacity:.5;cursor:default}\n#drx .klaar{max-width:640px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:var(--radius-xl);padding:40px}\n#drx .klaar .badge{display:inline-flex;align-items:center;gap:7px;background:var(--green-050);color:var(--green-600);font-weight:700;font-size:13px;padding:6px 12px;border-radius:var(--pill);margin-bottom:16px}\n#drx .klaar .badge svg{width:15px;height:15px}\n#drx .klaar h2{font-size:27px;margin-bottom:8px}\n#drx .klaar p.sub{color:var(--text-muted);margin-bottom:20px}\n#drx .klaar .samenv{background:var(--surface-subtle);border-radius:var(--radius-lg);padding:18px;display:grid;grid-template-columns:130px 1fr;gap:10px 18px;font-size:14.5px}\n#drx .klaar .samenv .k{color:var(--text-muted);text-transform:uppercase;font-size:12px;font-weight:700;letter-spacing:.04em}\n\n\/* responsive *\/\n@media(max-width:980px){\n  #drx nav.main,#drx .hdr-phone{display:none}\n  #drx .burger{display:inline-flex}\n  #drx .hero .grid{grid-template-columns:1fr;gap:36px}\n  #drx .hero h1{font-size:44px}\n  #drx .about{grid-template-columns:1fr;gap:32px}\n  #drx .faq{grid-template-columns:1fr;gap:24px}\n  #drx .contact{grid-template-columns:1fr;gap:28px}\n  #drx .contact-head{grid-template-columns:1fr;gap:24px}\n  #drx .formgrid{grid-template-columns:1fr;gap:32px}\n  #drx .svc-grid > .card{flex-basis:calc(50% - 9px)}\n  #drx .proj-grid{grid-template-columns:repeat(2,1fr)}\n  #drx .ft .top{grid-template-columns:1fr 1fr}\n}\n@media(max-width:620px){\n  #drx{font-size:16px}\n  #drx section{padding:56px 0}\n  #drx .hero{padding:48px 0 60px}\n  #drx .hero h1{font-size:36px}\n  #drx .hero .intro{font-size:17px}\n  #drx .sec-head h2,#drx .about h2,#drx .contact h2{font-size:27px}\n  #drx .svc-grid > .card{flex-basis:100%}\n  #drx .proj-grid{grid-template-columns:1fr}\n  #drx .about .mini{grid-template-columns:1fr}\n  #drx .form .two{grid-template-columns:1fr}\n  #drx .frow{grid-template-columns:1fr}\n  #drx .contact-head h2{font-size:30px}\n  #drx .stats .items{gap:32px}\n  #drx .stats .n{font-size:34px}\n  #drx .ft .top{grid-template-columns:1fr}\n  #drx .btn{width:100%}\n  #drx .hero .cta-row{flex-direction:column}\n}\n\n\/* beheer \/ bewerkmodus *\/\n#drx.edit [data-key]{outline:1.5px dashed rgba(228,2,46,.55);outline-offset:3px;cursor:text;border-radius:2px;transition:background .15s}\n#drx.edit [data-key]:hover{background:rgba(228,2,46,.06)}\n#drx.edit [data-key]:focus{outline:2px solid var(--brand);background:rgba(228,2,46,.06)}\n#drx.edit [data-slot]{cursor:pointer}\n#drx.edit [data-slot]:after{content:\"Foto wijzigen\";position:absolute;left:50%;bottom:10px;transform:translateX(-50%);background:rgba(11,13,16,.85);color:#fff;font-family:var(--font-body);font-size:12px;font-weight:600;padding:6px 12px;border-radius:var(--pill);z-index:5;pointer-events:none;white-space:nowrap}\n#drx.edit [data-slot] .ph{color:#fff}\n#drx .drxbar{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:2147482000;background:var(--ink-900);color:#fff;border:1px solid var(--line-dark);border-radius:var(--pill);display:none;align-items:center;gap:14px;padding:10px 12px 10px 20px;box-shadow:0 10px 30px rgba(0,0,0,.35)}\n#drx .drxbar.on{display:flex}\n#drx .drxbar .lab{font-size:13.5px;color:var(--text-invert-muted)}\n#drx .drxbar button{font:inherit;font-weight:700;font-size:14px;border:0;border-radius:var(--pill);padding:9px 16px;cursor:pointer}\n#drx .drxbar .save{background:var(--brand);color:#fff}\n#drx .drxbar .save[disabled]{opacity:.5}\n#drx .drxbar .uit{background:rgba(255,255,255,.1);color:#fff}\n#drx .drxlogin{position:fixed;inset:0;z-index:2147483000;background:rgba(11,13,16,.97);display:none;align-items:center;justify-content:center;padding:24px}\n#drx .drxlogin.on{display:flex}\n#drx .drxlogin form{width:100%;max-width:360px;text-align:center;color:#fff;font-family:var(--font-body)}\n#drx .drxlogin .k{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--brand);margin-bottom:10px}\n#drx .drxlogin h3{color:#fff;font-family:var(--font-display);font-size:24px;margin-bottom:8px}\n#drx .drxlogin p{color:var(--text-invert-muted);font-size:15px;margin-bottom:22px}\n#drx .drxlogin input{width:100%;background:rgba(255,255,255,.06);border:1px solid var(--line-dark);border-radius:var(--radius-md);padding:13px 15px;color:#fff;font:inherit;font-size:15px;margin-bottom:12px}\n#drx .drxlogin .fout{color:#ff9aac;font-size:14px;margin-bottom:12px;display:none}\n#drx .drxlogin .aan{width:100%;background:var(--brand);color:#fff;border:0;border-radius:var(--radius-md);padding:14px;font:inherit;font-weight:700;font-size:16px;cursor:pointer}\n#drx .drxlogin .terug{background:none;border:0;color:var(--text-invert-muted);font:inherit;font-size:14px;margin-top:14px;cursor:pointer;text-decoration:underline}\n\n\/* footer-cta + signup *\/\n#drx .fcta{background:var(--ink-900);color:#fff;padding:56px 0;border-bottom:1px solid var(--line-dark)}\n#drx .fcta .row{display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap}\n#drx .fcta h2{color:#fff;font-size:34px;margin-bottom:14px}\n#drx .fcta .ci-row{display:flex;gap:26px;flex-wrap:wrap}\n#drx .fcta .ci-row .ci{display:inline-flex;align-items:center;gap:9px;color:var(--text-invert-muted);font-size:15px}\n#drx .fcta .ci-row .ci svg{width:17px;height:17px;color:var(--brand)}\n#drx .ftsoc{display:flex;gap:14px;margin-top:18px}\n#drx .ftsoc a{width:38px;height:38px;border-radius:var(--pill);border:1px solid var(--line-dark);display:inline-flex;align-items:center;justify-content:center}\n#drx .ftsoc svg{width:17px;height:17px;color:#fff;opacity:.9}\n#drx .signup{display:flex;gap:8px;margin-top:6px}\n#drx .signup input{flex:1;background:rgba(255,255,255,.05);border:1px solid var(--line-dark);border-radius:var(--radius-md);padding:11px 13px;color:#fff;font:inherit;font-size:14px}\n#drx .signup input::placeholder{color:rgba(255,255,255,.4)}\n#drx .signup button{background:var(--brand);color:#fff;border:0;border-radius:var(--radius-md);padding:0 16px;font:inherit;font-weight:700;font-size:13px;letter-spacing:.04em;cursor:pointer;white-space:nowrap}\n@media(max-width:620px){#drx .fcta h2{font-size:26px}#drx .fcta .row{flex-direction:column;align-items:flex-start}}\n\n\/* media-bibliotheek modal *\/\n#drx .drxmedia{position:fixed;inset:0;z-index:2147483001;background:rgba(11,13,16,.6);display:none;align-items:center;justify-content:center;padding:20px}\n#drx .drxmedia.on{display:flex}\n#drx .mm-box{background:#fff;width:100%;max-width:920px;max-height:88vh;border-radius:var(--radius-xl);display:flex;flex-direction:column;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.4)}\n#drx .mm-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--line)}\n#drx .mm-head b{font-family:var(--font-display);font-size:18px;color:var(--text-strong)}\n#drx .mm-head button{background:var(--surface-subtle);border:0;width:34px;height:34px;border-radius:var(--pill);font-size:20px;cursor:pointer;color:var(--text-muted);line-height:1}\n#drx .mm-actions{display:flex;align-items:center;gap:14px;padding:14px 22px;border-bottom:1px solid var(--line)}\n#drx .mm-upload{background:var(--brand);color:#fff;border:0;border-radius:var(--radius-md);padding:11px 16px;font:inherit;font-weight:700;font-size:14px;cursor:pointer}\n#drx .mm-status{font-size:13.5px;color:var(--text-muted)}\n#drx .mm-grid{padding:18px 22px;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;align-content:start}\n#drx .mm-thumb{height:140px;border-radius:var(--radius-md);overflow:hidden;border:2px solid var(--line);cursor:pointer;background:var(--surface-subtle);position:relative}\n#drx .mm-thumb img{width:100%;height:100%;object-fit:cover}\n#drx .mm-thumb:hover{border-color:var(--brand)}\n#drx .mm-empty{grid-column:1\/-1;text-align:center;color:var(--text-muted);padding:30px;font-size:14.5px}\n#drx .ft li a{text-transform:none;font-weight:400;letter-spacing:0;font-size:15px;color:var(--text-invert-muted)}\n#drx .ft li a:hover{color:#fff}\n#drx .ft .ci a{text-transform:none;font-weight:400;letter-spacing:0}\n#drx .ft h4{text-transform:uppercase}\n\n\/* beheer-paneel *\/\n#drx .drxadmin{position:fixed;inset:0;z-index:2147483000;background:var(--surface-page);display:none;flex-direction:column;overflow:hidden}\n#drx .drxadmin.on{display:flex}\n#drx .ad-top{background:var(--ink-900);color:#fff;padding:26px 0 0}\n#drx .ad-kick{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-invert-muted);margin-bottom:8px}\n#drx .ad-row{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}\n#drx .ad-row h2{color:#fff;font-size:34px}\n#drx .ad-actions{display:flex;gap:10px}\n#drx .ad-actions button{font:inherit;font-weight:700;font-size:14px;border-radius:var(--radius-md);padding:10px 16px;cursor:pointer;border:1px solid var(--line-dark);background:rgba(255,255,255,.08);color:#fff}\n#drx .ad-actions #ad-bekijk{background:#fff;color:var(--ink-900);border-color:#fff}\n#drx .ad-top p{color:var(--text-invert-muted);font-size:15px;margin:12px 0 20px;max-width:640px}\n#drx .ad-tabs{display:flex;gap:26px;border-top:1px solid var(--line-dark)}\n#drx .ad-tab{background:none;border:0;color:var(--text-invert-muted);font:inherit;font-weight:600;font-size:15px;padding:16px 0;cursor:pointer;position:relative}\n#drx .ad-tab.on{color:#fff}\n#drx .ad-tab.on:after{content:\"\";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--brand)}\n#drx .ad-body{flex:1;overflow-y:auto;padding:32px var(--gutter) 110px;width:100%;max-width:var(--container);margin:0 auto}\n#drx .ad-pane{display:none}\n#drx .ad-pane.on{display:block}\n#drx .ad-tk{display:grid;grid-template-columns:250px 1fr;gap:32px;align-items:start}\n#drx .ad-groups{display:flex;flex-direction:column;gap:2px;position:sticky;top:0}\n#drx .ad-groups button{text-align:left;background:none;border:0;border-left:3px solid transparent;padding:11px 14px;border-radius:var(--radius-sm);font:inherit;font-size:14.5px;color:var(--text-muted);cursor:pointer}\n#drx .ad-groups button.on{background:var(--surface-subtle);border-left-color:var(--brand);color:var(--text-strong);font-weight:600}\n#drx .ad-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:26px}\n#drx .ad-card h3{font-family:var(--font-body);font-weight:700;font-size:18px;margin-bottom:4px}\n#drx .ad-card .note{color:var(--text-muted);font-size:14px;margin-bottom:18px}\n#drx .ad-fld{margin-bottom:16px}\n#drx .ad-fld label{display:block;font-size:13.5px;font-weight:600;margin-bottom:6px;color:var(--text-strong)}\n#drx .ad-fld input,#drx .ad-fld textarea,#drx .ad-fld select{width:100%;border:1px solid var(--line);border-radius:var(--radius-md);padding:11px 13px;font:inherit;font-size:15px;color:var(--text-strong);background:#fff}\n#drx .ad-fld textarea{min-height:90px;resize:vertical;line-height:1.5}\n#drx .ad-fld input:focus,#drx .ad-fld textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(46,155,201,.15)}\n#drx .ad-two{display:grid;grid-template-columns:1fr 1fr;gap:16px}\n#drx .ad-item{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:20px;margin-bottom:14px}\n#drx .ad-item .hd{font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-brand);margin-bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:12px}\n\/* Een project bijvoegen of weghalen. De verwijderknop staat rustig in de kop,\n   de knop om bij te voegen valt op, want dat is wat Dries dagelijks doet. *\/\n#drx .ad-item .pr-weg{font:inherit;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--text-3,#6B747D);background:transparent;border:1px solid var(--line);border-radius:8px;padding:4px 10px;cursor:pointer}\n#drx .ad-item .pr-weg:hover{color:#B00224;border-color:#F8B3C0;background:#FDEDF0}\n#drx .pr-bij{font:inherit;font-weight:600;font-size:14px;color:#fff;background:var(--red-500,#E4022E);border:0;border-radius:var(--radius-lg,12px);padding:12px 18px;cursor:pointer;margin-top:4px}\n#drx .pr-bij:hover{background:var(--red-600,#C8022A)}\n#drx .ad-fotos{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px}\n#drx .ad-foto{border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;background:#fff}\n#drx .ad-foto .prev{aspect-ratio:4\/3;background:var(--surface-subtle);position:relative;display:flex;align-items:center;justify-content:center;color:var(--ink-300)}\n#drx .ad-foto .prev img{width:100%;height:100%;object-fit:cover}\n#drx .ad-foto .prev svg{width:30px;height:30px}\n#drx .ad-foto .ft2{padding:12px 14px;display:flex;align-items:center;justify-content:space-between;gap:10px}\n#drx .ad-foto .ft2-tx{min-width:0}\n#drx .ad-foto .fhint{display:block;font-size:12px;color:var(--text-muted);margin-top:3px;line-height:1.35}\n#drx .ad-foto .ft2 b{font-size:13.5px;color:var(--text-strong)}\n#drx .ad-foto .ft2 button{font:inherit;font-weight:600;font-size:13px;color:#fff;background:var(--brand);border:0;border-radius:var(--radius-md);padding:8px 12px;cursor:pointer}\n#drx .ad-save{position:absolute;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--line);padding:14px 0}\n#drx .ad-save .wrap{display:flex;align-items:center;justify-content:flex-end;gap:16px}\n#drx .ad-save #ad-status{font-size:14px;color:var(--text-muted)}\n#drx .ad-save #ad-opslaan{background:var(--brand);color:#fff;border:0;border-radius:var(--radius-md);padding:13px 26px;font:inherit;font-weight:700;font-size:15px;cursor:pointer}\n@media(max-width:820px){#drx .ad-tk{grid-template-columns:1fr}#drx .ad-groups{flex-direction:row;overflow-x:auto;position:static}#drx .ad-two{grid-template-columns:1fr}#drx .ad-row h2{font-size:26px}}\n#drx .chip{text-transform:none;letter-spacing:0}\n#drx .fld2 label{text-transform:none;letter-spacing:0}\n#drx .ad-fld label{text-transform:none;letter-spacing:0}\n#drx .fld2 input,#drx .fld2 textarea{text-transform:none}\n<\/style>\n\n<!-- TOPBAR -->\n<div class=\"topbar\"><div class=\"wrap\">\n  <span class=\"loc\"><i data-lucide=\"map-pin\"><\/i><span data-key=\"algemeen.regio\">3590 Diepenbeek \u2014 Limburg<\/span><\/span>\n  <span class=\"soc\"><a href=\"#\" aria-label=\"Instagram\"><i data-lucide=\"instagram\"><\/i><\/a><a href=\"#\" aria-label=\"Facebook\"><i data-lucide=\"facebook\"><\/i><\/a><\/span>\n<\/div><\/div>\n\n<!-- HEADER -->\n<header class=\"hdr\"><div class=\"wrap\">\n  <a class=\"brand\" href=\"#home\"><img decoding=\"async\" class=\"logo\" src=\"https:\/\/dr-technics.com\/wp-content\/uploads\/2024\/03\/lang-logo-zwarte-achtergrond-HC.png\" alt=\"DR-Technics\"><\/a>\n  <nav class=\"main\">\n    <a href=\"#home\" class=\"active\">Home<\/a>\n    <a href=\"#services\">Services<\/a>\n    <a href=\"#projecten\">Projecten<\/a>\n    <a href=\"#contact\">Contact<\/a>\n    <a href=\"#\" id=\"drx-beheerlink\">Beheer<\/a>\n  <\/nav>\n  <div class=\"hdr-right\">\n    <a class=\"hdr-phone\" href=\"tel:+3249851 2564\"><i data-lucide=\"phone\"><\/i><span data-key=\"algemeen.telefoon\">(+32) 498 51 25 64<\/span><\/a>\n    <a class=\"btn btn-primary btn-sm\" href=\"#contact\">Offerte<\/a>\n    <button class=\"burger\" id=\"drx-burger\" aria-label=\"Menu\"><i data-lucide=\"menu\"><\/i><\/button>\n  <\/div>\n<\/div><\/header>\n\n<!-- MOBIEL MENU -->\n<div class=\"mnav\" id=\"drx-mnav\">\n  <div class=\"mtop\"><img decoding=\"async\" class=\"logo\" src=\"https:\/\/dr-technics.com\/wp-content\/uploads\/2024\/03\/lang-logo-zwarte-achtergrond-HC.png\" alt=\"\"><button class=\"mclose\" id=\"drx-mclose\"><i data-lucide=\"x\"><\/i><\/button><\/div>\n  <a href=\"#home\">Home<\/a>\n  <a href=\"#services\">Services<\/a>\n  <a href=\"#projecten\">Projecten<\/a>\n  <a href=\"#contact\">Contact<\/a>\n  <a href=\"#\" id=\"drx-beheerlink-m\">Beheer<\/a>\n  <div class=\"mfoot\">\n    <a class=\"btn btn-ghost inv\" href=\"tel:+32498512564\"><i data-lucide=\"phone\"><\/i> <span data-key=\"algemeen.telefoon\">(+32) 498 51 25 64<\/span><\/a>\n    <a class=\"btn btn-primary\" href=\"#contact\">Vraag een offerte<\/a>\n  <\/div>\n<\/div>\n\n<!-- HERO -->\n<section class=\"hero\" id=\"home\"><div class=\"wrap\"><div class=\"grid\">\n  <div>\n    <span class=\"kicker\"><i data-lucide=\"map-pin\"><\/i><span data-key=\"home.kicker\">Installateur in Diepenbeek \u2014 Limburg<\/span><\/span>\n    <h1 class=\"display\" data-key=\"home.titel\" data-multiline=\"1\">Optimale warmte\nen koeling<\/h1>\n    <div class=\"rule\"><\/div>\n    <p class=\"intro\" data-key=\"home.intro\">Betrouwbaar en energiezuinig. Van centrale verwarming en airconditioning tot badkamerrenovaties, service en onderhoud.<\/p>\n    <div class=\"cta-row\">\n      <a class=\"btn btn-primary\" href=\"#contact\"><span data-key=\"home.cta\">Vraag een offerte<\/span> <i data-lucide=\"arrow-right\"><\/i><\/a>\n      <a class=\"btn btn-ghost inv\" href=\"tel:+32498512564\"><i data-lucide=\"phone\"><\/i> <span data-key=\"algemeen.telefoon\">(+32) 498 51 25 64<\/span><\/a>\n    <\/div>\n    <div class=\"usps\" data-usps=\"home.usps\">\n      <span><i data-lucide=\"check-circle\"><\/i>E\u00e9n aanspreekpunt<\/span>\n      <span><i data-lucide=\"check-circle\"><\/i>Hernieuwbare energie<\/span>\n      <span><i data-lucide=\"check-circle\"><\/i>Service &amp; onderhoud<\/span>\n    <\/div>\n  <\/div>\n  <div class=\"frame r43\" data-slot=\"home-hero\"><div class=\"ph\"><i data-lucide=\"image\"><\/i><\/div><\/div>\n<\/div><\/div><\/section>\n\n<!-- SERVICES -->\n<section class=\"sec-subtle\" id=\"services\"><div class=\"wrap\">\n  <div class=\"sec-head\">\n    <div>\n      <span class=\"kicker\" data-key=\"services.kicker\">Onze services<\/span>\n      <h2 data-key=\"services.titel\">Van installatie tot onderhoud<\/h2>\n      <div class=\"rule\"><\/div>\n    <\/div>\n    <a class=\"btn btn-ghost\" href=\"#contact\">Alle services <i data-lucide=\"arrow-right\"><\/i><\/a>\n  <\/div>\n  <div class=\"svc-grid\" id=\"drx-svc\"><\/div>\n<div id=\"drx-foto\" role=\"dialog\" aria-label=\"Foto groter bekijken\">\n  <button class=\"fx\" type=\"button\" aria-label=\"Sluiten\">&times;<\/button>\n  <button class=\"fp\" type=\"button\" aria-label=\"Vorige\">&#8249;<\/button>\n  <img alt=\"\">\n  <button class=\"fn\" type=\"button\" aria-label=\"Volgende\">&#8250;<\/button>\n  <div class=\"ft\"><\/div>\n<\/div>\n<\/div><\/section>\n\n<!-- OVER ONS -->\n<section><div class=\"wrap\"><div class=\"about\">\n  <div class=\"frame r11\" data-slot=\"home-about\"><div class=\"ph\"><i data-lucide=\"image\"><\/i><\/div><\/div>\n  <div>\n    <span class=\"kicker\" data-key=\"over.kicker\">Over ons<\/span>\n    <h2 data-key=\"over.titel\">E\u00e9n vakman, alle technieken<\/h2>\n    <p class=\"intro\" data-key=\"over.intro\">DR-Technics is gespecialiseerd in alles van centrale verwarming en airconditioning tot badkamerrenovaties, service en onderhoud.<\/p>\n    <div class=\"mini\">\n      <span><i data-lucide=\"clock\"><\/i>Snel ter plaatse in Limburg<\/span>\n      <span><i data-lucide=\"shield-check\"><\/i>Wettelijk onderhoud in orde<\/span>\n      <span><i data-lucide=\"leaf\"><\/i>Focus op hernieuwbare energie<\/span>\n      <span><i data-lucide=\"file-text\"><\/i>Duidelijke offerte vooraf<\/span>\n    <\/div>\n  <\/div>\n<\/div><\/div><\/section>\n\n<!-- CIJFERBAND -->\n<section class=\"sec-dark\" style=\"padding:56px 0\"><div class=\"wrap\"><div class=\"stats\">\n  <div class=\"items\">\n    <div><div class=\"n\" data-key=\"cijfers.1.waarde\">2022<\/div><div class=\"l\" data-key=\"cijfers.1.label\">Opgericht<\/div><\/div>\n    <div><div class=\"n\" data-key=\"cijfers.2.waarde\">8<\/div><div class=\"l\" data-key=\"cijfers.2.label\">Services<\/div><\/div>\n    <div><div class=\"n\" data-key=\"cijfers.3.waarde\">Limburg<\/div><div class=\"l\" data-key=\"cijfers.3.label\">Werkgebied<\/div><\/div>\n  <\/div>\n  <img decoding=\"async\" class=\"mark\" src=\"https:\/\/dr-technics.com\/wp-content\/uploads\/2024\/03\/lang-logo-zwarte-achtergrond-HC.png\" alt=\"\">\n<\/div><\/div><\/section>\n\n<!-- PROJECTEN -->\n<section class=\"sec-subtle\" id=\"projecten\"><div class=\"wrap\">\n  <div class=\"sec-head\">\n    <div>\n      <span class=\"kicker\" data-key=\"projecten.kicker\">Projecten<\/span>\n      <h2 data-key=\"projecten.titel\">Recent werk in Limburg<\/h2>\n      <div class=\"rule\"><\/div>\n    <\/div>\n    <a class=\"btn btn-ghost\" href=\"#contact\">Alle projecten <i data-lucide=\"arrow-right\"><\/i><\/a>\n  <\/div>\n  <div class=\"proj-grid\" id=\"drx-proj\"><\/div>\n<\/div><\/section>\n\n<!-- FAQ -->\n<section><div class=\"wrap\"><div class=\"faq\">\n  <div>\n    <span class=\"kicker\" data-key=\"faq.kicker\">Veelgestelde vragen<\/span>\n    <h2 style=\"font-size:34px;margin-top:12px\" data-key=\"faq.titel\">Goed om te weten<\/h2>\n  <\/div>\n  <div id=\"drx-faq\"><\/div>\n<\/div><\/div><\/section>\n\n<!-- CONTACT \/ OFFERTE -->\n<section class=\"sec-dark\" id=\"contact\" style=\"padding-bottom:56px\"><div class=\"wrap\"><div class=\"contact-head\">\n  <div>\n    <span class=\"kicker\" data-key=\"contact.kicker\">Offerteaanvraag<\/span>\n    <h2 data-key=\"contact.titel\">Vraag een prijs<\/h2>\n    <div class=\"rule\"><\/div>\n    <p class=\"intro\" data-key=\"contact.intro\">Vier korte vragen \u2014 u hoeft niets uit te zoeken. Hoe meer u invult, hoe sneller wij met een concreet voorstel terugkomen.<\/p>\n  <\/div>\n  <div class=\"cstrip\">\n    <div class=\"ci\"><i data-lucide=\"phone\"><\/i><span data-key=\"algemeen.telefoon\">(+32) 498 51 25 64<\/span><\/div>\n    <div class=\"ci\"><i data-lucide=\"mail\"><\/i><span data-key=\"algemeen.mail\">info@DR-technics.com<\/span><\/div>\n    <div class=\"ci\"><i data-lucide=\"map-pin\"><\/i><span data-key=\"algemeen.adres\">Onderwijslaan, 3590 Diepenbeek, Belgi\u00eb<\/span><\/div>\n  <\/div>\n<\/div><\/div><\/section>\n\n<section class=\"formsec\"><div class=\"wrap\"><div id=\"drx-formwrap\">\n  <form id=\"drx-form\">\n    <div class=\"formgrid\">\n      <div>\n        <div class=\"fstep\">\n          <div class=\"st\"><h3>Wie ben je<\/h3><\/div>\n          <div class=\"frow\">\n            <div class=\"fld2\"><label>Naam <span class=\"req\">*<\/span><\/label><input name=\"naam\" required placeholder=\"Voor- en familienaam\"><\/div>\n            <div class=\"fld2\"><label>Telefoon <span class=\"req\">*<\/span><\/label><input name=\"telefoon\" required inputmode=\"tel\" placeholder=\"0498 51 25 64\"><\/div>\n          <\/div>\n          <div class=\"frow\" style=\"margin-top:16px\">\n            <div class=\"fld2\"><label>E-mail<\/label><input name=\"email\" type=\"email\" placeholder=\"naam@voorbeeld.be\"><\/div>\n            <div class=\"fld2\"><label>Gemeente<\/label><input name=\"gemeente\" placeholder=\"3590 Diepenbeek\"><\/div>\n          <\/div>\n        <\/div>\n        <div class=\"fstep\">\n          <div class=\"st\"><span class=\"num\">1<\/span><h3>Wat moet er gebeuren<\/h3><\/div>\n          <div class=\"chips\" id=\"chips-werk\"><\/div>\n          <div class=\"fld2\" style=\"margin-top:16px\"><label>Vertel er kort iets meer over<\/label><textarea name=\"meer\" placeholder=\"\"><\/textarea><div class=\"hint\">Bijvoorbeeld: ketel van 14 jaar oud die soms afslaat.<\/div><\/div>\n        <\/div>\n      <\/div>\n      <div>\n        <div class=\"fstep\">\n          <div class=\"st\"><span class=\"num\">2<\/span><h3>Tegen wanneer<\/h3><\/div>\n          <div class=\"chips\" id=\"chips-wanneer\"><\/div>\n        <\/div>\n        <div class=\"fstep\">\n          <div class=\"st\"><span class=\"num\">3<\/span><h3>Een foto van de ruimte<\/h3><\/div>\n          <div class=\"callout green\"><i data-lucide=\"check-circle\"><\/i><div><b style=\"display:block;margin-bottom:3px;color:var(--text-strong)\">Stuur je foto's door via WhatsApp<\/b><a href=\"https:\/\/wa.me\/32498512564\" data-key=\"algemeen.telefoon\">(+32) 498 51 25 64<\/a> \u2014 <span data-key=\"contact.whatsapp\">Naar dit nummer, met je naam erbij. E\u00e9n foto van de ketel of de ruimte volstaat meestal.<\/span><\/div><\/div>\n        <\/div>\n        <div class=\"callout grey\"><i data-lucide=\"shield-check\"><\/i><span data-key=\"contact.privacy\">Uw gegevens gaan enkel naar DR-Technics en worden alleen gebruikt om uw aanvraag te behandelen.<\/span><\/div>\n      <\/div>\n    <\/div>\n    <div class=\"form-foot\">\n      <button type=\"submit\" class=\"btn btn-primary\" id=\"drx-send\" disabled>Stuur de aanvraag <i data-lucide=\"arrow-right\"><\/i><\/button>\n      <span class=\"cap\" id=\"drx-cap\">Vul minstens naam, telefoon en wat er moet gebeuren in. Of bel direct: <span data-key=\"algemeen.telefoon\">(+32) 498 51 25 64<\/span><\/span>\n    <\/div>\n  <\/form>\n<\/div><\/div><\/section>\n\n\n<!-- CTA-BAND + FOOTER -->\n<div class=\"fcta\"><div class=\"wrap\"><div class=\"row\">\n  <div>\n    <h2>Een project in gedachten?<\/h2>\n    <div class=\"ci-row\">\n      <span class=\"ci\"><i data-lucide=\"phone\"><\/i><span data-key=\"algemeen.telefoon\">(+32) 498 51 25 64<\/span><\/span>\n      <span class=\"ci\"><i data-lucide=\"mail\"><\/i><span data-key=\"algemeen.mail\">info@DR-technics.com<\/span><\/span>\n      <span class=\"ci\"><i data-lucide=\"map-pin\"><\/i><span data-key=\"algemeen.adres\">Onderwijslaan, 3590 Diepenbeek, Belgi\u00eb<\/span><\/span>\n    <\/div>\n  <\/div>\n  <a class=\"btn btn-primary\" href=\"#contact\">Vraag een offerte <i data-lucide=\"arrow-right\"><\/i><\/a>\n<\/div><\/div><\/div>\n\n<footer class=\"ft\"><div class=\"wrap\">\n  <div class=\"top\">\n    <div>\n      <img decoding=\"async\" class=\"logo\" src=\"https:\/\/dr-technics.com\/wp-content\/uploads\/2024\/03\/lang-logo-zwarte-achtergrond-HC.png\" alt=\"DR-Technics\">\n      <p class=\"slog\" data-key=\"algemeen.slogan\">Optimale warmte en koeling \u2014 betrouwbaar en energiezuinig. Installatie, service en onderhoud in Limburg.<\/p>\n      <div class=\"ftsoc\"><a href=\"#\" aria-label=\"Instagram\"><i data-lucide=\"instagram\"><\/i><\/a><a href=\"#\" aria-label=\"Facebook\"><i data-lucide=\"facebook\"><\/i><\/a><\/div>\n    <\/div>\n    <div>\n      <h4>Services<\/h4>\n      <ul id=\"drx-ftsvc\"><\/ul>\n    <\/div>\n    <div>\n      <h4>Contact<\/h4>\n      <div class=\"ci\"><i data-lucide=\"phone\"><\/i><a href=\"tel:+32498512564\" data-key=\"algemeen.telefoon\">(+32) 498 51 25 64<\/a><\/div>\n      <div class=\"ci\"><i data-lucide=\"mail\"><\/i><a href=\"mailto:info@DR-technics.com\" data-key=\"algemeen.mail\">info@DR-technics.com<\/a><\/div>\n      <div class=\"ci\"><i data-lucide=\"map-pin\"><\/i><span data-key=\"algemeen.adres\">Onderwijslaan, 3590 Diepenbeek, Belgi\u00eb<\/span><\/div>\n      <div class=\"signup\"><input type=\"email\" placeholder=\"E-mailadres\" aria-label=\"E-mailadres\"><button type=\"button\">Aanmelden<\/button><\/div>\n    <\/div>\n  <\/div>\n  <div class=\"bottom\">\n    <span>\u00a9 <span id=\"drx-jaar\"><\/span> DR-Technics. Alle rechten voorbehouden.<\/span>\n    <span data-key=\"algemeen.btw\">BE 0780.895.926<\/span>\n  <\/div>\n<\/div><\/footer>\n\n<script>\n(function(){\n  var LOGO=\"https:\/\/dr-technics.com\/wp-content\/uploads\/2024\/03\/lang-logo-zwarte-achtergrond-HC.png\";\n  var HOOK_AANVRAAG=\"https:\/\/hook.eu1.make.com\/1rkc8xwhjy4flipszmu6kv4xbu1w7bfn\";\n  var KLANT=\"drtechnics-4h7q\";\n  var STORE_SEARCH=location.origin+\"\/wp-json\/wp\/v2\/media?search=dr-content&per_page=100\";\n  var DEFAULTS={\"algemeen.telefoon\": \"(+32) 498 51 25 64\", \"algemeen.mail\": \"info@DR-technics.com\", \"algemeen.adres\": \"Onderwijslaan, 3590 Diepenbeek, Belgi\u00eb\", \"algemeen.regio\": \"3590 Diepenbeek \u2014 Limburg\", \"algemeen.uren\": \"Ma\u2013vr 08:00\u201318:00, za op afspraak\", \"algemeen.btw\": \"BE 0780.895.926\", \"algemeen.slogan\": \"Optimale warmte en koeling \u2014 betrouwbaar en energiezuinig. Installatie, service en onderhoud in Limburg.\", \"home.kicker\": \"Installateur in Diepenbeek \u2014 Limburg\", \"home.titel\": \"Optimale warmte\\nen koeling\", \"home.intro\": \"Betrouwbaar en energiezuinig. Van centrale verwarming en airconditioning tot badkamerrenovaties, service en onderhoud.\", \"home.cta\": \"Vraag een offerte\", \"home.usps\": \"E\u00e9n aanspreekpunt|Hernieuwbare energie|Service & onderhoud\", \"services.kicker\": \"Onze services\", \"services.titel\": \"Van installatie tot onderhoud\", \"services.intro\": \"Wij zijn constant bezig onszelf en onze services te verbeteren. Door gebruik te maken van hernieuwbare energie breiden wij ons assortiment uit.\", \"over.kicker\": \"Over ons\", \"over.titel\": \"E\u00e9n vakman, alle technieken\", \"over.intro\": \"DR-Technics is gespecialiseerd in alles van centrale verwarming en airconditioning tot badkamerrenovaties, service en onderhoud. Wij streven ervoor om hernieuwbare energie optimaal te benutten, zodat we niet alleen comfort, maar ook duurzaamheid en kwaliteit bieden.\", \"cijfers.1.waarde\": \"2022\", \"cijfers.1.label\": \"Opgericht\", \"cijfers.2.waarde\": \"8\", \"cijfers.2.label\": \"Services\", \"cijfers.3.waarde\": \"Limburg\", \"cijfers.3.label\": \"Werkgebied\", \"projecten.kicker\": \"Projecten\", \"projecten.titel\": \"Recent werk in Limburg\", \"faq.kicker\": \"Veelgestelde vragen\", \"faq.titel\": \"Goed om te weten\", \"contact.kicker\": \"Offerteaanvraag\", \"contact.titel\": \"Vraag een prijs\", \"contact.intro\": \"Vier korte vragen \u2014 u hoeft niets uit te zoeken. Hoe meer u invult, hoe sneller wij met een concreet voorstel terugkomen.\", \"contact.whatsapp\": \"Naar dit nummer, met je naam erbij. E\u00e9n foto van de ketel of de ruimte volstaat meestal.\", \"contact.privacy\": \"Uw gegevens gaan enkel naar DR-Technics en worden alleen gebruikt om uw aanvraag te behandelen.\"};\n  var SERVICES=[{\"key\": \"verwarming\", \"icon\": \"flame\", \"tone\": \"heat\", \"title\": \"Verwarming\", \"description\": \"Van warmtepomp tot gasketel, geplaatst en onderhouden door dezelfde mensen.\", \"subs\": [\"Warmtepompen\", \"- Lucht-water\", \"- Geothermie\", \"- Lucht-lucht\", \"Gaswandketels\", \"Industri\u00eble gasketels\"]}, {\"key\": \"koeling\", \"icon\": \"snowflake\", \"tone\": \"cool\", \"title\": \"Koeling\", \"description\": \"Airco voor thuis en op kantoor, en koeling voor wie ze beroepshalve nodig heeft.\", \"subs\": [\"Airco's\", \"Koel en vriesinstallaties\"]}, {\"key\": \"ventilatie\", \"icon\": \"wind\", \"tone\": \"cool\", \"title\": \"Ventilatie\", \"description\": \"Gezonde lucht binnen, zonder uw warmte naar buiten te blazen.\", \"subs\": [\"Ventilatiesysteem D\", \"Ventilatiesysteem C+\", \"Industri\u00eble ventilatie\"]}, {\"key\": \"regenwater\", \"icon\": \"droplets\", \"tone\": \"cool\", \"title\": \"Regenwatervoorzieningen\", \"description\": \"Uw regenwater gebruiken waar het kan, met een pomp die het jaren volhoudt.\", \"subs\": [\"Dompelpompen\", \"Regenwaterpompen\"]}, {\"key\": \"ontkalking\", \"icon\": \"settings-2\", \"tone\": \"heat\", \"title\": \"Waterbehandeling \/ ontkalking\", \"description\": \"Zacht water spaart uw ketel, uw kranen en uw wasmachine.\", \"subs\": [\"Waterontharders \/ ontkalkers\"]}, {\"key\": \"sanitair\", \"icon\": \"shower-head\", \"tone\": \"heat\", \"title\": \"Sanitair\", \"description\": \"Van een volledige badkamer tot een kraan die blijft druppelen.\", \"subs\": [\"Badkamerrenovaties\", \"Douches\", \"Toiletten\", \"Kranen\", \"Allerlei sanitaire herstellingen en aanpassingen\"]}];\n  var PROJECTS=[{\"title\": \"Multi-split airco, 4 kamers\", \"place\": \"Diepenbeek \u2014 renovatie\", \"tag\": \"Airco\", \"tagTone\": \"cool\", \"slotId\": \"proj-1\"}, {\"title\": \"Warmtepomp + vloerverwarming\", \"place\": \"Limburg \u2014 nieuwbouw\", \"tag\": \"Hernieuwbaar\", \"tagTone\": \"cool\", \"slotId\": \"proj-2\"}, {\"title\": \"Volledige badkamerrenovatie\", \"place\": \"Diepenbeek \u2014 renovatie\", \"tag\": \"Sanitair\", \"tagTone\": \"heat\", \"slotId\": \"proj-3\"}, {\"title\": \"Vervanging condensatieketel\", \"place\": \"Limburg \u2014 bestaande woning\", \"tag\": \"Verwarming\", \"tagTone\": \"heat\", \"slotId\": \"proj-4\"}, {\"title\": \"Ventilatie systeem D\", \"place\": \"Limburg \u2014 nieuwbouw\", \"tag\": \"Ventilatie\", \"tagTone\": \"cool\", \"slotId\": \"proj-5\"}, {\"title\": \"Waterverzachter + ontkalking\", \"place\": \"Diepenbeek\", \"tag\": \"Ontkalking\", \"tagTone\": \"heat\", \"slotId\": \"proj-6\"}];\n  var FAQ=[{\"title\": \"Hoe snel kan ik terecht?\", \"body\": \"Voor dringende herstellingen bellen wij dezelfde werkdag terug. Voor installaties plannen we samen een datum in.\"}, {\"title\": \"Werkt u met onderhoudscontracten?\", \"body\": \"Ja. Jaarlijks onderhoud van uw ketel of airco kan als contract, zo vergeet u het nooit.\"}, {\"title\": \"Krijg ik een offerte vooraf?\", \"body\": \"Altijd. Na een bezoek ter plaatse krijgt u een duidelijke offerte met materiaal en werkuren.\"}, {\"title\": \"In welke regio werkt u?\", \"body\": \"Diepenbeek en omstreken, in de ruime regio Limburg.\"}];\n  var root=document.getElementById('drx');\n\n  \/\/ ---- Lucide-iconen ingebakken (identiek, geen externe bron) ----\n  var ICONS={\n    \"flame\":'<path d=\"M8.5 14.5A2.5 2.5 0 0 0 11 12c0-1.38-.5-2-1-3-1.072-2.143-.224-4.054 2-6 .5 2.5 2 4.9 4 6.5 2 1.6 3 3.5 3 5.5a7 7 0 1 1-14 0c0-1.153.433-2.294 1-3a2.5 2.5 0 0 0 2.5 2.5z\"\/>',\n    \"shower-head\":'<path d=\"m4 4 2.5 2.5\"\/><path d=\"M13.5 6.5a4.95 4.95 0 0 0-7 7\"\/><path d=\"M15 5 5 15\"\/><path d=\"M14 17v.01\"\/><path d=\"M10 16v.01\"\/><path d=\"M13 13v.01\"\/><path d=\"M16 10v.01\"\/><path d=\"M11 20v.01\"\/><path d=\"M17 14v.01\"\/><path d=\"M20 11v.01\"\/>',\n    \"snowflake\":'<line x1=\"2\" x2=\"22\" y1=\"12\" y2=\"12\"\/><line x1=\"12\" x2=\"12\" y1=\"2\" y2=\"22\"\/><path d=\"m20 16-4-4 4-4\"\/><path d=\"m4 8 4 4-4 4\"\/><path d=\"m16 4-4 4-4-4\"\/><path d=\"m8 20 4-4 4 4\"\/>',\n    \"droplets\":'<path d=\"M7 16.3c2.2 0 4-1.83 4-4.05 0-1.16-.57-2.26-1.71-3.19S7.29 4.24 7 2c-.29 2.24-1.14 4.13-2.29 5.06S3 11.1 3 12.25c0 2.22 1.8 4.05 4 4.05z\"\/><path d=\"M12.56 6.6A10.97 10.97 0 0 0 14 3.02c.5 2.5 2 4.9 4 6.5s3 3.5 3 5.5a6.98 6.98 0 0 1-11.91 4.97\"\/>',\n    \"wind\":'<path d=\"M17.7 7.7a2.5 2.5 0 1 1 1.8 4.3H2\"\/><path d=\"M9.6 4.6A2 2 0 1 1 11 8H2\"\/><path d=\"M12.6 19.4A2 2 0 1 0 14 16H2\"\/>',\n    \"settings-2\":'<path d=\"M20 7h-9\"\/><path d=\"M14 17H5\"\/><circle cx=\"17\" cy=\"17\" r=\"3\"\/><circle cx=\"7\" cy=\"7\" r=\"3\"\/>',\n    \"leaf\":'<path d=\"M11 20A7 7 0 0 1 9.8 6.1C15.5 5 17 4.48 19 2c1 2 2 4.18 2 8 0 5.5-4.78 10-10 10Z\"\/><path d=\"M2 21c0-3 1.85-5.36 5.08-6C9.5 14.52 12 13 13 12\"\/>',\n    \"wrench\":'<path d=\"M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2 2 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z\"\/>',\n    \"phone\":'<path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z\"\/>',\n    \"mail\":'<rect width=\"20\" height=\"16\" x=\"2\" y=\"4\" rx=\"2\"\/><path d=\"m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7\"\/>',\n    \"map-pin\":'<path d=\"M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z\"\/><circle cx=\"12\" cy=\"10\" r=\"3\"\/>',\n    \"check\":'<path d=\"M20 6 9 17l-5-5\"\/>',\n    \"arrow-right\":'<path d=\"M5 12h14\"\/><path d=\"m12 5 7 7-7 7\"\/>',\n    \"check-circle\":'<circle cx=\"12\" cy=\"12\" r=\"10\"\/><path d=\"m9 12 2 2 4-4\"\/>',\n    \"clock\":'<circle cx=\"12\" cy=\"12\" r=\"10\"\/><polyline points=\"12 6 12 12 16 14\"\/>',\n    \"shield-check\":'<path d=\"M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z\"\/><path d=\"m9 12 2 2 4-4\"\/>',\n    \"file-text\":'<path d=\"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z\"\/><path d=\"M14 2v4a2 2 0 0 0 2 2h4\"\/><path d=\"M16 13H8\"\/><path d=\"M16 17H8\"\/><path d=\"M10 9H8\"\/>',\n    \"instagram\":'<rect width=\"20\" height=\"20\" x=\"2\" y=\"2\" rx=\"5\" ry=\"5\"\/><path d=\"M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z\"\/><line x1=\"17.5\" x2=\"17.51\" y1=\"6.5\" y2=\"6.5\"\/>',\n    \"facebook\":'<path d=\"M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z\"\/>',\n    \"menu\":'<line x1=\"4\" x2=\"20\" y1=\"12\" y2=\"12\"\/><line x1=\"4\" x2=\"20\" y1=\"6\" y2=\"6\"\/><line x1=\"4\" x2=\"20\" y1=\"18\" y2=\"18\"\/>',\n    \"x\":'<path d=\"M18 6 6 18\"\/><path d=\"m6 6 12 12\"\/>',\n    \"image\":'<rect width=\"18\" height=\"18\" x=\"3\" y=\"3\" rx=\"2\" ry=\"2\"\/><circle cx=\"9\" cy=\"9\" r=\"2\"\/><path d=\"m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21\"\/>',\n    \"plus\":'<path d=\"M5 12h14\"\/><path d=\"M12 5v14\"\/>'\n  };\n  window.__drawIcons=function(scope){\n    (scope||document).querySelectorAll(\"[data-lucide]\").forEach(function(n){\n      var k=n.getAttribute(\"data-lucide\"); if(!ICONS[k]){ return; }\n      var svg='<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" width=\"1em\" height=\"1em\">'+ICONS[k]+'<\/svg>';\n      n.innerHTML=svg; n.removeAttribute(\"data-lucide\"); n.setAttribute(\"data-ic\",k);\n    });\n  }\n  function el(html){var t=document.createElement('template');t.innerHTML=html.trim();return t.content.firstChild;}\n  function esc(s){var d=document.createElement('div');d.textContent=s==null?'':String(s);return d.innerHTML;}\n\n  \/\/ services (herbruikbaar zodat het beheer ze kan bijwerken)\n  var svc=document.getElementById('drx-svc'), fts=document.getElementById('drx-ftsvc'), pg=document.getElementById('drx-proj');\n  function renderServices(list){\n    svc.innerHTML=''; fts.innerHTML='';\n    list.forEach(function(s){\n      var subs=(s.subs&&s.subs.length)?('<ul class=\"svc-subs\">'+s.subs.map(function(b){\n        var t=String(b);\n        \/\/ Een regel die met een streepje begint hoort onder de regel erboven.\n        if(\/^\\s*-\\s*\/.test(t)) return '<li class=\"sub2\"><span>'+esc(t.replace(\/^\\s*-\\s*\/,''))+'<\/span><\/li>';\n        return '<li><i data-lucide=\"check\"><\/i><span>'+esc(t)+'<\/span><\/li>';\n      }).join('')+'<\/ul>'):'';\n      \/\/ Drie fotovakken per dienst. Wie geen foto heeft, toont niets: liever een\n      \/\/ net kaartje dan een rij lege kaders op een publieke site.\n      var fotos='<div class=\"svc-fotos\">'+[1,2,3].map(function(nr){\n        return '<div class=\"frame r43\" data-slot=\"service-'+s.key+(nr>1?('-'+nr):'')+'\"><\/div>';\n      }).join('')+'<\/div>';\n      svc.appendChild(el('<div class=\"card\"><div class=\"cico '+(s.tone||'heat')+'\"><i data-lucide=\"'+(s.icon||'wrench')+'\"><\/i><\/div><h3>'+esc(s.title)+'<\/h3><p>'+esc(s.description)+'<\/p>'+subs+fotos+'<a class=\"more\" href=\"#contact\">Offerte aanvragen <i data-lucide=\"arrow-right\"><\/i><\/a><\/div>'));\n      fts.appendChild(el('<li><a href=\"#services\">'+esc(s.title)+'<\/a><\/li>'));\n    });\n    \/\/ De vinkjes en pijlen zijn net aangemaakt, dus nu pas tekenen.\n    if(window.__drawIcons) window.__drawIcons(svc);\n  }\n  function renderProjects(list){\n    pg.innerHTML='';\n    list.forEach(function(p){\n      \/\/ E\u00e9n foto zegt niets over een werf, dus: \u00e9\u00e9n grote met drie kleintjes eronder.\n      var duimen='<div class=\"pthumbs\">'+[2,3,4].map(function(nr){\n        return '<div class=\"frame r43\" data-slot=\"'+p.slotId+'-'+nr+'\"><\/div>';\n      }).join('')+'<\/div>';\n      pg.appendChild(el('<div class=\"proj\"><div class=\"frame r43 pmain\" data-slot=\"'+p.slotId+'\"><div class=\"ph\"><i data-lucide=\"image\"><\/i><\/div><\/div>'+duimen+'<div class=\"body\"><span class=\"tag '+(p.tagTone||'heat')+'\">'+esc(p.tag)+'<\/span><h3>'+esc(p.title)+'<\/h3><div class=\"place\">'+esc(p.place)+'<\/div><\/div><\/div>'));\n    });\n    if(window.__drawIcons) window.__drawIcons(pg);\n  }\n  \/\/ ---- foto groot bekijken ----\n  (function(){\n    var kader=document.getElementById('drx-foto');\n    if(!kader) return;\n    var beeld=kader.querySelector('img'), tekst=kader.querySelector('.ft');\n    var reeks=[], plek=0, naam='';\n    function toon(){ if(!reeks.length) return; beeld.src=reeks[plek]; tekst.textContent=naam+' \u2014 foto '+(plek+1)+' van '+reeks.length; }\n    function open(bron){\n      var kaart=bron.closest('.card') || bron.closest('.proj'); if(!kaart) return;\n      var vakken=[].slice.call(kaart.querySelectorAll('[data-slot].filled img'));\n      reeks=vakken.map(function(i){return i.src;});\n      plek=Math.max(0, vakken.indexOf(bron));\n      naam=(kaart.querySelector('h3')||{textContent:''}).textContent;\n      kader.classList.add('on'); document.body.style.overflow='hidden'; toon();\n    }\n    function sluit(){ kader.classList.remove('on'); document.body.style.overflow=''; }\n    function ga(stap){ if(!reeks.length) return; plek=(plek+stap+reeks.length)%reeks.length; toon(); }\n    document.addEventListener('click', function(e){\n      var img=e.target.closest ? e.target.closest('.svc-fotos .frame.filled img, .proj [data-slot].filled img') : null;\n      if(img){ e.preventDefault(); open(img); }\n    });\n    kader.querySelector('.fx').addEventListener('click', sluit);\n    kader.querySelector('.fp').addEventListener('click', function(e){ e.stopPropagation(); ga(-1); });\n    kader.querySelector('.fn').addEventListener('click', function(e){ e.stopPropagation(); ga(1); });\n    kader.addEventListener('click', function(e){ if(e.target===kader) sluit(); });\n    document.addEventListener('keydown', function(e){\n      if(!kader.classList.contains('on')) return;\n      if(e.key==='Escape') sluit();\n      if(e.key==='ArrowLeft') ga(-1);\n      if(e.key==='ArrowRight') ga(1);\n    });\n  })();\n\n  window.__renderServices=renderServices; window.__renderProjects=renderProjects;\n  window.__DEFAULTS=DEFAULTS; window.__SERVICES=SERVICES; window.__PROJECTS=PROJECTS;\n  renderServices(SERVICES); renderProjects(PROJECTS);\n  \/\/ faq\n  var fq=document.getElementById('drx-faq');\n  FAQ.forEach(function(f){\n    var item=el('<div class=\"acc-item\"><button class=\"acc-q\">'+esc(f.title)+'<i data-lucide=\"plus\" class=\"pl\"><\/i><\/button><div class=\"acc-a\"><p>'+esc(f.body)+'<\/p><\/div><\/div>');\n    item.querySelector('.acc-q').addEventListener('click',function(){ item.classList.toggle('open'); });\n    fq.appendChild(item);\n  });\n  document.getElementById('drx-jaar').textContent=new Date().getFullYear();\n\n  \/\/ iconen tekenen\n  window.__drawIcons();\n\n  \/\/ mobiel menu\n  var mnav=document.getElementById('drx-mnav');\n  document.getElementById('drx-burger').addEventListener('click',function(){ mnav.classList.add('open'); });\n  document.getElementById('drx-mclose').addEventListener('click',function(){ mnav.classList.remove('open'); });\n  mnav.querySelectorAll('a[href^=\"#\"]').forEach(function(a){ a.addEventListener('click',function(){ mnav.classList.remove('open'); }); });\n  \/\/ zachte scroll + actieve nav\n  root.querySelectorAll('a[href^=\"#\"]').forEach(function(a){\n    a.addEventListener('click',function(e){ var id=a.getAttribute('href'); var t=id.length>1?document.querySelector(id):null; if(t){ e.preventDefault(); t.scrollIntoView({behavior:'smooth',block:'start'}); } });\n  });\n\n  \/\/ inhoud van de server toepassen (teksten + foto's)\n  function toepassen(data){\n    if(!data) return;\n    var c=data.content||{};\n    root.querySelectorAll('[data-key]').forEach(function(node){\n      var k=node.getAttribute('data-key');\n      if(c[k]!=null && c[k]!==''){\n        if(node.hasAttribute('data-multiline')) node.innerHTML=esc(c[k]).replace(\/\\n\/g,'<br>');\n        else node.textContent=c[k];\n      }\n    });\n    \/\/ usps\n    var uc=c['home.usps']; if(uc){ var box=root.querySelector('[data-usps]'); if(box){ box.innerHTML=''; uc.split('|').forEach(function(t){ box.appendChild(el('<span><i data-lucide=\"check-circle\"><\/i>'+esc(t.trim())+'<\/span>')); }); } }\n    \/\/ services\/projecten uit de store\n    if(Array.isArray(data.services)&&data.services.length){ renderServices(data.services); }\n    if(Array.isArray(data.projects)&&data.projects.length){ renderProjects(data.projects); }\n    \/\/ foto's\n    var m=data.media||{};\n    root.querySelectorAll('[data-slot]').forEach(function(f){\n      var url=m[f.getAttribute('data-slot')];\n      if(url){ var img=f.querySelector('img')||el('<img alt=\"\">'); img.src=url; \/* el() maakt het beeld in een template, dus het heeft altijd al een ouder. De oude test op parentNode sloeg daardoor nooit aan en de foto kwam nergens terecht. *\/ if(img.parentNode!==f) f.appendChild(img); f.classList.add('filled'); }\n    });\n    window.__drawIcons();\n  }\n  function uitpak(t){\n    try{ var k=t.indexOf('id=\"drdata\">'); if(k>-1){ var s=t.indexOf('>',k)+1, e=t.indexOf('<'+'\/script>',s); return t.slice(s,e); } }catch(e){}\n    return t;\n  }\n  window.__uitpak=uitpak;\n  fetch(STORE_SEARCH+\"&_=\"+Date.now()).then(function(r){return r.json();}).then(function(l){\n    l=Array.isArray(l)?l:[]; l=l.filter(function(x){return x.source_url&&\/dr-content[^\\\/]*\\.(html|svg)$\/.test(x.source_url);});\n    if(!l.length) return; var u=l.sort(function(a,b){return b.id-a.id;})[0].source_url;\n    return fetch(u+\"?t=\"+Date.now()).then(function(r){return r.text();}).then(function(t){ try{ toepassen(JSON.parse(uitpak(t))); }catch(e){} });\n  }).catch(function(){});\n\n  \/\/ contactformulier met keuzeknopjes -> aanvraag\n  var WERK=['Centrale verwarming','Airconditioning','Badkamerrenovatie','Onderhoud of herstelling','Iets anders'];\n  var WANNEER=['Zo snel mogelijk','Binnen een maand','Binnen drie maanden','Later dit jaar','Weet ik nog niet'];\n  var werkSel=[], wanneerSel='';\n  var form=document.getElementById('drx-form');\n  if(form){\n    var cw=document.getElementById('chips-werk'), cn=document.getElementById('chips-wanneer'), send=document.getElementById('drx-send'), cap=document.getElementById('drx-cap');\n    WERK.forEach(function(w){ var b=el('<button type=\"button\" class=\"chip\">'+esc(w)+'<\/button>'); b.addEventListener('click',function(){ var i=werkSel.indexOf(w); if(i<0){werkSel.push(w);b.setAttribute('aria-pressed','true');}else{werkSel.splice(i,1);b.removeAttribute('aria-pressed');} valid(); }); cw.appendChild(b); });\n    WANNEER.forEach(function(w){ var b=el('<button type=\"button\" class=\"chip\">'+esc(w)+'<\/button>'); b.addEventListener('click',function(){ wanneerSel=(wanneerSel===w)?'':w; cn.querySelectorAll('.chip').forEach(function(x){x.removeAttribute('aria-pressed');}); if(wanneerSel) b.setAttribute('aria-pressed','true'); }); cn.appendChild(b); });\n    function valid(){ var ok=form.naam.value.trim()&&form.telefoon.value.trim()&&werkSel.length>0; send.disabled=!ok; if(cap) cap.style.display=ok?'none':'block'; return ok; }\n    form.naam.addEventListener('input',valid); form.telefoon.addEventListener('input',valid);\n    form.addEventListener('submit',function(e){ e.preventDefault(); if(!valid())return; send.disabled=true; send.textContent='Bezig...';\n      var fd={k:KLANT, naam:form.naam.value.trim(), telefoon:form.telefoon.value.trim(), email:form.email.value.trim(), gemeente:form.gemeente.value.trim(), omschrijving:form.meer.value.trim(), soort:werkSel.join(', '), wanneer:wanneerSel};\n      fetch(HOOK_AANVRAAG,{method:'POST',headers:{'Content-Type':'application\/json'},body:JSON.stringify(fd)})\n        .then(function(r){ if(!r.ok) throw 0; return r.text(); })\n        .then(function(){ document.getElementById('drx-formwrap').innerHTML='<div class=\"klaar\"><div class=\"badge\"><i data-lucide=\"check-circle\"><\/i>Verzonden<\/div><h2>Bedankt voor uw aanvraag<\/h2><p class=\"sub\">Wij bellen '+esc(fd.naam||'u')+' binnen \\u00e9\\u00e9n werkdag terug op '+esc(fd.telefoon||'het opgegeven nummer')+'.<\/p><\/div>'; window.__drawIcons(); })\n        .catch(function(){ send.disabled=false; send.innerHTML='Stuur de aanvraag'; alert('Versturen lukte niet. Probeer opnieuw of bel ons even.'); });\n    });\n  }\n})();\n<\/script>\n\n<div class=\"drxlogin\" id=\"drx-login\"><form id=\"drx-loginform\">\n  <div class=\"k\">Beheer<\/div>\n  <h3>Even aanmelden<\/h3>\n  <p>Deze pagina is enkel voor DR-Technics. Vul het wachtwoord in om teksten en foto's aan te passen.<\/p>\n  <input type=\"password\" id=\"drx-pw\" placeholder=\"Wachtwoord\" autocomplete=\"current-password\">\n  <div class=\"fout\" id=\"drx-fout\">Dat wachtwoord klopt niet.<\/div>\n  <button type=\"submit\" class=\"aan\" id=\"drx-aan\">Aanmelden<\/button>\n  <button type=\"button\" class=\"terug\" id=\"drx-terug\">Terug naar de site<\/button>\n<\/form><\/div>\n\n<div class=\"drxadmin\" id=\"drx-admin\">\n  <div class=\"ad-top\"><div class=\"wrap\">\n    <div class=\"ad-kick\">Beheer<\/div>\n    <div class=\"ad-row\">\n      <h2>Uw website aanpassen<\/h2>\n      <div class=\"ad-actions\"><button type=\"button\" id=\"ad-bekijk\">Bekijk site<\/button><button type=\"button\" id=\"ad-uit\">Afmelden<\/button><\/div>\n    <\/div>\n    <p>Pas hier alle teksten, services, projecten en foto's aan. Klik op Opslaan en het staat meteen voor iedereen op de site.<\/p>\n    <div class=\"ad-tabs\">\n      <button type=\"button\" class=\"ad-tab on\" data-tab=\"teksten\">Teksten<\/button>\n      <button type=\"button\" class=\"ad-tab\" data-tab=\"services\">Services<\/button>\n      <button type=\"button\" class=\"ad-tab\" data-tab=\"projecten\">Projecten<\/button>\n      <button type=\"button\" class=\"ad-tab\" data-tab=\"fotos\">Foto's<\/button>\n    <\/div>\n  <\/div><\/div>\n  <div class=\"ad-body\">\n    <div class=\"ad-pane on\" data-pane=\"teksten\"><div class=\"ad-tk\"><div class=\"ad-groups\" id=\"ad-groups\"><\/div><div id=\"ad-fields\"><\/div><\/div><\/div>\n    <div class=\"ad-pane\" data-pane=\"services\" id=\"ad-services\"><\/div>\n    <div class=\"ad-pane\" data-pane=\"projecten\" id=\"ad-projecten\"><\/div>\n    <div class=\"ad-pane\" data-pane=\"fotos\"><div class=\"ad-fotos\" id=\"ad-fotos\"><\/div><\/div>\n  <\/div>\n  <div class=\"ad-save\"><div class=\"wrap\"><span id=\"ad-status\"><\/span><button type=\"button\" id=\"ad-opslaan\">Opslaan<\/button><\/div><\/div>\n<\/div>\n\n<div class=\"drxmedia\" id=\"drx-media\">\n  <div class=\"mm-box\">\n    <div class=\"mm-head\"><b>Kies een foto uit je mediabibliotheek<\/b><button type=\"button\" id=\"mm-close\">&times;<\/button><\/div>\n    <div class=\"mm-actions\"><button type=\"button\" class=\"mm-upload\" id=\"mm-upload\">Foto opladen van je toestel<\/button><span class=\"mm-status\" id=\"mm-status\"><\/span><\/div>\n    <div class=\"mm-grid\" id=\"mm-grid\"><div class=\"mm-empty\">Bezig met laden&hellip;<\/div><\/div>\n  <\/div>\n<\/div>\n<input type=\"file\" id=\"drx-file\" accept=\"image\/*\" style=\"display:none\">\n\n<script>\n(function(){\n  var USER=\"nora\", ORIGIN=location.origin, MEDIA=ORIGIN+\"\/wp-json\/wp\/v2\/media\", PWKEY=\"dr_nora_pw\";\n  function creds(){ try{return sessionStorage.getItem(PWKEY)||\"\";}catch(e){return \"\";} }\n  function unlocked(){ return !!creds(); }\n  function authH(){ return \"Basic \"+btoa(USER+\":\"+creds()); }\n  function esc(s){ var d=document.createElement(\"div\"); d.textContent=s==null?\"\":String(s); return d.innerHTML; }\n\n  var DEFAULTS=window.__DEFAULTS||{};\n  var GROUPS=[\n    {id:\"algemeen\",label:\"Bedrijfsgegevens\",fields:[[\"algemeen.telefoon\",\"Telefoon\",\"text\"],[\"algemeen.mail\",\"E-mail\",\"text\"],[\"algemeen.adres\",\"Adres\",\"text\"],[\"algemeen.regio\",\"Regio (bovenbalk)\",\"text\"],[\"algemeen.uren\",\"Openingsuren\",\"text\"],[\"algemeen.btw\",\"BTW-nummer\",\"text\"],[\"algemeen.slogan\",\"Slogan (footer)\",\"area\"]]},\n    {id:\"home\",label:\"Homepagina \u2014 hero\",fields:[[\"home.kicker\",\"Kleine regel boven de titel\",\"text\"],[\"home.titel\",\"Titel (regelafbreking met Enter)\",\"area\"],[\"home.intro\",\"Introtekst\",\"area\"],[\"home.cta\",\"Tekst op de knop\",\"text\"],[\"home.usps\",\"Drie pluspunten (scheiden met |)\",\"text\"]]},\n    {id:\"over\",label:\"Homepagina \u2014 over ons\",fields:[[\"over.kicker\",\"Kleine regel\",\"text\"],[\"over.titel\",\"Titel\",\"text\"],[\"over.intro\",\"Tekst\",\"area\"]]},\n    {id:\"servicesblok\",label:\"Homepagina \u2014 servicesblok\",fields:[[\"services.kicker\",\"Kleine regel\",\"text\"],[\"services.titel\",\"Titel\",\"text\"],[\"services.intro\",\"Introtekst\",\"area\"]]},\n    {id:\"cijfers\",label:\"Cijferband\",fields:[[\"cijfers.1.waarde\",\"Cijfer 1\",\"text\"],[\"cijfers.1.label\",\"Label 1\",\"text\"],[\"cijfers.2.waarde\",\"Cijfer 2\",\"text\"],[\"cijfers.2.label\",\"Label 2\",\"text\"],[\"cijfers.3.waarde\",\"Cijfer 3\",\"text\"],[\"cijfers.3.label\",\"Label 3\",\"text\"]]},\n    {id:\"projfaq\",label:\"Projecten & vragen\",fields:[[\"projecten.kicker\",\"Projecten \u2014 kleine regel\",\"text\"],[\"projecten.titel\",\"Projecten \u2014 titel\",\"text\"],[\"faq.kicker\",\"Vragen \u2014 kleine regel\",\"text\"],[\"faq.titel\",\"Vragen \u2014 titel\",\"text\"]]},\n    {id:\"contact\",label:\"Contactpagina\",fields:[[\"contact.kicker\",\"Kleine regel\",\"text\"],[\"contact.titel\",\"Titel\",\"text\"],[\"contact.intro\",\"Introtekst\",\"area\"],[\"contact.whatsapp\",\"WhatsApp-blok\",\"area\"],[\"contact.privacy\",\"Privacyregel\",\"area\"]]}\n  ];\n  var HINT43=\"Liggend, 4:3 \u00b7 min 800\u00d7600, ideaal 1200\u00d7900 px\";\n  var HINT11=\"Vierkant, 1:1 \u00b7 min 600\u00d7600, ideaal 900\u00d7900 px\";\n  var SLOTS=[\n    {id:\"home-hero\",label:\"Homepagina \u2014 hero\",ratio:4\/3,hint:HINT43},\n    {id:\"home-about\",label:\"Over ons \u2014 foto\",ratio:1,hint:HINT11},\n  ];\n  \/\/ Per dienst drie fotovakken, zodat er meerdere foto's per sectie kunnen.\n  (window.__SERVICES||SERVICES||[]).forEach(function(s){\n    for(var fn=1;fn<=3;fn++){\n      SLOTS.push({id:\"service-\"+s.key+(fn>1?(\"-\"+fn):\"\"),label:s.title+\" \u2014 foto \"+fn,ratio:4\/3,hint:HINT43});\n    }\n  });\n  \/\/ De fotovakken van de projecten groeien mee met de lijst zelf. Stonden ze\n  \/\/ vast op zes projecten, dan kon er geen project bijkomen en was elke nieuwe\n  \/\/ werf zonder foto. Elk project heeft \u00e9\u00e9n grote foto en drie kleinere.\n  function projectSlots(lijst){\n    var uit=[];\n    (lijst||[]).forEach(function(p,i){\n      var basis=p.slotId||(\"proj-\"+(i+1));\n      uit.push({id:basis,label:\"Project \"+(i+1)+\" \u2014 grote foto\",ratio:4\/3,hint:HINT43});\n      for(var pf=2;pf<=4;pf++){\n        uit.push({id:basis+\"-\"+pf,label:\"Project \"+(i+1)+\" \u2014 foto \"+pf,ratio:4\/3,hint:HINT43});\n      }\n    });\n    return uit;\n  }\n  function alleSlots(){ return SLOTS.concat(projectSlots(model.projects)); }\n  function clone(o){ return JSON.parse(JSON.stringify(o)); }\n  var model={content:{},services:clone(window.__SERVICES||[]),projects:clone(window.__PROJECTS||[]),media:{}};\n  var curSlot=null, curRatio=4\/3;\n\n  \/\/ ---- login ----\n  var login=document.getElementById(\"drx-login\"), admin=document.getElementById(\"drx-admin\");\n  function openLogin(){ login.classList.add(\"on\"); var i=document.getElementById(\"drx-pw\"); i.value=\"\"; document.getElementById(\"drx-fout\").style.display=\"none\"; setTimeout(function(){i.focus();},60); }\n  function closeLogin(){ login.classList.remove(\"on\"); }\n  var bl=document.getElementById(\"drx-beheerlink\"); if(bl) bl.addEventListener(\"click\",function(e){ e.preventDefault(); if(unlocked()){ start(); } else openLogin(); });\n  var blm=document.getElementById(\"drx-beheerlink-m\"); if(blm) blm.addEventListener(\"click\",function(e){ e.preventDefault(); var mn=document.getElementById(\"drx-mnav\"); if(mn) mn.classList.remove(\"open\"); if(unlocked()){ start(); } else openLogin(); });\n  document.getElementById(\"drx-terug\").addEventListener(\"click\",closeLogin);\n  document.getElementById(\"drx-loginform\").addEventListener(\"submit\",function(e){\n    e.preventDefault();\n    var pw=document.getElementById(\"drx-pw\").value, aan=document.getElementById(\"drx-aan\"), fout=document.getElementById(\"drx-fout\");\n    fout.style.display=\"none\"; aan.textContent=\"Bezig...\"; aan.disabled=true;\n    fetch(ORIGIN+\"\/wp-json\/wp\/v2\/users\/me?context=edit&_=\"+Date.now(),{headers:{Authorization:\"Basic \"+btoa(USER+\":\"+pw)}})\n      .then(function(r){ if(!r.ok) throw 0; return r.json(); })\n      .then(function(){ try{sessionStorage.setItem(PWKEY,pw);}catch(e){} aan.textContent=\"Aanmelden\"; aan.disabled=false; closeLogin(); start(); })\n      .catch(function(){ aan.textContent=\"Aanmelden\"; aan.disabled=false; fout.style.display=\"block\"; });\n  });\n\n  \/\/ ---- model laden en paneel openen ----\n  function start(){\n    \/\/ Het paneel gaat altijd open, ook als er iets misgaat bij het inlezen.\n    \/\/ Vroeger hing alles aan \u00e9\u00e9n then zonder foutopvang: liep daar iets mis,\n    \/\/ dan gebeurde er letterlijk niets en zag je niet waarom.\n    function openen(fout){\n      try{ buildTeksten(); }catch(e){ fout=fout||(\"teksten: \"+e.message); }\n      try{ buildServices(); }catch(e){ fout=fout||(\"diensten: \"+e.message); }\n      try{ buildProjecten(); }catch(e){ fout=fout||(\"projecten: \"+e.message); }\n      try{ buildFotos(); }catch(e){ fout=fout||(\"foto's: \"+e.message); }\n      admin.classList.add(\"on\"); document.body.style.overflow=\"hidden\";\n      var st=document.getElementById(\"ad-status\");\n      if(st) st.textContent = fout ? (\"Let op: \"+fout) : \"\";\n    }\n    loadModel().then(function(){ openen(null); })\n      .catch(function(e){ openen(\"inhoud niet geladen (\"+(e&&e.message?e.message:\"onbekend\")+\"), je ziet de standaardteksten\"); });\n  }\n  window.__drxOpen=start;\n  function loadModel(){\n    return fetch(MEDIA+\"?search=dr-content&per_page=100&_=\"+Date.now()).then(function(r){return r.json();}).then(function(l){\n      l=Array.isArray(l)?l:[]; l=l.filter(function(x){return x.source_url&&\/dr-content[^\\\/]*\\.(html|svg)$\/.test(x.source_url);});\n      if(!l.length){ model.content={}; model.services=clone(window.__SERVICES); model.projects=clone(window.__PROJECTS); model.media={}; return; }\n      var u=l.sort(function(a,b){return b.id-a.id;})[0].source_url;\n      return fetch(u+\"?t=\"+Date.now()).then(function(r){return r.text();}).then(function(t){ var d={}; try{d=JSON.parse((window.__uitpak?window.__uitpak(t):t));}catch(e){}\n        model.content=d.content||{};\n        model.services=(Array.isArray(d.services)&&d.services.length)?d.services:clone(window.__SERVICES);\n        model.projects=(Array.isArray(d.projects)&&d.projects.length)?d.projects:clone(window.__PROJECTS);\n        model.media=d.media||{};\n      });\n    }).catch(function(){});\n  }\n  function val(k){ return (model.content[k]!=null&&model.content[k]!==\"\")?model.content[k]:(DEFAULTS[k]||\"\"); }\n  function setVal(k,v){ if(v===(DEFAULTS[k]||\"\")) delete model.content[k]; else model.content[k]=v; }\n\n  \/\/ ---- Teksten ----\n  var activeGroup=\"algemeen\";\n  function buildTeksten(){\n    var gc=document.getElementById(\"ad-groups\"); gc.innerHTML=\"\";\n    GROUPS.forEach(function(g){ var b=document.createElement(\"button\"); b.textContent=g.label; if(g.id===activeGroup) b.className=\"on\"; b.addEventListener(\"click\",function(){ activeGroup=g.id; buildTeksten(); }); gc.appendChild(b); });\n    var g=GROUPS.filter(function(x){return x.id===activeGroup;})[0]||GROUPS[0];\n    var wrap=document.getElementById(\"ad-fields\");\n    var html='<div class=\"ad-card\"><h3>'+esc(g.label)+'<\/h3><div class=\"note\">Wijzigingen staan na Opslaan meteen op de site.<\/div>';\n    g.fields.forEach(function(f){\n      var k=f[0],label=f[1],kind=f[2],v=val(k);\n      if(kind===\"area\") html+='<div class=\"ad-fld\"><label>'+esc(label)+'<\/label><textarea data-k=\"'+k+'\">'+esc(v)+'<\/textarea><\/div>';\n      else html+='<div class=\"ad-fld\"><label>'+esc(label)+'<\/label><input data-k=\"'+k+'\" value=\"'+esc(v)+'\"><\/div>';\n    });\n    html+='<\/div>';\n    wrap.innerHTML=html;\n    wrap.querySelectorAll(\"[data-k]\").forEach(function(inp){ inp.addEventListener(\"input\",function(){ setVal(inp.getAttribute(\"data-k\"), inp.value); }); });\n  }\n\n  \/\/ ---- Services ----\n  function buildServices(){\n    var c=document.getElementById(\"ad-services\"); c.innerHTML=\"\";\n    model.services.forEach(function(sv,idx){\n      var it=document.createElement(\"div\"); it.className=\"ad-item\";\n      it.innerHTML='<div class=\"hd\">Service '+(idx+1)+'<\/div><div class=\"ad-fld\"><label>Titel<\/label><input data-si=\"'+idx+'\" data-f=\"title\" value=\"'+esc(sv.title)+'\"><\/div><div class=\"ad-fld\"><label>Korte beschrijving<\/label><textarea data-si=\"'+idx+'\" data-f=\"description\">'+esc(sv.description)+'<\/textarea><\/div>'\n        + '<div class=\"ad-fld\"><label>Onderverdelingen, \u00e9\u00e9n per regel<\/label><textarea rows=\"5\" data-sub=\"'+idx+'\">'+esc((sv.subs||[]).join(\"\\n\"))+'<\/textarea><\/div>';\n      c.appendChild(it);\n    });\n    c.querySelectorAll(\"[data-si]\").forEach(function(inp){ inp.addEventListener(\"input\",function(){ model.services[+inp.getAttribute(\"data-si\")][inp.getAttribute(\"data-f\")]=inp.value; }); });\n    c.querySelectorAll(\"[data-sub]\").forEach(function(inp){ inp.addEventListener(\"input\",function(){\n      model.services[+inp.getAttribute(\"data-sub\")].subs=inp.value.split(\"\\n\").map(function(x){return x.trim();}).filter(Boolean);\n    }); });\n  }\n\n  \/\/ ---- Projecten ----\n  \/\/\n  \/\/ Dries vroeg om er zelf een werf bij te kunnen zetten. Het aantal stond vast\n  \/\/ op zes, dus de zevende werf kon niet op de site. Nu groeit de lijst mee, en\n  \/\/ met elk project komen ook zijn vier fotovakken erbij.\n  function vrijSlotId(){\n    var nr=0;\n    model.projects.forEach(function(p){\n      var m=\/^proj-(\\d+)$\/.exec(p.slotId||\"\");\n      if(m && +m[1]>nr) nr=+m[1];\n    });\n    return \"proj-\"+(nr+1);\n  }\n  function buildProjecten(){\n    var c=document.getElementById(\"ad-projecten\"); c.innerHTML=\"\";\n    model.projects.forEach(function(p,idx){\n      var it=document.createElement(\"div\"); it.className=\"ad-item\";\n      it.innerHTML='<div class=\"hd\">Project '+(idx+1)+'<button type=\"button\" class=\"pr-weg\" data-weg=\"'+idx+'\" title=\"Dit project verwijderen\">Verwijderen<\/button><\/div><div class=\"ad-two\"><div class=\"ad-fld\"><label>Titel<\/label><input data-pi=\"'+idx+'\" data-f=\"title\" value=\"'+esc(p.title)+'\"><\/div><div class=\"ad-fld\"><label>Plaats<\/label><input data-pi=\"'+idx+'\" data-f=\"place\" value=\"'+esc(p.place)+'\"><\/div><\/div><div class=\"ad-fld\"><label>Label (bv. Airco)<\/label><input data-pi=\"'+idx+'\" data-f=\"tag\" value=\"'+esc(p.tag)+'\"><\/div>';\n      c.appendChild(it);\n    });\n\n    var bij=document.createElement(\"button\");\n    bij.type=\"button\"; bij.className=\"pr-bij\"; bij.textContent=\"Project toevoegen\";\n    bij.addEventListener(\"click\",function(){\n      model.projects.push({title:\"Nieuw project\", place:\"\", tag:\"\", tagTone:\"heat\", slotId:vrijSlotId()});\n      buildProjecten(); buildFotos();\n      var st=document.getElementById(\"ad-status\");\n      if(st) st.textContent=\"Project toegevoegd. Vul de titel in, kies de foto's bij Foto's, en klik op Opslaan.\";\n    });\n    c.appendChild(bij);\n\n    c.querySelectorAll(\"[data-pi]\").forEach(function(inp){ inp.addEventListener(\"input\",function(){ model.projects[+inp.getAttribute(\"data-pi\")][inp.getAttribute(\"data-f\")]=inp.value; }); });\n\n    c.querySelectorAll(\"[data-weg]\").forEach(function(kn){ kn.addEventListener(\"click\",function(){\n      var i=+kn.getAttribute(\"data-weg\"); var p=model.projects[i]; if(!p) return;\n      if(!confirm('Project \"'+(p.title||\"zonder titel\")+'\" verwijderen van de site?')) return;\n      \/\/ Ook de foto's van dit project uit het model halen, anders blijven ze in\n      \/\/ de opslag staan zonder dat er nog een plek voor is.\n      var basis=p.slotId||\"\";\n      Object.keys(model.media).forEach(function(k){ if(basis && (k===basis || k.indexOf(basis+\"-\")===0)) delete model.media[k]; });\n      model.projects.splice(i,1);\n      buildProjecten(); buildFotos();\n      var st=document.getElementById(\"ad-status\");\n      if(st) st.textContent=\"Project verwijderd. Klik op Opslaan om het vast te leggen.\";\n    }); });\n  }\n\n  \/\/ ---- Foto's ----\n  function buildFotos(){\n    var c=document.getElementById(\"ad-fotos\"); c.innerHTML=\"\";\n    alleSlots().forEach(function(sl){\n      var url=model.media[sl.id]||\"\";\n      var label=sl.label;\n      if(sl.id.indexOf(\"proj-\")===0){ var pp=model.projects.filter(function(x){return x.slotId===sl.id;})[0]; if(pp&&pp.title) label=\"Project: \"+pp.title; }\n      var it=document.createElement(\"div\"); it.className=\"ad-foto\"; it.setAttribute(\"data-slotwrap\",sl.id);\n      it.innerHTML='<div class=\"prev\">'+(url?'<img decoding=\"async\" src=\"'+esc(url)+'\" alt=\"\">':'<i data-lucide=\"image\"><\/i>')+'<\/div><div class=\"ft2\"><div class=\"ft2-tx\"><b>'+esc(label)+'<\/b><span class=\"fhint\">'+esc(sl.hint||\"\")+'<\/span><\/div><div class=\"ft2-kn\"><button type=\"button\" class=\"kies\">'+(url?'Vervangen':'Kies foto')+'<\/button>'+(url?'<button type=\"button\" class=\"wis\">Wissen<\/button>':'')+'<\/div><\/div>';\n      it.querySelector(\".kies\").addEventListener(\"click\",function(){ curSlot=sl.id; curRatio=sl.ratio; openMedia(); });\n      var wisknop=it.querySelector(\".wis\");\n      if(wisknop) wisknop.addEventListener(\"click\",function(){\n        \/\/ Uit het model halen en de lijst opnieuw opbouwen, zodat het kader leeg\n        \/\/ is en de wisknop verdwijnt. Definitief wordt het pas bij Opslaan.\n        delete model.media[sl.id];\n        buildFotos();\n        var st=document.getElementById(\"ad-status\");\n        if(st) st.textContent=\"Foto weg bij \"+label+\". Klik op Opslaan om het vast te leggen.\";\n      });\n      c.appendChild(it);\n    });\n    if(window.__drawIcons) window.__drawIcons(c);\n  }\n  function refreshFoto(slot,url){ var w=document.querySelector('[data-slotwrap=\"'+slot+'\"] .prev'); if(w) w.innerHTML='<img decoding=\"async\" src=\"'+esc(url)+'\" alt=\"\">'; }\n\n  \/\/ ---- media modal ----\n  var mediaModal=document.getElementById(\"drx-media\"), mmGrid=document.getElementById(\"mm-grid\"), mmStatus=document.getElementById(\"mm-status\"), fileInput=document.getElementById(\"drx-file\");\n  function openMedia(){ mediaModal.classList.add(\"on\"); mmStatus.textContent=\"\"; loadGrid(); }\n  function closeMedia(){ mediaModal.classList.remove(\"on\"); }\n  document.getElementById(\"mm-close\").addEventListener(\"click\",closeMedia);\n  mediaModal.addEventListener(\"click\",function(e){ if(e.target===mediaModal) closeMedia(); });\n  function loadGrid(){\n    mmGrid.innerHTML='<div class=\"mm-empty\">Bezig met laden&hellip;<\/div>';\n    fetch(MEDIA+\"?media_type=image&per_page=60&orderby=date&order=desc&_=\"+Date.now(),{headers:{Authorization:authH()}})\n      .then(function(r){return r.json();}).then(function(l){\n        l=Array.isArray(l)?l:[];\n        if(!l.length){ mmGrid.innerHTML='<div class=\"mm-empty\">Nog geen foto\\'s. Laad er een op van je toestel.<\/div>'; return; }\n        mmGrid.innerHTML=\"\";\n        l.forEach(function(m){\n          var u=(m.media_details&&m.media_details.sizes&&m.media_details.sizes.medium&&m.media_details.sizes.medium.source_url)||m.source_url;\n          var t=document.createElement(\"div\"); t.className=\"mm-thumb\"; t.innerHTML='<img decoding=\"async\" loading=\"lazy\" src=\"'+u+'\" alt=\"\">';\n          t.addEventListener(\"click\",function(){ pick(m.source_url); });\n          mmGrid.appendChild(t);\n        });\n      }).catch(function(){ mmGrid.innerHTML='<div class=\"mm-empty\">Kon de mediabibliotheek niet laden.<\/div>'; });\n  }\n  function pick(url){ if(!curSlot) return; model.media[curSlot]=url; refreshFoto(curSlot,url); closeMedia(); }\n  document.getElementById(\"mm-upload\").addEventListener(\"click\",function(){ fileInput.value=\"\"; fileInput.click(); });\n  fileInput.addEventListener(\"change\",function(){\n    var file=fileInput.files&&fileInput.files[0]; if(!file) return;\n    mmStatus.textContent=\"Foto wordt opgeladen...\";\n    var reader=new FileReader();\n    reader.onload=function(){ processImage(reader.result,curRatio).then(function(small){ return uploadPhoto(small); }).then(function(url){ if(url){ pick(url); } else { mmStatus.textContent=\"Opladen mislukte.\"; } }).catch(function(){ mmStatus.textContent=\"Opladen mislukte. Probeer opnieuw.\"; }); };\n    reader.readAsDataURL(file);\n  });\n  function processImage(dataUrl, ratio){\n    return new Promise(function(resolve){\n      var img=new Image();\n      img.onload=function(){\n        var iw=img.naturalWidth, ih=img.naturalHeight; if(!iw||!ih){ resolve(dataUrl); return; }\n        var target=ratio||(iw\/ih); var cw=iw, ch=Math.round(iw\/target);\n        if(ch>ih){ ch=ih; cw=Math.round(ih*target); }\n        var sx=Math.round((iw-cw)\/2), sy=Math.round((ih-ch)\/2);\n        var MAX=1600, ow=cw, oh=ch, L=Math.max(ow,oh);\n        if(L>MAX){ var k=MAX\/L; ow=Math.round(ow*k); oh=Math.round(oh*k); }\n        try{ var cv=document.createElement(\"canvas\"); cv.width=ow; cv.height=oh; var cx=cv.getContext(\"2d\"); cx.fillStyle=\"#fff\"; cx.fillRect(0,0,ow,oh); cx.drawImage(img,sx,sy,cw,ch,0,0,ow,oh); resolve(cv.toDataURL(\"image\/jpeg\",0.82)); }\n        catch(e){ resolve(dataUrl); }\n      };\n      img.onerror=function(){ resolve(dataUrl); };\n      img.src=dataUrl;\n    });\n  }\n  function uploadPhoto(dataUrl){\n    var m=\/^data:(image\\\/[a-zA-Z0-9.+-]+);base64,(.+)$\/.exec(dataUrl); if(!m) return Promise.resolve(null);\n    var bin=atob(m[2]); var arr=new Uint8Array(bin.length); for(var i=0;i<bin.length;i++)arr[i]=bin.charCodeAt(i);\n    var fname=\"dr-foto-\"+Date.now()+\".jpg\";\n    return fetch(MEDIA,{method:\"POST\",headers:{Authorization:authH(),\"Content-Disposition\":\"attachment; filename=\"+fname,\"Content-Type\":m[1]},body:arr})\n      .then(function(r){return r.json();}).then(function(j){ return (j&&j.source_url)?j.source_url:null; });\n  }\n\n  \/\/ ---- tabs ----\n  admin.querySelectorAll(\".ad-tab\").forEach(function(tb){ tb.addEventListener(\"click\",function(){\n    admin.querySelectorAll(\".ad-tab\").forEach(function(x){x.classList.remove(\"on\");}); tb.classList.add(\"on\");\n    var t=tb.getAttribute(\"data-tab\");\n    admin.querySelectorAll(\".ad-pane\").forEach(function(p){ p.classList.toggle(\"on\", p.getAttribute(\"data-pane\")===t); });\n  }); });\n\n  \/\/ ---- opslaan ----\n  document.getElementById(\"ad-opslaan\").addEventListener(\"click\",function(){\n    var btn=this; btn.disabled=true; btn.textContent=\"Bezig...\"; var st=document.getElementById(\"ad-status\"); st.textContent=\"\";\n    var store={content:model.content,services:model.services,projects:model.projects,media:model.media};\n    fetch(MEDIA+\"?search=dr-content&per_page=100&_=\"+Date.now()).then(function(r){return r.json();}).then(function(l){\n      l=Array.isArray(l)?l:[]; var olds=l.filter(function(x){return x.source_url&&\/dr-content[^\\\/]*\\.(html|svg)$\/.test(x.source_url);});\n      var huls='<'+'!DOCTYPE html><html><head><meta charset=\"utf-8\"><title>DR-Technics inhoud<\/'+'title><\/'+'head><body><script type=\"application\/json\" id=\"drdata\">'+JSON.stringify(store)+'<\/'+'script><\/'+'body><\/'+'html>';\n      var body=new Blob([huls],{type:\"text\/html\"});\n      return fetch(MEDIA,{method:\"POST\",headers:{Authorization:authH(),\"Content-Disposition\":\"attachment; filename=dr-content.html\",\"Content-Type\":\"text\/html\"},body:body})\n        .then(function(r){ if(!r.ok) throw 0; return r.json(); })\n        .then(function(j){ olds.forEach(function(m){ if(!j||m.id!==j.id) fetch(MEDIA+\"\/\"+m.id+\"?force=true\",{method:\"DELETE\",headers:{Authorization:authH()}}).catch(function(){}); }); });\n    }).then(function(){ btn.disabled=false; btn.textContent=\"Opslaan\"; st.textContent=\"Bewaard. Dit staat nu voor iedereen op de site.\"; })\n      .catch(function(){ btn.disabled=false; btn.textContent=\"Opslaan\"; st.textContent=\"Bewaren mislukte. Probeer opnieuw.\"; });\n  });\n\n  document.getElementById(\"ad-bekijk\").addEventListener(\"click\",function(){ admin.classList.remove(\"on\"); document.body.style.overflow=\"\"; location.reload(); });\n  document.getElementById(\"ad-uit\").addEventListener(\"click\",function(){ try{sessionStorage.removeItem(PWKEY);}catch(e){} location.reload(); });\n})();\n<\/script>\n\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"saved_in_kubio":false,"_monsterinsights_skip_tracking":false,"footnotes":""},"class_list":["post-699","page","type-page","status-publish","hentry"],"kubio_ai_page_context":{"short_desc":"","purpose":"general"},"_links":{"self":[{"href":"https:\/\/dr-technics.com\/index.php\/wp-json\/wp\/v2\/pages\/699","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dr-technics.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dr-technics.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dr-technics.com\/index.php\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/dr-technics.com\/index.php\/wp-json\/wp\/v2\/comments?post=699"}],"version-history":[{"count":2,"href":"https:\/\/dr-technics.com\/index.php\/wp-json\/wp\/v2\/pages\/699\/revisions"}],"predecessor-version":[{"id":702,"href":"https:\/\/dr-technics.com\/index.php\/wp-json\/wp\/v2\/pages\/699\/revisions\/702"}],"wp:attachment":[{"href":"https:\/\/dr-technics.com\/index.php\/wp-json\/wp\/v2\/media?parent=699"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}