{"__meta":{"id":"01M5H59QKKEP92Y32W91J1B8PB","tabUuid":null,"batchId":null,"timestamp":"2026-10-22T06:38:11.573Z","utime":1792651091.5733520984649658203125,"method":"GET","url":"https://muralworksai.com/coming-soon","component":null,"requestType":"http","status":200,"redirectLocation":null,"serverTimingMs":11.5733460000000007994458428584039211273193359375,"visitId":null},"http":{"requestHeaders":{"x-https":"1","accept-encoding":"gzip","cookie":"[REDACTED]","accept":"*/*","user-agent":"Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/124.0.0.0 Safari/537.36","host":"muralworksai.com"},"responseHeaders":{"cache-control":"no-cache, private","date":"Thu, 22 Oct 2026 06:38:11 GMT","content-type":"text/html; charset=utf-8","vary":"X-Inertia","x-inertia-devtools-id":"01M5H59QKKEP92Y32W91J1B8PB","x-inertia-devtools-parent-out":"01M5H59QKKEP92Y32W91J1B8PB"},"requestBody":{"status":"empty"},"responseBody":{"status":"present","value":"<!DOCTYPE html>\n<html lang=\"en\">\n\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <meta name=\"google-site-verification\" content=\"R8j8bD3YQFulJkeKdIRUeoFL2DERm6g9RE--z_aXGJo\" />\n    <meta name=\"csrf-token\" content=\"uOMYXQZDtuOGSHMOwy04x6k3wrDehnT14DoO78WQ\">\n    <title>MuralWorks AI</title>\n    <!-- Import Google Fonts -->\n    <link href=\"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap\"\n        rel=\"stylesheet\">\n    <link rel=\"stylesheet\" href=\"/css/style.css\">\n\n    <!-- Lucide Icons -->\n    <script src=\"https://unpkg.com/lucide@latest\"></script>\n\n    <!-- Three.js (used in some pages) -->\n    <script src=\"https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js\"></script>\n\n    <!-- Lenis smooth scrolling -->\n    <script src=\"https://cdn.jsdelivr.net/gh/studio-freight/lenis@1.0.19/bundled/lenis.min.js\"></script>\n\n    <!-- Google Tag Manager -->\n    <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':\n    new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],\n    j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=\n    'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);\n    })(window,document,'script','dataLayer','GTM-KF7TR3WN');</script>\n   <!-- End Google Tag Manager -->\n\n\n\n    <style>\n        body {\n            margin: 0;\n            font-family: 'Inter', sans-serif;\n            background-color: #ffffff;\n            color: #0F0500;\n            min-height: 100vh;\n            display: flex;\n            flex-direction: column;\n        }\n\n        .nav-desktop {\n            display: flex;\n            align-items: center;\n            gap: 4px;\n        }\n\n        .hamburger-btn {\n            display: none;\n            width: 36px;\n            height: 36px;\n            align-items: center;\n            justify-content: center;\n            border-radius: 8px;\n            border: 1px solid #FFD6B0;\n            color: #E85D04;\n            background: transparent;\n            cursor: pointer;\n        }\n\n        @media (max-width: 768px) {\n            .nav-desktop {\n                display: none !important;\n            }\n\n            .hamburger-btn {\n                display: flex !important;\n            }\n        }\n\n        /* Nav item styles */\n        .nav-item {\n            font-size: 0.88rem;\n            font-weight: 600;\n            color: rgba(255, 255, 255, 0.95);\n            padding: 8px 16px;\n            border-radius: 10px;\n            background: transparent;\n            border: 1px solid transparent;\n            transition: all 0.18s ease;\n            text-decoration: none;\n            display: inline-flex;\n            align-items: center;\n            gap: 6px;\n            font-family: inherit;\n            cursor: pointer;\n        }\n\n        .nav-item:hover {\n            background: transparent;\n            color: #FF7A2F;\n        }\n\n        .nav-item.active {\n            font-weight: 700;\n            color: #FF7A2F;\n            background: transparent;\n            border-color: transparent;\n        }\n\n        /* Scrolled navbar adaptive colors */\n        #navbar.is-scrolled .nav-item,\n        #navbar.is-scrolled .mega-trigger-btn {\n            color: #522E1B !important;\n        }\n\n        #navbar.is-scrolled .nav-item:hover,\n        #navbar.is-scrolled .mega-trigger-btn:hover,\n        #navbar.is-scrolled .mega-wrapper.is-open .mega-trigger-btn {\n            background: transparent;\n            color: #E85D04 !important;\n        }\n\n        #navbar.is-scrolled .nav-item.active {\n            color: #E85D04 !important;\n            background: transparent;\n            border-color: transparent;\n        }\n\n        #navbar.is-scrolled #logo-ai-tag {\n            color: #6B3A1F !important;\n        }\n\n        /* Mobile menu */\n        #mobile-menu {\n            position: fixed;\n            top: 64px;\n            left: 0;\n            right: 0;\n            bottom: 0;\n            z-index: 999;\n            background: #ffffff;\n            padding: 20px 24px 40px;\n            box-shadow: 0 16px 40px rgba(232, 93, 4, 0.15);\n            display: none;\n            overflow-y: auto;\n        }\n\n        .mobile-nav-item {\n            display: flex;\n            align-items: center;\n            justify-content: space-between;\n            width: 100%;\n            text-align: left;\n            padding: 14px 0;\n            font-size: 1rem;\n            font-weight: 700;\n            color: #2D1200;\n            border-bottom: 1px solid #FFE8D4;\n            text-decoration: none;\n            background: transparent;\n            cursor: pointer;\n        }\n\n        .mobile-nav-item.active {\n            color: #E85D04;\n        }\n\n        .mobile-segment-grid {\n            display: grid;\n            grid-template-columns: 1fr;\n            gap: 8px;\n            padding: 12px 0 16px;\n        }\n\n        .mobile-segment-card {\n            display: flex;\n            align-items: center;\n            gap: 10px;\n            padding: 10px 14px;\n            border-radius: 10px;\n            background: #FFF8F3;\n            border: 1px solid #FFE8D4;\n            text-decoration: none;\n            color: #2D1200;\n            font-weight: 600;\n            font-size: 0.88rem;\n            transition: background 0.15s ease;\n        }\n\n        .mobile-segment-card:hover {\n            background: #FFEAD7;\n            color: #E85D04;\n        }\n\n        /* ─────────────────────────────────────────────────────────────\n           NICE.COM INSPIRED INTERACTIVE MEGA MENU\n           ───────────────────────────────────────────────────────────── */\n        .mega-wrapper {\n            position: relative;\n            display: inline-block;\n        }\n\n        .mega-trigger-btn {\n            font-size: 0.88rem;\n            font-weight: 600;\n            color: rgba(255, 255, 255, 0.95);\n            padding: 8px 16px;\n            border-radius: 10px;\n            background: transparent;\n            border: 1px solid transparent;\n            transition: all 0.18s ease;\n            cursor: pointer;\n            display: inline-flex;\n            align-items: center;\n            gap: 6px;\n            font-family: inherit;\n            text-decoration: none;\n        }\n\n        .mega-trigger-btn:hover,\n        .mega-wrapper.is-open .mega-trigger-btn,\n        .mega-wrapper:hover .mega-trigger-btn {\n            background: transparent;\n            color: #FF7A2F;\n        }\n\n        .mega-trigger-btn .mega-chevron {\n            transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);\n        }\n\n        .mega-wrapper.is-open .mega-chevron,\n        .mega-wrapper:hover .mega-chevron {\n            transform: rotate(180deg);\n        }\n\n        /* Backdrop dim */\n        .mega-backdrop-overlay {\n            position: fixed;\n            top: 64px;\n            left: 0;\n            right: 0;\n            bottom: 0;\n            background: rgba(15, 5, 0, 0.35);\n            backdrop-filter: blur(4px);\n            -webkit-backdrop-filter: blur(4px);\n            z-index: 990;\n            opacity: 0;\n            visibility: hidden;\n            transition: all 0.25s ease;\n        }\n\n        .mega-backdrop-overlay.active {\n            opacity: 1;\n            visibility: visible;\n        }\n\n        /* Mega Menu Flyout Panel */\n        .mega-menu-flyout {\n            position: fixed;\n            top: 64px;\n            left: 50%;\n            transform: translateX(-50%) translateY(10px);\n            width: min(1180px, calc(100vw - 32px));\n            background: #ffffff;\n            border: 1px solid rgba(255, 214, 176, 0.9);\n            border-radius: 20px;\n            box-shadow: 0 24px 60px rgba(15, 5, 0, 0.18), 0 4px 18px rgba(232, 93, 4, 0.08);\n            z-index: 999;\n            opacity: 0;\n            visibility: hidden;\n            pointer-events: none;\n            transition: opacity 0.22s cubic-bezier(0.16, 1, 0.3, 1), transform 0.22s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.22s ease;\n            overflow: hidden;\n        }\n\n        .mega-wrapper:hover .mega-menu-flyout,\n        .mega-wrapper.is-open .mega-menu-flyout {\n            opacity: 1;\n            visibility: visible;\n            pointer-events: auto;\n            transform: translateX(-50%) translateY(0);\n        }\n\n        /* Mega Menu Layout: 3 Columns */\n        .mega-layout {\n            display: grid;\n            grid-template-columns: 290px 1fr 310px;\n            min-height: 460px;\n        }\n\n        /* Left Column: Segments List */\n        .mega-sidebar {\n            background: #FAF6F2;\n            border-right: 1px solid #FFEAD7;\n            padding: 16px 10px;\n            display: flex;\n            flex-direction: column;\n            gap: 2px;\n            max-height: 480px;\n            overflow-y: auto;\n        }\n\n        .mega-sidebar::-webkit-scrollbar {\n            width: 4px;\n        }\n\n        .mega-sidebar::-webkit-scrollbar-track {\n            background: #FAF6F2;\n        }\n\n        .mega-sidebar::-webkit-scrollbar-thumb {\n            background: #FFD6B0;\n            border-radius: 4px;\n        }\n\n        .mega-sidebar-title {\n            font-size: 0.72rem;\n            font-weight: 800;\n            color: #8C5335;\n            letter-spacing: 0.08em;\n            text-transform: uppercase;\n            padding: 4px 12px 8px;\n        }\n\n        .mega-segment-btn {\n            display: flex;\n            align-items: center;\n            justify-content: space-between;\n            padding: 8px 12px;\n            border-radius: 8px;\n            font-size: 0.85rem;\n            font-weight: 600;\n            color: #381A0B;\n            text-decoration: none;\n            transition: color 0.15s ease, background-color 0.15s ease;\n            cursor: pointer;\n            border: none;\n            background: transparent;\n        }\n\n        .mega-segment-btn:hover {\n            color: #E85D04;\n            background: rgba(232, 93, 4, 0.06);\n        }\n\n        .mega-segment-btn.active {\n            color: #E85D04;\n            font-weight: 700;\n            background: rgba(232, 93, 4, 0.09);\n        }\n\n        .mega-seg-label {\n            display: flex;\n            align-items: center;\n            gap: 8px;\n        }\n\n        .mega-seg-icon {\n            font-size: 1rem;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            flex-shrink: 0;\n        }\n\n        /* Center Column: Interactive Capabilities & Workflows */\n        .mega-center {\n            padding: 28px 32px;\n            display: flex;\n            flex-direction: column;\n            justify-content: space-between;\n            background: #ffffff;\n            max-height: 480px;\n            overflow-y: auto;\n        }\n\n        .mega-detail-panel {\n            display: none;\n            animation: megaFade 0.2s ease-out;\n        }\n\n        .mega-detail-panel.active {\n            display: block;\n        }\n\n        @keyframes megaFade {\n            from {\n                opacity: 0;\n                transform: translateY(4px);\n            }\n\n            to {\n                opacity: 1;\n                transform: translateY(0);\n            }\n        }\n\n        .mega-panel-eyebrow {\n            font-size: 0.75rem;\n            font-weight: 700;\n            text-transform: uppercase;\n            letter-spacing: 0.08em;\n            color: #E85D04;\n            margin-bottom: 6px;\n        }\n\n        .mega-panel-title {\n            font-size: 1.4rem;\n            font-weight: 800;\n            color: #0F0500;\n            margin: 0 0 8px 0;\n            letter-spacing: -0.02em;\n        }\n\n        .mega-panel-tagline {\n            font-size: 0.88rem;\n            color: #6B3A1F;\n            line-height: 1.55;\n            margin: 0 0 20px 0;\n        }\n\n        .mega-capabilities-grid {\n            display: grid;\n            grid-template-columns: repeat(2, 1fr);\n            gap: 12px;\n            margin-bottom: 16px;\n        }\n\n        .mega-cap-card {\n            background: #FAF6F2;\n            border: 1px solid #FFEEDF;\n            border-radius: 10px;\n            padding: 12px 14px;\n            transition: all 0.15s ease;\n        }\n\n        .mega-cap-card:hover {\n            background: #FFF5EC;\n            border-color: #FFD6B0;\n        }\n\n        .mega-cap-header {\n            display: flex;\n            align-items: center;\n            gap: 8px;\n            font-size: 0.82rem;\n            font-weight: 700;\n            color: #0F0500;\n            margin-bottom: 4px;\n        }\n\n        .mega-cap-desc {\n            font-size: 0.75rem;\n            color: #6B3A1F;\n            line-height: 1.45;\n            margin: 0;\n        }\n\n        /* Right Column: Featured Action Card */\n        .mega-spotlight {\n            background: #140702;\n            border-left: 1px solid #FFEAD7;\n            padding: 30px 22px;\n            display: flex;\n            flex-direction: column;\n            justify-content: space-between;\n            color: #ffffff;\n            position: relative;\n        }\n\n        .mega-spotlight-title {\n            font-size: 1.08rem;\n            font-weight: 800;\n            line-height: 1.35;\n            color: #ffffff;\n            margin-bottom: 10px;\n        }\n\n        .mega-spotlight-desc {\n            font-size: 0.78rem;\n            color: rgba(255, 255, 255, 0.7);\n            line-height: 1.55;\n            margin-bottom: 20px;\n        }\n\n        .mega-stat-pill {\n            display: flex;\n            align-items: center;\n            gap: 10px;\n            padding: 11px 13px;\n            border-radius: 8px;\n            background: rgba(255, 255, 255, 0.05);\n            border: 1px solid rgba(255, 255, 255, 0.1);\n            margin-bottom: 22px;\n        }\n\n        .mega-stat-val {\n            font-size: 1.2rem;\n            font-weight: 800;\n            color: #FF7A2F;\n        }\n\n        .mega-stat-lbl {\n            font-size: 0.7rem;\n            color: rgba(255, 255, 255, 0.7);\n            line-height: 1.3;\n        }\n\n        .mega-primary-btn {\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            gap: 8px;\n            width: 100%;\n            padding: 11px 16px;\n            border-radius: 8px;\n            font-size: 0.84rem;\n            font-weight: 700;\n            color: #ffffff;\n            background: linear-gradient(135deg, #E85D04, #FF7A2F);\n            text-decoration: none;\n            border: none;\n            cursor: pointer;\n            transition: all 0.18s ease;\n            box-sizing: border-box;\n        }\n\n        .mega-primary-btn:hover {\n            opacity: 0.95;\n            color: #ffffff;\n        }\n\n        .mega-sec-btn {\n            display: block;\n            text-align: center;\n            font-size: 0.75rem;\n            font-weight: 600;\n            color: rgba(255, 255, 255, 0.6);\n            text-decoration: none;\n            margin-top: 12px;\n            cursor: pointer;\n            transition: color 0.15s ease;\n        }\n\n        .mega-sec-btn:hover {\n            color: #FF9454;\n        }\n\n        /* Bottom Mega Footer */\n        .mega-footer {\n            background: #FAF6F2;\n            border-top: 1px solid #FFEAD7;\n            padding: 12px 32px;\n            display: flex;\n            align-items: center;\n            justify-content: space-between;\n            font-size: 0.78rem;\n            color: #5C3219;\n        }\n\n        .mega-footer a {\n            color: #E85D04;\n            font-weight: 700;\n            text-decoration: none;\n            display: inline-flex;\n            align-items: center;\n            gap: 4px;\n        }\n\n        .mega-footer a:hover {\n            text-decoration: underline;\n        }\n    </style>\n</head>\n<!-- Google tag (gtag.js) --> \n<script async src=\"https://www.googletagmanager.com/gtag/js?id=G-K765E5Z897\"></script>\n<script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-K765E5Z897'); </script>\n\n<body>\n    \n    <!-- Google Tag Manager (noscript) -->\n    <noscript><iframe src=\"https://www.googletagmanager.com/ns.html?id=GTM-KF7TR3WN\"\n    height=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"></iframe></noscript>\n    <!-- End Google Tag Manager (noscript) -->\n\n\n    <!-- NAVBAR -->\n    <header id=\"navbar\" class=\"is-scrolled\"\n        style=\"position: fixed; top: 0; left: 0; right: 0; z-index: 1000; height: 64px; display: flex; align-items: center; background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-bottom: 1px solid rgba(255, 214, 176, 0.4); box-shadow: 0 4px 20px rgba(15, 5, 0, 0.04); transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);\">\n        <div class=\"container\" style=\"display: flex; align-items: center; justify-content: space-between; width: 100%;\">\n\n            <!-- Logo -->\n            <a href=\"/\"\n                style=\"display: flex; align-items: center; gap: 10px; cursor: pointer; user-select: none; text-decoration: none;\">\n                <div\n                    style=\"width: 36px; height: 36px; border-radius: 10px; background: linear-gradient(135deg, #E85D04, #FF7A2F); display: flex; align-items: center; justify-content: center; box-shadow: 0 3px 12px rgba(232,93,4,0.35); animation: pulse-ring 3s ease-in-out infinite;\">\n                    <i data-lucide=\"zap\" style=\"color: #fff; fill: #fff; width: 18px; height: 18px;\"></i>\n                </div>\n                <div style=\"display: flex; align-items: baseline; gap: 2px;\">\n                    <span\n                        style=\"font-size: 1.1rem; font-weight: 800; letter-spacing: -0.02em; color: #E85D04;\">MuralWorks</span>\n                    <span id=\"logo-ai-tag\" style=\"font-size: 1.1rem; font-weight: 500; color: #6B3A1F; transition: color 0.2s ease;\">AI</span>\n                </div>\n            </a>\n\n            <!-- Desktop Nav -->\n            <nav class=\"nav-desktop\">\n                <a href=\"/\" class=\"nav-item \">Home</a>\n\n                <!-- INTERACTIVE MEGA DROPDOWN (NICE.COM STYLE) -->\n                <div class=\"mega-wrapper\" id=\"mega-wrapper\">\n                    <button class=\"mega-trigger-btn\" id=\"mega-trigger\" aria-expanded=\"false\">\n                        <span>Mural Workers</span>\n                        <i data-lucide=\"chevron-down\" class=\"mega-chevron\" style=\"width:15px; height:15px;\"></i>\n                    </button>\n\n                    <!-- Mega Flyout Canvas -->\n                    <div class=\"mega-menu-flyout\" id=\"mega-flyout\">\n                        <div class=\"mega-layout\">\n\n                            <!-- 1. LEFT: Industry Segments Sidebar -->\n                            <div class=\"mega-sidebar\">\n                                <div class=\"mega-sidebar-title\">Industry Segments</div>\n\n                                <a href=\"https://dev-salesworker.crescendoworldwide.com/demo\"\n                                    target=\"_blank\" class=\"mega-segment-btn active\" data-segment=\"training\"\n                                    onmouseenter=\"activateSegment('training')\">\n                                    <div class=\"mega-seg-label\">\n                                        <span class=\"mega-seg-icon\">🏫</span>\n                                        <span>Training Institute</span>\n                                    </div>\n                                    <i data-lucide=\"chevron-right\" style=\"width:13px; height:13px; opacity:0.5;\"></i>\n                                </a>\n\n                                <a href=\"http://localhost:5175/logistic-companies\"\n                                    target=\"_blank\" class=\"mega-segment-btn\" data-segment=\"logistic\"\n                                    onmouseenter=\"activateSegment('logistic')\">\n                                    <div class=\"mega-seg-label\">\n                                        <span class=\"mega-seg-icon\">🚚</span>\n                                        <span>Logistic Companies</span>\n                                    </div>\n                                    <i data-lucide=\"chevron-right\" style=\"width:13px; height:13px; opacity:0.5;\"></i>\n                                </a>\n\n                                <a href=\"/coming-soon\" target=\"_blank\"\n                                    class=\"mega-segment-btn\" data-segment=\"exporters\"\n                                    onmouseenter=\"activateSegment('exporters')\">\n                                    <div class=\"mega-seg-label\">\n                                        <span class=\"mega-seg-icon\">🌍</span>\n                                        <span>Exporters</span>\n                                    </div>\n                                    <i data-lucide=\"chevron-right\" style=\"width:13px; height:13px; opacity:0.5;\"></i>\n                                </a>\n\n                                <a href=\"http://localhost:5175/industrial-product-companies\"\n                                    target=\"_blank\" class=\"mega-segment-btn\" data-segment=\"industrial\"\n                                    onmouseenter=\"activateSegment('industrial')\">\n                                    <div class=\"mega-seg-label\">\n                                        <span class=\"mega-seg-icon\">🏭</span>\n                                        <span>Industrial Products</span>\n                                    </div>\n                                    <i data-lucide=\"chevron-right\" style=\"width:13px; height:13px; opacity:0.5;\"></i>\n                                </a>\n\n                                <a href=\"http://localhost:5175/real-estate-developers\"\n                                    target=\"_blank\" class=\"mega-segment-btn\" data-segment=\"realestate\"\n                                    onmouseenter=\"activateSegment('realestate')\">\n                                    <div class=\"mega-seg-label\">\n                                        <span class=\"mega-seg-icon\">🏗️</span>\n                                        <span>Real Estate Developers</span>\n                                    </div>\n                                    <i data-lucide=\"chevron-right\" style=\"width:13px; height:13px; opacity:0.5;\"></i>\n                                </a>\n\n                                <a href=\"/coming-soon\"\n                                    target=\"_blank\" class=\"mega-segment-btn\" data-segment=\"education\"\n                                    onmouseenter=\"activateSegment('education')\">\n                                    <div class=\"mega-seg-label\">\n                                        <span class=\"mega-seg-icon\">🎓</span>\n                                        <span>Educational Institutions</span>\n                                    </div>\n                                    <i data-lucide=\"chevron-right\" style=\"width:13px; height:13px; opacity:0.5;\"></i>\n                                </a>\n\n                                <a href=\"http://localhost:5175/healthcare-providers\"\n                                    target=\"_blank\" class=\"mega-segment-btn\" data-segment=\"healthcare\"\n                                    onmouseenter=\"activateSegment('healthcare')\">\n                                    <div class=\"mega-seg-label\">\n                                        <span class=\"mega-seg-icon\">🏥</span>\n                                        <span>Healthcare Providers</span>\n                                    </div>\n                                    <i data-lucide=\"chevron-right\" style=\"width:13px; height:13px; opacity:0.5;\"></i>\n                                </a>\n\n                                <a href=\"/coming-soon\"\n                                    target=\"_blank\" class=\"mega-segment-btn\" data-segment=\"consulting\"\n                                    onmouseenter=\"activateSegment('consulting')\">\n                                    <div class=\"mega-seg-label\">\n                                        <span class=\"mega-seg-icon\">💼</span>\n                                        <span>Consulting Firms</span>\n                                    </div>\n                                    <i data-lucide=\"chevron-right\" style=\"width:13px; height:13px; opacity:0.5;\"></i>\n                                </a>\n\n                                <a href=\"/coming-soon\"\n                                    target=\"_blank\" class=\"mega-segment-btn\" data-segment=\"recruitment\"\n                                    onmouseenter=\"activateSegment('recruitment')\">\n                                    <div class=\"mega-seg-label\">\n                                        <span class=\"mega-seg-icon\">👥</span>\n                                        <span>Recruitment Agencies</span>\n                                    </div>\n                                    <i data-lucide=\"chevron-right\" style=\"width:13px; height:13px; opacity:0.5;\"></i>\n                                </a>\n\n                                <a href=\"/coming-soon\"\n                                    target=\"_blank\" class=\"mega-segment-btn\" data-segment=\"insurance\"\n                                    onmouseenter=\"activateSegment('insurance')\">\n                                    <div class=\"mega-seg-label\">\n                                        <span class=\"mega-seg-icon\">🛡️</span>\n                                        <span>Insurance Companies</span>\n                                    </div>\n                                    <i data-lucide=\"chevron-right\" style=\"width:13px; height:13px; opacity:0.5;\"></i>\n                                </a>\n\n                                <a href=\"http://localhost:5175/banking\" target=\"_blank\"\n                                    class=\"mega-segment-btn\" data-segment=\"banking\"\n                                    onmouseenter=\"activateSegment('banking')\">\n                                    <div class=\"mega-seg-label\">\n                                        <span class=\"mega-seg-icon\">🏦</span>\n                                        <span>Banking</span>\n                                    </div>\n                                    <i data-lucide=\"chevron-right\" style=\"width:13px; height:13px; opacity:0.5;\"></i>\n                                </a>\n\n                                <a href=\"http://localhost:5175/it-saas-companies\"\n                                    target=\"_blank\" class=\"mega-segment-btn\" data-segment=\"it\"\n                                    onmouseenter=\"activateSegment('it')\">\n                                    <div class=\"mega-seg-label\">\n                                        <span class=\"mega-seg-icon\">☁️</span>\n                                        <span>IT & SaaS Companies</span>\n                                    </div>\n                                    <i data-lucide=\"chevron-right\" style=\"width:13px; height:13px; opacity:0.5;\"></i>\n                                </a>\n\n                                <a href=\"http://localhost:5175/government-public-sector\"\n                                    target=\"_blank\" class=\"mega-segment-btn\" data-segment=\"government\"\n                                    onmouseenter=\"activateSegment('government')\">\n                                    <div class=\"mega-seg-label\">\n                                        <span class=\"mega-seg-icon\">🏛️</span>\n                                        <span>Government & Public Sector</span>\n                                    </div>\n                                    <i data-lucide=\"chevron-right\" style=\"width:13px; height:13px; opacity:0.5;\"></i>\n                                </a>\n\n                                <a href=\"http://localhost:5175/economic-development-agencies\"\n                                    target=\"_blank\" class=\"mega-segment-btn\" data-segment=\"economic\"\n                                    onmouseenter=\"activateSegment('economic')\">\n                                    <div class=\"mega-seg-label\">\n                                        <span class=\"mega-seg-icon\">📈</span>\n                                        <span>Economic Development</span>\n                                    </div>\n                                    <i data-lucide=\"chevron-right\" style=\"width:13px; height:13px; opacity:0.5;\"></i>\n                                </a>\n\n                                <a href=\"http://localhost:5175/industrial-promotion-bodies\"\n                                    target=\"_blank\" class=\"mega-segment-btn\" data-segment=\"promotion\"\n                                    onmouseenter=\"activateSegment('promotion')\">\n                                    <div class=\"mega-seg-label\">\n                                        <span class=\"mega-seg-icon\">🏆</span>\n                                        <span>Industrial Promotion Bodies</span>\n                                    </div>\n                                    <i data-lucide=\"chevron-right\" style=\"width:13px; height:13px; opacity:0.5;\"></i>\n                                </a>\n                            </div>\n\n                            <!-- 2. CENTER: Interactive Capabilities Panel -->\n                            <div class=\"mega-center\">\n\n                                <!-- 0. Training Institute -->\n                                <div class=\"mega-detail-panel active\" id=\"detail-training\">\n                                    <div class=\"mega-panel-eyebrow\">Autonomous Engagement & Support Worker</div>\n                                    <h3 class=\"mega-panel-title\">Training Institute</h3>\n                                    <p class=\"mega-panel-tagline\">Automate course enrollments, proactively gather feedback from students, and boost sales with AI.</p>\n                                    <div class=\"mega-capabilities-grid\">\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"trending-up\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Sales</div>\n                                            <p class=\"mega-cap-desc\">Qualifies leads, provides course details, and drives student enrollments directly over the phone.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"message-square\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Feedback</div>\n                                            <p class=\"mega-cap-desc\">Automatically collects post-training feedback and resolves student queries 24/7.</p>\n                                        </div>\n                                    </div>\n                                </div>\n\n                                <!-- 1. Logistics -->\n                                <div class=\"mega-detail-panel\" id=\"detail-logistic\">\n                                    <div class=\"mega-panel-eyebrow\">Autonomous Freight & Dispatch Worker</div>\n                                    <h3 class=\"mega-panel-title\">Logistic Companies</h3>\n                                    <p class=\"mega-panel-tagline\">Automate dispatch calls, track shipments with AI in\n                                        real time, and provide 24/7 driver support to eliminate operational bottlenecks.\n                                    </p>\n                                    <div class=\"mega-capabilities-grid\">\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"navigation\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Autonomous\n                                                Dispatching</div>\n                                            <p class=\"mega-cap-desc\">Confirms driver readiness, load check-ins, and\n                                                routing instructions with instant CRM syncing.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"map-pin\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Live Shipment\n                                                IVR</div>\n                                            <p class=\"mega-cap-desc\">Shippers and consignees get conversational ETAs,\n                                                GPS updates, and detention status.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"alert-triangle\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Route Delay\n                                                Alerts</div>\n                                            <p class=\"mega-cap-desc\">Proactively dials distribution centers and drivers\n                                                during severe weather or customs delays.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"file-check\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Proof of\n                                                Delivery Follow-up</div>\n                                            <p class=\"mega-cap-desc\">Automatically confirms BOL signatures and resolves\n                                                accessorial billing items by phone.</p>\n                                        </div>\n                                    </div>\n                                </div>\n\n                                <!-- 2. Exporters -->\n                                <div class=\"mega-detail-panel\" id=\"detail-exporters\">\n                                    <div class=\"mega-panel-eyebrow\">Cross-Border Trade & Customs Worker</div>\n                                    <h3 class=\"mega-panel-title\">Exporters & Trade Houses</h3>\n                                    <p class=\"mega-panel-tagline\">Coordinate overseas consignments, automate customs\n                                        clearance status calls, and qualify international buyers across time zones.</p>\n                                    <div class=\"mega-capabilities-grid\">\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"globe\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Multi-Lingual\n                                                Inquiries</div>\n                                            <p class=\"mega-cap-desc\">Speaks 40+ languages to converse with international\n                                                buyers in their native tongue.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"file-text\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Customs Doc\n                                                Follow-up</div>\n                                            <p class=\"mega-cap-desc\">Coordinates Letter of Credit and bill of lading\n                                                document requirements automatically.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"anchor\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Port &\n                                                Container Tracking</div>\n                                            <p class=\"mega-cap-desc\">Provides real-time container demurrage and vessel\n                                                booking status.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"dollar-sign\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Trade Quote\n                                                Screening</div>\n                                            <p class=\"mega-cap-desc\">Screens overseas trade leads on volume, Incoterms,\n                                                and payment escrow terms.</p>\n                                        </div>\n                                    </div>\n                                </div>\n\n                                <!-- 3. Industrial Products -->\n                                <div class=\"mega-detail-panel\" id=\"detail-industrial\">\n                                    <div class=\"mega-panel-eyebrow\">B2B Technical Sales Worker</div>\n                                    <h3 class=\"mega-panel-title\">Industrial Product Companies</h3>\n                                    <p class=\"mega-panel-tagline\">Qualify commercial buyers instantly, answer complex\n                                        engineering specs directly from CAD/spec sheets, and book distributor demos.</p>\n                                    <div class=\"mega-capabilities-grid\">\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"layers\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Spec Sheet\n                                                Advisory</div>\n                                            <p class=\"mega-cap-desc\">Answers SKU tolerances, certifications, and\n                                                compatibility questions naturally.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"filter\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Commercial\n                                                Qualification</div>\n                                            <p class=\"mega-cap-desc\">Screens buyers on MOQ, delivery timeline, and\n                                                project budget before rep routing.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"calendar\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Distributor\n                                                Scheduling</div>\n                                            <p class=\"mega-cap-desc\">Schedules field engineer consultations and regional\n                                                distributor visits in real time.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"file-text\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Instant RFQ\n                                                Capture</div>\n                                            <p class=\"mega-cap-desc\">Captures exact quote parameters and transmits\n                                                structured RFQ data into ERP.</p>\n                                        </div>\n                                    </div>\n                                </div>\n\n                                <!-- 4. Real Estate -->\n                                <div class=\"mega-detail-panel\" id=\"detail-realestate\">\n                                    <div class=\"mega-panel-eyebrow\">Property Concierge & Tour Worker</div>\n                                    <h3 class=\"mega-panel-title\">Real Estate Developers</h3>\n                                    <p class=\"mega-panel-tagline\">Engage high-intent buyers 24/7, book guided site tours\n                                        directly into worker calendars, and provide instant floor plan and pricing\n                                        details.</p>\n                                    <div class=\"mega-capabilities-grid\">\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"calendar-check\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Site Tour\n                                                Booking</div>\n                                            <p class=\"mega-cap-desc\">Syncs with sales gallery schedules to book\n                                                on-premise walkthroughs in seconds.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"home\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Inventory &\n                                                Pricing IVR</div>\n                                            <p class=\"mega-cap-desc\">Shares real-time unit availability, square footage,\n                                                amenities, and payment plans.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"phone-incoming\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> 30s\n                                                Speed-to-Lead</div>\n                                            <p class=\"mega-cap-desc\">Dials portal leads within 30 seconds of form\n                                                submission while intent is at peak.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"user-check\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Warm Sales\n                                                Transfer</div>\n                                            <p class=\"mega-cap-desc\">Seamlessly transfers pre-qualified luxury buyers to\n                                                on-duty sales specialists.</p>\n                                        </div>\n                                    </div>\n                                </div>\n\n                                <!-- 5. Education -->\n                                <div class=\"mega-detail-panel\" id=\"detail-education\">\n                                    <div class=\"mega-panel-eyebrow\">Admissions & Student Advisor</div>\n                                    <h3 class=\"mega-panel-title\">Educational Institutions</h3>\n                                    <p class=\"mega-panel-tagline\">Support applicants through admissions deadlines,\n                                        schedule 1-on-1 counseling appointments, and handle campus FAQs year-round.</p>\n                                    <div class=\"mega-capabilities-grid\">\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"book-open\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Admissions\n                                                Assistance</div>\n                                            <p class=\"mega-cap-desc\">Guides prospective students on deadlines,\n                                                prerequisites, and program details.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"user-plus\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Counselor\n                                                Scheduling</div>\n                                            <p class=\"mega-cap-desc\">Gauges student career interests and books\n                                                counseling appointments instantly.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"help-circle\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Campus &\n                                                Tuition FAQ</div>\n                                            <p class=\"mega-cap-desc\">Resolves financial aid, dorm housing, and syllabus\n                                                queries without staff load.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"bell\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Enrollment\n                                                Reminders</div>\n                                            <p class=\"mega-cap-desc\">Calls accepted students with personalized\n                                                orientation reminders and next steps.</p>\n                                        </div>\n                                    </div>\n                                </div>\n\n                                <!-- 6. Healthcare -->\n                                <div class=\"mega-detail-panel\" id=\"detail-healthcare\">\n                                    <div class=\"mega-panel-eyebrow\">Patient Scheduling & Intake Worker</div>\n                                    <h3 class=\"mega-panel-title\">Healthcare Providers</h3>\n                                    <p class=\"mega-panel-tagline\">Handle patient scheduling, automated pre-op reminders,\n                                        and basic intake with empathetic, HIPAA-ready voice AI.</p>\n                                    <div class=\"mega-capabilities-grid\">\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"calendar\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Clinic\n                                                Appointment Booking</div>\n                                            <p class=\"mega-cap-desc\">Matches patients with specialist calendars and\n                                                verifies accepted insurance plans.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"clock\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Pre-Visit\n                                                Reminders</div>\n                                            <p class=\"mega-cap-desc\">Proactively confirms appointments and delivers\n                                                preparation instructions.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"pill\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Prescription\n                                                Refill FAQ</div>\n                                            <p class=\"mega-cap-desc\">Directs refill requests and clinic operating\n                                                queries with zero waiting hold times.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"heart-pulse\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Post-Care\n                                                Follow-ups</div>\n                                            <p class=\"mega-cap-desc\">Checks in on discharged patients to monitor\n                                                recovery milestones automatically.</p>\n                                        </div>\n                                    </div>\n                                </div>\n\n                                <!-- 7. Consulting -->\n                                <div class=\"mega-detail-panel\" id=\"detail-consulting\">\n                                    <div class=\"mega-panel-eyebrow\">Executive Scheduling & Lead Intake</div>\n                                    <h3 class=\"mega-panel-title\">Consulting Firms</h3>\n                                    <p class=\"mega-panel-tagline\">Capture enterprise inbound leads, screen engagements\n                                        for partner fit, and orchestrate scoping consultations.</p>\n                                    <div class=\"mega-capabilities-grid\">\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"briefcase\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Practice Area\n                                                Routing</div>\n                                            <p class=\"mega-cap-desc\">Routes prospective clients to the right practice\n                                                group partner automatically.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"calendar\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Partner\n                                                Calendar Sync</div>\n                                            <p class=\"mega-cap-desc\">Coordinates executive discovery calls across\n                                                multiple partner schedules.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"shield\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Conflict\n                                                Checking Info</div>\n                                            <p class=\"mega-cap-desc\">Collects initial party information cleanly for\n                                                compliance conflict review.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"file-check\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Post-Meeting\n                                                Next Steps</div>\n                                            <p class=\"mega-cap-desc\">Sends proposal outlines and follow-up links\n                                                immediately after calls.</p>\n                                        </div>\n                                    </div>\n                                </div>\n\n                                <!-- 8. Recruitment -->\n                                <div class=\"mega-detail-panel\" id=\"detail-recruitment\">\n                                    <div class=\"mega-panel-eyebrow\">Candidate Screening & Interview Worker</div>\n                                    <h3 class=\"mega-panel-title\">Recruitment Agencies</h3>\n                                    <p class=\"mega-panel-tagline\">Screen hundreds of candidate applicants daily, verify\n                                        salary expectations and availability, and schedule recruiter interviews.</p>\n                                    <div class=\"mega-capabilities-grid\">\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"users\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> High-Volume\n                                                Phone Screen</div>\n                                            <p class=\"mega-cap-desc\">Asks standard qualifying questions and logs\n                                                structured resume responses.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"clock\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Availability &\n                                                Notice Check</div>\n                                            <p class=\"mega-cap-desc\">Confirms current notice period, location\n                                                preference, and compensation.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"calendar\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Recruiter\n                                                Interview Booking</div>\n                                            <p class=\"mega-cap-desc\">Books qualified talent directly onto recruiter\n                                                interview calendars.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"database\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> ATS Auto-Sync\n                                            </div>\n                                            <p class=\"mega-cap-desc\">Pushes call recordings, candidate ratings, and\n                                                transcripts into ATS.</p>\n                                        </div>\n                                    </div>\n                                </div>\n\n                                <!-- 9. Insurance -->\n                                <div class=\"mega-detail-panel\" id=\"detail-insurance\">\n                                    <div class=\"mega-panel-eyebrow\">FNOL Claims & Policy Worker</div>\n                                    <h3 class=\"mega-panel-title\">Insurance Companies</h3>\n                                    <p class=\"mega-panel-tagline\">Streamline First Notice of Loss (FNOL) intake, answer\n                                        policy coverage questions, and warm-transfer complex claims to adjusters.</p>\n                                    <div class=\"mega-capabilities-grid\">\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"shield-alert\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> 24/7 FNOL\n                                                Claims Intake</div>\n                                            <p class=\"mega-cap-desc\">Collects incident timestamps, policy numbers, and\n                                                damage descriptions cleanly.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"file-search\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Policy Coverage\n                                                Inquiry</div>\n                                            <p class=\"mega-cap-desc\">Explains deductibles, rider limits, and payment\n                                                schedules in natural language.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"phone-forwarded\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Adjuster Warm\n                                                Transfer</div>\n                                            <p class=\"mega-cap-desc\">Escalates high-priority claims to licensed\n                                                adjusters with complete screen-pop summary.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"refresh-cw\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Policy Renewal\n                                                Calls</div>\n                                            <p class=\"mega-cap-desc\">Proactively contacts policyholders before\n                                                expiration to retain active accounts.</p>\n                                        </div>\n                                    </div>\n                                </div>\n\n                                <!-- 10. Banking -->\n                                <div class=\"mega-detail-panel\" id=\"detail-banking\">\n                                    <div class=\"mega-panel-eyebrow\">Secure Voice Banking & Screening Worker</div>\n                                    <h3 class=\"mega-panel-title\">Banking & Financial Services</h3>\n                                    <p class=\"mega-panel-tagline\">Deliver secure balance inquiries, loan\n                                        pre-qualification screening, and instant transaction fraud verification with\n                                        conversational AI.</p>\n                                    <div class=\"mega-capabilities-grid\">\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"lock\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Voice Biometric\n                                                Auth</div>\n                                            <p class=\"mega-cap-desc\">Authenticates callers securely for balance checks\n                                                and recent statement inquiries.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"credit-card\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Card Block &\n                                                Replacement</div>\n                                            <p class=\"mega-cap-desc\">Instantly freezes compromised cards and triggers\n                                                expedited replacements.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"trending-up\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Loan\n                                                Pre-Qualification</div>\n                                            <p class=\"mega-cap-desc\">Screens mortgage and credit line applicants on\n                                                criteria before loan officer calls.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"alert-circle\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Proactive Fraud\n                                                Verification</div>\n                                            <p class=\"mega-cap-desc\">Calls account holders in real time to confirm\n                                                flagged card charges.</p>\n                                        </div>\n                                    </div>\n                                </div>\n\n                                <!-- 11. IT & SaaS -->\n                                <div class=\"mega-detail-panel\" id=\"detail-it\">\n                                    <div class=\"mega-panel-eyebrow\">AI SDR & L1 Helpdesk Worker</div>\n                                    <h3 class=\"mega-panel-title\">IT & SaaS Companies</h3>\n                                    <p class=\"mega-panel-tagline\">Automate outbound pipeline generation, dial inbound\n                                        demo requests in seconds, and resolve Tier-1 technical support without human\n                                        workers.</p>\n                                    <div class=\"mega-capabilities-grid\">\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"zap\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Outbound AI SDR\n                                            </div>\n                                            <p class=\"mega-cap-desc\">Dials targeted ICP contact lists, gauges pain\n                                                points, and books AE demo calls.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"phone-call\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Instant Inbound\n                                                Response</div>\n                                            <p class=\"mega-cap-desc\">Dials form fills within 10 seconds to convert\n                                                website visitors when intent is hottest.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"terminal\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> L1 Technical\n                                                Helpdesk</div>\n                                            <p class=\"mega-cap-desc\">Resolves SSO lockouts, password resets, and API\n                                                endpoint questions 24/7.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"database\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> CRM & Ticket\n                                                Sync</div>\n                                            <p class=\"mega-cap-desc\">Writes full call transcripts, sentiment scores, and\n                                                next steps into HubSpot / Salesforce.</p>\n                                        </div>\n                                    </div>\n                                </div>\n\n                                <!-- 12. Government -->\n                                <div class=\"mega-detail-panel\" id=\"detail-government\">\n                                    <div class=\"mega-panel-eyebrow\">Public Citizen Services Voice Worker</div>\n                                    <h3 class=\"mega-panel-title\">Government & Public Sector</h3>\n                                    <p class=\"mega-panel-tagline\">Deliver instant 24/7 citizen services, municipal\n                                        permit inquiries, and emergency informational helplines.</p>\n                                    <div class=\"mega-capabilities-grid\">\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"landmark\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> 311 Citizen\n                                                Helpline</div>\n                                            <p class=\"mega-cap-desc\">Resolves public inquiries on trash schedules,\n                                                licenses, and utility bills instantly.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"calendar\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> DMV & Office\n                                                Appointments</div>\n                                            <p class=\"mega-cap-desc\">Schedules in-person department visits and sends\n                                                checklist SMS reminders.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"alert-circle\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Crisis &\n                                                Emergency Broadcasts</div>\n                                            <p class=\"mega-cap-desc\">Broadcasts urgent community safety advisories to\n                                                thousands of residents simultaneously.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"check-square\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Public Records\n                                                & Permits</div>\n                                            <p class=\"mega-cap-desc\">Guides citizens through application requirements\n                                                and status lookups.</p>\n                                        </div>\n                                    </div>\n                                </div>\n\n                                <!-- 13. Economic Development -->\n                                <div class=\"mega-detail-panel\" id=\"detail-economic\">\n                                    <div class=\"mega-panel-eyebrow\">Inward Investment Concierge</div>\n                                    <h3 class=\"mega-panel-title\">Economic Development Agencies</h3>\n                                    <p class=\"mega-panel-tagline\">Engage corporate site selectors, provide incentive\n                                        package details, and coordinate regional business expansion visits.</p>\n                                    <div class=\"mega-capabilities-grid\">\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"trending-up\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Site Selector\n                                                Inquiries</div>\n                                            <p class=\"mega-cap-desc\">Answers demographic, tax incentive, and zoning\n                                                questions on natural phone calls.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"map\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Regional\n                                                Expansion Tours</div>\n                                            <p class=\"mega-cap-desc\">Schedules business delegation visits and meetings\n                                                with local officials.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"award\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Grant &\n                                                Incentive Screening</div>\n                                            <p class=\"mega-cap-desc\">Pre-qualifies expanding businesses for regional\n                                                workforce tax credits.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"phone-outgoing\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Outbound FDI\n                                                Outreach</div>\n                                            <p class=\"mega-cap-desc\">Dials prospective manufacturing executives to\n                                                present regional advantages.</p>\n                                        </div>\n                                    </div>\n                                </div>\n\n                                <!-- 14. Industrial Promotion -->\n                                <div class=\"mega-detail-panel\" id=\"detail-promotion\">\n                                    <div class=\"mega-panel-eyebrow\">Trade Association & Expo Worker</div>\n                                    <h3 class=\"mega-panel-title\">Industrial Promotion Bodies</h3>\n                                    <p class=\"mega-panel-tagline\">Accelerate trade show delegate attendance, coordinate\n                                        B2B buyer-seller matchmaking, and manage member services.</p>\n                                    <div class=\"mega-capabilities-grid\">\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"award\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Expo &\n                                                Conference RSVPs</div>\n                                            <p class=\"mega-cap-desc\">Dials past attendees and prospective exhibitors to\n                                                confirm registration passes.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"handshake\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> B2B Matchmaking\n                                                Schedules</div>\n                                            <p class=\"mega-cap-desc\">Coordinates 1-on-1 business meetings between buyers\n                                                and manufacturing suppliers.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"users\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Member\n                                                Association Renewals</div>\n                                            <p class=\"mega-cap-desc\">Proactively reminds members of annual membership\n                                                renewals and benefits.</p>\n                                        </div>\n                                        <div class=\"mega-cap-card\">\n                                            <div class=\"mega-cap-header\"><i data-lucide=\"file-text\"\n                                                    style=\"width:14px; height:14px; color:#E85D04;\"></i> Export Guide\n                                                Distribution</div>\n                                            <p class=\"mega-cap-desc\">Follows up calls by delivering customized industry\n                                                research reports over SMS/email.</p>\n                                        </div>\n                                    </div>\n                                </div>\n\n                            </div>\n\n                            <!-- 3. RIGHT: Spotlight Action Card -->\n                            <div class=\"mega-spotlight\">\n                                <div id=\"spotlight-text-content\">\n                                    <h4 class=\"mega-spotlight-title\" id=\"spotlight-title\">See Mural Worker for Logistics\n                                    </h4>\n                                    <p class=\"mega-spotlight-desc\" id=\"spotlight-desc\">Experience low-latency,\n                                        human-like voice workflows custom-tuned for this industry segment.</p>\n\n                                    <div class=\"mega-stat-pill\">\n                                        <div class=\"mega-stat-val\" id=\"spotlight-stat-val\">85%</div>\n                                        <div class=\"mega-stat-lbl\" id=\"spotlight-stat-lbl\">Reduction in manual dispatch\n                                            & coordinator calls</div>\n                                    </div>\n                                </div>\n                                <div id=\"spotlight-image-content\" style=\"display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; border-top-right-radius: 12px; border-bottom-right-radius: 12px; overflow: hidden;\">\n                                    <div style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, rgba(0,0,0,0.1) 50%, rgba(0,0,0,0.8) 100%); z-index: 2;\"></div>\n                                    <img id=\"spotlight-image\" src=\"\" alt=\"Industry Image\" style=\"width: 100%; height: 100%; object-fit: cover; object-position: center top; position: relative; z-index: 1;\">\n                                </div>\n\n                                <div style=\"position: relative; z-index: 10;\">\n                                    <a href=\"https://dev-salesworker.crescendoworldwide.com/demo\"\n                                        target=\"_blank\" id=\"spotlight-cta-btn\" class=\"mega-primary-btn\">\n                                        <span>Explore Industry Solution</span>\n                                        <i data-lucide=\"arrow-right\" style=\"width:14px; height:14px;\"></i>\n                                    </a>\n                                    <a href=\"#\" class=\"mega-sec-btn\" style=\"text-shadow: 0 1px 3px rgba(0,0,0,0.6);\">\n                                        Schedule an Enterprise Demo →\n                                    </a>\n                                </div>\n                            </div>\n\n                        </div>\n\n                        <!-- Mega Menu Bottom Bar -->\n                        <div class=\"mega-footer\">\n                            <div>\n                                Need a custom voice model for your specific enterprise workflow?\n                            </div>\n                            <div style=\"display:flex; align-items:center; gap:20px;\">\n                                <a href=\"http://localhost:5175/\" target=\"_blank\"\n                                    style=\"color:#E85D04; font-weight:700;\">\n                                    <span>✨ View All Segments Hub</span>\n                                    <i data-lucide=\"arrow-right\" style=\"width:12px; height:12px;\"></i>\n                                </a>\n                                <a href=\"#\">\n                                    <span>Talk to our AI Solutions Team</span>\n                                    <i data-lucide=\"arrow-right\" style=\"width:12px; height:12px;\"></i>\n                                </a>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n\n                <a href=\"/cases\" class=\"nav-item \">Case Studies</a>\n            </nav>\n\n            <!-- CTA -->\n            <div style=\"display: flex; align-items: center; gap: 10px;\">\n                <button type=\"button\" onclick=\"openContactSalesModal()\"\n                    style=\"font-size: 0.84rem; font-weight: 700; color: #ffffff; padding: 8px 18px; border-radius: 9px; border: none; background: linear-gradient(135deg, #E85D04, #FF7A2F); transition: all 0.15s ease; cursor: pointer; box-shadow: 0 3px 12px rgba(232,93,4,0.28); display: inline-flex; align-items: center; gap: 6px;\">\n                    <i data-lucide=\"phone\" style=\"width: 14px; height: 14px;\"></i>\n                    Contact Sales: +91 8956872271\n                </button>\n                <button id=\"hamburger-btn\" class=\"hamburger-btn\">\n                    <i id=\"hamburger-icon\" data-lucide=\"menu\" style=\"width: 18px; height: 18px;\"></i>\n                </button>\n            </div>\n        </div>\n    </header>\n\n    <!-- Mega Menu Backdrop -->\n    <div class=\"mega-backdrop-overlay\" id=\"mega-backdrop\" onclick=\"closeMegaMenu()\"></div>\n\n    <!-- Mobile Drawer -->\n    <div id=\"mobile-menu\">\n        <a href=\"/\" class=\"mobile-nav-item \">Home</a>\n\n        <!-- Mobile Accordion for Mural Workers -->\n        <div style=\"border-bottom: 1px solid #FFE8D4; padding: 14px 0;\">\n            <div style=\"display:flex; align-items:center; justify-content:space-between; font-size:1rem; font-weight:700; color:#E85D04; cursor:pointer;\"\n                onclick=\"toggleMobileSegments()\">\n                <span>Mural Workers (15 Segments)</span>\n                <i data-lucide=\"chevron-down\" id=\"mobile-seg-icon\" style=\"width:16px; height:16px;\"></i>\n            </div>\n            <div id=\"mobile-seg-list\" class=\"mobile-segment-grid\"\n                style=\"display:none; margin-top:12px; max-height:360px; overflow-y:auto;\">\n                <a class=\"mobile-segment-card\"\n                    href=\"https://dev-salesworker.crescendoworldwide.com/demo\" target=\"_blank\">🏫\n                    Training Institute</a>\n                <a class=\"mobile-segment-card\"\n                    href=\"http://localhost:5175/logistic-companies\" target=\"_blank\">🚚\n                    Logistic Companies</a>\n                <a class=\"mobile-segment-card\" href=\"/coming-soon\"\n                    target=\"_blank\">🌍 Exporters</a>\n                <a class=\"mobile-segment-card\"\n                    href=\"http://localhost:5175/industrial-product-companies\"\n                    target=\"_blank\">🏭 Industrial Products</a>\n                <a class=\"mobile-segment-card\"\n                    href=\"http://localhost:5175/real-estate-developers\" target=\"_blank\">🏗️\n                    Real Estate Developers</a>\n                <a class=\"mobile-segment-card\"\n                    href=\"/coming-soon\"\n                    target=\"_blank\">🎓 Educational Institutions</a>\n                <a class=\"mobile-segment-card\"\n                    href=\"http://localhost:5175/healthcare-providers\" target=\"_blank\">🏥\n                    Healthcare Providers</a>\n                <a class=\"mobile-segment-card\"\n                    href=\"/coming-soon\" target=\"_blank\">💼\n                    Consulting Firms</a>\n                <a class=\"mobile-segment-card\"\n                    href=\"/coming-soon\" target=\"_blank\">👥\n                    Recruitment Agencies</a>\n                <a class=\"mobile-segment-card\"\n                    href=\"/coming-soon\" target=\"_blank\">🛡️\n                    Insurance Companies</a>\n                <a class=\"mobile-segment-card\" href=\"http://localhost:5175/banking\"\n                    target=\"_blank\">🏦 Banking</a>\n                <a class=\"mobile-segment-card\"\n                    href=\"http://localhost:5175/it-saas-companies\" target=\"_blank\">☁️ IT &\n                    SaaS Companies</a>\n                <a class=\"mobile-segment-card\"\n                    href=\"http://localhost:5175/government-public-sector\"\n                    target=\"_blank\">🏛️ Government & Public Sector</a>\n                <a class=\"mobile-segment-card\"\n                    href=\"http://localhost:5175/economic-development-agencies\"\n                    target=\"_blank\">📈 Economic Development</a>\n                <a class=\"mobile-segment-card\"\n                    href=\"http://localhost:5175/industrial-promotion-bodies\"\n                    target=\"_blank\">🏆 Industrial Promotion Bodies</a>\n                <a class=\"mobile-segment-card\" href=\"http://localhost:5175/\"\n                    target=\"_blank\" style=\"color:#ff781f; font-weight:700;\">✨ View All Segments Hub</a>\n            </div>\n        </div>\n\n        <a href=\"/cases\" class=\"mobile-nav-item \">Case Studies</a>\n    </div>\n\n    <!-- MAIN CONTENT -->\n    <main style=\"flex: 1; padding-top: 0px;\">\n        <div style=\"background:#ffffff; color:#0F0500; min-height: 80vh; display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; padding: 40px; margin-top: 80px;\">\n    <h1 style=\"font-size: 3rem; font-weight: 800; color: #E85D04; margin-bottom: 20px;\">Coming Soon</h1>\n    <p style=\"font-size: 1.25rem; color: #555; max-width: 600px; margin-bottom: 40px;\">We are working hard to bring this industry segment to you. Stay tuned for updates!</p>\n    <a href=\"/\" style=\"display: inline-flex; align-items: center; justify-content: center; background: #0F0500; color: #ffffff; padding: 14px 28px; font-weight: 600; border-radius: 8px; text-decoration: none; transition: background 0.2s;\">\n        Return to Homepage\n    </a>\n</div>\n    </main>\n\n    <!-- FOOTER -->\n    <footer\n        style=\"background: #0F0500; border-top: 3px solid #E85D04; padding: 64px 0 28px; color: #fff; font-size: 0.85rem;\">\n        <div class=\"container\">\n            <div\n                style=\"display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 36px; margin-bottom: 52px;\">\n\n                <!-- Brand -->\n                <div>\n                    <div style=\"display: flex; align-items: center; gap: 10px; margin-bottom: 14px;\">\n                        <div\n                            style=\"width: 32px; height: 32px; border-radius: 8px; background: linear-gradient(135deg,#E85D04,#FF7A2F); display: flex; align-items: center; justify-content: center;\">\n                            <i data-lucide=\"zap\" style=\"color: #fff; fill: #fff; width: 17px; height: 17px;\"></i>\n                        </div>\n                        <div>\n                            <span style=\"font-size: 1rem; font-weight: 800; color: #E85D04;\">MuralWorks</span>\n                            <span style=\"font-size: 1rem; font-weight: 500; color: rgba(255,255,255,0.6);\">AI</span>\n                        </div>\n                    </div>\n                    <p style=\"line-height: 1.7; color: rgba(255,255,255,0.5); margin-bottom: 18px; font-size: 0.82rem;\">\n                        AI workers for outbound sales and inbound support. Prospect by phone, resolve customer calls,\n                        and warm-transfer when it matters — without adding headcount.\n                    </p>\n                    <div style=\"display: flex; gap: 10px;\">\n                        <a href=\"#\" class=\"social-icon\"\n                            style=\"width: 34px; height: 34px; border-radius: 8px; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,0.15); color: rgba(255,255,255,0.5); transition: all 0.15s ease;\"\n                            onmouseenter=\"this.style.borderColor='#E85D04'; this.style.color='#E85D04';\"\n                            onmouseleave=\"this.style.borderColor='rgba(255,255,255,0.15)'; this.style.color='rgba(255,255,255,0.5)';\">\n                            <i data-lucide=\"twitter\" style=\"width: 15px; height: 15px;\"></i>\n                        </a>\n                        <a href=\"#\" class=\"social-icon\"\n                            style=\"width: 34px; height: 34px; border-radius: 8px; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,0.15); color: rgba(255,255,255,0.5); transition: all 0.15s ease;\"\n                            onmouseenter=\"this.style.borderColor='#E85D04'; this.style.color='#E85D04';\"\n                            onmouseleave=\"this.style.borderColor='rgba(255,255,255,0.15)'; this.style.color='rgba(255,255,255,0.5)';\">\n                            <i data-lucide=\"linkedin\" style=\"width: 15px; height: 15px;\"></i>\n                        </a>\n                    </div>\n                </div>\n\n                <!-- Product -->\n                <div>\n                    <h4\n                        style=\"color: #E85D04; font-size: 0.75rem; font-weight: 800; margin-bottom: 14px; letter-spacing: 0.08em; text-transform: uppercase;\">\n                        Product</h4>\n                    <ul style=\"list-style: none; display: flex; flex-direction: column; gap: 10px; padding: 0;\">\n                        <li><a href=\"/cases\" class=\"footer-link\">Case Studies</a></li>\n                        <li><a href=\"#\" class=\"footer-link\">Book a\n                                Demo</a></li>\n                        <li><a href=\"#\" class=\"footer-link\">Integrations</a></li>\n                        <li><a href=\"#\" class=\"footer-link\">Changelog</a></li>\n                    </ul>\n                </div>\n\n                <!-- Solutions -->\n                <div>\n                    <h4\n                        style=\"color: #E85D04; font-size: 0.75rem; font-weight: 800; margin-bottom: 14px; letter-spacing: 0.08em; text-transform: uppercase;\">\n                        Solutions</h4>\n                    <ul style=\"list-style: none; display: flex; flex-direction: column; gap: 10px; padding: 0;\">\n                        <li><a href=\"#\" class=\"footer-link\">Outbound\n                                Sales</a></li>\n                        <li><a href=\"#\" class=\"footer-link\">Inbound\n                                Support</a></li>\n                        <li><a href=\"#\" class=\"footer-link\">Pipeline\n                                Generation</a></li>\n                        <li><a href=\"#\" class=\"footer-link\">Customer\n                                Service</a></li>\n                    </ul>\n                </div>\n\n                <!-- Resources -->\n                <div>\n                    <h4\n                        style=\"color: #E85D04; font-size: 0.75rem; font-weight: 800; margin-bottom: 14px; letter-spacing: 0.08em; text-transform: uppercase;\">\n                        Resources</h4>\n                    <ul style=\"list-style: none; display: flex; flex-direction: column; gap: 10px; padding: 0;\">\n                        <li><a href=\"#\" class=\"footer-link\">Documentation</a></li>\n                        <li><a href=\"#\" class=\"footer-link\">API Reference</a></li>\n                        <li><a href=\"#\" class=\"footer-link\">Blog</a></li>\n                        <li><a href=\"/cases\" class=\"footer-link\">Case Studies</a></li>\n                    </ul>\n                </div>\n\n                <!-- Contact -->\n                <div>\n                    <h4\n                        style=\"color: #E85D04; font-size: 0.75rem; font-weight: 800; margin-bottom: 14px; letter-spacing: 0.08em; text-transform: uppercase;\">\n                        Contact Us</h4>\n                    <a href=\"#\" class=\"footer-link\"\n                        style=\"display: flex; align-items: center; gap: 8px; margin-bottom: 12px;\">\n                        <i data-lucide=\"calendar\" style=\"width: 14px; height: 14px; color: #E85D04;\"></i>Schedule a Demo\n                    </a>\n                    <a href=\"mailto:info@muralworksai.com\" class=\"footer-link\"\n                        style=\"display: flex; align-items: center; gap: 8px; margin-bottom: 20px;\">\n                        <i data-lucide=\"mail\" style=\"width: 14px; height: 14px;\"></i>info@muralworksai.com\n                    </a>\n                </div>\n            </div>\n\n            <!-- Trust badges row -->\n            <div style=\"display: flex; gap: 10px; margin-bottom: 28px; flex-wrap: wrap;\">\n                <span class=\"trust-badge\">SOC 2 Type II</span>\n                <span class=\"trust-badge\">GDPR</span>\n                <span class=\"trust-badge\">Stackline CRM</span>\n                <span class=\"trust-badge\">Relay CRM</span>\n            </div>\n\n            <!-- Sub footer -->\n            <div\n                style=\"border-top: 1px solid rgba(255,255,255,0.08); padding-top: 20px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; font-size: 0.75rem; color: rgba(255,255,255,0.3);\">\n                <div>© 2026 MuralWorksAI. All rights reserved. AI workers for sales and support.</div>\n                <div style=\"display: flex; gap: 20px;\">\n                    <a href=\"#\" class=\"footer-sub-link\">Privacy Policy</a>\n                    <a href=\"#\" class=\"footer-sub-link\">Terms of Service</a>\n                    <a href=\"#\" class=\"footer-sub-link\">Cookie Policy</a>\n                </div>\n            </div>\n        </div>\n    </footer>\n\n    <style>\n        .footer-link {\n            color: rgba(255, 255, 255, 0.55);\n            transition: color 0.15s ease;\n            text-decoration: none;\n        }\n\n        .footer-link:hover {\n            color: #E85D04;\n        }\n\n        .footer-sub-link {\n            color: rgba(255, 255, 255, 0.3);\n            transition: color 0.15s ease;\n            text-decoration: none;\n        }\n\n        .footer-sub-link:hover {\n            color: #E85D04;\n        }\n\n        .trust-badge {\n            padding: 4px 12px;\n            border-radius: 9999px;\n            font-size: 0.7rem;\n            font-weight: 600;\n            border: 1px solid rgba(255, 255, 255, 0.12);\n            color: rgba(255, 255, 255, 0.4);\n            background: rgba(255, 255, 255, 0.04);\n        }\n\n        </style>\n\n    <!-- Global JS -->\n    <script>\n        // Initialize Lucide Icons\n        lucide.createIcons();\n\n        // ─────────────────────────────────────────────────────────────\n        // NICE.COM-STYLE MEGA MENU INTERACTIVITY\n        // ─────────────────────────────────────────────────────────────\n        const demoAppBase = \"http://localhost:5175\";\n        let activeSegmentId = 'training';\n\n        const segmentData = {\n            training: {\n                title: \"See Mural Worker for Training Institutes\",\n                desc: \"Automate course enrollments, proactively gather feedback from students, and boost sales with AI.\",\n                statVal: \"3x\",\n                statLbl: \"Increase in course enrollments and sales\",\n                url: \"https://dev-salesworker.crescendoworldwide.com/demo\"\n            },\n            logistic: {\n                title: \"See Mural Worker for Logistics\",\n                desc: \"Autonomous freight dispatch, live load check-ins & 24/7 driver support.\",\n                statVal: \"85%\",\n                statLbl: \"Reduction in manual dispatch & coordinator calls\",\n                url: demoAppBase + \"/logistic-companies\"\n            },\n            exporters: {\n                title: \"See Mural Worker for Exporters\",\n                desc: \"Multilingual trade desk, container customs clearance & international buyer triage.\",\n                statVal: \"40+\",\n                statLbl: \"Global languages spoken fluently in real time\",\n                url: \"/coming-soon\"\n            },\n            industrial: {\n                title: \"See Mural Worker for Industrial Products\",\n                desc: \"Instant technical qualification, spec sheet consultation & distributor routing.\",\n                statVal: \"3.8x\",\n                statLbl: \"Faster quote-to-call response time\",\n                url: demoAppBase + \"/industrial-product-companies\"\n            },\n            realestate: {\n                title: \"See Mural Worker for Real Estate\",\n                desc: \"24/7 buyer capture, site visit booking & instant floor plan/pricing answers.\",\n                statVal: \"42%\",\n                statLbl: \"Increase in scheduled on-site tour appointments\",\n                url: demoAppBase + \"/real-estate-developers\"\n            },\n            education: {\n                title: \"See Mural Worker for Education\",\n                desc: \"Round-the-clock admissions counseling & automated campus services.\",\n                statVal: \"94%\",\n                statLbl: \"First-contact inquiry resolution rate\",\n                url: \"/coming-soon\"\n            },\n            healthcare: {\n                title: \"See Mural Worker for Healthcare\",\n                desc: \"Patient appointment scheduling, pre-op reminders & HIPAA-ready intake.\",\n                statVal: \"60%\",\n                statLbl: \"Reduction in clinic appointment no-shows\",\n                url: demoAppBase + \"/healthcare-providers\"\n            },\n            consulting: {\n                title: \"See Mural Worker for Consulting\",\n                desc: \"Executive partner scheduling, engagement fit screening & proposal follow-up.\",\n                statVal: \"10s\",\n                statLbl: \"Speed-to-lead response for inbound inquiries\",\n                url: \"/coming-soon\"\n            },\n            recruitment: {\n                title: \"See Mural Worker for Recruitment\",\n                desc: \"High-volume phone screens, salary verification & ATS automated synchronization.\",\n                statVal: \"500+\",\n                statLbl: \"Candidate phone screens completed daily\",\n                url: \"/coming-soon\"\n            },\n            insurance: {\n                title: \"See Mural Worker for Insurance\",\n                desc: \"Instant 24/7 FNOL claims intake, coverage advisory & adjuster warm-transfer.\",\n                statVal: \"< 45s\",\n                statLbl: \"Average FNOL claim collection time\",\n                url: \"/coming-soon\"\n            },\n            banking: {\n                title: \"See Mural Worker for Banking\",\n                desc: \"Voice biometric authentication, card freeze & loan qualification screening.\",\n                statVal: \"99.2%\",\n                statLbl: \"Voice biometric accuracy & fraud deterrence\",\n                url: demoAppBase + \"/banking\"\n            },\n            it: {\n                title: \"See Mural Worker for IT & SaaS\",\n                desc: \"Outbound AI SDR cold-dialing, 10s speed-to-lead & Tier-1 helpdesk support.\",\n                statVal: \"10x\",\n                statLbl: \"Outbound pipeline prospecting dial volume\",\n                url: demoAppBase + \"/it-saas-companies\"\n            },\n            government: {\n                title: \"See Mural Worker for Government\",\n                desc: \"311 citizen helpline, DMV scheduling & emergency alert broadcasting.\",\n                statVal: \"24/7\",\n                statLbl: \"Automated public citizen service coverage\",\n                url: demoAppBase + \"/government-public-sector\"\n            },\n            economic: {\n                title: \"See Mural Worker for Economic Development\",\n                desc: \"Inward investment concierge, site selector inquiries & incentive screening.\",\n                statVal: \"3x\",\n                statLbl: \"Increase in qualified corporate site inquiries\",\n                url: demoAppBase + \"/economic-development-agencies\"\n            },\n            promotion: {\n                title: \"See Mural Worker for Industrial Promotion\",\n                desc: \"Expo & conference registrations, B2B buyer matchmaking & member renewals.\",\n                statVal: \"80%\",\n                statLbl: \"Faster delegate RSVP and expo check-in rate\",\n                url: demoAppBase + \"/industrial-promotion-bodies\"\n            }\n        };\n\n        function activateSegment(segmentId) {\n            activeSegmentId = segmentId;\n\n            // 1. Update left sidebar active states\n            document.querySelectorAll('.mega-segment-btn').forEach(btn => {\n                btn.classList.toggle('active', btn.getAttribute('data-segment') === segmentId);\n            });\n\n            // 2. Switch center detail panel\n            document.querySelectorAll('.mega-detail-panel').forEach(panel => {\n                panel.classList.remove('active');\n            });\n            const targetPanel = document.getElementById('detail-' + segmentId);\n            if (targetPanel) {\n                targetPanel.classList.add('active');\n            }\n\n            // 3. Update right spotlight action card\n            const data = segmentData[segmentId];\n            if (data) {\n                const textContent = document.getElementById('spotlight-text-content');\n                const imageContent = document.getElementById('spotlight-image-content');\n                const titleEl = document.getElementById('spotlight-title');\n                const descEl = document.getElementById('spotlight-desc');\n                const statValEl = document.getElementById('spotlight-stat-val');\n                const statLblEl = document.getElementById('spotlight-stat-lbl');\n                const ctaBtn = document.getElementById('spotlight-cta-btn');\n                const imgEl = document.getElementById('spotlight-image');\n\n                if (data.image) {\n                    if (textContent) textContent.style.display = 'none';\n                    if (imageContent) {\n                        imageContent.style.display = 'block';\n                        if (imgEl) imgEl.src = data.image;\n                    }\n                } else {\n                    if (textContent) textContent.style.display = 'block';\n                    if (imageContent) imageContent.style.display = 'none';\n                    if (titleEl) titleEl.textContent = data.title;\n                    if (descEl) descEl.textContent = data.desc;\n                    if (statValEl) statValEl.textContent = data.statVal;\n                    if (statLblEl) statLblEl.textContent = data.statLbl;\n                }\n                \n                if (ctaBtn && data.url) ctaBtn.href = data.url;\n            }\n\n            // Re-render icons if dynamically updated\n            lucide.createIcons();\n        }\n\n        // Initialize with default segment\n        activateSegment('training');\n\n        // Mega menu click & hover handling\n        const megaWrapper = document.getElementById('mega-wrapper');\n        const megaTrigger = document.getElementById('mega-trigger');\n        const megaBackdrop = document.getElementById('mega-backdrop');\n\n        if (megaWrapper && megaTrigger) {\n            megaTrigger.addEventListener('click', (e) => {\n                e.preventDefault();\n                const isOpen = megaWrapper.classList.contains('is-open');\n                if (isOpen) {\n                    closeMegaMenu();\n                } else {\n                    openMegaMenu();\n                }\n            });\n\n            megaWrapper.addEventListener('mouseenter', () => {\n                if (window.innerWidth > 768) {\n                    if (megaBackdrop) megaBackdrop.classList.add('active');\n                }\n            });\n\n            megaWrapper.addEventListener('mouseleave', () => {\n                if (!megaWrapper.classList.contains('is-open')) {\n                    if (megaBackdrop) megaBackdrop.classList.remove('active');\n                }\n            });\n        }\n\n        function openMegaMenu() {\n            if (megaWrapper) megaWrapper.classList.add('is-open');\n            if (megaTrigger) megaTrigger.setAttribute('aria-expanded', 'true');\n            if (megaBackdrop) megaBackdrop.classList.add('active');\n        }\n\n        function closeMegaMenu() {\n            if (megaWrapper) megaWrapper.classList.remove('is-open');\n            if (megaTrigger) megaTrigger.setAttribute('aria-expanded', 'false');\n            if (megaBackdrop) megaBackdrop.classList.remove('active');\n        }\n\n        // Close on ESC or click outside\n        document.addEventListener('click', (e) => {\n            if (megaWrapper && !megaWrapper.contains(e.target) && !e.target.closest('#mega-trigger')) {\n                closeMegaMenu();\n            }\n        });\n\n        // Mobile Segments Accordion Toggle\n        function toggleMobileSegments() {\n            const list = document.getElementById('mobile-seg-list');\n            const icon = document.getElementById('mobile-seg-icon');\n            if (!list) return;\n            const isOpen = list.style.display === 'grid';\n            list.style.display = isOpen ? 'none' : 'grid';\n            if (icon) {\n                icon.style.transform = isOpen ? 'rotate(0deg)' : 'rotate(180deg)';\n                icon.style.transition = 'transform 0.2s ease';\n            }\n            lucide.createIcons();\n        }\n\n        // Navbar Scroll Glass Effect\n        const navbar = document.getElementById('navbar');\n        const isHomePage = false;\n        function handleNavScroll() {\n            if (!isHomePage || window.scrollY > 20) {\n                navbar.classList.add('is-scrolled');\n                navbar.style.background = isHomePage ? 'rgba(255, 255, 255, 0.92)' : 'rgba(255, 255, 255, 0.95)';\n                navbar.style.backdropFilter = 'blur(16px)';\n                navbar.style.webkitBackdropFilter = 'blur(16px)';\n                navbar.style.borderBottom = '1px solid rgba(255, 214, 176, 0.4)';\n                navbar.style.boxShadow = '0 4px 20px rgba(15, 5, 0, 0.04)';\n            } else {\n                navbar.classList.remove('is-scrolled');\n                navbar.style.background = 'transparent';\n                navbar.style.backdropFilter = 'none';\n                navbar.style.webkitBackdropFilter = 'none';\n                navbar.style.borderBottom = '1px solid transparent';\n                navbar.style.boxShadow = 'none';\n            }\n        }\n        window.addEventListener('scroll', handleNavScroll);\n        handleNavScroll();\n\n        // Mobile Menu Toggle\n        const hamburgerBtn = document.getElementById('hamburger-btn');\n        const mobileMenu = document.getElementById('mobile-menu');\n        const hamburgerIcon = document.getElementById('hamburger-icon');\n        let mobileOpen = false;\n\n        hamburgerBtn.addEventListener('click', () => {\n            mobileOpen = !mobileOpen;\n            if (mobileOpen) {\n                mobileMenu.style.display = 'block';\n                hamburgerIcon.setAttribute('data-lucide', 'x');\n            } else {\n                mobileMenu.style.display = 'none';\n                hamburgerIcon.setAttribute('data-lucide', 'menu');\n            }\n            lucide.createIcons(); // re-init icons\n        });\n\n        // Lenis Smooth Scrolling\n        const lenis = new Lenis({\n            duration: 1.2,\n            easing: (t) => Math.min(1, 1.001 - Math.pow(2, -10 * t)),\n            orientation: 'vertical',\n            gestureOrientation: 'vertical',\n            smoothWheel: true,\n            wheelMultiplier: 1,\n            smoothTouch: false,\n            touchMultiplier: 2,\n        });\n\n        function raf(time) {\n            lenis.raf(time);\n            requestAnimationFrame(raf);\n        }\n        requestAnimationFrame(raf);\n    </script>\n        <!-- CONTACT SALES MODAL -->\n<div id=\"contact-sales-modal\" class=\"cs-modal-overlay\" style=\"display:none;\" aria-hidden=\"true\" role=\"dialog\" aria-modal=\"true\">\n    <div class=\"cs-modal-backdrop\" onclick=\"closeContactSalesModal()\"></div>\n    <div class=\"cs-modal-container\">\n        <div class=\"cs-modal-card\">\n            <button type=\"button\" class=\"cs-close-btn\" onclick=\"closeContactSalesModal()\" aria-label=\"Close dialog\">\n                <i data-lucide=\"x\" style=\"width: 17px; height: 17px;\"></i>\n            </button>\n\n            <div class=\"cs-modal-header\">\n                <h3 class=\"cs-title\">Contact Sales</h3>\n                <p class=\"cs-subtitle\">Provide your details and our team will get in touch.</p>\n            </div>\n\n            <div id=\"cs-form-wrapper\">\n                <form id=\"contact-sales-form\" onsubmit=\"handleContactSalesSubmit(event)\" novalidate>\n                    <input type=\"hidden\" name=\"_token\" value=\"uOMYXQZDtuOGSHMOwy04x6k3wrDehnT14DoO78WQ\" autocomplete=\"off\">                    <div class=\"cs-form-group\">\n                        <label for=\"cs_name\" class=\"cs-label\">Name <span class=\"cs-req\">*</span></label>\n                        <input type=\"text\" id=\"cs_name\" name=\"name\" class=\"cs-input\" placeholder=\"Your name\" required>\n                        <div class=\"cs-error\" id=\"err-name\"></div>\n                    </div>\n\n                    <div class=\"cs-form-group\">\n                        <label for=\"cs_email\" class=\"cs-label\">Email Address <span class=\"cs-req\">*</span></label>\n                        <input type=\"email\" id=\"cs_email\" name=\"email\" class=\"cs-input\" placeholder=\"name@company.com\" required>\n                        <div class=\"cs-error\" id=\"err-email\"></div>\n                    </div>\n\n                    <div class=\"cs-form-group\">\n                        <label for=\"cs_phone\" class=\"cs-label\">Phone Number <span class=\"cs-req\">*</span></label>\n                        <input type=\"text\" id=\"cs_phone\" name=\"phone\" class=\"cs-input\" placeholder=\"+1 234 567 8900\" required>\n                        <div class=\"cs-error\" id=\"err-phone\"></div>\n                    </div>\n\n                    <div id=\"cs-form-alert\" class=\"cs-alert\" style=\"display:none;\"></div>\n\n                    <div style=\"margin-top: 16px;\">\n                        <button type=\"submit\" id=\"cs-submit-btn\" class=\"cs-submit-btn\">\n                            <span id=\"cs-submit-label\">Submit</span>\n                            <span id=\"cs-submit-spinner\" style=\"display:none; align-items:center; justify-content:center; gap:8px;\">\n                                <svg class=\"cs-spin-icon\" viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\">\n                                    <circle cx=\"12\" cy=\"12\" r=\"9\" stroke-opacity=\"0.25\"></circle>\n                                    <path d=\"M12 3a9 9 0 0 1 9 9\" stroke-linecap=\"round\"></path>\n                                </svg>\n                                <span>Submitting...</span>\n                            </span>\n                        </button>\n                    </div>\n                </form>\n            </div>\n\n            <div id=\"cs-success-wrapper\" style=\"display:none; text-align:center; padding:24px 12px 12px;\">\n                <div class=\"cs-success-icon-badge\">\n                    <i data-lucide=\"check\" style=\"width: 26px; height: 26px; color: #fff;\"></i>\n                </div>\n                <h3 style=\"font-size: 1.4rem; font-weight: 800; color: #0F0500; margin: 14px 0 4px;\">Thank You!</h3>\n                <p id=\"cs-success-msg\" style=\"font-size: 0.88rem; color: #6B3A1F; line-height: 1.5; margin: 0 auto 16px;\">\n                    Our sales team will contact you shortly.\n                </p>\n                <button type=\"button\" onclick=\"closeContactSalesModal()\" class=\"cs-modal-done-btn\">Done</button>\n            </div>\n        </div>\n    </div>\n</div>\n\n<style>\n    .cs-modal-overlay { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 16px; opacity: 0; transition: opacity 0.25s ease; pointer-events: none; }\n    .cs-modal-overlay.active { opacity: 1; pointer-events: auto; }\n    .cs-modal-backdrop { position: absolute; inset: 0; background: rgba(15, 5, 0, 0.65); backdrop-filter: blur(8px); }\n    .cs-modal-container { position: relative; z-index: 2; width: 100%; max-width: 440px; }\n    .cs-modal-card { background: #ffffff; border-radius: 18px; width: 100%; padding: 20px 24px; position: relative; transform: scale(0.95); transition: transform 0.25s ease; box-shadow: 0 20px 60px rgba(15, 5, 0, 0.25); }\n    .cs-modal-overlay.active .cs-modal-card { transform: scale(1); }\n    .cs-close-btn { position: absolute; top: 16px; right: 16px; background: #f3f4f6; border: none; border-radius: 50%; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; cursor: pointer; }\n    .cs-title { font-size: 1.4rem; font-weight: 800; margin-bottom: 4px; }\n    .cs-subtitle { font-size: 0.9rem; color: #666; margin-bottom: 20px; }\n    .cs-form-group { margin-bottom: 16px; }\n    .cs-label { display: block; font-size: 0.85rem; font-weight: 600; margin-bottom: 6px; }\n    .cs-req { color: #E85D04; }\n    .cs-input { width: 100%; padding: 10px 14px; border: 1px solid #ccc; border-radius: 8px; font-size: 0.95rem; }\n    .cs-input.is-invalid { border-color: #ef4444; }\n    .cs-error { font-size: 0.75rem; color: #ef4444; display: none; margin-top: 4px; }\n    .cs-error.show { display: block; }\n    .cs-submit-btn { width: 100%; padding: 12px; background: linear-gradient(135deg, #E85D04, #FF7A2F); color: #fff; border: none; border-radius: 8px; font-weight: 700; cursor: pointer; }\n    .cs-modal-done-btn { width: 100%; padding: 12px; background: #f3f4f6; border: none; border-radius: 8px; font-weight: 700; cursor: pointer; margin-top: 10px; }\n    .cs-alert { padding: 12px; border-radius: 8px; margin-bottom: 16px; font-size: 0.85rem; }\n    .cs-alert.error { background: #fee2e2; color: #b91c1c; }\n    .cs-success-icon-badge { display: inline-flex; background: #10b981; padding: 12px; border-radius: 50%; margin-bottom: 10px; }\n    @keyframes spin { 100% { transform: rotate(360deg); } }\n    .cs-spin-icon { animation: spin 1s linear infinite; }\n</style>\n\n<script>\n    function openContactSalesModal() {\n        const modal = document.getElementById('contact-sales-modal');\n        if (!modal) return;\n        document.getElementById('cs-form-wrapper').style.display = 'block';\n        document.getElementById('cs-success-wrapper').style.display = 'none';\n        document.getElementById('contact-sales-form').reset();\n        document.querySelectorAll('.cs-error').forEach(e => e.classList.remove('show'));\n        document.querySelectorAll('.cs-input').forEach(e => e.classList.remove('is-invalid'));\n        const alertBox = document.getElementById('cs-form-alert');\n        if (alertBox) alertBox.style.display = 'none';\n        \n        modal.style.display = 'flex';\n        requestAnimationFrame(() => modal.classList.add('active'));\n    }\n\n    function closeContactSalesModal() {\n        const modal = document.getElementById('contact-sales-modal');\n        if (!modal) return;\n        modal.classList.remove('active');\n        setTimeout(() => modal.style.display = 'none', 250);\n    }\n\n    async function handleContactSalesSubmit(e) {\n        e.preventDefault();\n        \n        document.querySelectorAll('.cs-error').forEach(e => e.classList.remove('show'));\n        document.querySelectorAll('.cs-input').forEach(e => e.classList.remove('is-invalid'));\n        const alertBox = document.getElementById('cs-form-alert');\n        if (alertBox) alertBox.style.display = 'none';\n\n        const name = document.getElementById('cs_name').value.trim();\n        const email = document.getElementById('cs_email').value.trim();\n        const phone = document.getElementById('cs_phone').value.trim();\n        let hasError = false;\n\n        if (!name) {\n            document.getElementById('cs_name').classList.add('is-invalid');\n            const err = document.getElementById('err-name');\n            err.textContent = 'Please enter your name.';\n            err.classList.add('show');\n            hasError = true;\n        }\n        if (!email) {\n            document.getElementById('cs_email').classList.add('is-invalid');\n            const err = document.getElementById('err-email');\n            err.textContent = 'Please enter your email.';\n            err.classList.add('show');\n            hasError = true;\n        }\n        if (!phone) {\n            document.getElementById('cs_phone').classList.add('is-invalid');\n            const err = document.getElementById('err-phone');\n            err.textContent = 'Please enter your phone number.';\n            err.classList.add('show');\n            hasError = true;\n        }\n\n        if (hasError) return;\n\n        const submitBtn = document.getElementById('cs-submit-btn');\n        document.getElementById('cs-submit-label').style.display = 'none';\n        document.getElementById('cs-submit-spinner').style.display = 'inline-flex';\n        submitBtn.disabled = true;\n\n        const csrfToken = document.querySelector('meta[name=\"csrf-token\"]')?.getAttribute('content') || '';\n\n        try {\n            const response = await fetch('/contact-sales', {\n                method: 'POST',\n                headers: {\n                    'Content-Type': 'application/json',\n                    'Accept': 'application/json',\n                    'X-CSRF-TOKEN': csrfToken\n                },\n                body: JSON.stringify({ name, email, phone })\n            });\n\n            const data = await response.json();\n\n            if (response.ok && data.success) {\n                document.getElementById('cs-form-wrapper').style.display = 'none';\n                document.getElementById('cs-success-wrapper').style.display = 'block';\n                if (data.message) {\n                    document.getElementById('cs-success-msg').textContent = data.message;\n                }\n            } else {\n                if (alertBox) {\n                    alertBox.className = 'cs-alert error';\n                    alertBox.textContent = data.message || 'Something went wrong. Please try again.';\n                    alertBox.style.display = 'block';\n                }\n            }\n        } catch (err) {\n            if (alertBox) {\n                alertBox.className = 'cs-alert error';\n                alertBox.textContent = 'A network error occurred. Please check your connection and try again.';\n                alertBox.style.display = 'block';\n            }\n        } finally {\n            submitBtn.disabled = false;\n            document.getElementById('cs-submit-label').style.display = 'inline';\n            document.getElementById('cs-submit-spinner').style.display = 'none';\n        }\n    }\n</script>\n  <script src=\"//code.tidio.co/w6s0dqpplrb3n7jnh5yd5lmjnib20nsq.js\" async></script>\n</body>\n\n</html>"}},"props":[],"propValues":[],"route":{"name":"coming-soon","uri":"/coming-soon","action":"\\Illuminate\\Routing\\ViewController","actionSource":{"file":"/home/crescendo/public_html/muralworksai.com/vendor/laravel/framework/src/Illuminate/Routing/ViewController.php","line":32}},"renderSource":null,"componentPath":null}