// Pricing Toggle (Webseiten-Pakete) function showPricing(type) { const leasing = document.getElementById('pricingLeasing'); const einmalig = document.getElementById('pricingEinmalig'); const btnLeasing = document.getElementById('toggleLeasing'); const btnEinmalig = document.getElementById('toggleEinmalig'); if (type === 'leasing') { leasing.style.display = ''; einmalig.style.display = 'none'; btnLeasing.className = 'btn btn-primary'; btnEinmalig.className = 'btn btn-outline'; } else { leasing.style.display = 'none'; einmalig.style.display = ''; btnLeasing.className = 'btn btn-outline'; btnEinmalig.className = 'btn btn-primary'; } } // Module Toggle (optionale Module — unabhängig vom Webseiten-Modus) function showModules(type) { const monthly = document.getElementById('modulesMonthly'); const onetime = document.getElementById('modulesOneTime'); const btnMonthly = document.getElementById('toggleModulesMonthly'); const btnOneTime = document.getElementById('toggleModulesOneTime'); if (!monthly || !onetime) return; if (type === 'monthly') { monthly.style.display = ''; onetime.style.display = 'none'; btnMonthly.className = 'btn btn-primary'; btnOneTime.className = 'btn btn-outline'; } else { monthly.style.display = 'none'; onetime.style.display = ''; btnMonthly.className = 'btn btn-outline'; btnOneTime.className = 'btn btn-primary'; } } // Sticky header const header = document.getElementById('header'); window.addEventListener('scroll', () => { header.classList.toggle('scrolled', window.scrollY > 20); }); // Mobile menu const mobileToggle = document.getElementById('mobileToggle'); const navMenu = document.getElementById('navMenu'); mobileToggle.addEventListener('click', () => { navMenu.classList.toggle('open'); const isOpen = navMenu.classList.contains('open'); mobileToggle.setAttribute('aria-expanded', isOpen); mobileToggle.setAttribute('aria-label', isOpen ? 'Navigation schliessen' : 'Navigation öffnen'); }); navMenu.querySelectorAll('a').forEach(link => { link.addEventListener('click', () => navMenu.classList.remove('open')); }); // Scroll animations (fade-up) const fadeEls = document.querySelectorAll('.fade-up'); const fadeObserver = new IntersectionObserver((entries) => { entries.forEach((entry, i) => { if (entry.isIntersecting) { setTimeout(() => entry.target.classList.add('visible'), i * 80); fadeObserver.unobserve(entry.target); } }); }, { threshold: 0.15 }); fadeEls.forEach(el => fadeObserver.observe(el)); // === SIMPLE TRANSITION-BASED LOOP === // Just toggles a .show class on/off. CSS transitions handle the rest. function startLoop(elements, showClass, holdMs, hideMs, pauseMs, onShow, onHide) { let active = false; function show() { if (!active) return; // Add show class (CSS transition animates in) elements.forEach(el => el.classList.add(showClass)); if (onShow) onShow(); // After hold time, hide setTimeout(hide, holdMs); } function hide() { if (!active) return; if (onHide) onHide(); // Remove show class (CSS transition animates out) elements.forEach(el => el.classList.remove(showClass)); // After transition out + pause, show again setTimeout(show, hideMs + pauseMs); } return { start() { if (active) return; active = true; show(); } }; } // --- Floating badges --- const floatingBadges = document.querySelectorAll('.fbadge'); const heroVisual = document.querySelector('.hero-visual'); let floatTimer = null; const badgeLoop = startLoop( floatingBadges, 'show', 10000, // 10s sichtbar 1500, // 1.5s für Ausblend-Transition 2000, // 2s Pause () => { // Float-Effekt nach dem Einblenden floatTimer = setTimeout(() => { floatingBadges.forEach(b => b.classList.add('float')); }, 2000); }, () => { clearTimeout(floatTimer); floatingBadges.forEach(b => b.classList.remove('float')); } ); const badgeObserver = new IntersectionObserver((entries) => { if (entries[0].isIntersecting) badgeLoop.start(); }, { threshold: 0.3 }); if (heroVisual) badgeObserver.observe(heroVisual); // --- Score rings (one-shot, no loop) --- const scoreRings = document.querySelectorAll('.score-ring'); const ringObserver = new IntersectionObserver((entries) => { entries.forEach(entry => { if (entry.isIntersecting) { entry.target.classList.add('animated'); const fill = entry.target.querySelector('.ring-fill'); if (fill) { const offset = fill.style.getPropertyValue('--offset'); fill.style.strokeDashoffset = offset; } ringObserver.unobserve(entry.target); } }); }, { threshold: 0.5 }); scoreRings.forEach(ring => ringObserver.observe(ring)); // --- Consequences loop --- const consequences = document.querySelectorAll('.ba-consequence'); const conSection = document.getElementById('baConsequences'); const conLoop = startLoop( consequences, 'show', 10000, 1500, 2000, null, null ); const conObserver = new IntersectionObserver((entries) => { if (entries[0].isIntersecting) conLoop.start(); }, { threshold: 0.3 }); if (conSection) conObserver.observe(conSection); // --- Advantages loop --- const advantages = document.querySelectorAll('.ba-advantage'); const advSection = document.getElementById('baAdvantages'); let barTimers = []; const advLoop = startLoop( advantages, 'show', 10000, 1500, 2000, () => { // Bars wachsen lassen nach Einblenden barTimers = Array.from(advantages).map((adv, i) => setTimeout(() => adv.classList.add('animated'), 500 + i * 200) ); }, () => { barTimers.forEach(t => clearTimeout(t)); advantages.forEach(adv => { adv.classList.remove('animated'); }); } ); const advObserver = new IntersectionObserver((entries) => { if (entries[0].isIntersecting) advLoop.start(); }, { threshold: 0.3 }); if (advSection) advObserver.observe(advSection); // Counters function formatNumber(n) { if (n === 0) return '0'; return n.toString().replace(/\B(?=(\d{3})+(?!\d))/g, "'"); } const counters = document.querySelectorAll('.counter'); let counterStarted = false; function startCounters() { if (counterStarted) return; counterStarted = true; counters.forEach(counter => { const target = parseInt(counter.getAttribute('data-target')); if (target === 0) { counter.textContent = '0'; return; } const duration = 2000; const step = target / (duration / 16); let current = 0; const timer = setInterval(() => { current += step; if (current >= target) { current = target; clearInterval(timer); counter.closest('.stat-item').classList.add('counted'); } counter.textContent = formatNumber(Math.floor(current)); }, 16); }); } const statsBar = document.querySelector('.stats-bar'); const statsObserver = new IntersectionObserver((entries) => { if (entries[0].isIntersecting) { startCounters(); statsObserver.unobserve(statsBar); } }, { threshold: 0.3 }); statsObserver.observe(statsBar); // Form handling — submit to our /api/contact route (proxies to HubSpot CRM) document.getElementById('contactForm').addEventListener('submit', async function(e) { e.preventDefault(); const form = this; const btn = form.querySelector('button[type="submit"]'); const originalText = btn.textContent; btn.textContent = 'Wird gesendet...'; btn.disabled = true; // Split full name into firstname + lastname for HubSpot Contact properties const fullName = (form.name.value || '').trim(); const sp = fullName.indexOf(' '); const firstname = sp > 0 ? fullName.slice(0, sp) : fullName; const lastname = sp > 0 ? fullName.slice(sp + 1) : ''; // Shared event_id für Pixel <-> Conversions-API-Deduplizierung var fbLeadId = (window.crypto && crypto.randomUUID) ? crypto.randomUUID() : ('evt_' + Date.now() + '_' + Math.random().toString(36).slice(2)); // Website-URL tolerant machen: fehlendes Protokoll ergänzen (z.B. "seox.ch" -> "https://seox.ch") var websiteVal = (form.website.value || '').trim(); if (websiteVal && !/^https?:\/\//i.test(websiteVal)) websiteVal = 'https://' + websiteVal; const payload = { firstname, lastname, email: form.email.value, company: form.firma.value, phone: form.telefon.value, industry: form.branche.value, website: websiteVal, message: form.message ? form.message.value : '', fbEventId: fbLeadId, isOrder: false, marketingConsent: (function(){ try { return localStorage.getItem('mop_consent') === 'granted'; } catch(e){ return false; } })(), }; try { const res = await fetch('/api/contact', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(payload), }); if (res.ok) { btn.textContent = 'Erfolgreich gesendet!'; btn.style.background = '#34d399'; if (window.dataLayer) window.dataLayer.push({ event: 'form_submit_success', form_id: 'contactForm' }); if (typeof window.fbq === 'function') window.fbq('track', 'Lead', { content_name: 'Kontaktformular' }, { eventID: fbLeadId }); // Redirect to thank-you page for conversion tracking setTimeout(() => { window.location.href = '/danke'; }, 600); return; } else { const err = await res.json().catch(() => ({})); console.error('[contactForm] API error', res.status, err); btn.textContent = err.error || 'Fehler — bitte erneut versuchen'; btn.style.background = '#ef4444'; } } catch (err) { console.error('[contactForm] Network error', err); btn.textContent = 'Netzwerkfehler'; btn.style.background = '#ef4444'; } setTimeout(() => { btn.textContent = originalText; btn.style.background = ''; btn.disabled = false; }, 4000); }); // ========== KONFIGURATOR ========== (function(){ const kSteps = [ { label: 'Schritt 1 von 4', title: 'Was ist Deine grösste Herausforderung?', sub: 'Wähle alles, was auf Dich zutrifft.', multi: true, options: [ {id:'no-leads', t:'Zu wenig Anfragen', d:'Webseite bringt kaum Leads oder Anrufe'}, {id:'not-found', t:'Online nicht sichtbar', d:'Kunden finden Dich nicht bei Google'}, {id:'old-site', t:'Veraltete Webseite', d:'Design und Technik nicht mehr zeitgemäss'}, {id:'no-time', t:'Keine Zeit / kein Know-how', d:'Du willst Dich auf Dein Business konzentrieren'}, {id:'bad-ads', t:'Werbung bringt nichts', d:'Google Ads laufen, aber ohne messbaren Erfolg'}, {id:'ai-invisible', t:'KI-Suche ignoriert mich', d:'ChatGPT & Co. empfehlen die Konkurrenz'} ] }, { label: 'Schritt 2 von 4', title: 'Wie gross ist Dein Unternehmen?', sub: 'Das hilft uns, den richtigen Umfang einzuschätzen.', multi: false, options: [ {id:'solo', t:'Einzelunternehmen', d:'1 Person, gerade am Starten oder etabliert'}, {id:'small', t:'Kleines KMU (2-10 MA)', d:'Wachsendes Team, lokaler Fokus'}, {id:'medium', t:'Mittleres KMU (11-50 MA)', d:'Mehrere Standorte oder Abteilungen'}, {id:'large', t:'Grösseres Unternehmen (50+)', d:'Nationale/internationale Präsenz'} ] }, { label: 'Schritt 3 von 4', title: 'Wie wichtig ist Dir laufende Betreuung?', sub: 'Damit wir das richtige Modell für Dich finden.', multi: false, options: [ {id:'diy', t:'Ich mach es selbst', d:'Einmalige Webseite, danach übernehme ich'}, {id:'some-help', t:'Etwas Unterstützung', d:'Ab und zu Änderungen und Updates'}, {id:'full-service', t:'Rundum-sorglos', d:'Webseite + Marketing komplett betreut'}, {id:'growth', t:'Wachstumspartner', d:'Ich will aktiv skalieren'} ] }, { label: 'Schritt 4 von 4', title: 'Welches Budget-Modell passt besser?', sub: 'Kein Commitment — nur damit wir Dir den passenden Vorschlag zeigen.', multi: false, options: [ {id:'leasing', t:'Monatlich (Leasing)', d:'Ab CHF 59/Mt., Webseite gratis im Paket, laufende Betreuung'}, {id:'einmalig', t:'Einmalig (Kauf)', d:'Ab CHF 499, volle Eigentumsrechte, Domain & Hosting 12 Mt. gratis'} ] } ]; let kCur = 0; let kSel = {}; let kOptional = {}; function kFmt(n) { return n.toLocaleString('de-CH'); } function kRender() { // Progress bar const bar = document.getElementById('konfigBar'); const totalDots = kSteps.length + 1; bar.innerHTML = ''; for (let i = 0; i < totalDots; i++) { const dot = document.createElement('div'); dot.className = 'konfig-progress-dot' + (i < kCur ? ' done' : (i === kCur ? ' active' : '')); bar.appendChild(dot); } const content = document.getElementById('konfigContent'); const nav = document.getElementById('konfigNav'); if (kCur < kSteps.length) { const s = kSteps[kCur]; const chosen = kSel[kCur] || []; let html = '

' + s.label + '

'; html += '

' + s.title + '

'; html += '

' + s.sub + '

'; html += '

'; s.options.forEach(function(o) { const isSel = chosen.indexOf(o.id) >= 0; html += '

'; html += '

' + o.t + '

'; html += '

' + o.d + '

'; html += '

'; }); html += '

'; content.innerHTML = html; // Click handlers content.querySelectorAll('.konfig-opt').forEach(function(el) { el.addEventListener('click', function() { const step = parseInt(this.dataset.step); const id = this.dataset.id; const multi = this.dataset.multi === 'true'; if (!kSel[step]) kSel[step] = []; if (multi) { const idx = kSel[step].indexOf(id); if (idx >= 0) kSel[step].splice(idx, 1); else kSel[step].push(id); } else { kSel[step] = [id]; } kRender(); }); }); // Navigation let navHtml = ''; if (kCur > 0) { navHtml += ''; } else { navHtml += ''; } navHtml += ''; nav.innerHTML = navHtml; if (kCur > 0) { document.getElementById('konfigBack').addEventListener('click', function() { kCur--; kRender(); }); } var nextBtn = document.getElementById('konfigNext'); nextBtn.addEventListener('click', function() { if ((kSel[kCur] || []).length > 0) { kCur++; kRender(); } }); } else { kShowResult(); } } function kShowResult() { const ch = kSel[0] || []; const size = (kSel[1] || [])[0] || 'small'; const care = (kSel[2] || [])[0] || 'some-help'; const model = (kSel[3] || [])[0] || 'leasing'; const isL = model === 'leasing'; // Determine base package (neue 4-Paket-Struktur) var baseName, basePrice, baseInquiry = false, baseSlug, baseValue, basePages; if (size === 'large' || care === 'growth') { baseName = 'Enterprise'; basePrice = null; baseInquiry = true; baseSlug = 'enterprise'; baseValue = null; basePages = '30+ Seiten (individuell)'; } else if (size === 'medium' || care === 'full-service') { baseName = 'Professional'; basePrice = isL ? 599 : 2899; baseSlug = 'professional'; baseValue = '2\'899'; basePages = 'bis 10 Seiten'; } else if (size === 'small') { baseName = 'Essential'; basePrice = isL ? 399 : 1499; baseSlug = 'essential'; baseValue = '1\'499'; basePages = 'bis 5 Seiten'; } else { baseName = '1 Pager'; basePrice = isL ? 199 : 899; baseSlug = '1pager'; baseValue = '899'; basePages = '1 Landingpage'; } // solo // Pro- vs Light-Variante der Einmal-Kickstarts je nach Grösse/Betreuung var kickPro = (size === 'medium' || size === 'large' || care === 'full-service' || care === 'growth'); // Determine recommended modules var recMods = []; var optMods = []; if (ch.indexOf('not-found') >= 0 || ch.indexOf('no-leads') >= 0) { if (size === 'large' || care === 'full-service' || care === 'growth') { recMods.push(isL ? {id:'seo_pro', n:'SEO Professional', p:799, u:'/Mt.', d:'10 Keywords, Content & Link-Building'} : {id:'seo_kickstart_pro', n:'SEO Kickstart Pro', p:2490, u:' einmalig', d:'Bis 1\'000 Keyword-Analysen + alle Seiten + Audit'}); } else { recMods.push(isL ? {id:'seo_starter', n:'SEO Starter', p:399, u:'/Mt.', d:'3 Keywords mit Ranking-Report'} : {id:'seo_kickstart_light', n:'SEO Kickstart Light', p:1599, u:' einmalig', d:'Bis 100 Keyword-Analysen + On-Page Top-Seiten'}); } } if (ch.indexOf('bad-ads') >= 0) { if (size === 'large' || care === 'growth') { recMods.push(isL ? {id:'sea_pro', n:'SEA Professional', p:599, u:'/Mt.', d:'8 Kampagnen + Remarketing (exkl. Media)'} : {id:'sea_kickstart_pro', n:'SEA Kickstart Pro', p:2590, u:' einmalig', d:'Bis 10 Kampagnen + 100 Keywords + Remarketing'}); } else { recMods.push(isL ? {id:'sea_starter', n:'SEA Starter', p:299, u:'/Mt.', d:'3 Kampagnen (exkl. Media Budget)'} : {id:'sea_kickstart_light', n:'SEA Kickstart Light', p:1699, u:' einmalig', d:'Bis 3 Kampagnen + 30 Keywords + Tracking'}); } } if (ch.indexOf('ai-invisible') >= 0) { recMods.push(isL ? {id:'geo', n:'GEO-Optimierung', p:349, u:'/Mt.', d:'Sichtbarkeit in ChatGPT, Perplexity & Co.'} : {id:'geo_setup', n:'GEO-Setup', p:1490, u:' einmalig', d:'Schema Markup + AI-Snippet Optimierung'}); } // Optional modules (not recommended but available) if (isL) { if (!recMods.find(function(m){ return m.n.indexOf('SEO') >= 0; })) { optMods.push({id:'seo_starter', n:'SEO Starter', p:399, u:'/Mt.', d:'3 Keywords mit Ranking-Report'}); } if (!recMods.find(function(m){ return m.n.indexOf('SEA') >= 0; })) { optMods.push({id:'sea_starter', n:'SEA Starter', p:299, u:'/Mt.', d:'3 Kampagnen (exkl. Media Budget)'}); } if (!recMods.find(function(m){ return m.n.indexOf('GEO') >= 0; })) { optMods.push({id:'geo', n:'GEO-Optimierung', p:349, u:'/Mt.', d:'Sichtbarkeit in KI-Suchmaschinen'}); } if (care === 'full-service' || care === 'growth') { recMods.push({id:'content_social', n:'Content & Social', p:499, u:'/Mt.', d:'4 Blog-Beiträge + 8 Social Posts/Mt.'}); } else { optMods.push({id:'content_social', n:'Content & Social', p:499, u:'/Mt.', d:'4 Blog-Beiträge + 8 Social Posts/Mt.'}); } } else { if (!recMods.find(function(m){ return m.n.indexOf('SEO') >= 0; })) { optMods.push(kickPro ? {id:'seo_kickstart_pro', n:'SEO Kickstart Pro', p:2490, u:' einmalig', d:'Bis 1\'000 Keyword-Analysen + alle Seiten + Audit'} : {id:'seo_kickstart_light', n:'SEO Kickstart Light', p:1599, u:' einmalig', d:'Bis 100 Keyword-Analysen + On-Page Top-Seiten'}); } if (!recMods.find(function(m){ return m.n.indexOf('SEA') >= 0; })) { optMods.push(kickPro ? {id:'sea_kickstart_pro', n:'SEA Kickstart Pro', p:2590, u:' einmalig', d:'Bis 10 Kampagnen + 100 Keywords + Remarketing'} : {id:'sea_kickstart_light', n:'SEA Kickstart Light', p:1699, u:' einmalig', d:'Bis 3 Kampagnen + 30 Keywords + Tracking'}); } if (!recMods.find(function(m){ return m.n.indexOf('GEO') >= 0; })) { optMods.push({id:'geo_setup', n:'GEO-Setup', p:1490, u:' einmalig', d:'Schema Markup + AI-Snippets'}); } } // Alle Module in eine wählbare Liste: empfohlene sind vorausgewählt, // optionale nicht. Der Kunde kann alle an-/abwählen. var allMods = recMods.map(function(m){ return Object.assign({}, m, {rec:true}); }) .concat(optMods.map(function(m){ return Object.assign({}, m, {rec:false}); })); var kModSel = {}; allMods.forEach(function(m, i){ kModSel[i] = m.rec; }); var pUnit = isL ? '/Mt.' : ' einmalig'; function calcTotal() { if (baseInquiry) return null; var t = basePrice; allMods.forEach(function(m, i) { if (kModSel[i]) t += m.p; }); return t; } function selectedMods() { return allMods.filter(function(m, i){ return kModSel[i]; }); } function renderResult() { var total = calcTotal(); var html = '

Deine persönliche Empfehlung

'; html += '

Das passt zu Dir

'; html += '

Basierend auf Deinen Angaben haben wir Module vorausgewählt. Du kannst sie jederzeit an- oder abwählen.

'; // Base var baseDesc = basePages + ' · CR-optimiertes Design, ' + (isL ? 'inkl. Hosting & Pflege' : 'volle Eigentumsrechte'); var basePriceLabel = baseInquiry ? 'Preis auf Anfrage' : ('CHF ' + kFmt(basePrice) + pUnit); html += '

'; html += '

' + baseName + ' Basis

'; html += '

' + baseDesc + '

'; html += '

' + basePriceLabel + '

'; // Module (alle wählbar) allMods.forEach(function(m, i) { var on = kModSel[i]; var tag = m.rec ? '' + (on ? 'Empfohlen' : 'Abgewählt') + '' : '' + (on ? 'Hinzugefügt' : 'Optional') + ''; html += '

'; html += '

' + (on ? '✓ ' : '+ ') + m.n + ' ' + tag + '

'; html += '

' + m.d + '

'; html += '

CHF ' + kFmt(m.p) + m.u + '

'; }); // Gratis-Boni-Hinweis var gifts = []; if (isL) { gifts.push('Webseite GRATIS im Paket' + (baseValue ? ' (Wert CHF ' + baseValue + ')' : '')); var mods = selectedMods(); var hasSeo = mods.some(function(m){ return m.n.indexOf('SEO') >= 0; }); var hasSea = mods.some(function(m){ return m.n.indexOf('SEA') >= 0; }); var kickLabel = kickPro ? 'Pro' : 'Light'; var seoVal = kickPro ? '2\'490' : '1\'599'; var seaVal = kickPro ? '2\'590' : '1\'699'; if (hasSeo) gifts.push('SEO Kickstart ' + kickLabel + ' (Wert CHF ' + seoVal + ')'); if (hasSea) gifts.push('SEA Kickstart ' + kickLabel + ' (Wert CHF ' + seaVal + ')'); } else { gifts.push('Domain & Hosting 12 Monate geschenkt'); } if (gifts.length) { html += '

🎁 Gratis dazu: ' + gifts.join(' + ') + '.

'; } // Total html += '

Gesamt' + (isL ? ' monatlich' : '') + '

'; html += '

' + (baseInquiry ? 'Preis auf Anfrage' : ('CHF ' + kFmt(total) + ' ' + pUnit + '')) + '

'; // Social proof & urgency html += '

87% unserer Kunden mit ähnlichem Profil haben sich für diese Kombination entschieden.

'; html += '

Noch 3 Plätze für kostenlose Erstberatung im Mai verfügbar.

'; // CTA: bestellen mit vorausgewählten Paketen var addonIds = selectedMods().map(function(m){ return m.id; }).filter(Boolean).join(','); var orderUrl = '/bestellen?paket=' + baseSlug + '&modus=' + (isL ? 'leasing' : 'einmalig') + (addonIds ? '&addons=' + addonIds : ''); html += ''; html += ''; html += '

Unverbindlich und kostenlos — in 15 Minuten weisst Du, was möglich ist.

'; content.innerHTML = html; // Modul an-/abwählen content.querySelectorAll('.konfig-result-item[data-mod-idx]').forEach(function(el) { el.addEventListener('click', function() { var idx = parseInt(this.dataset.modIdx); kModSel[idx] = !kModSel[idx]; renderResult(); }); }); // Bestellen -> mit Vorauswahl var orderBtn = content.querySelector('.konfig-btn-cta'); if (orderBtn) orderBtn.addEventListener('click', function(){ window.location.href = this.dataset.orderUrl; }); // Beraten lassen -> Chatbot öffnen var adviseBtn = content.querySelector('.konfig-btn-advise'); if (adviseBtn) adviseBtn.addEventListener('click', function(){ var fab = document.getElementById('chatFab'); if (fab && !document.getElementById('chatWindow').classList.contains('open')) fab.click(); }); } var content = document.getElementById('konfigContent'); renderResult(); // Nav var nav = document.getElementById('konfigNav'); nav.innerHTML = ''; document.getElementById('konfigBackResult').addEventListener('click', function() { kCur--; kRender(); }); document.getElementById('konfigReset').addEventListener('click', function() { kCur = 0; kSel = {}; kOptional = {}; kRender(); }); } // Init kRender(); })(); // ========== CHATBOT ========== (function(){ var fab = document.getElementById('chatFab'); var win = document.getElementById('chatWindow'); var msgs = document.getElementById('chatMessages'); var input = document.getElementById('chatInput'); var sendBtn = document.getElementById('chatSend'); var hint = document.getElementById('chatHint'); var pulse = document.getElementById('chatPulse'); var isOpen = false; var conversationState = 'init'; // --- Chat-Logging (anonym, PII maskiert) --- var SID; try { SID = sessionStorage.getItem('mop_chat_sid'); if (!SID) { SID = (window.crypto && crypto.randomUUID) ? crypto.randomUUID() : (String(Date.now()) + Math.random().toString(16).slice(2)); sessionStorage.setItem('mop_chat_sid', SID); } } catch (e) { SID = String(Date.now()); } function maskPiiClient(s) { return String(s) .replace(/[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}/g, '[email]') .replace(/\+?\d[\d\s()./-]{5,}\d/g, function (m) { var d = m.replace(/\D/g, '').length; return (d >= 7 && d <= 15) ? '[phone]' : m; }); } function trackChat(o) { try { try { if (localStorage.getItem('mop_consent') !== 'granted') return; } catch (e) { return; } var txt = (o.text || '').toString().slice(0, 2000); if (!txt) return; var params = new URLSearchParams(location.search); var payload = { session_id: SID, type: o.type, text: maskPiiClient(txt), intent: o.intent || null, page: location.pathname, referrer: document.referrer || null, utm_source: params.get('utm_source'), utm_medium: params.get('utm_medium'), utm_campaign: params.get('utm_campaign') }; var data = JSON.stringify(payload); if (navigator.sendBeacon) { navigator.sendBeacon('/api/chatlog', new Blob([data], { type: 'application/json' })); } else { fetch('/api/chatlog', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: data, keepalive: true }); } window.dataLayer = window.dataLayer || []; window.dataLayer.push({ event: 'chatbot_message', chat_type: o.type, chat_intent: o.intent || 'unknown' }); } catch (e) {} } // Show hint after 5 seconds setTimeout(function() { if (!isOpen) { hint.classList.add('visible'); } }, 5000); // Hide hint after 12 seconds setTimeout(function() { hint.classList.remove('visible'); }, 12000); fab.addEventListener('click', function() { isOpen = !isOpen; fab.classList.toggle('open', isOpen); win.classList.toggle('open', isOpen); hint.classList.remove('visible'); pulse.style.display = isOpen ? 'none' : ''; if (isOpen && msgs.children.length === 0) { startConversation(); } if (isOpen) input.focus(); }); function addMsg(text, type, quickReplies) { var div = document.createElement('div'); div.className = 'chatbot-msg ' + type; div.innerHTML = text; if (quickReplies && quickReplies.length) { var qr = document.createElement('div'); qr.className = 'chatbot-quick-replies'; quickReplies.forEach(function(r) { var btn = document.createElement('button'); btn.className = 'chatbot-quick-btn'; btn.textContent = r.label; btn.addEventListener('click', function() { addMsg(r.label, 'user'); qr.remove(); trackChat({ type: 'quickreply', text: r.label, intent: 'quickreply' }); if (r.action) r.action(); }); qr.appendChild(btn); }); div.appendChild(qr); } msgs.appendChild(div); msgs.scrollTop = msgs.scrollHeight; } function showTyping() { var div = document.createElement('div'); div.className = 'chatbot-msg bot typing'; div.id = 'typingIndicator'; div.innerHTML = ''; msgs.appendChild(div); msgs.scrollTop = msgs.scrollHeight; } function hideTyping() { var t = document.getElementById('typingIndicator'); if (t) t.remove(); } function botReply(text, quickReplies, delay) { showTyping(); setTimeout(function() { hideTyping(); addMsg(text, 'bot', quickReplies); }, delay || 1200); } function startConversation() { conversationState = 'greeting'; botReply('Hallo! Ich bin der SEOX Berater. Ich helfe Dir, das passende Paket zu finden. Was beschreibt Deine Situation am besten?', [ {label: 'Ich brauche eine neue Webseite', action: function(){ handleNeed('new'); }}, {label: 'Meine Webseite bringt keine Kunden', action: function(){ handleNeed('noconv'); }}, {label: 'Ich will online sichtbarer werden', action: function(){ handleNeed('seo'); }}, {label: 'Ich will einfach mal schauen', action: function(){ handleNeed('browse'); }} ], 600); } function handleNeed(need) { conversationState = 'need-' + need; var responses = { 'new': 'Eine neue Webseite — gute Entscheidung! Wir bauen keine normalen Webseiten, sondern Umsatzmaschinen, die auf Basis von 1\'000+ Datenpunkten optimiert sind.', 'noconv': 'Das hören wir oft. Die meisten Webseiten sind hübsch, aber nicht auf Conversion optimiert. Genau da setzen wir an — mit datenbasierter CR-Optimierung.', 'seo': 'Sichtbarkeit ist der Schlüssel! Wir kombinieren SEO, GEO (KI-Suche) und SEA zu einer Strategie, die Dich überall sichtbar macht.', 'browse': 'Kein Problem! Schau Dich in Ruhe um. Ich bin hier, wenn Du Fragen hast.' }; botReply(responses[need], null, 1000); if (need === 'browse') { setTimeout(function() { botReply('Ein paar Optionen, falls Du doch neugierig bist:', [ {label: 'Was kostet das?', action: function(){ handlePricing(); }}, {label: 'Was macht SEOX anders?', action: function(){ handleUSP(); }}, {label: 'Zum Konfigurator', action: function(){ scrollToKonfig(); }} ]); }, 2000); return; } setTimeout(function() { botReply('Wie möchtest Du am liebsten arbeiten?', [ {label: 'Monatliches Leasing ab 59.-', action: function(){ handleModel('leasing'); }}, {label: 'Einmalig kaufen ab 499.-', action: function(){ handleModel('einmalig'); }}, {label: 'Bin mir unsicher', action: function(){ handleModel('unsure'); }} ]); }, 2800); } function handleModel(model) { conversationState = 'model-' + model; if (model === 'unsure') { botReply('Kein Problem! Unser Konfigurator hilft Dir in 60 Sekunden die perfekte Kombination zu finden. Oder ich kann Dir die Unterschiede erklären.', [ {label: 'Zum Konfigurator', action: function(){ scrollToKonfig(); }}, {label: 'Erkläre die Unterschiede', action: function(){ handleCompare(); }}, {label: 'Lieber persönlich beraten', action: function(){ handleContact(); }} ]); } else { var text = model === 'leasing' ? 'Leasing ist ideal, wenn Du planbare Kosten willst und laufende Betreuung schätzt. Schon ab CHF 59/Mt. startest Du mit dem Starter — und ab CHF 199/Mt. bekommst Du eine CR-optimierte, AI-Ready Webseite gratis im Paket, inkl. Hosting und Pflege.

Mein Tipp: Buchst Du ein SEO- oder SEA-Modul dazu, bekommst Du das passende SEO/SEA Kickstart-Setup gratis (Wert bis CHF 2\'590). 🎁' : 'Einmalig ist perfekt, wenn Du volle Eigentumsrechte willst. Schon ab CHF 499 startest Du mit dem Starter — ab CHF 899 bekommst Du eine CR-optimierte, AI-Ready Webseite mit allen Source Files. Domain & Hosting sind 12 Monate geschenkt. 🎁 SEO- und SEA-Kickstart gibt es als Einmal-Setup dazu.'; botReply(text, [ {label: 'Pakete anschauen', action: function(){ scrollToPricing(); }}, {label: 'Jetzt bestellen', action: function(){ goToBestellen(model); }}, {label: 'Kostenlose Beratung buchen', action: function(){ handleContact(); }} ]); } } function handlePricing() { botReply('Wir haben 5 Pakete — jeweils als Leasing oder Einmalkauf:

' + 'Starter — ab CHF 59/Mt. oder ab CHF 499 · Einstieg (Template, ohne AI-Ready)
' + '1 Pager — ab CHF 199/Mt. oder ab CHF 899 · für Freelancer (AI-Ready)
' + 'Essential — CHF 399/Mt. oder CHF 1\'499 · kleine Unternehmen
' + 'Professional — CHF 599/Mt. oder CHF 2\'899 · KMU (beliebteste Wahl)
' + 'Enterprise — auf Anfrage · grössere Unternehmen

' + '🎁 Im Leasing ist die Webseite gratis, beim Einmalkauf Domain & Hosting 12 Monate. Dazu Module wie SEO (ab 399/Mt.), SEA (ab 299/Mt.) und GEO (349/Mt.).', [ {label: 'Pakete vergleichen', action: function(){ scrollToPricing(); }}, {label: 'Jetzt bestellen', action: function(){ goToBestellen('leasing'); }}, {label: 'Was ist GEO?', action: function(){ handleGEO(); }} ]); } function handleUSP() { botReply('Wir sind keine Webdesign-Agentur, die Dich nach dem Launch allein lässt:

1. Über 25 Jahre SEO-Know-how: Echte Suchmaschinen-Expertise — keine Seite, die niemand findet.
2. Für Google UND KI optimiert: Sichtbar bei Google, Bing und in KI-Suchen wie ChatGPT, Perplexity & Gemini.
3. KI-Power + Experten-Wissen: Wir bauen mit KI schnell — und optimieren mit Erfahrung wirklich performant.
4. Modular & fair: Du zahlst nur, was Du brauchst.', [ {label: 'Was kostet das?', action: function(){ handlePricing(); }}, {label: 'Jetzt bestellen', action: function(){ goToBestellen('leasing'); }}, {label: 'Kostenlose Demo anfordern', action: function(){ handleContact(); }} ]); } function handleGEO() { botReply('GEO (Generative Engine Optimization) sorgt dafür, dass KI-Suchmaschinen wie ChatGPT, Perplexity und Gemini Dein Unternehmen empfehlen. Das ist die Zukunft der Sichtbarkeit — und wir sind einer der wenigen Anbieter in der Schweiz, die das anbieten.', [ {label: 'GEO-Modul buchen', action: function(){ scrollToPricing(); }}, {label: 'Kostenlose Beratung', action: function(){ handleContact(); }} ]); } function handleCompare() { botReply('Leasing (ab CHF 59/Mt.): Planbare Kosten, Webseite gratis im Paket, laufende Betreuung & Hosting inkl. 🎁 Bonus: SEO/SEA Kickstart gratis bei Buchung eines Moduls.

Einmalig (ab CHF 499): Volle Eigentumsrechte, Du bist unabhängig. 🎁 Domain & Hosting 12 Monate geschenkt.', [ {label: 'Leasing wählen', action: function(){ handleModel('leasing'); }}, {label: 'Einmalig wählen', action: function(){ handleModel('einmalig'); }}, {label: 'Jetzt bestellen', action: function(){ goToBestellen('leasing'); }} ]); } function handleContact() { botReply('Sehr gerne! Scroll zum Formular und fordere eine kostenlose Demo an — oder ruf uns direkt an unter +41 79 860 51 65. Wir melden uns innerhalb von 24 Stunden.', [ {label: 'Zum Formular', action: function(){ scrollToContact(); }}, {label: 'Noch eine Frage', action: function(){ handleMoreQ(); }} ]); } function handleMoreQ() { botReply('Klar, frag einfach! Du kannst auch gerne unten eine Nachricht eintippen.', null); } function scrollToKonfig() { addMsg('Ich öffne den Konfigurator für Dich!', 'bot'); setTimeout(function() { document.getElementById('konfigurator').scrollIntoView({behavior:'smooth'}); }, 500); } function goToBestellen(model) { addMsg('Perfekt — ich bringe Dich direkt zur Bestellung. Dort wählst Du Paket und Module in 6 einfachen Schritten.', 'bot'); setTimeout(function() { window.location.href = '/bestellen?modus=' + (model === 'einmalig' ? 'einmalig' : 'leasing'); }, 800); } function scrollToPricing() { addMsg('Hier sind unsere Pakete:', 'bot'); setTimeout(function() { document.getElementById('pakete').scrollIntoView({behavior:'smooth'}); }, 500); } function scrollToContact() { addMsg('Ich bringe Dich zum Formular!', 'bot'); setTimeout(function() { document.getElementById('kontakt').scrollIntoView({behavior:'smooth'}); }, 500); } // Free text input handling // Mirrors the handleFreeText branches so the logged intent matches the shown answer function classifyIntent(text) { var t = (text || '').toLowerCase(); if (t.indexOf('preis') >= 0 || t.indexOf('kost') >= 0 || t.indexOf('budget') >= 0 || t.indexOf('chf') >= 0 || t.indexOf('geld') >= 0) return 'pricing'; if (t.indexOf('seo') >= 0 || t.indexOf('google') >= 0 || t.indexOf('ranking') >= 0 || t.indexOf('sichtbar') >= 0) return 'seo'; if (t.indexOf('sea') >= 0 || t.indexOf('ads') >= 0 || t.indexOf('werbung') >= 0 || t.indexOf('kampagne') >= 0) return 'sea'; if (t.indexOf('geo') >= 0 || t.indexOf('chatgpt') >= 0 || t.indexOf('ki') >= 0 || t.indexOf('perplexity') >= 0 || t.indexOf('gemini') >= 0) return 'geo'; if (t.indexOf('kontakt') >= 0 || t.indexOf('termin') >= 0 || t.indexOf('anruf') >= 0 || t.indexOf('beraten') >= 0 || t.indexOf('demo') >= 0) return 'contact'; if (t.indexOf('leasing') >= 0 || t.indexOf('monatl') >= 0 || t.indexOf('miete') >= 0) return 'leasing'; if (t.indexOf('einmal') >= 0 || t.indexOf('kauf') >= 0 || t.indexOf('eigen') >= 0) return 'einmalig'; if (t.indexOf('unterschied') >= 0 || t.indexOf('vergleich') >= 0) return 'compare'; if (t.indexOf('hallo') >= 0 || t.indexOf('hi') >= 0 || t.indexOf('hey') >= 0 || t.indexOf('grüss') >= 0) return 'greeting'; return 'fallback'; } function handleFreeText(text) { var t = text.toLowerCase(); if (t.indexOf('preis') >= 0 || t.indexOf('kost') >= 0 || t.indexOf('budget') >= 0 || t.indexOf('chf') >= 0 || t.indexOf('geld') >= 0) { handlePricing(); } else if (t.indexOf('seo') >= 0 || t.indexOf('google') >= 0 || t.indexOf('ranking') >= 0 || t.indexOf('sichtbar') >= 0) { botReply('SEO ist mit über 25 Jahren Erfahrung unser Kerngebiet! Als Module gibt es SEO Starter (3 Keywords, CHF 399/Mt.) und SEO Professional (10 Keywords, CHF 799/Mt.).

🎁 Im Leasing bekommst Du bei Buchung eines SEO-Moduls das SEO Kickstart-Setup gratis (Wert bis CHF 2\'490).', [ {label: 'SEO-Modul buchen', action: function(){ goToBestellen('leasing'); }}, {label: 'Mehr zu SEO erfahren', action: function(){ handleUSP(); }} ]); } else if (t.indexOf('sea') >= 0 || t.indexOf('ads') >= 0 || t.indexOf('werbung') >= 0 || t.indexOf('kampagne') >= 0) { botReply('Google Ads gibt es als SEA Starter (3 Kampagnen, CHF 299/Mt.) oder SEA Professional (8 Kampagnen + Remarketing, CHF 599/Mt.). Media Budget exkl.

🎁 Im Leasing bekommst Du bei Buchung eines SEA-Moduls das SEA Kickstart-Setup gratis (Wert bis CHF 2\'590).', [ {label: 'SEA-Modul buchen', action: function(){ goToBestellen('leasing'); }}, {label: 'Kostenlose Beratung', action: function(){ handleContact(); }} ]); } else if (t.indexOf('geo') >= 0 || t.indexOf('chatgpt') >= 0 || t.indexOf('ki') >= 0 || t.indexOf('perplexity') >= 0 || t.indexOf('gemini') >= 0) { handleGEO(); } else if (t.indexOf('kontakt') >= 0 || t.indexOf('termin') >= 0 || t.indexOf('anruf') >= 0 || t.indexOf('beraten') >= 0 || t.indexOf('demo') >= 0) { handleContact(); } else if (t.indexOf('leasing') >= 0 || t.indexOf('monatl') >= 0 || t.indexOf('miete') >= 0) { handleModel('leasing'); } else if (t.indexOf('einmal') >= 0 || t.indexOf('kauf') >= 0 || t.indexOf('eigen') >= 0) { handleModel('einmalig'); } else if (t.indexOf('unterschied') >= 0 || t.indexOf('vergleich') >= 0) { handleCompare(); } else if (t.indexOf('hallo') >= 0 || t.indexOf('hi') >= 0 || t.indexOf('hey') >= 0 || t.indexOf('grüss') >= 0) { botReply('Hallo! Schön, dass Du da bist. Wie kann ich Dir helfen?', [ {label: 'Was kostet das?', action: function(){ handlePricing(); }}, {label: 'Was macht SEOX anders?', action: function(){ handleUSP(); }}, {label: 'Konfigurator starten', action: function(){ scrollToKonfig(); }} ]); } else { botReply('Gute Frage! Für eine detaillierte Antwort empfehle ich Dir ein kostenloses Beratungsgespräch. Oder versuch es mit dem Konfigurator — der findet in 60 Sekunden Dein ideales Paket.', [ {label: 'Kostenlose Beratung', action: function(){ handleContact(); }}, {label: 'Konfigurator starten', action: function(){ scrollToKonfig(); }}, {label: 'Pakete anschauen', action: function(){ scrollToPricing(); }} ]); } } function sendMessage() { var text = input.value.trim(); if (!text) return; addMsg(text, 'user'); input.value = ''; trackChat({ type: 'freetext', text: text, intent: classifyIntent(text) }); handleFreeText(text); } sendBtn.addEventListener('click', sendMessage); input.addEventListener('keydown', function(e) { if (e.key === 'Enter') sendMessage(); }); })(); // ========== ADVANCED ANIMATIONS ========== // --- Particle Background (deferred until idle to protect LCP) --- (function() { const canvas = document.getElementById('heroParticles'); if (!canvas) return; const boot = () => initParticles(canvas); if ('requestIdleCallback' in window) { requestIdleCallback(boot, { timeout: 2500 }); } else { setTimeout(boot, 800); } })(); function initParticles(canvas) { const ctx = canvas.getContext('2d'); let w, h, particles = [], animId; const PARTICLE_COUNT = 45; const CONNECT_DIST = 120; const pink = [212, 35, 138]; const white = [249, 250, 252]; function resize() { const hero = document.getElementById('hero'); w = canvas.width = hero.offsetWidth; h = canvas.height = hero.offsetHeight; } function createParticle() { const useWhite = Math.random() > 0.5; const c = useWhite ? white : pink; return { x: Math.random() * w, y: Math.random() * h, vx: (Math.random() - 0.5) * 0.4, vy: (Math.random() - 0.5) * 0.4, r: Math.random() * 2 + 0.5, color: c, alpha: Math.random() * 0.4 + 0.1 }; } function init() { resize(); particles = []; for (let i = 0; i < PARTICLE_COUNT; i++) particles.push(createParticle()); } function draw() { ctx.clearRect(0, 0, w, h); // Connections for (let i = 0; i < particles.length; i++) { for (let j = i + 1; j < particles.length; j++) { const dx = particles[i].x - particles[j].x; const dy = particles[i].y - particles[j].y; const dist = Math.sqrt(dx * dx + dy * dy); if (dist < CONNECT_DIST) { const opacity = (1 - dist / CONNECT_DIST) * 0.12; ctx.beginPath(); ctx.moveTo(particles[i].x, particles[i].y); ctx.lineTo(particles[j].x, particles[j].y); ctx.strokeStyle = 'rgba(' + pink.join(',') + ',' + opacity + ')'; ctx.lineWidth = 0.5; ctx.stroke(); } } } // Particles particles.forEach(p => { p.x += p.vx; p.y += p.vy; if (p.x < 0 || p.x > w) p.vx *= -1; if (p.y < 0 || p.y > h) p.vy *= -1; ctx.beginPath(); ctx.arc(p.x, p.y, p.r, 0, Math.PI * 2); ctx.fillStyle = 'rgba(' + p.color.join(',') + ',' + p.alpha + ')'; ctx.fill(); }); animId = requestAnimationFrame(draw); } // Only run when hero is visible const heroObs = new IntersectionObserver((entries) => { if (entries[0].isIntersecting) { if (!animId) draw(); } else { cancelAnimationFrame(animId); animId = null; } }, { threshold: 0 }); heroObs.observe(document.getElementById('hero')); init(); window.addEventListener('resize', function() { resize(); particles.forEach(p => { if (p.x > w) p.x = w - 10; if (p.y > h) p.y = h - 10; }); }); } // --- Hero Cursor Glow --- (function() { const hero = document.getElementById('hero'); const glow = document.getElementById('heroGlow'); if (!hero || !glow) return; hero.addEventListener('mousemove', function(e) { const rect = hero.getBoundingClientRect(); glow.style.left = (e.clientX - rect.left - 175) + 'px'; glow.style.top = (e.clientY - rect.top - 175) + 'px'; }); })(); // --- 3D Tilt on Cards --- (function() { const cards = document.querySelectorAll('.pricing-card, .addon-card, .process-step, .alps-phase-content'); cards.forEach(card => { card.addEventListener('mousemove', function(e) { const rect = card.getBoundingClientRect(); const x = e.clientX - rect.left; const y = e.clientY - rect.top; const cx = rect.width / 2; const cy = rect.height / 2; const rotateX = ((y - cy) / cy) * -5; const rotateY = ((x - cx) / cx) * 5; card.style.transform = 'perspective(800px) rotateX(' + rotateX + 'deg) rotateY(' + rotateY + 'deg) scale(1.02)'; }); card.addEventListener('mouseleave', function() { card.style.transform = 'perspective(800px) rotateX(0) rotateY(0) scale(1)'; }); }); })(); // --- Magnetic Button Effect --- (function() { var btns = document.querySelectorAll('.btn-primary, .btn-outline'); btns.forEach(function(btn) { btn.addEventListener('mousemove', function(e) { var rect = btn.getBoundingClientRect(); var x = e.clientX - rect.left - rect.width / 2; var y = e.clientY - rect.top - rect.height / 2; btn.style.transform = 'translate(' + (x * 0.15) + 'px, ' + (y * 0.15) + 'px)'; }); btn.addEventListener('mouseleave', function() { btn.style.transform = 'translate(0, 0)'; }); }); })(); // --- Glow Dividers between sections --- (function() { var sections = document.querySelectorAll('.section, .section-alt'); sections.forEach(function(sec) { if (!sec.previousElementSibling || !sec.previousElementSibling.classList.contains('section') && !sec.previousElementSibling.classList.contains('section-alt')) return; var divider = document.createElement('div'); divider.className = 'glow-divider'; sec.parentNode.insertBefore(divider, sec); }); })(); // ========== AI-CHECK HERO TOOL (Round 1 + Round 2) ========== (function(){ var form = document.getElementById('aiCheckForm'); if (!form) return; var btn = document.getElementById('aiCheckBtn'); var input = document.getElementById('aiCheckUrl'); var resultEl = document.getElementById('aiCheckResult'); var STATUS_MAP = { visible: { cls: 'good', icon: '✅', label: 'AI-empfohlen' }, partial: { cls: 'warn', icon: '⚠️', label: 'Teilweise sichtbar' }, absent: { cls: 'bad', icon: '❌', label: 'Nicht in KI-Empfehlungen' } }; // Cache aus Round 1 für Round 2 (Domain + strukturiertes ChatGPT-Result) var lastDomain = ''; var lastResult = null; function setLoading(on) { btn.disabled = on; var t = btn.querySelector('.aic-btn-text'); if (t) t.hidden = on; var s = btn.querySelector('.aic-btn-spinner'); if (s) s.hidden = !on; } function esc(s){ return (s||'').replace(/&/g,'&').replace(//g,'>'); } function render(html) { resultEl.innerHTML = html; resultEl.hidden = false; resultEl.scrollIntoView({behavior:'smooth', block:'nearest'}); } // Status-aware sales pitch under the AI-check result. Drives directly to the // #kontakt sales form (not to the multi-LLM Round-2 detail report — that // backend is preserved but no longer surfaced as the primary CTA). var PITCH = { absent: { icon: '⚡', head: 'Deine Webseite ist nicht in KI-Empfehlungen.', sub: 'Das kostet Dich heute schon Kunden. Im kostenlosen Strategie-Call zeigen wir, wie wir Dich AI-Ready machen — inkl. persönlicher Demo-Webseite.' }, partial: { icon: '🚀', head: 'Du bist drin — aber nicht an vorderster Stelle.', sub: 'Genau hier verlierst Du Anfragen an die Top-3. Im kostenlosen Strategie-Call zeigen wir, wie wir Dich nach vorne bringen — inkl. Demo-Webseite & Plan.' }, visible: { icon: '📈', head: 'Top-Platzierung. Jetzt verteidigen & skalieren.', sub: 'Vorsprung in KI-Empfehlungen ist kein Selbstläufer. Im kostenlosen Strategie-Call besprechen wir, wie Du Deine Position ausbaust — inkl. Demo-Webseite.' } }; function unlockBox(domain, status) { var p = PITCH[status] || PITCH.absent; return '

' + '' + '

' + ''+esc(p.head)+'' + ''+esc(p.sub)+'' + '

' + '' + '

'; } function renderStructured(data) { var r = data.result; var domain = esc(data.domain || ''); var s = STATUS_MAP[r.status] || STATUS_MAP.absent; var competitorsHtml = (r.competitors && r.competitors.length) ? r.competitors.map(function(c){ return '

'+esc(c)+'

'; }).join('') : '

keine direkten Mitbewerber gefunden

'; var gapHtml = r.gap ? '

⚡ Grösste Lücke '+esc(r.gap)+'

' : ''; var html = '

' + '

'+s.label+'

' + '

'+domain+'

' + '

'+esc(r.summary)+'

' + '

Branche

'+esc(r.branche || '—')+'

' + '

KI-Position

'+esc(r.position || '—')+'

' + '

Stattdessen empfohlen

'+competitorsHtml+'

' + '

' + gapHtml + unlockBox(data.domain || '', r.status); render(html); } function renderProse(data) { var domain = esc(data.domain || ''); var answer = esc(data.answer || '').replace(/\n/g,'
'); render('

ChatGPT-Antwort · '+domain+'

'+answer+'

'+unlockBox(data.domain || '', 'absent')); } // Round 2 — Lead-Form HTML function round2FormHtml() { return '

' + '

' + '🔓 Detailbericht freischalten' + 'Wir analysieren auch Perplexity + Gemini, schicken Dir den Report per E-Mail und Du bekommst direkt einen 30-Min-Strategie-Call dazu — kostenlos.' + '

' + '' + '

'; } function openRound2() { var ub = resultEl.querySelector('.aic-unlock-box'); if (!ub) return; var wrap = document.createElement('div'); wrap.innerHTML = round2FormHtml(); ub.parentNode.replaceChild(wrap.firstChild, ub); var f = document.getElementById('aiCheckFullForm'); if (!f) return; f.addEventListener('submit', submitRound2); var firstInput = f.querySelector('input[name="name"]'); if (firstInput) firstInput.focus(); if (window.dataLayer) window.dataLayer.push({event:'ai_check_unlock_opened', ai_check_domain: lastDomain}); } function submitRound2(e) { e.preventDefault(); var f = e.currentTarget; var sb = f.querySelector('.aic-r2-submit'); var sbTxt = sb.querySelector('.aic-r2-btn-text'); var sbSp = sb.querySelector('.aic-btn-spinner'); var errEl = document.getElementById('aicR2Err'); function setSubLoading(on) { sb.disabled = on; if (sbTxt) sbTxt.hidden = on; if (sbSp) sbSp.hidden = !on; } function showErr(msg) { if (errEl) { errEl.textContent = msg; errEl.hidden = false; } } if (errEl) errEl.hidden = true; setSubLoading(true); var fd = new FormData(f); var payload = { domain: lastDomain, name: (fd.get('name')||'').toString().trim(), email: (fd.get('email')||'').toString().trim(), phone: (fd.get('phone')||'').toString().trim(), company: (fd.get('company')||'').toString().trim(), website_url2: (fd.get('website_url2')||'').toString(), chatgpt_result: lastResult }; if (window.dataLayer) window.dataLayer.push({event:'ai_check_full_submitted', ai_check_domain: lastDomain}); fetch('/api/ai-check-full', { method:'POST', headers:{'Content-Type':'application/json'}, body: JSON.stringify(payload) }) .then(function(r){ return r.json().then(function(d){ return {ok:r.ok, data:d}; }); }) .then(function(o) { if (!o.data.ok) { setSubLoading(false); showErr(o.data.error || 'Etwas ist schiefgelaufen, bitte erneut versuchen.'); return; } renderFullReport(o.data); if (window.dataLayer) window.dataLayer.push({event:'ai_check_full_completed', ai_check_domain: o.data.domain}); }) .catch(function(){ setSubLoading(false); showErr('Netzwerk-Fehler, bitte erneut versuchen.'); }); } function llmCard(llm, r) { if (!r) { return '

'+esc(llm)+'

Keine Antwort erhalten — wir prüfen das manuell im Strategie-Call.

'; } var s = STATUS_MAP[r.status] || STATUS_MAP.absent; var compHtml = (r.competitors && r.competitors.length) ? r.competitors.map(function(c){ return '

'+esc(c)+'

'; }).join('') : '

keine

'; var gapHtml = r.gap ? '

⚡ '+esc(r.gap)+'

' : ''; return '

' + '

'+esc(llm)+' '+s.label+'

' + '

'+esc(r.summary)+'

' + '

'+ '

KI-Position'+esc(r.position || '—')+'

'+ '

Welches Paket passt zu dir?