    <!DOCTYPE html>
    <html lang="nl">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>postcode-zoek - LAYG</title>
        <meta name="description" content="LAYG - postcode-zoek. Professionele IT oplossingen voor uw bedrijf.">
        <meta name="keywords" content="IT solutions, AI, web development, software, Nederland, LAYG">
        <meta name="theme-color" content="#ffffff">
        <meta name="color-scheme" content="light">
        
        <!-- Favicon: SVG werkt overal; .ico/.png alleen als ze bestaan (voorkomt 404) -->
        <link rel="icon" href="/favicon.svg" type="image/svg+xml">
                <link rel="alternate icon" type="image/x-icon" href="/favicon.ico">
                        <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
                        <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
                        <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
                        <link rel="manifest" href="/site.webmanifest">
                
        <!-- Open Graph Meta Tags -->
        <meta property="og:title" content="postcode-zoek - LAYG">
        <meta property="og:description" content="LAYG - postcode-zoek. Professionele IT oplossingen voor uw bedrijf.">
        <meta property="og:type" content="website">
        <meta property="og:url" content="https://layg.nl/domein/postcode-zoek.php">
        <meta property="og:image" content="https://layg.nl/assets/images/og-image.jpg">
        <meta property="og:image:secure_url" content="https://layg.nl/assets/images/og-image.jpg">
        <meta property="og:image:type" content="image/jpeg">
        <meta property="og:image:width" content="1200">
        <meta property="og:image:height" content="630">
        <meta property="og:image:alt" content="postcode-zoek - LAYG">
        <meta property="og:site_name" content="LAYG">
        <meta property="og:locale" content="nl_NL">
        
        <!-- Twitter Card Meta Tags -->
        <meta name="twitter:card" content="summary_large_image">
        <meta name="twitter:title" content="postcode-zoek - LAYG">
        <meta name="twitter:description" content="LAYG - postcode-zoek. Professionele IT oplossingen voor uw bedrijf.">
        <meta name="twitter:image" content="https://layg.nl/assets/images/og-image.jpg">
        
        <!-- Additional SEO Meta Tags -->
        <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
        <meta name="author" content="LAYG">
        <meta name="language" content="Dutch">
        <link rel="canonical" href="https://layg.nl/domein/postcode-zoek.php">
        
        <!-- Enhanced Performance & SEO -->
        <link rel="preconnect" href="https://fonts.googleapis.com">
        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
        <link rel="preconnect" href="https://cdnjs.cloudflare.com">
        <link rel="dns-prefetch" href="//www.googletagmanager.com">
        <link rel="dns-prefetch" href="//www.google-analytics.com">
        <link rel="dns-prefetch" href="//cdn.jsdelivr.net">
        <link rel="preload" href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800;900&family=DM+Sans:ital,wght@0,300;0,400;0,500;1,300&display=swap" as="style" onload="this.onload=null;this.rel='stylesheet'">
        <noscript><link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800;900&family=DM+Sans:ital,wght@0,300;0,400;0,500;1,300&display=swap" rel="stylesheet"></noscript>
        <!-- FontAwesome — async to avoid render-blocking -->
        <link rel="preload" href="/font-awesome/6.4.0/css/all.min.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
        <noscript><link rel="stylesheet" href="/font-awesome/6.4.0/css/all.min.css"></noscript>
        <link rel="stylesheet" href="https://layg.nl/assets/css/enhanced-styles-v2.css?v=1779372637">
        <!-- Universal White Text Fix - Prevent white text on white backgrounds -->
        <link rel="stylesheet" href="https://layg.nl/assets/css/universal-white-text-fix.css?v=1785065455">
        
        <!-- Structured Data -->
                <script type="application/ld+json">
        {
            "@context": "https://schema.org",
            "@graph": [
                {
                    "@type": "Organization",
                    "@id": "https://www.layg.nl/#organization",
                    "name": "LAYG",
                    "url": "https://www.layg.nl",
                    "logo": {
                        "@type": "ImageObject",
                        "url": "https://www.layg.nl/assets/images/og-image.jpg"
                    },
                    "description": "LAYG bouwt websites, AI-tools en sectorportalen voor ondernemers. Website, hosting, marketing en CRM onder een dak.",
                    "address": {
                        "@type": "PostalAddress",
                        "addressCountry": "NL"
                    },
                    "contactPoint": {
                        "@type": "ContactPoint",
                        "telephone": "+31850835610",
                        "contactType": "customer service"
                    },
                    "sameAs": [
                        "https://www.linkedin.com/company/layg-nl"
                    ]
                },
                {
                    "@type": "WebSite",
                    "@id": "https://www.layg.nl/#website",
                    "url": "https://www.layg.nl",
                    "name": "LAYG",
                    "description": "LAYG bouwt websites, AI-tools en sectorportalen voor ondernemers. Website, hosting, marketing en CRM onder een dak.",
                    "publisher": {
                        "@id": "https://www.layg.nl/#organization"
                    },
                    "inLanguage": "nl-NL"
                },
                {
                    "@type": "WebPage",
                    "@id": "https://www.layg.nl#webpage",
                    "url": "https://www.layg.nl",
                    "name": "postcode-zoek - LAYG",
                    "description": "LAYG bouwt websites, AI-tools en sectorportalen voor ondernemers. Website, hosting, marketing en CRM onder een dak.",
                    "isPartOf": {
                        "@id": "https://www.layg.nl/#website"
                    },
                    "about": {
                        "@id": "https://www.layg.nl/#organization"
                    },
                    "inLanguage": "nl-NL"
                }
            ]
        }
        </script>
        <style>
            :root {
                --navy: #020917;
                --gold: #f2c14f;
                --gold2: #ffd97a;
                --gold-dim: rgba(242,193,79,0.13);
                --gold-border: rgba(242,193,79,0.28);
                --cyan: #00c8ff;
                --white: #ffffff;
                --muted: #6B92B8;
                --muted2: #3a567a;
                --gray: #6B92B8;
                --gray-light: #8ba3c4;
                --dark: #020917;
                --dark-lighter: #060f24;
                --primary: #f2c14f;
                --primary-dark: #c8922a;
                --gradient-primary: linear-gradient(135deg, #f2c14f 0%, #ffd97a 50%, #c8922a 100%);
                --gradient-accent: linear-gradient(135deg, #00c8ff 0%, #0066cc 100%);
                --shadow: 0 10px 25px rgba(0,0,0,0.2);
                --shadow-lg: 0 20px 40px rgba(0,0,0,0.3);
                --shadow-xl: 0 25px 50px rgba(0,0,0,0.4);
                --shadow-glow: 0 0 30px rgba(242,193,79,0.35);
            }
                /* 2026-08-10 — LICHTE PAGINA'S. Hierboven staat het DONKERE palet in :root:
                   --muted/--gray = #6B92B8, prima op navy maar op een lichte achtergrond
                   2,86-3,12:1. Een lichte pagina erft anders de DONKERE waarden: dat gaf 19
                   contrastfouten op /contact/ alleen al. Het donkere thema blijft ongewijzigd. */
                body.itlive-public-day { --muted: #475569; --gray: #475569; --muted2: #334155; }


            * { margin: 0; padding: 0; box-sizing: border-box; }
            html { scroll-behavior: smooth; }
            body {
                font-family: 'DM Sans', sans-serif;
                background: var(--navy);
                color: var(--white);
                line-height: 1.6;
                overflow-x: hidden;
                min-height: 100vh;
            }
            .navbar {
                position: sticky;
                top: 0;
                z-index: 200;
                display: grid;
                grid-template-columns: 1fr auto 1fr;
                align-items: center;
                padding: 0 1.25rem 0 1.5rem;
                height: 66px;
                background: rgba(2, 9, 23, 0.85);
                backdrop-filter: blur(20px) saturate(180%);
                -webkit-backdrop-filter: blur(20px) saturate(180%);
                border-bottom: 1px solid rgba(0, 200, 255, 0.1);
            }
            .navbar .navbar-left { display: flex; align-items: center; justify-content: flex-start; gap: 0.75rem; }
            .navbar .logo-icons {
                display: flex;
                align-items: center;
                gap: 0.35rem;
            }
            .navbar .logo-icons a {
                width: 34px;
                height: 34px;
                border-radius: 8px;
                display: flex;
                align-items: center;
                justify-content: center;
                color: var(--muted);
                text-decoration: none;
                transition: color 0.2s, background 0.2s;
            }
            .navbar .logo-icons a:hover { color: var(--gold); background: rgba(255,255,255,0.06); }
            .navbar .logo-icons a i { font-size: 0.9rem; }
            .navbar .navbar-center { display: flex; align-items: center; justify-content: center; gap: 0.25rem; }
            .navbar .navbar-right { display: flex; align-items: center; justify-content: flex-end; gap: 1rem; }
            .navbar .nav-links {
                display: none;
                list-style: none;
                margin: 0;
                padding: 0;
                flex-wrap: wrap;
                align-items: center;
                justify-content: center;
                gap: 0.1rem 1.25rem;
            }
            .navbar .nav-links li { margin: 0; }
            .navbar .nav-links a {
                color: var(--muted);
                text-decoration: none;
                font-size: 0.875rem;
                font-weight: 500;
                letter-spacing: 0.04em;
                padding: 0.4rem 0.5rem;
                border-radius: 6px;
                transition: color 0.2s, background 0.2s;
            }
            .navbar .nav-links a:hover { color: #fff; background: rgba(255,255,255,0.06); }
            .navbar .nav-links a.active { color: var(--gold); }
            .navbar .nav-links .nav-live-ai { color: var(--cyan); font-weight: 600; }
            .navbar .nav-links .nav-live-ai:hover { color: var(--gold); }
            @media (min-width: 992px) {
                .navbar .nav-links { display: flex; }
                .navbar .menu-toggle { display: none !important; }
            }
            .navbar .logo {
                display: flex;
                align-items: center;
                gap: 10px;
                text-decoration: none;
            }
            .navbar .logo img.logo-icon-svg { width: 40px; height: 40px; flex-shrink: 0; }
            .navbar .logo-txt, .navbar .itlive-brand-wordmark .wm-main {
                font-family: 'Montserrat', sans-serif;
                font-weight: 900;
                font-size: 0.98rem;
                letter-spacing: 0.22em;
                color: #fff;
                text-transform: uppercase;
            }
            .navbar .logo-txt b, .navbar .itlive-brand-wordmark .wm-sub { color: var(--gold); font-weight: 600; font-size: 0.55em; letter-spacing: 0.25em; margin-top: 2px; }
            .navbar .itlive-brand-wordmark .wm-sub{color:#a16207}
            .navbar .itlive-brand-wordmark { display: flex; flex-direction: column; align-items: flex-start; line-height: 1.1; }
            .navbar .nav-btn {
                padding: 0.52rem 1.4rem;
                border-radius: 999px;
                border: none;
                background: linear-gradient(135deg, var(--gold) 0%, #c8922a 100%);
                color: #0a0a0a;
                font-family: 'Montserrat', sans-serif;
                font-weight: 800;
                font-size: 0.78rem;
                letter-spacing: 0.07em;
                text-transform: uppercase;
                cursor: pointer;
                text-decoration: none;
                display: inline-block;
                box-shadow: 0 4px 22px rgba(242,193,79,0.35), inset 0 1px 1px rgba(255,255,255,0.5);
                transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1);
            }
            .navbar .nav-btn:hover {
                transform: translateY(-2px);
                box-shadow: 0 8px 32px rgba(242,193,79,0.6), inset 0 1px 1px rgba(255,255,255,0.6);
            }
            /* Ingelogd: zelfde balk als homepage — chip + primaire + ghost knop */
            .navbar-auth-cluster {
                display: none;
                align-items: center;
                gap: 0.45rem;
                flex-wrap: nowrap;
                justify-content: flex-end;
                flex-shrink: 0;
            }
            .itl-user-menu { position: relative; display: inline-flex; }
            .itl-user-trigger {
                display: inline-flex; align-items: center; gap: 0.4rem;
                padding: 0.4rem 0.75rem; border-radius: 10px;
                background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.14);
                color: var(--gray-light, #e2e8f0); font-size: 0.8125rem; font-weight: 600;
                cursor: pointer; font-family: inherit; white-space: nowrap;
                max-width: min(16rem, 40vw); transition: background .15s, border-color .15s;
            }
            .itl-user-trigger .itlive-auth-name {
                overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 10rem;
            }
            .itl-user-trigger:hover, .itl-user-menu.open .itl-user-trigger {
                background: rgba(255,255,255,0.14); border-color: rgba(0,200,255,0.35);
            }
            .itl-user-menu.open .itl-user-trigger .fa-chevron-down { transform: rotate(180deg); }
            .itl-user-panel {
                display: none; position: absolute; top: calc(100% + 8px); right: 0;
                min-width: 180px; background: #fff; border: 1px solid #e2e8f0;
                border-radius: 10px; box-shadow: 0 10px 28px rgba(0,0,0,.12);
                overflow: hidden; z-index: 9999;
            }
            .itl-user-menu.open .itl-user-panel { display: block; }
            .itl-user-panel a {
                display: flex; align-items: center; gap: 9px;
                padding: 11px 16px; font-size: .875rem; font-weight: 600;
                color: #0f172a !important; text-decoration: none;
                transition: background .12s;
            }
            .itl-user-panel a:hover { background: #f8fafc; }
            .itl-user-panel .itl-logout-link { color: #dc2626 !important; border-top: 1px solid #f1f5f9; }
            .itl-user-panel .itl-logout-link:hover { background: #fff5f5; }
            .navbar-user-chip {
                display: inline-flex;
                align-items: center;
                gap: 0.4rem;
                max-width: min(14rem, 32vw);
                padding: 0.4rem 0.8rem;
                border-radius: 10px;
                background: rgba(255, 255, 255, 0.08);
                border: 1px solid rgba(255, 255, 255, 0.14);
                color: var(--gray-light);
                font-size: 0.8125rem;
                font-weight: 600;
                line-height: 1.2;
            }
            .navbar-user-chip .itlive-auth-name {
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
            .navbar .nav-btn.nav-btn--ghost {
                background: transparent !important;
                border: 1.5px solid rgba(255, 255, 255, 0.32) !important;
                color: #e2e8f0 !important;
                box-shadow: none !important;
            }
            .navbar .nav-btn.nav-btn--ghost:hover {
                background: rgba(255, 255, 255, 0.08) !important;
                border-color: rgba(0, 200, 255, 0.35) !important;
                color: #fff !important;
            }
            .navbar .menu-toggle {
                height: 44px;
                min-width: 44px;
                min-height: 44px;
                padding: 0 0.7rem;
                border-radius: 12px;
                border: 1px solid rgba(0,207,255,0.28);
                background: linear-gradient(135deg, rgba(124,58,237,0.20), rgba(0,207,255,0.10));
                backdrop-filter: blur(10px);
                color: #fff;
                cursor: pointer;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 0.5rem;
                font-size: 1.1rem;
                transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
            }
            .navbar .menu-toggle .menu-toggle-logo {
                width: 22px;
                height: 22px;
                display: block;
                filter: drop-shadow(0 0 6px rgba(0,207,255,0.45));
                transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
            }
            .navbar .menu-toggle:hover {
                background: linear-gradient(135deg, rgba(124,58,237,0.32), rgba(0,207,255,0.18));
                border-color: rgba(0,207,255,0.55);
                transform: scale(1.05);
            }
            .navbar .menu-toggle:hover .menu-toggle-logo { transform: rotate(-8deg) scale(1.08); }
            /* ── Mobile: tablet ── */
            @media (max-width: 991px) {
                .navbar {
                    display: flex !important;
                    grid-template-columns: none !important;
                    justify-content: space-between;
                    padding: 0 1rem;
                    height: 60px;
                    gap: 8px;
                }
                .navbar .menu-toggle { display: flex; }
                .navbar .logo-icons { display: none; }
                .navbar .navbar-center { display: none !important; }
                .navbar .navbar-right {
                    gap: 8px;
                    flex-shrink: 0;
                }
                .navbar .itlive-auth-guest { display: inline-flex; }
                .navbar-auth-cluster { flex-wrap: nowrap !important; }
                .itl-user-panel { right: 0; }
            }
            /* ── Mobile: phone ── */
            @media (max-width: 768px) {
                .navbar { padding: 0 0.75rem; height: 56px; gap: 6px; }
                .navbar .logo img.logo-icon-svg { width: 34px; height: 34px; }
                .navbar .itlive-brand-wordmark .wm-main { font-size: 0.85rem; letter-spacing: 0.12em; }
                .navbar .nav-btn { padding: 0.4rem 0.9rem; font-size: 0.72rem; }
                .contact-bar { font-size: 0.72rem !important; }
                .contact-bar .sep { display: none !important; }
                .contact-bar-inner { gap: 8px !important; }
            }
            /* ── Mobile: small phone ── */
            @media (max-width: 480px) {
                .navbar { padding: 0 0.5rem; height: 52px; }
                .navbar .itlive-brand-wordmark .wm-sub { display: none; }
                .navbar .itlive-brand-wordmark .wm-main { font-size: 0.78rem; }
                .navbar .logo img.logo-icon-svg { width: 30px; height: 30px; }
                .navbar .nav-btn { padding: 0.35rem 0.75rem; font-size: 0.68rem; letter-spacing: 0.04em; }
                .navbar .menu-toggle { height: 38px; min-width: 38px; min-height: 38px; padding: 0 0.5rem; gap: 0.4rem; font-size: 1rem; }
                .navbar .menu-toggle .menu-toggle-logo { width: 18px; height: 18px; }
                .contact-bar { display: none !important; }
            }
            .nav-sidebar-overlay {
                position: fixed;
                inset: 0;
                background: rgba(2,9,23,0.75);
                backdrop-filter: blur(8px);
                z-index: 400;
                opacity: 0;
                visibility: hidden;
                transition: opacity 0.25s, visibility 0.25s;
            }
            .nav-sidebar-overlay.is-open { opacity: 1; visibility: visible; }
            .nav-sidebar {
                position: fixed;
                top: 0;
                right: 0;
                width: min(360px, 90vw);
                height: 100vh;
                background: linear-gradient(180deg, #020917 0%, #0C1B38 100%);
                border-left: 1px solid rgba(0,200,255,0.15);
                z-index: 401;
                transform: translateX(100%);
                transition: transform 0.3s ease;
                overflow-y: auto;
                display: flex;
                flex-direction: column;
            }
            .nav-sidebar-overlay.is-open .nav-sidebar { transform: translateX(0); }
            .nav-sidebar-header {
                display: flex;
                align-items: center;
                justify-content: space-between;
                padding: 1rem 1.25rem;
                border-bottom: 1px solid rgba(255,255,255,0.08);
            }
            .nav-sidebar-brand { display: flex; align-items: center; gap: 0.7rem; min-width: 0; }
            .nav-sidebar-logo { width: 36px; height: 36px; flex-shrink: 0; }
            .nav-sidebar-brand-txt { display: flex; flex-direction: column; line-height: 1.1; min-width: 0; }
            .nav-sidebar-brand-name { font-weight: 800; font-size: 1rem; letter-spacing: 0.02em; }
            .nav-sidebar-brand-sub { font-size: 0.6rem; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: var(--gold); margin-top: 1px; }
            .nav-sidebar-header .sidebar-close {
                width: 44px;
                height: 44px;
                border-radius: 10px;
                border: 1px solid rgba(255,255,255,0.15);
                background: rgba(255,255,255,0.06);
                color: #fff;
                cursor: pointer;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 1.25rem;
            }
            .nav-sidebar-header .sidebar-close:hover { background: rgba(255,255,255,0.12); }
            .nav-sidebar-menu { list-style: none; padding: 1rem 0; margin: 0; }
            .nav-sidebar-menu li { margin: 0; }
            .nav-sidebar-menu a {
                display: block;
                padding: 0.85rem 1.25rem;
                color: #e8f0f8;
                text-decoration: none;
                font-weight: 500;
                border-left: 3px solid transparent;
                transition: background 0.2s, border-color 0.2s, color 0.2s;
            }
            .nav-sidebar-menu a:hover,
                        .nav-sidebar-group { margin: 0; }
            .nav-sidebar-toggle {
                width: 100%; text-align: left; background: transparent; border: 0; color: #fff;
                padding: 0.85rem 1.5rem; font-size: 1rem; font-weight: 600; cursor: pointer;
                display: flex; align-items: center; justify-content: space-between;
            }
            .nav-sidebar-toggle:hover { background: rgba(255,255,255,0.06); color: var(--gold); }
            .nav-sidebar-sub { list-style: none; margin: 0; padding: 0 0 0.5rem 0; display: none; background: rgba(0,0,0,0.15); }
            .nav-sidebar-group.open .nav-sidebar-sub { display: block; }
            .nav-sidebar-sub a { padding: 0.55rem 1.5rem 0.55rem 2.25rem !important; font-size: 0.92rem !important; font-weight: 500 !important; }
            .nav-sidebar-label { padding: 0.65rem 1.5rem 0.25rem 2rem; font-size: 0.68rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--gold); opacity: 0.85; }
.nav-sidebar-menu a.active {
                background: rgba(255,255,255,0.06);
                border-left-color: var(--gold);
                color: var(--gold);
            }
            .nav-sidebar-chat {
                margin: 1rem 1.25rem;
                padding: 1.25rem;
                background: rgba(0,200,255,0.08);
                border: 1px solid rgba(0,200,255,0.2);
                border-radius: 12px;
            }
            .nav-sidebar-chat h4 { font-size: 1rem; margin-bottom: 0.5rem; color: var(--cyan); display: flex; align-items: center; gap: 0.5rem; }
            .nav-sidebar-chat p { font-size: 0.875rem; color: var(--muted); margin-bottom: 1rem; line-height: 1.4; }
            .nav-sidebar-chat .btn-open-chat {
                display: inline-flex;
                align-items: center;
                gap: 0.5rem;
                padding: 0.6rem 1.2rem;
                background: linear-gradient(135deg, var(--cyan), #0066aa);
                color: #fff;
                border: none;
                border-radius: 8px;
                font-weight: 600;
                font-size: 0.9rem;
                cursor: pointer;
                text-decoration: none;
            }
            .nav-sidebar-chat .btn-open-chat:hover { box-shadow: 0 6px 20px rgba(0,200,255,0.35); }
            .nav-sidebar-contact {
                margin-top: auto;
                padding: 1.25rem;
                border-top: 1px solid rgba(255,255,255,0.08);
                font-size: 0.875rem;
            }
            .nav-sidebar-contact a {
                display: inline-flex;
                align-items: center;
                gap: 0.35rem;
                color: var(--muted);
                text-decoration: none;
                margin-right: 1rem;
                margin-bottom: 0.5rem;
            }
            .nav-sidebar-contact a:hover { color: var(--gold); }

            /* Live zoekbalk – alle domeinen + AI suggesties bij geen resultaat */
            .navbar .search-wrap {
                position: relative;
                margin-right: 0.5rem;
            }
            .navbar .search-input {
                width: 160px;
                padding: 0.45rem 0.75rem 0.45rem 2rem;
                border-radius: 999px;
                border: 1px solid rgba(255,255,255,0.15);
                background: rgba(255,255,255,0.06);
                color: #fff;
                font-size: 0.8125rem;
                transition: width 0.2s, border-color 0.2s;
            }
            .navbar .search-input::placeholder { color: rgba(255,255,255,0.4); }
            .navbar .search-input:focus {
                outline: none;
                border-color: rgba(0,200,255,0.4);
                width: 200px;
            }
            .navbar .search-wrap .search-icon {
                position: absolute;
                left: 0.75rem;
                top: 50%;
                transform: translateY(-50%);
                color: var(--muted);
                font-size: 0.8rem;
                pointer-events: none;
            }
            .navbar .search-dropdown {
                position: absolute;
                top: calc(100% + 6px);
                left: 0;
                right: 0;
                min-width: 280px;
                max-height: 70vh;
                overflow-y: auto;
                background: linear-gradient(180deg, #020917 0%, #0C1B38 100%);
                border: 1px solid rgba(0,200,255,0.2);
                border-radius: 12px;
                box-shadow: 0 12px 40px rgba(0,0,0,0.5);
                z-index: 300;
                display: none;
            }
            .navbar .search-dropdown.is-open { display: block; }
            .navbar .search-dropdown a {
                display: block;
                padding: 0.6rem 1rem;
                color: #e8f0f8;
                text-decoration: none;
                font-size: 0.875rem;
                border-bottom: 1px solid rgba(255,255,255,0.06);
                transition: background 0.2s;
            }
            .navbar .search-dropdown a:hover { background: rgba(255,255,255,0.08); color: var(--gold); }
            .navbar .search-dropdown a small {
                display: block;
                font-size: 0.75rem;
                color: var(--muted);
                margin-top: 0.15rem;
            }
            .navbar .search-dropdown .search-no-results {
                padding: 1rem;
                color: var(--muted);
                font-size: 0.875rem;
            }
            .navbar .search-dropdown .search-no-results strong { color: var(--cyan); }
            .navbar .search-dropdown .search-suggestions {
                padding: 0.5rem 1rem 1rem;
                border-top: 1px solid rgba(255,255,255,0.08);
            }
            .navbar .search-dropdown .search-suggestions a {
                display: inline-block;
                margin: 0.25rem 0.25rem 0 0;
                padding: 0.35rem 0.65rem;
                background: rgba(0,200,255,0.15);
                border-radius: 8px;
                font-size: 0.8rem;
                border: none;
            }
            .navbar .search-dropdown .search-suggestions a:hover { background: rgba(0,200,255,0.25); }
            .nav-sidebar .search-wrap {
                position: relative;
                padding: 0.75rem 1.25rem;
                border-bottom: 1px solid rgba(255,255,255,0.08);
            }
            .nav-sidebar .search-wrap .search-icon { left: 1.5rem; }
            .nav-sidebar .search-input {
                width: 100%;
                padding: 0.6rem 1rem 0.6rem 2.5rem;
                border-radius: 10px;
                border: 1px solid rgba(255,255,255,0.15);
                background: rgba(255,255,255,0.06);
                color: #fff;
                font-size: 0.9rem;
            }
            .nav-sidebar .search-input::placeholder { color: rgba(255,255,255,0.4); }
            .nav-sidebar .search-dropdown {
                left: 1.25rem;
                right: 1.25rem;
                min-width: auto;
            }
            @media (max-width: 991px) {
                .navbar .search-wrap { display: none; }
            }
            @media (max-width: 1100px) {
                .navbar .search-input { width: 140px; }
                .navbar .search-input:focus { width: 180px; }
            }
            /* iPad landscape compact — hide search so AANMELDEN button stays visible */
            @media (min-width: 992px) and (max-width: 1200px) {
                .navbar .search-wrap { display: none !important; }
                .navbar .navbar-right { gap: 0.5rem; }
            }

            /* Contact bar – 1 regel, full width */
            .contact-bar {
                width: 100%;
                background: rgba(0, 32, 59, 0.95);
                border-bottom: 1px solid rgba(0, 200, 255, 0.12);
                padding: 0.5rem 1rem;
            }
            .contact-bar-inner {
                max-width: 1200px;
                margin: 0 auto;
                display: flex;
                flex-wrap: wrap;
                align-items: center;
                justify-content: center;
                gap: 1rem 1.5rem;
                font-size: 0.875rem;
            }
            .contact-bar a {
                color: var(--muted);
                text-decoration: none;
                display: inline-flex;
                align-items: center;
                gap: 0.35rem;
                transition: color 0.2s;
            }
            .contact-bar a:hover { color: var(--gold); }
            .contact-bar .sep {
                color: rgba(255,255,255,0.2);
                user-select: none;
            }
            @media (max-width: 768px) {
                .contact-bar { padding: 0.5rem 0.75rem; }
                .contact-bar-inner { gap: 0.75rem 1rem; font-size: 0.8125rem; }
            }
            @media (max-width: 600px) {
                .contact-bar-inner { gap: 0.5rem 0.75rem; font-size: 0.8rem; }
                .contact-bar .sep { display: none; }
            }

            /* Reduce motion for users who prefer it */
            @media (prefers-reduced-motion: reduce) {
                * {
                    animation-duration: 0.01ms !important;
                    animation-iteration-count: 1 !important;
                    transition-duration: 0.01ms !important;
                }
            }

            /* Dag-thema: witte header, lichte achtergrond (publieke site) */
            body.itlive-public-day {
                background: #f1f5f9 !important;
                color: #0f172a !important;
            }
            body.itlive-public-day .navbar {
                background: rgba(255, 255, 255, 0.96) !important;
                border-bottom: 1px solid rgba(15, 23, 42, 0.08) !important;
                box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
            }
            body.itlive-public-day .navbar .nav-links a {
                color: #475569 !important;
            }
            body.itlive-public-day .navbar .nav-links a:hover {
                color: #0f172a !important;
                background: rgba(15, 23, 42, 0.06) !important;
            }
            body.itlive-public-day .navbar .nav-links a.active { color: #92400e !important; /* 2026-08-10: was #b45309 op #e7f0fd = 4,37:1, net onder de norm. Nu 6,17:1. */ }
            body.itlive-public-day .navbar .nav-links .nav-live-ai { color: #0e7490 !important; }
            body.itlive-public-day .navbar .nav-links .nav-live-ai:hover { color: #c9a227 !important; }
            body.itlive-public-day .navbar .logo-txt,
            body.itlive-public-day .navbar .itlive-brand-wordmark .wm-main { color: #0f172a !important; }
            body.itlive-public-day .navbar .logo-icons a { color: #64748b !important; }
            body.itlive-public-day .navbar .logo-icons a:hover { color: #0e7490 !important; background: rgba(15, 23, 42, 0.06) !important; }
            body.itlive-public-day .navbar .menu-toggle {
                border-color: rgba(15, 23, 42, 0.15) !important;
                background: rgba(255, 255, 255, 0.9) !important;
                color: #0f172a !important;
            }
            body.itlive-public-day .navbar .search-input {
                border: 1px solid rgba(15, 23, 42, 0.12) !important;
                background: #fff !important;
                color: #0f172a !important;
            }
            body.itlive-public-day .navbar .search-input::placeholder { color: #94a3b8 !important; }
            body.itlive-public-day .navbar .search-wrap .search-icon { color: #64748b !important; }
            body.itlive-public-day .navbar .search-dropdown {
                background: #fff !important;
                border: 1px solid rgba(15, 23, 42, 0.1) !important;
                box-shadow: 0 12px 40px rgba(15, 23, 42, 0.12) !important;
            }
            body.itlive-public-day .navbar .search-dropdown a {
                color: #0f172a !important;
                border-bottom-color: rgba(15, 23, 42, 0.06) !important;
            }
            body.itlive-public-day .navbar .search-dropdown a:hover { background: #f8fafc !important; color: #b45309 !important; }
            body.itlive-public-day .navbar .search-dropdown a small { color: #64748b !important; }
            body.itlive-public-day .contact-bar {
                background: #ffffff !important;
                border-bottom: 1px solid rgba(15, 23, 42, 0.08) !important;
            }
            body.itlive-public-day .contact-bar a { color: #475569 !important; }
            body.itlive-public-day .contact-bar a:hover { color: #0e7490 !important; }
            body.itlive-public-day .contact-bar .sep { color: rgba(15, 23, 42, 0.2) !important; }
            body.itlive-public-day .nav-sidebar-overlay { background: rgba(15, 23, 42, 0.45) !important; }
            body.itlive-public-day .nav-sidebar {
                background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
                border-left: 1px solid rgba(15, 23, 42, 0.1) !important;
            }
            body.itlive-public-day .nav-sidebar-header { border-bottom-color: rgba(15, 23, 42, 0.08) !important; color: #0f172a !important; }
            body.itlive-public-day .nav-sidebar-welcome { color: #64748b !important; }
            body.itlive-public-day .nav-sidebar-header .sidebar-close {
                border-color: rgba(15, 23, 42, 0.15) !important;
                background: #fff !important;
                color: #0f172a !important;
            }
            body.itlive-public-day .nav-sidebar-menu a { color: #334155 !important; }
            body.itlive-public-day .nav-sidebar-menu a:hover,
            body.itlive-public-day .nav-sidebar-menu a.active { background: rgba(15, 23, 42, 0.06) !important; color: #b45309 !important; border-left-color: #c9a227 !important; }
            body.itlive-public-day .nav-sidebar .search-input {
                border: 1px solid rgba(15, 23, 42, 0.12) !important;
                background: #fff !important;
                color: #0f172a !important;
            }
            body.itlive-public-day .nav-sidebar-chat {
                background: rgba(8, 145, 178, 0.08) !important;
                border: 1px solid rgba(8, 145, 178, 0.25) !important;
            }
            body.itlive-public-day .nav-sidebar-chat h4 { color: #0e7490 !important; }
            body.itlive-public-day .nav-sidebar-chat p { color: #64748b !important; }
            body.itlive-public-day .nav-sidebar-contact { border-top-color: rgba(15, 23, 42, 0.08) !important; }
            body.itlive-public-day .nav-sidebar-contact a { color: #64748b !important; }
            body.itlive-public-day .nav-sidebar-contact a:hover { color: #b45309 !important; }
            body.itlive-public-day .navbar-user-chip {
                background: #f1f5f9 !important;
                border-color: rgba(15, 23, 42, 0.1) !important;
                color: #334155 !important;
            }
            body.itlive-public-day .navbar .nav-btn.nav-btn--ghost {
                border-color: rgba(15, 23, 42, 0.18) !important;
                color: #475569 !important;
            }
            body.itlive-public-day .navbar .nav-btn.nav-btn--ghost:hover {
                background: rgba(15, 23, 42, 0.06) !important;
                border-color: rgba(15, 23, 42, 0.22) !important;
                color: #0f172a !important;
            }
                    /* 2026-07-16 fix: tussen 1200-1500px liep de nav over -> AANMELDEN-CTA werd afgekapt.
               Compacter in die zone; >=1501px blijft ongewijzigd. */
            @media (min-width: 1201px) and (max-width: 1500px) {
                .navbar { padding: 0 0.75rem; }
                .navbar .navbar-right { gap: 0.5rem; }
                .navbar .search-wrap { margin-right: 0.25rem; }
                .navbar .search-input { width: 110px; }
                .navbar .nav-btn { padding: 0.52rem 0.9rem; }
                .navbar .nav-links { gap: 0.55rem; }
            }
</style>
        <!-- ═══ Animatie keyframes (2026-05-25) — GEEN hero kleur overrides ═══ -->
        <style>
            @keyframes itl-fadeInUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
            @keyframes itl-fadeIn{from{opacity:0}to{opacity:1}}
            @keyframes itl-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
            @keyframes itl-gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
            /* Hero kleuren worden per pagina gestyled, niet globaal */
            @media (prefers-reduced-motion: reduce) {
                .hero, section.hero, .page-hero, [class*="hero-section"] { animation: none !important; }
                .hero::after { animation: none !important; }
                .hero h1, .hero p, .hero-eyebrow, .hero-stats,
                .hero [class*="eyebrow"], .hero [class*="stats"] { animation: none !important; }
            }
        </style>
        <!-- Service Worker Registration -->
        <script>
        if ('serviceWorker' in navigator) {
            window.addEventListener('load', () => {
                navigator.serviceWorker.register('/sw-v3.js', { updateViaCache: 'none' })
                    .then(registration => {
                        console.log('SW registered: ', registration);
                    })
                    .catch(registrationError => {
                        console.log('SW registration failed: ', registrationError);
                    });
            });
        }
        </script>
        <script src="https://layg.nl/assets/js/enhanced-scripts-v2.js?v=1776187681" defer></script>
                <!-- Live AI Chat – alle Layg & subdomeinen, klantflows direct -->
        <!-- 2026-05-10: skip floating widget als pagina al een inline chat heeft (voorkomt dubbele chat-bubbles).
             Pagina kan flag zetten met: $GLOBALS['itlive_skip_chat_widget'] = true; vóór header-include
             2026-05-13: PHP-guard ITLIVE_CHAT_WIDGET_LOADED voorkomt dat footer-include hetzelfde script nog een keer rendert. -->
                <script src="https://layg.nl/api/ai-chat-widget.php?tenant=layg" async></script>
                <!-- Layg Polish Layer: verbetert chat, nav, footer, cards, forms globaal -->
        <link rel="stylesheet" href="/assets/css/itlive-home-polish.css?v=1779374255">
        <!-- Overflow-fix: navbar-right te breed op 1280px (taalswitch buiten viewport) -->
        <style>
        html{overflow-x:clip!important}
        body{overflow-x:hidden!important}
        .lc-wrap,.nav-sidebar-overlay{overflow:hidden!important}
        /* Verberg langswitch op <1400px — te weinig ruimte naast CODE+AANMELDEN+nav */
        @media(max-width:1399px){
            .itlive-langswitch{display:none!important}
        }
        /* Verklein zoekbalk op <1300px */
        @media(max-width:1299px){
            .navbar .search-input{width:100px!important}
            .navbar .search-input:focus{width:130px!important}
        }
        /* iPad landscape ≤1100px: compact buttons + tight gap */
        @media(max-width:1100px) and (min-width:921px){
            .navbar .navbar-right{gap:.35rem!important}
            .navbar .nav-btn{padding:.4rem .75rem!important;font-size:.72rem!important}
            .navbar .logo img.logo-icon-svg,.navbar .logo-icon-svg{width:34px!important;height:34px!important}
            .navbar .itlive-brand-wordmark .wm-sub{display:none!important}
            .navbar .itlive-brand-wordmark .wm-main{font-size:.82rem!important}
        }
        </style>
            </head>
    <body class="itlive-public-day">
        <style id="itl-topbar-css">
/* Oude contact-bar (onder navbar) vervangen door deze topbar */
.contact-bar{display:none!important}
#itl-topbar{width:100%;background:linear-gradient(90deg,#020917,#0c1b38 55%,#020917);border-bottom:1px solid rgba(0,200,255,.14);display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:0 clamp(.6rem,3vw,1.5rem);height:40px;position:relative;z-index:210;font-family:'DM Sans','Segoe UI',sans-serif}
#itl-topbar .itl-tb-note{color:#8ea3bd;font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-flex;align-items:center;gap:.45rem}
#itl-topbar .itl-tb-note .itl-tb-dot{width:7px;height:7px;border-radius:50%;background:#22c55e;box-shadow:0 0 6px #22c55e;flex:0 0 auto}
#itl-topbar .itl-tb-actions{display:flex;align-items:center;gap:.15rem;margin-left:auto}
.itl-tb-btn{display:inline-flex;align-items:center;gap:.42rem;background:transparent;border:0;color:#cbd5e1;font-size:.8rem;font-weight:600;padding:.34rem .7rem;border-radius:9px;cursor:pointer;transition:background .18s,color .18s;line-height:1;text-decoration:none}
.itl-tb-btn:hover{background:rgba(255,255,255,.08);color:#fff}
.itl-tb-btn svg{width:15px;height:15px;flex:0 0 auto}
.itl-tb-btn--call svg{color:#f2c14f}
.itl-tb-btn--wa svg{color:#25d366}
.itl-tb-btn--mail svg{color:#60a5fa}
.itl-tb-sep{width:1px;height:16px;background:rgba(255,255,255,.14);margin:0 .2rem}
@media(max-width:719px){#itl-topbar .itl-tb-note{display:none}#itl-topbar{justify-content:center}#itl-topbar .itl-tb-actions{margin:0 auto}}
@media(max-width:430px){.itl-tb-btn .itl-tb-lbl{display:none}.itl-tb-btn{padding:.34rem .85rem}.itl-tb-btn svg{width:17px;height:17px}}
/* ── Backdrop ── */
#itl-tb-backdrop{position:fixed;inset:0;background:rgba(2,9,23,.5);backdrop-filter:blur(2px);z-index:380;opacity:0;pointer-events:none;transition:opacity .22s}
#itl-tb-backdrop.show{opacity:1;pointer-events:auto}
/* ── Panels ── */
.itl-panel{position:fixed;top:52px;right:14px;width:360px;max-width:calc(100vw - 20px);background:#fff;color:#0f172a;border-radius:16px;box-shadow:0 24px 64px rgba(2,9,23,.4);z-index:400;display:none;overflow:hidden;font-family:'DM Sans','Segoe UI',sans-serif}
.itl-panel.show{display:block;animation:itlPanelIn .24s ease}
@keyframes itlPanelIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:520px){.itl-panel{right:10px;left:10px;width:auto;top:50px}}
.itl-panel-hd{display:flex;align-items:center;gap:.7rem;padding:.9rem 1rem;color:#fff}
.itl-panel--call .itl-panel-hd{background:linear-gradient(135deg,#0c1b38,#1d4ed8)}
.itl-panel--wa .itl-panel-hd{background:linear-gradient(135deg,#128c7e,#25d366)}
.itl-panel--mail .itl-panel-hd{background:linear-gradient(135deg,#1e40af,#3b82f6)}
.itl-panel-hd svg{width:22px;height:22px;flex:0 0 auto}
.itl-panel-hd .itl-panel-tt{font-size:1rem;font-weight:800;line-height:1.15}
.itl-panel-hd .itl-panel-sub{font-size:.74rem;opacity:.85;font-weight:500}
.itl-panel-x{margin-left:auto;background:rgba(255,255,255,.16);border:0;color:#fff;width:28px;height:28px;border-radius:50%;font-size:17px;line-height:1;cursor:pointer;flex:0 0 auto}
.itl-panel-x:hover{background:rgba(255,255,255,.3)}
.itl-panel-bd{padding:1rem;max-height:min(70vh,560px);overflow-y:auto}
.itl-panel-bd label{display:block;font-size:.78rem;font-weight:700;color:#334155;margin:.65rem 0 .25rem}
.itl-panel-bd input[type=text],.itl-panel-bd input[type=email],.itl-panel-bd input[type=tel],.itl-panel-bd textarea{width:100%;border:1.5px solid #e2e8f0;border-radius:10px;padding:.55rem .7rem;font-size:.9rem;font-family:inherit;color:#0f172a;background:#fff;box-sizing:border-box;outline:none;transition:border-color .15s}
.itl-panel-bd input:focus,.itl-panel-bd textarea:focus{border-color:#3b82f6}
.itl-panel-bd textarea{resize:vertical;min-height:84px}
.itl-btn-primary{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;border:0;border-radius:11px;padding:.7rem 1rem;font-size:.92rem;font-weight:800;cursor:pointer;color:#fff;background:linear-gradient(135deg,#1e40af,#3b82f6);margin-top:.85rem;transition:filter .15s}
.itl-btn-primary:hover{filter:brightness(1.1)}
.itl-btn-primary:disabled{opacity:.55;cursor:wait}
.itl-btn-wa{background:linear-gradient(135deg,#128c7e,#25d366)!important}
.itl-btn-ghost{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;border:1.5px solid #e2e8f0;background:#f8fafc;border-radius:11px;padding:.65rem 1rem;font-size:.9rem;font-weight:700;color:#0f172a;cursor:pointer;margin-top:.6rem}
.itl-btn-ghost:hover{border-color:#94a3b8}
.itl-div{display:flex;align-items:center;gap:.6rem;color:#94a3b8;font-size:.75rem;font-weight:700;margin:.9rem 0 .1rem;text-transform:uppercase;letter-spacing:.04em}
.itl-div::before,.itl-div::after{content:'';flex:1;height:1px;background:#e2e8f0}
/* Bel-knoppen */
.itl-callrow{display:flex;align-items:center;gap:.8rem;border:1.5px solid #e2e8f0;border-radius:12px;padding:.7rem .85rem;text-decoration:none;color:#0f172a;margin-top:.6rem;transition:border-color .15s,background .15s}
.itl-callrow:hover{border-color:#3b82f6;background:#f8fafc}
.itl-callrow .itl-flag{font-size:1.25rem}
.itl-callrow .itl-cl{font-size:.72rem;font-weight:700;color:#64748b;text-transform:uppercase;letter-spacing:.04em}
.itl-callrow .itl-cn{font-size:1.02rem;font-weight:800;color:#0c1b38}
.itl-callrow svg{margin-left:auto;width:18px;height:18px;color:#3b82f6}
.itl-hours{background:#f1f5f9;border-radius:10px;padding:.6rem .8rem;font-size:.8rem;color:#475569;margin-bottom:.2rem}
/* Upload */
.itl-upl{border:1.5px dashed #cbd5e1;border-radius:11px;padding:.75rem;text-align:center;cursor:pointer;color:#64748b;font-size:.82rem;font-weight:600;margin-top:.25rem;transition:border-color .15s,background .15s}
.itl-upl:hover{border-color:#3b82f6;background:#f8fafc}
.itl-upl svg{width:18px;height:18px;vertical-align:-4px;margin-right:.35rem;color:#3b82f6}
.itl-files{list-style:none;margin:.4rem 0 0;padding:0}
.itl-files li{display:flex;align-items:center;gap:.5rem;font-size:.78rem;color:#334155;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:.3rem .55rem;margin-top:.3rem}
.itl-files li .itl-fs{color:#94a3b8;margin-left:auto;flex:0 0 auto}
.itl-files li button{border:0;background:none;color:#ef4444;cursor:pointer;font-size:.95rem;line-height:1;padding:0 .1rem;flex:0 0 auto}
.itl-chk{display:flex;align-items:flex-start;gap:.55rem;margin-top:.8rem;cursor:pointer}
.itl-chk input{width:17px;height:17px;margin-top:1px;accent-color:#2563eb;cursor:pointer}
.itl-chk span{font-size:.84rem;color:#334155;font-weight:600}
.itl-err{color:#b91c1c;background:#fef2f2;border:1px solid #fecaca;border-radius:9px;padding:.5rem .7rem;font-size:.8rem;margin-top:.6rem;display:none}
/* Succes-view */
.itl-success{display:none;text-align:center;padding:.4rem 0 .2rem}
.itl-success .itl-okic{width:54px;height:54px;border-radius:50%;background:#dcfce7;display:flex;align-items:center;justify-content:center;margin:0 auto .7rem}
.itl-success .itl-okic svg{width:28px;height:28px;color:#16a34a}
.itl-success h4{margin:0 0 .3rem;font-size:1.05rem;color:#0c1b38}
.itl-success p{margin:0 0 .4rem;font-size:.85rem;color:#475569;line-height:1.5}
</style>

<div id="itl-topbar" role="complementary" aria-label="Snel contact">
    <span class="itl-tb-note"><span class="itl-tb-dot" aria-hidden="true"></span>LAYG — IT &amp; Webdesign · Ma–Vr 09:00–17:30</span>
    <div class="itl-tb-actions">
        <button type="button" class="itl-tb-btn itl-tb-btn--call" data-itl-panel="call" aria-haspopup="dialog">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 16.92v3a2 2 0 01-2.18 2 19.79 19.79 0 01-8.63-3.07 19.5 19.5 0 01-6-6 19.79 19.79 0 01-3.07-8.67A2 2 0 014.11 2h3a2 2 0 012 1.72c.127.96.361 1.903.7 2.81a2 2 0 01-.45 2.11L8.09 9.91a16 16 0 006 6l1.27-1.27a2 2 0 012.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0122 16.92z"/></svg>
            <span class="itl-tb-lbl">085 083 5610</span>
        </button>
        <span class="itl-tb-sep" aria-hidden="true"></span>
        <button type="button" class="itl-tb-btn itl-tb-btn--wa" data-itl-panel="wa" aria-haspopup="dialog">
            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z"/></svg>
            <span class="itl-tb-lbl">WhatsApp</span>
        </button>
        <span class="itl-tb-sep" aria-hidden="true"></span>
        <button type="button" class="itl-tb-btn itl-tb-btn--mail" data-itl-panel="mail" aria-haspopup="dialog">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="4" width="20" height="16" rx="2"/><path d="M22 7l-10 7L2 7"/></svg>
            <span class="itl-tb-lbl">Mail ons</span>
        </button>
    </div>
</div>

<div id="itl-tb-backdrop" aria-hidden="true"></div>

<!-- ── Panel: Bel ons ── -->
<div class="itl-panel itl-panel--call" id="itl-panel-call" role="dialog" aria-modal="true" aria-label="Bel ons">
    <div class="itl-panel-hd">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 16.92v3a2 2 0 01-2.18 2 19.79 19.79 0 01-8.63-3.07 19.5 19.5 0 01-6-6 19.79 19.79 0 01-3.07-8.67A2 2 0 014.11 2h3a2 2 0 012 1.72c.127.96.361 1.903.7 2.81a2 2 0 01-.45 2.11L8.09 9.91a16 16 0 006 6l1.27-1.27a2 2 0 012.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0122 16.92z"/></svg>
        <div><div class="itl-panel-tt">Bel ons direct</div><div class="itl-panel-sub">Wij helpen u graag persoonlijk</div></div>
        <button type="button" class="itl-panel-x" aria-label="Sluiten">&times;</button>
    </div>
    <div class="itl-panel-bd">
        <div class="itl-hours"><strong>Bereikbaar:</strong> maandag t/m vrijdag, 09:00 – 17:30</div>
        <a class="itl-callrow" href="tel:0850835610">
            <span class="itl-flag" aria-hidden="true">🇳🇱</span>
            <span><span class="itl-cl">Nederland</span><br><span class="itl-cn">085 083 5610</span></span>
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 16.92v3a2 2 0 01-2.18 2 19.79 19.79 0 01-8.63-3.07 19.5 19.5 0 01-6-6 19.79 19.79 0 01-3.07-8.67A2 2 0 014.11 2h3a2 2 0 012 1.72c.127.96.361 1.903.7 2.81a2 2 0 01-.45 2.11L8.09 9.91a16 16 0 006 6l1.27-1.27a2 2 0 012.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0122 16.92z"/></svg>
        </a>
        <div class="itl-div">liever dat wij bellen?</div>
        <button type="button" class="itl-btn-ghost" id="itl-call-to-mail">
            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="4" width="20" height="16" rx="2"/><path d="M22 7l-10 7L2 7"/></svg>
            Terugbelverzoek achterlaten
        </button>
    </div>
</div>

<!-- ── Panel: WhatsApp ── -->
<div class="itl-panel itl-panel--wa" id="itl-panel-wa" role="dialog" aria-modal="true" aria-label="WhatsApp">
    <div class="itl-panel-hd">
        <svg viewBox="0 0 24 24" fill="currentColor"><path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z"/></svg>
        <div><div class="itl-panel-tt">WhatsApp met LAYG</div><div class="itl-panel-sub">Meestal antwoord binnen enkele minuten</div></div>
        <button type="button" class="itl-panel-x" aria-label="Sluiten">&times;</button>
    </div>
    <div class="itl-panel-bd">
        <button type="button" class="itl-btn-primary itl-btn-wa" id="itl-wa-direct">
            <svg width="17" height="17" viewBox="0 0 24 24" fill="currentColor"><path d="M2.01 21L23 12 2.01 3 2 10l15 2-15 2z"/></svg>
            Direct doorgaan naar de chat
        </button>
        <div class="itl-div">of typ eerst uw bericht</div>
        <label for="itl-wa-msg">Uw bericht</label>
        <textarea id="itl-wa-msg" rows="3" placeholder="Bijv. Ik wil graag een offerte voor een website..."></textarea>
        <button type="button" class="itl-btn-primary itl-btn-wa" id="itl-wa-send">
            <svg width="17" height="17" viewBox="0 0 24 24" fill="currentColor"><path d="M2.01 21L23 12 2.01 3 2 10l15 2-15 2z"/></svg>
            Versturen via WhatsApp
        </button>
    </div>
</div>

<!-- ── Panel: Mail ons ── -->
<div class="itl-panel itl-panel--mail" id="itl-panel-mail" role="dialog" aria-modal="true" aria-label="Mail ons">
    <div class="itl-panel-hd">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="4" width="20" height="16" rx="2"/><path d="M22 7l-10 7L2 7"/></svg>
        <div><div class="itl-panel-tt">Stuur ons een bericht</div><div class="itl-panel-sub">Met foto's of bestanden — reactie binnen 1 werkdag</div></div>
        <button type="button" class="itl-panel-x" aria-label="Sluiten">&times;</button>
    </div>
    <div class="itl-panel-bd">
        <form id="itl-mail-form" novalidate>
            <input type="text" name="website" tabindex="-1" autocomplete="off" style="position:absolute;left:-9999px" aria-hidden="true">
            <label for="itl-m-name">Uw naam *</label>
            <input type="text" id="itl-m-name" placeholder="Volledige naam" autocomplete="name" maxlength="120" required>
            <label for="itl-m-email">Uw e-mailadres *</label>
            <input type="email" id="itl-m-email" placeholder="naam@voorbeeld.nl" autocomplete="email" maxlength="200" required>
            <label for="itl-m-msg">Omschrijving *</label>
            <textarea id="itl-m-msg" rows="4" placeholder="Vertel wat u nodig heeft: website, webshop, hosting, AI-assistent..." maxlength="8000" required></textarea>
            <label>Foto's of bestanden (optioneel)</label>
            <div class="itl-upl" id="itl-m-upl" role="button" tabindex="0">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 01-2 2H5a2 2 0 01-2-2v-4"/><polyline points="17 8 12 3 7 8"/><line x1="12" y1="3" x2="12" y2="15"/></svg>
                Klik om te uploaden — max 5 bestanden, 10 MB p/st
            </div>
            <input type="file" id="itl-m-files" multiple accept="image/*,.pdf,.doc,.docx,.xls,.xlsx,.txt,.zip" style="display:none">
            <ul class="itl-files" id="itl-m-flist"></ul>
            <label class="itl-chk"><input type="checkbox" id="itl-m-cb"><span>Ik wil telefonisch benaderd worden</span></label>
            <div id="itl-m-phone-wrap" style="display:none">
                <label for="itl-m-phone">Uw telefoonnummer *</label>
                <input type="tel" id="itl-m-phone" placeholder="06 1234 5678" autocomplete="tel" maxlength="30">
            </div>
            <div class="itl-err" id="itl-m-err"></div>
            <button type="submit" class="itl-btn-primary" id="itl-m-submit">
                <svg width="17" height="17" viewBox="0 0 24 24" fill="currentColor"><path d="M2.01 21L23 12 2.01 3 2 10l15 2-15 2z"/></svg>
                Versturen
            </button>
        </form>
        <div class="itl-success" id="itl-m-success">
            <div class="itl-okic"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg></div>
            <h4>Bedankt! Uw bericht is verstuurd.</h4>
            <p>We reageren binnen 1 werkdag. Wilt u ook direct een samenvatting via WhatsApp sturen? Dan pakken we het nog sneller op.</p>
            <button type="button" class="itl-btn-primary itl-btn-wa" id="itl-m-wa-sum">
                <svg width="17" height="17" viewBox="0 0 24 24" fill="currentColor"><path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z"/></svg>
                Samenvatting via WhatsApp sturen
            </button>
            <button type="button" class="itl-btn-ghost" id="itl-m-close2">Sluiten</button>
        </div>
    </div>
</div>

<script id="itl-topbar-js">
(function(){
'use strict';
var WA = '31850835610';
var backdrop = document.getElementById('itl-tb-backdrop');
var panels = { call: document.getElementById('itl-panel-call'), wa: document.getElementById('itl-panel-wa'), mail: document.getElementById('itl-panel-mail') };
var active = null;

function open(key){
    closeAll();
    var p = panels[key]; if(!p) return;
    active = key; p.classList.add('show');
    if (backdrop) backdrop.classList.add('show');
    var f = p.querySelector('input:not([name=website]), textarea');
    if (f) setTimeout(function(){ try{ f.focus(); }catch(e){} }, 250);
}
function closeAll(){
    for (var k in panels) if (panels[k]) panels[k].classList.remove('show');
    active = null;
    if (backdrop) backdrop.classList.remove('show');
}
document.querySelectorAll('[data-itl-panel]').forEach(function(btn){
    btn.addEventListener('click', function(e){ e.stopPropagation(); open(btn.getAttribute('data-itl-panel')); });
});
document.querySelectorAll('.itl-panel-x').forEach(function(x){ x.addEventListener('click', closeAll); });
if (backdrop) backdrop.addEventListener('click', closeAll);
document.addEventListener('keydown', function(e){ if (e.key === 'Escape' && active) closeAll(); });
document.addEventListener('click', function(e){
    if (!active) return;
    var p = panels[active];
    if (p && !p.contains(e.target)) closeAll();
});

/* ── Bel-panel: terugbelverzoek → mail-panel met voorgevinkte terugbel-optie ── */
var callToMail = document.getElementById('itl-call-to-mail');
if (callToMail) callToMail.addEventListener('click', function(){
    open('mail');
    var cb = document.getElementById('itl-m-cb');
    if (cb && !cb.checked) { cb.checked = true; cb.dispatchEvent(new Event('change')); }
});

/* ── WhatsApp-panel: 2 opties ── */
var waDirect = document.getElementById('itl-wa-direct');
if (waDirect) waDirect.addEventListener('click', function(){
    window.open('https://wa.me/' + WA, '_blank', 'noopener');
    closeAll();
});
var waMsg = document.getElementById('itl-wa-msg');
var waSend = document.getElementById('itl-wa-send');
if (waSend) waSend.addEventListener('click', function(){
    var m = (waMsg && waMsg.value.trim()) || 'Hallo Layg, ik heb een vraag.';
    window.open('https://wa.me/' + WA + '?text=' + encodeURIComponent(m), '_blank', 'noopener');
    if (waMsg) waMsg.value = '';
    closeAll();
});

/* ── Mail-panel ── */
var mForm = document.getElementById('itl-mail-form');
var mFiles = [];
var mInput = document.getElementById('itl-m-files');
var mUpl = document.getElementById('itl-m-upl');
var mList = document.getElementById('itl-m-flist');
var mErr = document.getElementById('itl-m-err');
var MAXF = 5, MAXB = 10 * 1024 * 1024;

function fmtSize(b){ return b > 1048576 ? (b/1048576).toFixed(1)+' MB' : Math.max(1, Math.round(b/1024))+' kB'; }
function renderFiles(){
    mList.innerHTML = '';
    mFiles.forEach(function(f, i){
        var li = document.createElement('li');
        var nm = document.createElement('span'); nm.textContent = f.name;
        var sz = document.createElement('span'); sz.className = 'itl-fs'; sz.textContent = fmtSize(f.size);
        var rm = document.createElement('button'); rm.type = 'button'; rm.textContent = '×'; rm.setAttribute('aria-label','Verwijder');
        rm.addEventListener('click', function(){ mFiles.splice(i,1); renderFiles(); });
        li.appendChild(nm); li.appendChild(sz); li.appendChild(rm);
        mList.appendChild(li);
    });
}
function showErr(t){ mErr.textContent = t; mErr.style.display = t ? 'block' : 'none'; }
if (mUpl && mInput) {
    mUpl.addEventListener('click', function(){ mInput.click(); });
    mUpl.addEventListener('keydown', function(e){ if (e.key==='Enter'||e.key===' ') { e.preventDefault(); mInput.click(); } });
    mInput.addEventListener('change', function(){
        showErr('');
        Array.prototype.forEach.call(mInput.files, function(f){
            if (mFiles.length >= MAXF) { showErr('Maximaal ' + MAXF + ' bestanden.'); return; }
            if (f.size > MAXB) { showErr('"' + f.name + '" is groter dan 10 MB.'); return; }
            mFiles.push(f);
        });
        mInput.value = '';
        renderFiles();
    });
}
var mCb = document.getElementById('itl-m-cb');
var mPhoneWrap = document.getElementById('itl-m-phone-wrap');
if (mCb) mCb.addEventListener('change', function(){ mPhoneWrap.style.display = mCb.checked ? 'block' : 'none'; });

var lastSummary = '';
if (mForm) mForm.addEventListener('submit', function(e){
    e.preventDefault();
    showErr('');
    var name  = document.getElementById('itl-m-name').value.trim();
    var email = document.getElementById('itl-m-email').value.trim();
    var msg   = document.getElementById('itl-m-msg').value.trim();
    var cb    = mCb.checked;
    var phone = document.getElementById('itl-m-phone').value.trim();
    if (!name || !email || !msg) { showErr('Vul uw naam, e-mailadres en omschrijving in.'); return; }
    if (!/^[^\s@]+@[^\s@]+\.[^\s@]{2,}$/.test(email)) { showErr('Controleer uw e-mailadres.'); return; }
    if (cb && !phone) { showErr('Vul uw telefoonnummer in (of vink "telefonisch benaderd" uit).'); return; }
    var btn = document.getElementById('itl-m-submit');
    btn.disabled = true; btn.textContent = 'Bezig met versturen…';
    var fd = new FormData();
    fd.append('website', mForm.querySelector('[name=website]').value);
    fd.append('name', name); fd.append('email', email); fd.append('message', msg);
    fd.append('callback', cb ? '1' : ''); fd.append('phone', phone);
    fd.append('page', location.href);
    mFiles.forEach(function(f){ fd.append('files[]', f, f.name); });
    fetch('/api/topbar-contact.php', { method: 'POST', body: fd })
        .then(function(r){ return r.json(); })
        .then(function(d){
            if (!d || !d.ok) throw new Error((d && d.error) || 'send');
            lastSummary = 'Samenvatting van mijn bericht via layg.nl:\n'
                + 'Naam: ' + name + '\nE-mail: ' + email
                + (cb ? '\nGraag telefonisch contact: ' + phone : '')
                + '\n\nBericht:\n' + msg
                + (mFiles.length ? '\n\n(' + mFiles.length + ' bijlage(n) per e-mail meegestuurd)' : '');
            mForm.style.display = 'none';
            document.getElementById('itl-m-success').style.display = 'block';
        })
        .catch(function(){ showErr('Versturen is niet gelukt. Probeer het opnieuw of mail direct naar info@layg.nl.'); })
        .finally(function(){ btn.disabled = false; btn.innerHTML = '<svg width="17" height="17" viewBox="0 0 24 24" fill="currentColor"><path d="M2.01 21L23 12 2.01 3 2 10l15 2-15 2z"/></svg> Versturen'; });
});
var waSum = document.getElementById('itl-m-wa-sum');
if (waSum) waSum.addEventListener('click', function(){
    window.open('https://wa.me/' + WA + '?text=' + encodeURIComponent(lastSummary || 'Ik heb zojuist een bericht gestuurd via layg.nl.'), '_blank', 'noopener');
});
var mClose2 = document.getElementById('itl-m-close2');
if (mClose2) mClose2.addEventListener('click', function(){
    closeAll();
    /* formulier resetten voor volgende keer */
    setTimeout(function(){
        mForm.reset(); mFiles = []; renderFiles();
        mPhoneWrap.style.display = 'none';
        mForm.style.display = 'block';
        document.getElementById('itl-m-success').style.display = 'none';
    }, 300);
});
})();
</script>
                        <nav class="navbar" id="navbar">
            <div class="navbar-left">
                <a href="https://layg.nl/" class="logo itlive-brand-logo" aria-label="LAYG – Digitaal Bureau">
                    <img src="https://layg.nl/assets/images/logo-layg.svg?v=1778228638" alt="" width="40" height="40" class="logo-icon-svg">
                    <span class="itlive-brand-wordmark on-dark">
                        <span class="wm-main">LAYG</span>
                        <span class="wm-sub">DIGITAAL BUREAU</span>
                    </span>
                </a>
                <div class="logo-icons">
                    <a href="tel:0850835610" title="Bel 085 083 5610" aria-label="Telefoon"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-phone"></use></svg></a>
                    <a href="mailto:info@layg.nl" title="info@layg.nl" aria-label="Email"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-envelope"></use></svg></a>
                    <a href="https://wa.me/31850835610" target="_blank" rel="noopener" title="WhatsApp" aria-label="WhatsApp"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#b-whatsapp"></use></svg></a>
                </div>
            </div>
            <div class="navbar-center">
                                <ul class="nav-links itl-nav-v2">
                    <li><a href="https://layg.nl/" class="">Startpagina</a></li>
                     <li><a href="/gevonden-door-ai" class="nav-live-ai">Gratis AI-scan</a></li>
                     <li><a href="/aanvraag/" class="">Aanvraag</a></li>
                     <li><a href="/demo/" class="">Demo</a></li>

                    <li class="itl-nav-group" data-itl-nav-group>
                        <button type="button" class="itl-nav-btn active" aria-expanded="false" aria-haspopup="true" onclick="itlToggleNavGroup(this)">Diensten <svg class="itl-fa itl-caret" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-chevron-down"></use></svg></button>
                        <div class="itl-nav-submenu">
                            <a href="https://layg.nl/diensten/"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-list-ul"></use></svg><span><strong>Diensten</strong><small>Wat we doen</small></span></a>
                            <a href="https://layg.nl/marketing-beheer"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-chart-line"></use></svg><span><strong>Marketing beheer</strong><small>SEO · Ads · Content</small></span></a>
                            <a href="https://layg.nl/assistent"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-robot"></use></svg><span><strong>AI Assistent</strong><small>Chatbot &amp; AI</small></span></a>
                            <a href="https://layg.nl/chatbots/"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-comments"></use></svg><span><strong>AI Chatbots</strong><small>Demo · Prijzen · ROI</small></span></a>
                                                        <!-- Lay-G: recruitment chatbot prijspagina — alleen zichtbaar op layg.* domeinen -->
                            <a href="https://layg.nl/chatbot-prijzen-layg"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-users"></use></svg><span><strong>Recruitment Chatbot</strong><small>Prijzen voor bureaus</small></span></a>
                                                        <a href="https://layg.nl/spraakassistent"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-microphone"></use></svg><span><strong>Spraakassistent</strong><small>AI voice &amp; telefonie</small></span></a>
                            <a href="https://layg.nl/callcenteropdrachten/"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-headset"></use></svg><span><strong>Callcenter-opdrachten</strong><small>Live · AI · tickets · WhatsApp</small></span></a>
                            <a href="https://layg.nl/callcenteropdrachten/fr/"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-headset"></use></svg><span><strong>Callcenter FR</strong><small>Centre d'appels francophone</small></span></a>
                            <a href="https://layg.nl/callcenteropdrachten/de/"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-headset"></use></svg><span><strong>Callcenter DE</strong><small>Deutschsprachiges Callcenter</small></span></a>
                            <a href="https://layg.nl/virtuele-medewerker/"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-headset"></use></svg><span><strong>Virtuele medewerker</strong><small>AI · vanaf €8,50/uur</small></span></a>
                            <a href="https://layg.nl/diensten/ai-telefonie/"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-phone"></use></svg><span><strong>AI-Telefonie</strong><small>Pakketten vanaf €99/mnd</small></span></a>
                            <a href="https://layg.nl/diensten/ai-receptionist/"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-microphone"></use></svg><span><strong>AI Receptionist</strong><small>Sophie 24/7</small></span></a>
                            <a href="https://layg.nl/diensten/callcenter-oplossingen/"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-comments"></use></svg><span><strong>Callcenter-oplossingen</strong><small>Techniek + koppelingen</small></span></a>
                            <a href="https://layg.nl/gratis-tools/"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-toolbox"></use></svg><span><strong>Gratis Tools</strong><small>Logo · QR · SEO scan</small></span></a>
                        </div>
                    </li>

                                        <li class="itl-nav-group itl-nav-mega" data-itl-nav-group>
                        <button type="button" class="itl-nav-btn" aria-expanded="false" aria-haspopup="true" onclick="itlToggleNavGroup(this)">Sectoren <svg class="itl-fa itl-caret" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-chevron-down"></use></svg></button>
                        <div class="itl-nav-submenu itl-nav-mega-cats">
                                                    <div class="itl-mega-col">
                            <a class="itl-mega-col-h" href="/diensten/energie/" style="text-decoration:none;color:inherit"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-bolt"></use></svg> Energie & verduurzaming</a>
                                                            <a href="/diensten/zonnepanelen/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-solar-panel"></use></svg> Zonnepanelen</a>
                                                            <a href="/diensten/warmtepompen/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-fire"></use></svg> Warmtepompen</a>
                                                            <a href="/diensten/isolatie/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-cubes"></use></svg> Isolatie</a>
                                                            <a href="/diensten/thuisbatterij/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-battery-three-quarters"></use></svg> Thuisbatterij</a>
                                                            <a href="/diensten/laadpaal/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-charging-station"></use></svg> Laadpaal</a>
                                                            <a href="/diensten/airconditioning/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-snowflake"></use></svg> Airconditioning</a>
                                                            <a href="/diensten/cv-onderhoud/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-temperature-half"></use></svg> CV-onderhoud</a>
                                                      </div>
                                                    <div class="itl-mega-col">
                            <a class="itl-mega-col-h" href="/diensten/bouw/" style="text-decoration:none;color:inherit"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-hammer"></use></svg> Bouw & vakman</a>
                                                            <a href="/diensten/dakwerken/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-house"></use></svg> Dakwerken</a>
                                                            <a href="/diensten/loodgieter/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-wrench"></use></svg> Loodgieter</a>
                                                            <a href="/diensten/schilderwerk/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-paint-roller"></use></svg> Schilderwerk</a>
                                                            <a href="/diensten/elektricien/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-bolt"></use></svg> Elektricien</a>
                                                            <a href="/diensten/bouw/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-hammer"></use></svg> Bouw</a>
                                                            <a href="/diensten/sanitair/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-bath"></use></svg> Sanitair</a>
                                                            <a href="/diensten/slotenmaker/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-key"></use></svg> Slotenmaker</a>
                                                      </div>
                                                    <div class="itl-mega-col">
                            <a class="itl-mega-col-h" href="/diensten/dienstverlening/" style="text-decoration:none;color:inherit"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-truck"></use></svg> Dienstverlening</a>
                                                            <a href="/diensten/verhuizingen/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-truck"></use></svg> Verhuizingen</a>
                                                            <a href="/diensten/schoonmaak/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-broom"></use></svg> Schoonmaak</a>
                                                            <a href="/diensten/beveiliging/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-shield-halved"></use></svg> Beveiliging</a>
                                                            <a href="/diensten/rijschool/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-car"></use></svg> Rijschool</a>
                                                            <a href="/diensten/zorg/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-heart-pulse"></use></svg> Zorg</a>
                                                      </div>
                                                    <div class="itl-mega-col">
                            <a class="itl-mega-col-h" href="/diensten/zakelijk/" style="text-decoration:none;color:inherit"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-briefcase"></use></svg> Zakelijk & finance</a>
                                                            <a href="/diensten/verzekeringen/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-umbrella"></use></svg> Verzekeringen</a>
                                                            <a href="/diensten/hypotheken/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-house-chimney"></use></svg> Hypotheken</a>
                                                            <a href="/diensten/juridisch/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-scale-balanced"></use></svg> Juridisch</a>
                                                            <a href="/diensten/horeca/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-utensils"></use></svg> Horeca</a>
                                                            <a href="/diensten/fitness/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-dumbbell"></use></svg> Fitness</a>
                                                            <a href="/diensten/autogarage/" class="itl-mega-link"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-car-side"></use></svg> Autogarage</a>
                                                      </div>
                                                    <div class="itl-mega-hub-links" style="grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px;padding:12px 8px 4px;border-top:1px solid rgba(255,255,255,.08);margin-top:8px">
                            <a href="/diensten/sectoren/" style="font-weight:700;color:#7dd3fc;text-decoration:none;font-size:.88rem">25 sectoren hub →</a>
                            <a href="/diensten/sectoren/fr/" style="color:#94a3b8;text-decoration:none;font-size:.82rem">FR</a>
                            <a href="/diensten/sectoren/de/" style="color:#94a3b8;text-decoration:none;font-size:.82rem">DE</a>
                            <a href="/diensten/aeo/" style="color:#c4b5fd;text-decoration:none;font-size:.82rem">AEO</a>
                            <a href="/aeo-scan/" style="color:#c4b5fd;text-decoration:none;font-size:.82rem">AEO-scan</a>
                          </div>
                        </div>
                    </li>
                    
                    <li class="itl-nav-group" data-itl-nav-group>
                        <button type="button" class="itl-nav-btn " aria-expanded="false" aria-haspopup="true" onclick="itlToggleNavGroup(this)">Pakketten <svg class="itl-fa itl-caret" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-chevron-down"></use></svg></button>
                        <div class="itl-nav-submenu">
                            <a href="https://layg.nl/pakketten"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-boxes-stacked"></use></svg><span><strong>Alle pakketten</strong><small>Setup · Recurring · Bundels</small></span></a>
                            <a href="https://layg.nl/portaal-types"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-puzzle-piece"></use></svg><span><strong>Portaal-types</strong><small>7 sectoren op maat</small></span></a>
                            <a href="https://layg.nl/actie"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-fire"></use></svg><span><strong>Acties</strong><small>1+1 setup · €279</small></span></a>
                            <a href="https://layg.nl/aanvragen"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-paper-plane"></use></svg><span><strong>Direct aanvragen</strong><small>3-stappen flow</small></span></a>
                        </div>
                    </li>

                    <li class="itl-nav-projecten-top"><a href="https://layg.nl/projecten/" class="">Projecten</a></li>

                    <li class="itl-nav-group" data-itl-nav-group>
                        <button type="button" class="itl-nav-btn " aria-expanded="false" aria-haspopup="true" onclick="itlToggleNavGroup(this)">Over ons <svg class="itl-fa itl-caret" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-chevron-down"></use></svg></button>
                        <div class="itl-nav-submenu">
                            <a href="https://layg.nl/over-ons/"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-building"></use></svg><span><strong>Over ons</strong><small>Wie we zijn</small></span></a>
                            <a href="https://layg.nl/projecten/"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-images"></use></svg><span><strong>Projecten</strong><small>Recente klanten</small></span></a>
                            <a href="https://jobs.layg.nl/"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-briefcase"></use></svg><span><strong>Vacatures</strong><small>Werken bij ons</small></span></a>
                            <a href="https://jobs.layg.nl/opdrachten/"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-list-check"></use></svg><span><strong>Opdrachten</strong><small>Plaats een project</small></span></a>
                            <a href="https://layg.nl/contact/"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-envelope"></use></svg><span><strong>Contact</strong><small>Bel · Mail · WhatsApp</small></span></a>
                        </div>
                    </li>
                </ul>
                                                <style>
                /* 2026-05-05 Layg nav v2 — dropdowns met sub-toggles, full-width, tablet-friendly */
                .nav-links.itl-nav-v2 { display:flex; align-items:center; gap:.15rem; list-style:none; padding:0; margin:0; flex-wrap:nowrap; }
                .nav-links.itl-nav-v2 > li { position: relative; }
                .nav-links.itl-nav-v2 > li > a, .itl-nav-btn {
                    display: inline-flex; align-items:center; gap:.35rem;
                    padding: .55rem .85rem;
                    border-radius: 8px; font-size: .9rem; font-weight: 600;
                    color: inherit; text-decoration:none;
                    background: none; border: none; cursor: pointer; font-family: inherit;
                    white-space: nowrap; transition: background .15s, color .15s;
                }
                .nav-links.itl-nav-v2 > li > a:hover, .itl-nav-btn:hover, .itl-nav-group.open > .itl-nav-btn, .nav-links.itl-nav-v2 > li > a.active, .itl-nav-btn.active {
                    background: rgba(26,115,232,.10); color: #1558b0;  /* 2026-08-10: was #1a73e8 op zijn eigen 10%-tint (#e7f0fd) = 3,92:1. Nu 5,98:1. Alleen de nav-knop; het icoon verderop is een 22px-pictogram, andere norm. */
                }
                .itl-caret { font-size:.6rem; transition: transform .2s; }
                .itl-nav-group.open .itl-caret { transform: rotate(180deg); }

                .itl-nav-submenu {
                    position: absolute; top: calc(100% + 4px); left: 0;
                    min-width: 280px; background: #fff;
                    border: 1px solid rgba(15,23,42,.08); border-radius: 12px;
                    box-shadow: 0 12px 32px rgba(0,0,0,.10);
                    padding: .4rem;
                    display: flex; flex-direction: column; gap: 1px;
                    opacity:0; visibility:hidden; transform: translateY(-6px);
                    transition: opacity .15s, transform .15s, visibility .15s;
                    z-index: 250;
                }
                .itl-nav-group.open .itl-nav-submenu, .itl-nav-group:hover .itl-nav-submenu {
                    opacity:1; visibility:visible; transform: translateY(0);
                }
                .itl-nav-submenu a {
                    display:flex; align-items:center; gap:.7rem;
                    padding: .55rem .7rem; border-radius: 8px;
                    text-decoration: none; color: #0f172a;
                    transition: background .15s;
                }
                .itl-nav-submenu a:hover { background: #f8fafc; color: #1a73e8; }
                .itl-nav-submenu a > i {
                    width: 28px; height: 28px; border-radius: 6px;
                    background: rgba(26,115,232,.10);
                    color: #1a73e8;
                    display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:.85rem;
                }
                .itl-nav-submenu a > span { display:flex; flex-direction:column; line-height:1.25; }
                .itl-nav-submenu a strong { font-size:.88rem; font-weight:700; }
                .itl-nav-submenu a small { font-size:.72rem; color:#64748b; margin-top:1px; }

                /* 2026-05-10: Sectoren mega-grid (5 kolommen) */
                .itl-nav-mega .itl-nav-submenu.itl-nav-mega-grid {
                    display: grid; grid-template-columns: repeat(5, minmax(150px, 1fr));
                    gap: 2px; min-width: 760px; max-width: 90vw; padding: .6rem;
                }
                .itl-nav-mega .itl-nav-submenu.itl-nav-mega-grid a { padding: .5rem .6rem; }
                .itl-nav-mega .itl-nav-submenu.itl-nav-mega-grid a strong { font-size:.78rem; }
                @media (max-width: 1100px) {
                    .itl-nav-mega .itl-nav-submenu.itl-nav-mega-grid { grid-template-columns: repeat(3, 1fr); min-width: 480px; }
                }
                @media (max-width: 720px) {
                    .itl-nav-mega .itl-nav-submenu.itl-nav-mega-grid { grid-template-columns: repeat(2, 1fr); min-width: 280px; }
                }
                /* 2026-05-10b: Sectoren mega met 4 categorieën-kolommen */
                .itl-nav-mega .itl-nav-submenu.itl-nav-mega-cats {
                    display: grid; grid-template-columns: repeat(4, minmax(170px, 1fr));
                    gap: 0; min-width: 760px; max-width: 92vw; padding: .9rem;
                    background: #fff;
                }
                .itl-nav-mega .itl-mega-col { padding: .5rem .8rem .5rem 0; border-right: 1px solid #f1f5f9; }
                .itl-nav-mega .itl-mega-col:last-child { border-right: 0; }
                .itl-nav-mega .itl-mega-col-h {
                    font-size: .68rem; font-weight: 800; letter-spacing: .04em;
                    text-transform: uppercase; color: #64748b; margin-bottom: .35rem; padding: 0 .5rem;
                }
                .itl-nav-mega .itl-mega-link {
                    display: flex; align-items: center; gap: .55rem;
                    padding: .42rem .55rem; border-radius: 7px;
                    text-decoration: none; color: #0f172a; font-size: .82rem; font-weight: 600;
                    transition: background .15s, color .15s;
                }
                .itl-nav-mega .itl-mega-link:hover { background: #f8fafc; color: #1a73e8; }
                .itl-nav-mega .itl-mega-link i,
                .itl-nav-mega .itl-mega-link .itl-fa {
                    width: 22px; height: 22px; border-radius: 5px; padding: 5px; box-sizing: border-box;
                    background: rgba(26,115,232,.10); color: #1a73e8; fill: #1a73e8;
                    display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: .68rem;
                }
                @media (max-width: 1024px) {
                    .itl-nav-mega .itl-nav-submenu.itl-nav-mega-cats {
                        grid-template-columns: repeat(2, 1fr); min-width: 380px;
                    }
                    .itl-nav-mega .itl-mega-col { border-right: 0; border-bottom: 1px solid #f1f5f9; }
                }
                @media (max-width: 600px) {
                    .itl-nav-mega .itl-nav-submenu.itl-nav-mega-cats {
                        grid-template-columns: 1fr; min-width: 260px;
                    }
                }

                /* RTL */
                html[dir="rtl"] .itl-nav-submenu { left: auto; right: 0; }

                /* Tablet ≤ 1180px */
                @media (max-width: 1180px) {
                    .nav-links.itl-nav-v2 > li > a, .itl-nav-btn { padding: .5rem .65rem; font-size: .85rem; }
                }

                /* iPad landscape ≤ 1100px — ultra-compact nav items, hide Projecten top-level */
                @media (max-width: 1100px) {
                    .nav-links.itl-nav-v2 { gap: 0; }
                    .nav-links.itl-nav-v2 > li > a, .itl-nav-btn { padding: .4rem .4rem; font-size: .78rem; letter-spacing: 0; }
                    .itl-nav-projecten-top { display: none !important; }
                }

                /* Mobile ≤ 920px — central nav verbergen, sidebar pakt over */
                @media (max-width: 920px) {
                    .nav-links.itl-nav-v2 { display: none !important; }
                }
                </style>
            </div>
            <div class="navbar-right">
                <div class="search-wrap" role="search">
                    <span class="search-icon" aria-hidden="true"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-magnifying-glass"></use></svg></span>
                    <input type="search" class="search-input" id="nav-site-search" placeholder="Zoek over alle domeinen…" autocomplete="off" aria-label="Zoek op layg.nl en subdomeinen">
                    <div class="search-dropdown" id="nav-search-dropdown" role="listbox" aria-label="Zoekresultaten"></div>
                </div>
                                                                <a href="https://account.layg.nl/customer_portal/unlock.php" class="nav-btn nav-btn--ghost" title="Voer je 6-cijferige code in" style="display:inline-flex;align-items:center;gap:0.35rem;">
                    <svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-key"></use></svg> Code
                </a>
                <span class="itlive-auth-guest" style="display:inline-flex;align-items:center;gap:0.4rem;flex-wrap:wrap;">
                    <a href="https://layg.nl/aanmelden.php" class="nav-btn">Aanmelden</a>
                </span>
                                <div class="itlive-langswitch" id="itliveLangSwitch">
                  <button type="button" onclick="document.getElementById('itliveLangSwitch').classList.toggle('open')" aria-haspopup="true" aria-expanded="false" aria-label="Taal kiezen" title="Language">
                    <span class="lang-flag" aria-hidden="true"><svg width="18" height="18" style="display:inline-block;vertical-align:middle;border-radius:50%" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><mask id="SVGuywqVbel"><circle cx="256" cy="256" r="256" fill="#fff"/></mask><g mask="url(#SVGuywqVbel)"><path fill="#eee" d="m0 167l253.8-19.3L512 167v178l-254.9 32.3L0 345z"/><path fill="#a2001d" d="M0 0h512v167H0z"/><path fill="#0052b4" d="M0 345h512v167H0z"/></g></svg></span>
                    <span class="lang-short">NL</span>
                    <svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-chevron-down"></use></svg>
                  </button>
                  <div class="itlive-lang-menu" role="menu">
                                        <a href="/api/set-lang.php?lang=nl&back=%2Fdomein%2Fpostcode-zoek.php" role="menuitem" class="active">
                      <span class="lang-flag" aria-hidden="true"><svg width="18" height="18" style="display:inline-block;vertical-align:middle;border-radius:50%" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><mask id="SVGuywqVbel"><circle cx="256" cy="256" r="256" fill="#fff"/></mask><g mask="url(#SVGuywqVbel)"><path fill="#eee" d="m0 167l253.8-19.3L512 167v178l-254.9 32.3L0 345z"/><path fill="#a2001d" d="M0 0h512v167H0z"/><path fill="#0052b4" d="M0 345h512v167H0z"/></g></svg></span>
                      <span class="lang-name">Nederlands</span>
                    </a>
                                        <a href="/api/set-lang.php?lang=en&back=%2Fdomein%2Fpostcode-zoek.php" role="menuitem" class="">
                      <span class="lang-flag" aria-hidden="true"><svg width="18" height="18" style="display:inline-block;vertical-align:middle;border-radius:50%" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><mask id="SVGuywqVbel"><circle cx="256" cy="256" r="256" fill="#fff"/></mask><g mask="url(#SVGuywqVbel)"><path fill="#eee" d="m0 0l8 22l-8 23v23l32 54l-32 54v32l32 48l-32 48v32l32 54l-32 54v68l22-8l23 8h23l54-32l54 32h32l48-32l48 32h32l54-32l54 32h68l-8-22l8-23v-23l-32-54l32-54v-32l-32-48l32-48v-32l-32-54l32-54V0l-22 8l-23-8h-23l-54 32l-54-32h-32l-48 32l-48-32h-32l-54 32L68 0z"/><path fill="#0052b4" d="M336 0v108L444 0Zm176 68L404 176h108zM0 176h108L0 68ZM68 0l108 108V0Zm108 512V404L68 512ZM0 444l108-108H0Zm512-108H404l108 108Zm-68 176L336 404v108z"/><path fill="#d80027" d="M0 0v45l131 131h45zm208 0v208H0v96h208v208h96V304h208v-96H304V0zm259 0L336 131v45L512 0zM176 336L0 512h45l131-131zm160 0l176 176v-45L381 336z"/></g></svg></span>
                      <span class="lang-name">English</span>
                    </a>
                                        <a href="/api/set-lang.php?lang=de&back=%2Fdomein%2Fpostcode-zoek.php" role="menuitem" class="">
                      <span class="lang-flag" aria-hidden="true"><svg width="18" height="18" style="display:inline-block;vertical-align:middle;border-radius:50%" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><mask id="SVGuywqVbel"><circle cx="256" cy="256" r="256" fill="#fff"/></mask><g mask="url(#SVGuywqVbel)"><path fill="#ffda44" d="m0 345l256.7-25.5L512 345v167H0z"/><path fill="#d80027" d="m0 167l255-23l257 23v178H0z"/><path fill="#333" d="M0 0h512v167H0z"/></g></svg></span>
                      <span class="lang-name">Deutsch</span>
                    </a>
                                        <a href="/api/set-lang.php?lang=fr&back=%2Fdomein%2Fpostcode-zoek.php" role="menuitem" class="">
                      <span class="lang-flag" aria-hidden="true"><svg width="18" height="18" style="display:inline-block;vertical-align:middle;border-radius:50%" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><mask id="SVGuywqVbel"><circle cx="256" cy="256" r="256" fill="#fff"/></mask><g mask="url(#SVGuywqVbel)"><path fill="#eee" d="M167 0h178l25.9 252.3L345 512H167l-29.8-253.4z"/><path fill="#0052b4" d="M0 0h167v512H0z"/><path fill="#d80027" d="M345 0h167v512H345z"/></g></svg></span>
                      <span class="lang-name">Français</span>
                    </a>
                                        <a href="/api/set-lang.php?lang=ar&back=%2Fdomein%2Fpostcode-zoek.php" role="menuitem" class="">
                      <span class="lang-flag" aria-hidden="true"><svg width="18" height="18" style="display:inline-block;vertical-align:middle;border-radius:50%" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><mask id="SVGuywqVbel"><circle cx="256" cy="256" r="256" fill="#fff"/></mask><g mask="url(#SVGuywqVbel)"><path fill="#496e2d" d="M0 0h512v512H0z"/><g fill="#eee"><path d="M144.7 306c0 18.5 15 33.5 33.4 33.5h100.2a27.8 27.8 0 0 0 27.8 27.8h33.4a27.8 27.8 0 0 0 27.8-27.8V306zm225.4-161.3v78c0 12.2-10 22.2-22.3 22.2v33.4c30.7 0 55.7-25 55.7-55.7v-77.9H370zm-239.3 78c0 12.2-10 22.2-22.3 22.2v33.4c30.7 0 55.7-25 55.7-55.7v-77.9h-33.4z"/><path d="M320 144.7h33.4v78H320zm-50 44.5a5.6 5.6 0 0 1-11.2 0v-44.5h-33.4v44.5a5.6 5.6 0 0 1-11.1 0v-44.5h-33.4v44.5a39 39 0 0 0 39 39a38.7 38.7 0 0 0 22.2-7a38.7 38.7 0 0 0 22.2 7c1.7 0 3.4-.1 5-.3a22.3 22.3 0 0 1-21.6 17v33.4c30.6 0 55.6-25 55.6-55.7v-77.9H270z"/><path d="M180.9 244.9h50v33.4h-50z"/></g></g></svg></span>
                      <span class="lang-name">العربية</span>
                    </a>
                                        <a href="/api/set-lang.php?lang=ar_ma&back=%2Fdomein%2Fpostcode-zoek.php" role="menuitem" class="">
                      <span class="lang-flag" aria-hidden="true"><svg width="18" height="18" style="display:inline-block;vertical-align:middle;border-radius:50%" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><mask id="SVGuywqVbel"><circle cx="256" cy="256" r="256" fill="#fff"/></mask><g mask="url(#SVGuywqVbel)"><path fill="#d80027" d="M0 0h512v512H0z"/><path fill="#496e2d" d="M407.3 210H291.7L256 100.3L220.3 210H104.7l93.5 68l-35.7 109.8L256 320l93.5 68l-35.7-110zm-183 59.5l12.2-37.1h39l12.1 37.1l-31.6 23l-31.6-23zm44-59.4h-24.6l12.3-37.9zm38.3 45.7l-7.7-23.4h39.9zM213 232.4l-7.7 23.4l-32.2-23.4zm-8.3 97.3l12.3-38l20 14.5zm70.1-23.4l20-14.5l12.3 37.9z"/></g></svg></span>
                      <span class="lang-name">الدارجة</span>
                    </a>
                                      </div>
                </div>
                <style>
                /* Layg language switcher v2 */
                .itlive-langswitch{position:relative;display:inline-block}
                .itlive-langswitch > button{
                  display:inline-flex;align-items:center;gap:.4rem;
                  padding:.45rem .7rem;border-radius:8px;
                  background:transparent;border:1px solid rgba(15,23,42,.12);
                  font-size:.82rem;font-weight:600;color:inherit;
                  cursor:pointer;font-family:inherit;
                  transition:background .15s,border-color .15s,color .15s;
                }
                .itlive-langswitch > button:hover, .itlive-langswitch.open > button{
                  background:rgba(26,115,232,.08); border-color:#1a73e8; color:#1a73e8;
                }
                .itlive-langswitch .lang-flag{font-size:1.05rem;line-height:1}
                .itlive-langswitch .lang-short{letter-spacing:.4px}
                .itlive-langswitch > button > i.fa-chevron-down{font-size:.6rem;transition:transform .2s}
                .itlive-langswitch.open > button > i.fa-chevron-down{transform:rotate(180deg)}
                .itlive-lang-menu{
                  position:absolute;top:calc(100% + 6px);right:0;left:auto;
                  min-width:180px;
                  background:#fff;border:1px solid #e2e8f0;border-radius:10px;
                  box-shadow:0 10px 28px rgba(0,0,0,.12);
                  padding:.3rem;display:flex;flex-direction:column;gap:1px;
                  opacity:0;visibility:hidden;transform:translateY(-6px);
                  transition:opacity .15s, transform .15s, visibility .15s;
                  z-index:300;
                }
                .itlive-langswitch.open .itlive-lang-menu{opacity:1;visibility:visible;transform:translateY(0)}
                .itlive-lang-menu a{
                  display:flex;align-items:center;gap:.55rem;
                  padding:.5rem .65rem;border-radius:6px;
                  text-decoration:none;color:#0f172a;font-size:.86rem;font-weight:500;
                  transition:background .12s, color .12s;
                }
                .itlive-lang-menu a:hover{background:#f8fafc; color:#1a73e8}
                .itlive-lang-menu a.active{background:rgba(26,115,232,.10); color:#1a73e8; font-weight:600}
                .itlive-lang-menu a.active::after{content:"✓"; margin-left:auto; color:#1a73e8; font-weight:700}
                .itlive-lang-menu .lang-flag{font-size:1.1rem;line-height:1}
                .itlive-lang-menu .lang-name{flex:1}
                html[dir="rtl"] .itlive-lang-menu{right:auto;left:0}
                html[dir="rtl"] .itlive-lang-menu a.active::after{margin-left:0;margin-right:auto}
                @media(max-width:640px){html,body{overflow-x:hidden!important}.contact-bar,.contact-bar-inner,.nav-sidebar-contact{white-space:normal!important;flex-wrap:wrap!important}.contact-bar-inner>*,.contact-bar>*{min-width:0!important;max-width:100%}}</style>
                
                <span class="itlive-auth-user navbar-auth-cluster" hidden>
                    <div class="itl-user-menu" id="itlUserMenu">
                        <button class="itl-user-trigger" type="button" aria-label="Accountmenu" aria-haspopup="true" onclick="document.getElementById('itlUserMenu').classList.toggle('open')"><!-- KNOPNAAM-20260830: naam kwam pas via JS na inloggen, dus uitgelogd las een schermlezer alleen 'knop' -->
                            <svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-circle-user"></use></svg>
                            <span class="itlive-auth-name"></span>
                            <svg class="itl-fa" aria-hidden="true" style="font-size:.6rem;transition:transform .2s"><use href="/assets/fa-sprite.svg#s-chevron-down"></use></svg>
                        </button>
                        <div class="itl-user-panel">
                            <a href="https://account.layg.nl/customer_portal/ecosystem-dashboard-enhanced.php" class="itlive-auth-dashboard">
                                <svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-table-cells-large"></use></svg> Mijn portaal
                            </a>
                            <a href="https://account.layg.nl/customer_portal/login.php?action=logout" class="itlive-auth-logout itl-logout-link">
                                <svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-right-from-bracket"></use></svg> Uitloggen
                            </a>
                        </div>
                    </div>
                </span>
                                                <button type="button" class="menu-toggle" id="nav-menu-toggle" aria-label="Menu openen" aria-expanded="false" aria-controls="nav-sidebar-overlay"><img src="https://layg.nl/assets/images/logo-layg.svg?v=1778228638" alt="" width="22" height="22" class="menu-toggle-logo"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-bars"></use></svg></button>
            </div>
        </nav>
        <div class="contact-bar" role="complementary" aria-label="Contactgegevens">
            <div class="contact-bar-inner">
                <a href="tel:0850835610"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-phone"></use></svg> 085 083 5610</a>
                <span class="sep">|</span>
                <a href="mailto:info@layg.nl"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-envelope"></use></svg> info@layg.nl</a>
                <span class="sep">|</span>
                <a href="https://wa.me/31850835610" target="_blank" rel="noopener noreferrer"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#b-whatsapp"></use></svg> WhatsApp</a>
            </div>
        </div>        <div class="nav-sidebar-overlay" id="nav-sidebar-overlay" aria-hidden="true">
            <div class="nav-sidebar" role="dialog" aria-label="Navigatiemenu">
                <div class="nav-sidebar-header">
                    <div class="nav-sidebar-brand">
                        <img src="https://layg.nl/assets/images/logo-layg.svg?v=1778228638" alt="LAYG" width="36" height="36" class="nav-sidebar-logo">
                        <div class="nav-sidebar-brand-txt">
                            <span class="nav-sidebar-brand-name">LAYG</span>
                            <span class="nav-sidebar-brand-sub">Menu</span>
                            <div class="nav-sidebar-welcome itlive-sidebar-welcome" hidden style="margin-top:0.35rem;font-size:0.84rem;font-weight:600;">
                                <svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-circle-user"></use></svg> <span class="itlive-auth-name"></span>
                            </div>
                        </div>
                    </div>
                    <button type="button" class="sidebar-close" id="nav-sidebar-close" aria-label="Menu sluiten"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-xmark"></use></svg></button>
                </div>
                <div class="search-wrap nav-sidebar-search" role="search">
                    <span class="search-icon"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-magnifying-glass"></use></svg></span>
                    <input type="search" class="search-input" id="sidebar-site-search" placeholder="Zoek over alle domeinen…" autocomplete="off" aria-label="Zoek op layg.nl en subdomeinen">
                    <div class="search-dropdown" id="sidebar-search-dropdown" role="listbox"></div>
                </div>
                                <ul class="nav-sidebar-menu">
                    <li><a href="https://layg.nl/" class="">Startpagina</a></li>
                     <li><a href="/gevonden-door-ai" class="nav-live-ai">Gratis AI-scan</a></li>
                     <li><a href="/aanvraag/" class="">Aanvraag</a></li>
                     <li><a href="/demo/" class="">Demo</a></li>
                    <li class="itlive-sidebar-auth-guest"><a href="https://layg.nl/aanmelden.php" class="">Aanmelden</a></li>
                    <li class="itlive-sidebar-auth-user" hidden><a href="https://account.layg.nl/customer_portal/ecosystem-dashboard-enhanced.php" class="itlive-auth-dashboard-nav">Mijn portaal</a></li>
                    <li class="itlive-sidebar-auth-user" hidden><a href="https://account.layg.nl/customer_portal/login.php?action=logout" class="itlive-auth-logout-nav">Uitloggen</a></li>
                    <li class="nav-sidebar-group open">
                        <button type="button" class="nav-sidebar-toggle" onclick="this.parentElement.classList.toggle('open')">Diensten <span aria-hidden="true">▾</span></button>
                        <ul class="nav-sidebar-sub">
                            <li><a href="https://layg.nl/diensten/" class="active">Alle diensten &amp; prijzen</a></li>
                            <li class="nav-sidebar-label">Callcenter &amp; telefonie</li>
                            <li><a href="https://layg.nl/callcenteropdrachten/" class="">Callcenter-opdrachten</a></li>
                            <li><a href="https://layg.nl/callcenteropdrachten/fr/">Callcenter FR</a></li>
                            <li><a href="https://layg.nl/callcenteropdrachten/de/">Callcenter DE</a></li>
                            <li><a href="https://layg.nl/virtuele-medewerker/" class="">Virtuele medewerker</a></li>
                            <li><a href="https://layg.nl/diensten/ai-telefonie/">AI-Telefonie</a></li>
                            <li><a href="https://layg.nl/diensten/ai-receptionist/">AI Receptionist</a></li>
                            <li><a href="https://layg.nl/spraakassistent">Spraakassistent</a></li>
                            <li><a href="https://layg.nl/diensten/callcenter-oplossingen/">Callcenter-oplossingen</a></li>
                            <li class="nav-sidebar-label">AI &amp; marketing</li>
                            <li><a href="https://layg.nl/assistent">AI Assistent</a></li>
                            <li><a href="https://layg.nl/chatbots/">AI Chatbots</a></li>
                            <li><a href="https://layg.nl/marketing-beheer">Marketing beheer</a></li>
                            <li><a href="https://layg.nl/gratis-tools/">Gratis tools</a></li>
                        </ul>
                    </li>
                    <li class="nav-sidebar-group">
                        <button type="button" class="nav-sidebar-toggle" onclick="this.parentElement.classList.toggle('open')">Pakketten <span aria-hidden="true">▾</span></button>
                        <ul class="nav-sidebar-sub">
                            <li><a href="https://layg.nl/pakketten/">Alle pakketten</a></li>
                            <li><a href="https://layg.nl/portaal-types/">Portaal-types</a></li>
                            <li><a href="https://layg.nl/actie/">Acties &amp; combo-deals</a></li>
                            <li><a href="https://layg.nl/aanvragen/">Direct aanvragen</a></li>
                        </ul>
                    </li>
                    <li><a href="https://layg.nl/projecten/" class="">Projecten</a></li>
                    <li><a href="https://layg.nl/over-ons/" class="">Over ons</a></li>
                    <li><a href="https://layg.nl/contact/">Contact</a></li>
                                                </ul>
                <div class="nav-sidebar-chat">
                    <h4><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-comments"></use></svg> Live AI Chat</h4>
                    <p>Voor alle Layg & subdomeinen · Klantflows direct.</p>
                    <button type="button" class="btn-open-chat" id="sidebar-open-chat"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-comments"></use></svg> Open chat</button>
                </div>
                                <div class="nav-sidebar-contact">
                    <a href="tel:0850835610"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-phone"></use></svg> 085 083 5610</a>
                    <a href="mailto:info@layg.nl"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#s-envelope"></use></svg> info@layg.nl</a>
                    <a href="https://wa.me/31850835610" target="_blank" rel="noopener"><svg class="itl-fa" aria-hidden="true"><use href="/assets/fa-sprite.svg#b-whatsapp"></use></svg> WhatsApp</a>
                </div>
            </div>
        </div>
        <script>
        (function() {
            var overlay = document.getElementById('nav-sidebar-overlay');
            var toggle = document.getElementById('nav-menu-toggle');
            var closeBtn = document.getElementById('nav-sidebar-close');
            var openChat = document.getElementById('sidebar-open-chat');
            function openSidebar() {
                overlay.classList.add('is-open');
                overlay.setAttribute('aria-hidden', 'false');
                if (toggle) toggle.setAttribute('aria-expanded', 'true');
                document.body.style.overflow = 'hidden';
            }
            function closeSidebar() {
                overlay.classList.remove('is-open');
                overlay.setAttribute('aria-hidden', 'true');
                if (toggle) toggle.setAttribute('aria-expanded', 'false');
                document.body.style.overflow = '';
            }
            if (toggle) toggle.addEventListener('click', openSidebar);
            if (closeBtn) closeBtn.addEventListener('click', closeSidebar);
            overlay.addEventListener('click', function(e) { if (e.target === overlay) closeSidebar(); });
            if (openChat) openChat.addEventListener('click', function() {
                closeSidebar();
                if (typeof window.itliveOpenChat === 'function') window.itliveOpenChat();
                else {
                    var btn = document.querySelector('[data-itlive-chat-trigger], .itlive-chat-toggle, .ai-chat-widget-button, [id*="chat-widget"]');
                    if (btn) btn.click();
                }
            });
            document.addEventListener('keydown', function(e) { if (e.key === 'Escape') closeSidebar(); });
        })();
        </script>
        <script>
        (function() {
            var searchApi = '/api/site-search-live.php';
            function initSearch(input, dropdown) {
                if (!input || !dropdown) return;
                var debounce = null;
                function hideDropdown() {
                    dropdown.classList.remove('is-open');
                    dropdown.innerHTML = '';
                }
                function showResults(data) {
                    dropdown.innerHTML = '';
                    var q = (data.query || '').trim();
                    if (data.results && data.results.length > 0) {
                        data.results.forEach(function(r) {
                            var a = document.createElement('a');
                            a.href = r.url;
                            a.setAttribute('role', 'option');
                            a.innerHTML = r.label + (r.domain ? '<small>' + r.domain + '</small>' : '');
                            a.addEventListener('click', function() { hideDropdown(); });
                            dropdown.appendChild(a);
                        });
                    } else {
                        var noRes = document.createElement('div');
                        noRes.className = 'search-no-results';
                        noRes.innerHTML = '<strong>Geen resultaten gevonden</strong> voor &ldquo;' + (q ? document.createTextNode(q).textContent : '…') + '&rdquo;. Probeer:';
                        dropdown.appendChild(noRes);
                        if (data.suggestions && data.suggestions.length > 0) {
                            var sug = document.createElement('div');
                            sug.className = 'search-suggestions';
                            data.suggestions.forEach(function(s) {
                                var a = document.createElement('a');
                                a.href = s.url;
                                a.textContent = s.label;
                                a.addEventListener('click', function() { hideDropdown(); });
                                sug.appendChild(a);
                            });
                            dropdown.appendChild(sug);
                        }
                    }
                    dropdown.classList.add('is-open');
                }
                input.addEventListener('input', function() {
                    clearTimeout(debounce);
                    var q = input.value.trim();
                    if (q.length === 0) { hideDropdown(); return; }
                    debounce = setTimeout(function() {
                        fetch(searchApi + '?q=' + encodeURIComponent(q)).then(function(res) { return res.json(); }).then(showResults).catch(function() {
                            dropdown.innerHTML = '<div class="search-no-results"><strong>Geen resultaten.</strong> Probeer: <div class="search-suggestions"><a href="https://layg.nl/tools/">Tools</a><a href="https://layg.nl/diensten/">Diensten</a><a href="https://layg.nl/contact/">Contact</a></div></div>';
                            dropdown.classList.add('is-open');
                        });
                    }, 300);
                });
                input.addEventListener('focus', function() {
                    if (input.value.trim() && dropdown.querySelector('a, .search-suggestions a')) dropdown.classList.add('is-open');
                });
                input.addEventListener('blur', function() { setTimeout(hideDropdown, 180); });
                input.addEventListener('keydown', function(e) {
                    if (e.key === 'Escape') { hideDropdown(); input.blur(); }
                });
            }
            initSearch(document.getElementById('nav-site-search'), document.getElementById('nav-search-dropdown'));
            initSearch(document.getElementById('sidebar-site-search'), document.getElementById('sidebar-search-dropdown'));
                    })();
        </script>
        <script>
(function () {
    var API = 'https://account.layg.nl/customer_portal/api/public-session-status.php';
    function resolveDisplayName(d) {
        var raw = (d.display_name || '').toString().trim();
        if (!raw || /^[\s\?\.\-_]+$/i.test(raw)) {
            raw = (d.company_name || '').toString().trim();
        }
        if (!raw && d.email) {
            var e = (d.email || '').toString().split('@')[0];
            raw = e ? e.trim() : '';
        }
        return raw || 'Klant';
    }
    function apply(d) {
        if (!d || !d.logged_in) return;
        var displayLabel = resolveDisplayName(d);
        document.querySelectorAll('.itlive-auth-guest').forEach(function (el) {
            el.setAttribute('hidden', '');
            el.style.display = 'none';
        });
        document.querySelectorAll('.itlive-auth-user').forEach(function (el) {
            el.removeAttribute('hidden');
            var inBar = el.closest && (el.closest('.navbar-right') || el.closest('.top-bar-right'));
            el.style.display = inBar ? 'flex' : '';
        });
        document.querySelectorAll('.itlive-auth-guest-nav').forEach(function (el) {
            el.setAttribute('hidden', '');
            el.style.display = 'none';
        });
        document.querySelectorAll('.itlive-auth-user-nav').forEach(function (el) {
            el.removeAttribute('hidden');
            el.style.display = '';
        });
        document.querySelectorAll('.itlive-sidebar-auth-guest').forEach(function (el) {
            el.setAttribute('hidden', '');
            el.style.display = 'none';
        });
        document.querySelectorAll('.itlive-sidebar-auth-user').forEach(function (el) {
            el.removeAttribute('hidden');
            el.style.display = '';
        });
        document.querySelectorAll('.itlive-sidebar-welcome').forEach(function (el) {
            el.removeAttribute('hidden');
            el.style.display = 'flex';
            el.style.alignItems = 'center';
            el.style.gap = '0.35rem';
        });
        document.querySelectorAll('.itlive-auth-name').forEach(function (el) { el.textContent = displayLabel; });
        document.querySelectorAll('.itlive-auth-dashboard').forEach(function (el) { el.href = d.dashboard_url || el.href; });
        document.querySelectorAll('.itlive-auth-workspace').forEach(function (el) { if (d.workspace_url) el.href = d.workspace_url; });
        document.querySelectorAll('.itlive-auth-drive').forEach(function (el) { if (d.drive_url) el.href = d.drive_url; });
        document.querySelectorAll('.itlive-auth-logout').forEach(function (el) { el.href = d.logout_url || el.href; });
        var compEl = document.getElementById('itlive-topbar-company');
        if (compEl) {
            if (d.company_name) {
                compEl.textContent = d.company_name;
                compEl.removeAttribute('hidden');
            } else {
                compEl.textContent = '';
                compEl.setAttribute('hidden', '');
            }
        }
        var metaEl = document.getElementById('itlive-topbar-account-meta');
        if (metaEl) {
            var parts = [];
            if (d.customer_id) parts.push('Klant-ID: ' + d.customer_id);
            if (d.email) parts.push(d.email);
            metaEl.textContent = parts.length ? parts.join(' · ') : 'Snel naar dashboard, webspace en drive hieronder.';
        }
        document.querySelectorAll('.itlive-auth-dashboard-nav').forEach(function (el) { el.href = d.dashboard_url || el.href; });
        document.querySelectorAll('.itlive-auth-logout-nav').forEach(function (el) { el.href = d.logout_url || el.href; });
    }
    fetch(API, { credentials: 'include', mode: 'cors' }).then(function (r) { return r.json(); }).then(apply).catch(function () {});
    // Sluit itl-user-menu bij klik buiten
    document.addEventListener('click', function(e) {
        var menu = document.getElementById('itlUserMenu');
        if (menu && !menu.contains(e.target)) menu.classList.remove('open');
    });
})();
</script>
        <script>
        document.addEventListener('DOMContentLoaded', function() {
            document.querySelectorAll('a[href^="#"]').forEach(function(a) {
                a.addEventListener('click', function(e) {
                    var t = document.querySelector(this.getAttribute('href'));
                    if (t) { e.preventDefault(); t.scrollIntoView({ behavior: 'smooth', block: 'start' }); }
                });
            });
        });
        
        // Fix Font Awesome integrity errors by replacing problematic references
        (function() {
            // Replace any use.fontawesome.com links with cdnjs.cloudflare.com
            var fontAwesomeLinks = document.querySelectorAll('link[href*="use.fontawesome.com"]');
            fontAwesomeLinks.forEach(function(link) {
                var newLink = document.createElement('link');
                newLink.rel = 'stylesheet';
                newLink.href = '/font-awesome/6.4.0/css/all.min.css';
                newLink.crossOrigin = 'anonymous';
                link.parentNode.replaceChild(newLink, link);
            });
            
            // Remove integrity attributes from Font Awesome links to prevent SRI errors
            var allLinks = document.querySelectorAll('link[href*="font-awesome"]');
            allLinks.forEach(function(link) {
                // 2026-07-16: preload-links NIET aanraken — crossOrigin wijzigen na de fetch
                // maakt de preload onbruikbaar ("preload found but not used") + verspilt de fetch.
                if (link.rel === 'preload') return;
                link.removeAttribute('integrity');
                link.removeAttribute('crossorigin');
                link.crossOrigin = 'anonymous';
            });
        })();
        </script>
        <script>
        // 2026-05-05 Layg nav v2 — dropdown toggles
        function itlToggleNavGroup(btn) {
          var grp = btn.closest('[data-itl-nav-group]');
          if (!grp) return;
          // Close other groups (single-open)
          document.querySelectorAll('.itl-nav-group.open').forEach(function(g){ if (g !== grp) g.classList.remove('open'); });
          var isOpen = grp.classList.toggle('open');
          btn.setAttribute('aria-expanded', isOpen ? 'true' : 'false');
        }
        document.addEventListener('click', function(e){
          if (e.target.closest('[data-itl-nav-group]')) return;
          document.querySelectorAll('.itl-nav-group.open').forEach(function(g){ g.classList.remove('open'); });
        });
        // Keyboard: ESC sluit dropdowns
        document.addEventListener('keydown', function(e){
          if (e.key === 'Escape') {
            document.querySelectorAll('.itl-nav-group.open').forEach(function(g){ g.classList.remove('open'); });
          }
        });
        </script>
    <style id="itl-nav-fix-20260723">html,body{overflow-x:hidden}#navbar{max-width:100vw}@media(min-width:1200px){#navbar .navbar-center{display:flex!important}#navbar .menu-toggle{display:none!important}}@media(max-width:1699.98px){#navbar .logo-icons{display:none!important}}@media(max-width:1559.98px){#navbar .search-wrap{display:none!important}}@media(max-width:1199.98px){#navbar{display:flex!important;align-items:center!important;justify-content:space-between!important;flex-wrap:nowrap!important;gap:8px!important;grid-template-columns:none!important}#navbar .navbar-left{flex:0 1 auto!important;min-width:0!important;overflow:hidden!important}#navbar .navbar-center{display:none!important}#navbar .navbar-right{display:flex!important;flex:0 0 auto!important;margin-left:auto!important;min-width:0;align-items:center;gap:.5rem}#navbar .navbar-right .search-wrap{display:none!important}#navbar .menu-toggle{display:inline-flex!important;position:static!important;flex:0 0 auto!important;visibility:visible!important;opacity:1!important;order:99}body .contact-bar.contact-bar{flex-wrap:wrap!important;white-space:normal!important;max-width:100vw!important}}@media(max-width:680px){#navbar .navbar-right>*:not(.menu-toggle){display:none!important}#navbar .menu-toggle{display:inline-flex!important}#navbar .itlive-brand-wordmark .wm-sub{display:none!important}body .contact-bar.contact-bar{display:none!important}}</style>
<style>
/* Layg Universal Page Styles */
:root {
    --navy: #020917;
    --gold: #f2c14f;
    --gold2: #ffd97a;
    --gold-dim: rgba(242,193,79,0.13);
    --gold-border: rgba(242,193,79,0.3);
    --cyan: #00cfff;
    --cyan-dim: rgba(0,207,255,0.1);
    --white: #ffffff;
    --muted: #6B92B8;
}

body {
    background: linear-gradient(135deg, var(--navy) 0%, #0C1B38 50%, var(--navy) 100%);
    color: var(--white);
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    line-height: 1.6;
    margin: 0;
    padding: 2rem;
    min-height: 100vh;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem;
    background: rgba(4,12,32,0.8);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(242,193,79,0.3);
    border-radius: 16px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.3);
}

h1 {
    font-family: 'Montserrat', sans-serif;
    font-size: 2.5rem;
    font-weight: 900;
    color: var(--white);
    margin-bottom: 1rem;
    text-align: center;
}

h1 em {
    font-style: normal;
    background: linear-gradient(120deg, var(--gold) 0%, var(--gold2) 50%, #c8922a 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

h2 {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--white);
    margin: 2rem 0 1rem;
}

p {
    color: var(--muted);
    margin-bottom: 1.5rem;
    font-size: 1.1rem;
}

.btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 2rem;
    border-radius: 12px;
    text-decoration: none;
    font-weight: 600;
    font-family: 'Montserrat', sans-serif;
    transition: all 0.3s ease;
    margin: 0.5rem;
}

.btn-primary {
    background: linear-gradient(135deg, var(--gold), #c8922a);
    color: var(--white);
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 20px 40px rgba(242,193,79,0.3);
    color: var(--white);
}

.btn-secondary {
    background: transparent;
    color: var(--white);
    border: 2px solid rgba(0,207,255,0.5);
}

.btn-secondary:hover {
    border-color: var(--gold);
    color: var(--gold);
    transform: translateY(-2px);
}

.actions {
    text-align: center;
    margin: 2rem 0;
}

.demo-info {
    background: rgba(242,193,79,0.1);
    border: 1px solid rgba(242,193,79,0.3);
    border-radius: 12px;
    padding: 1.5rem;
    margin: 2rem 0;
}

.demo-info h3 {
    color: var(--gold);
    margin-bottom: 1rem;
}

.demo-info p {
    color: var(--white);
    margin-bottom: 1rem;
}

.back-link {
    text-align: center;
    margin-top: 3rem;
}

.back-link a {
    color: var(--cyan);
    text-decoration: none;
    font-weight: 600;
}

.back-link a:hover {
    color: var(--gold);
}

@media (max-width: 768px) {
    body {
        padding: 1rem;
    }
    
    .container {
        padding: 1rem;
    }
    
    h1 {
        font-size: 2rem;
    }
    
    h2 {
        font-size: 1.5rem;
    }
}
</style>

<div class="container">

{"ok":false,"error":"Parameter q verplicht.","suggestions":[]}