const { useState: useS, useEffect: useE, useRef: useR } = React; const { Reveal, ChapterHead, SectionWorld, Parallax } = window; /* ---------- Problem ---------- */ function Problem({ copy }) { const p = copy.problem; return (
{p.title[0]}{p.title[1]}{p.title[2]}} lede={p.lede} />
{p.cards.map((c, i) => (
0{i+1}

{c.t}

{c.d}

 ))}
{p.stats.map((s, i) => (
{s.n}
{s.d}
 ))}
); } /* ---------- Solution: animated module switcher ---------- */ function Solution({ copy }) { const s = copy.solution; const [active, setActive] = useS(0); const [auto, setAuto] = useS(true); // auto-rotate useE(() => { if (!auto) return; const id = setInterval(() => setActive(a => (a + 1) % s.modules.length), 5200); return () => clearInterval(id); }, [auto, s.modules.length]); const mod = s.modules[active]; return (
{s.title[0]}{s.title[1]}} lede={s.lede} />
{s.modules.map((m, i) => ( ))}
MODUL_{mod.id}

{mod.t}

{mod.d}

    {mod.features.map((f, i) => (
  • {f}
    • ))}
); } /* ---------- Module visuals (one per tab) ---------- */ function ModuleVisual({ active }) { if (active === 0) return ; if (active === 1) return ; return ; } function ChatVisual() { return (
internal_chat.session_42
Welche Compliance-Auflagen gelten für unseren neuen DACH-Kunden?
Basierend auf der internen Wissensbasis (Policy v3.4): DSGVO Art. 28 Auftragsverarbeitung, ISO 27001 Klausel A.5.34 und das interne Data Residency Memo vom 14.03.2026.
↳ wissensbasis/policy_v3.4.pdf ↳ wissensbasis/data_residency.md
▍ frag etwas internes… PRIVAT
); } function EmailVisual() { return (
● inbox · 12 threads triaged
{[ { from: "Marc L.", subj: "Re: Q3 Roadmap", tag: "REPLIED", time: "vor 2 min" }, { from: "Finance", subj: "INV-2026-0412", tag: "DRAFTED", time: "vor 8 min" }, { from: "Sarah K.", subj: "Onboarding-Workshop", tag: "REPLIED", time: "vor 14 min" }, { from: "Support", subj: "Ticket #8821", tag: "TRIAGED", time: "vor 21 min" } ].map((m, i) => (
{m.from}
{m.subj}
{m.tag} {m.time}
))}
); } function AnalyzerVisual() { const tasks = [ { name: "Rechnungs-Erinnerung", freq: "92×/Monat", roi: 88, status: "auto" }, { name: "Status-Update an PM", freq: "64×/Monat", roi: 72, status: "auto" }, { name: "CRM-Hygiene", freq: "48×/Monat", roi: 55, status: "review" }, { name: "Spesen-Freigabe", freq: "31×/Monat", roi: 41, status: "manual" } ]; return (
analyzer · workflow_mining
{tasks.map((t, i) => (
{t.name}
{t.freq}
{t.status === 'auto' && '◇ AUTOMATISIERBAR'} {t.status === 'review' && '◇ REVIEW'} {t.status === 'manual' && '◇ MANUELL'}
ROI {t.roi}/100
))}
); } /* ---------- How ---------- */ function How({ copy }) { const h = copy.how; return (
{h.title[0]}{h.title[1]}} />
{h.steps.map((s, i) => (
{s.n}

{s.t}

{s.d}

 ))}
); } /* ---------- Security ---------- */ function Security({ copy }) { const s = copy.security; return (
{s.title[0]}{s.title[1]}} lede={s.lede} />
{s.items.map((it, i) => (
{it.t}
{it.d}
 ))}
); } function LockIcon({ i }) { const paths = [ , , , , ]; return {paths[i]}; } function EnclaveVisual({ label, env }) { return (
{label}
{env}
{Array.from({length: 8}).map((_, i) => (
))}
); } /* ---------- Results: animated counters ---------- */ function Counter({ to, suffix, decimals = 0, duration = 1400 }) { const [val, setVal] = useS(0); const ref = useR(null); const started = useR(false); useE(() => { if (!ref.current) return; const io = new IntersectionObserver((entries) => { entries.forEach(e => { if (e.isIntersecting && !started.current) { started.current = true; const start = performance.now(); const tick = (now) => { const t = Math.min((now - start) / duration, 1); const eased = 1 - Math.pow(1 - t, 3); setVal(to * eased); if (t < 1) requestAnimationFrame(tick); }; requestAnimationFrame(tick); } }); }, { threshold: 0.3 }); io.observe(ref.current); return () => io.disconnect(); }, [to, duration]); const display = decimals ? val.toFixed(decimals) : Math.round(val); return {display}{suffix}; } function Results({ copy }) { const r = copy.results; const lang = copy === window.COPY?.en ? 'en' : 'de'; const methodology = lang === 'en' ? "Aggregate across active pilots · Q2 2026" : "Aggregat aus aktiven Piloten · Q2 2026"; return (
{r.title[0]}{r.title[1]}} lede={methodology} />
{r.stats.map((s, i) => (
{s.t}
{s.d}
 ))}
); } /* ---------- Projects ---------- */ function Projects({ copy }) { const p = copy.projects; return (
{p.title[0]}{p.title[1]}} />
B&J
● {p.pilot.toUpperCase()}

{p.name}

{p.desc}

Internal ChatGPT Email Agent Workflow Automation
START Q1 2026
PHASE Live
HOURS/MO 1,240+
{p.more}
{Array.from({length: 3}).map((_, i) => (
[ Q3 / 2026 ]
))}
); } /* ---------- CTA ---------- */ function CTA({ copy }) { const c = copy.cta; return (
{c.eyebrow}

{c.title[0]}{c.title[1]}

{c.lede}
); } Object.assign(window, { Reveal, Problem, Solution, How, Security, Results, Projects, CTA, Counter });