// V2 — Live Assessment // Animated hero showing the product working: evidence files drop in, // get scanned, controls light up with maturity scores. Confident voice. (function () { const { Icon, Logo, TopNav, Footer, CustomerWall, FRAMEWORK_GROUPS, SAMPLE_CONTROLS } = window.LP; const { useState: useStateLA, useEffect: useEffectLA, useRef: useRefLA } = React; // Cycling animation states for the demo const DEMO_FILES = [ { name: "AWS-IAM-policy-export.json", type: "json", color: "#F4C28A" }, { name: "Q4-access-review.csv", type: "csv", color: "#A8D8A8" }, { name: "incident-runbook.pdf", type: "pdf", color: "#E07A5F" }, { name: "vendor-SOC2-datadog.pdf", type: "pdf", color: "#D4A8D4" }, { name: "training-roster.xlsx", type: "xlsx", color: "#93D2CC" }, ]; function HeroLive({ headline, kicker }) { const [phase, setPhase] = useStateLA("idle"); // idle | dropping | scanning | scoring | done const [activeFile, setActiveFile] = useStateLA(0); const [scoredRows, setScoredRows] = useStateLA({}); const [progress, setProgress] = useStateLA(0); // Master cycle useEffectLA(() => { let timers = []; const cycle = () => { timers.forEach(clearTimeout); setScoredRows({}); setProgress(0); setPhase("dropping"); timers.push(setTimeout(() => setPhase("scanning"), 900)); // Progress bar let p = 0; const progInt = setInterval(() => { p += 1.5 + Math.random() * 2; if (p >= 100) { p = 100; clearInterval(progInt); } setProgress(p); }, 40); timers.push({ clear: () => clearInterval(progInt) }); // Score rows progressively SAMPLE_CONTROLS.slice(0, 6).forEach((c, i) => { timers.push(setTimeout(() => { setScoredRows((r) => ({ ...r, [c.id]: c.score })); }, 1400 + i * 280)); }); timers.push(setTimeout(() => setPhase("done"), 3300)); timers.push(setTimeout(() => { setActiveFile((f) => (f + 1) % DEMO_FILES.length); }, 4400)); }; cycle(); const rep = setInterval(cycle, 5500); return () => { clearInterval(rep); timers.forEach((t) => t.clear ? t.clear() : clearTimeout(t)); }; }, []); return (
{/* Subtle radial mesh */}
{/* Grid pattern */}
{/* Copy */}
{kicker}

{headline.split("|").map((part, i) => ( {part} ))}

Drop in a policy, an export, a screenshot. Control+S maps it to every framework you have, scores maturity, and shows its work.

Watch the 90-sec tour
Free credits to start No card required
{/* Animated demo */}
); } function LiveDemo({ phase, progress, scoredRows, activeFile }) { const file = DEMO_FILES[activeFile]; const scoreColor = (s) => { if (s == null) return { bg: "rgba(255,255,255,0.08)", fg: "rgba(255,255,255,0.5)", ring: "rgba(255,255,255,0.15)" }; if (s >= 4) return { bg: "#93D2CC", fg: "#404C5C", ring: "#93D2CC" }; if (s >= 2) return { bg: "#F4C28A", fg: "#404C5C", ring: "#F4C28A" }; return { bg: "#E07A5F", fg: "#FFFFFF", ring: "#E07A5F" }; }; return (
{/* Glow halo */}
{/* App-window chrome */}
{/* Title bar */}
control+s · live assessment
live
{/* Drop zone */}
{/* File icon */}
{file.type.toUpperCase()} {phase === "scanning" && ( )}

{file.name}

{phase === "dropping" && "Receiving file…"} {phase === "scanning" && "Extracting controls…"} {phase === "scoring" && "Mapping to frameworks…"} {phase === "done" && `Mapped to ${Object.keys(scoredRows).length} controls across 4 frameworks`} {phase === "idle" && "Drop here to assess"}

{Math.round(progress)}%
{/* Progress bar */}
{/* Controls being scored */}
Controls scoring · CIS v8.1.2 {Object.keys(scoredRows).length}/{SAMPLE_CONTROLS.slice(0, 6).length}
{SAMPLE_CONTROLS.slice(0, 6).map((c) => { const score = scoredRows[c.id]; const isScored = score !== undefined; const colors = scoreColor(score); return (
{c.id} {c.title} {isScored && ( AI )} {score == null ? (isScored ? "–" : "?") : score}
); })}
{/* Footer summary */}
Overall maturity
{[1,2,3,4,5].map(n => (
))}
{phase === "done" ? "4.0 / 5" : "— / 5"}
{/* Floating "explanation" tooltip */}

Reasoning

MFA enrolled for 96% of admin users (Okta export, line 412). Lacks step-up auth for billing. Maturity 4.

); } function MetricStrip() { const metrics = [ { v: "11→1", l: "Weeks of audit prep, condensed" }, { v: "3,200+", l: "Controls in our pre-loaded library" }, { v: "<60s", l: "From upload to maturity score" }, { v: "16", l: "Frameworks supported" }, ]; return (
{metrics.map((m, i) => (

{m.v}

{m.l}

))}
); } function HowItWorksLive() { const steps = [ { n: "01", title: "Connect or upload", body: "Pipe in evidence from Okta, AWS, GitHub, KnowBe4, or just drop a PDF. We don't care where it came from.", icon: "upload" }, { n: "02", title: "We do the mapping", body: "Every artifact gets parsed, then matched against every control in every framework you have enabled. Reasoning attached.", icon: "sparkles" }, { n: "03", title: "You review and publish", body: "Accept the score, edit the rationale, or override. Your auditor gets a defensible trail. You get back to work.", icon: "shieldCheck" }, ]; return (

How it works

Drop. Score. Done.

{steps.map((s, i) => (
{/* Connector line */} {i < 2 &&
}
{s.n}

{s.title}

{s.body}

))}
); } function FrameworksLive() { return (

Pre-loaded

16 frameworks. Zero setup.

Enable as many as you need. Map evidence once, score against all.

{FRAMEWORK_GROUPS.flatMap((g) => g.frameworks.map((f) => ({ ...f, category: g.category }))).map((f) => (

{f.name}

{f.publisher}

))}
); } function ClosingLive() { return (

See it work on your evidence.

Free credits to start. Pay only for what you use.

Talk to founder
); } window.LP_Live = function ({ headline, kicker, sectionOrder }) { const sections = { proof: , metrics: , how: , frameworks: , }; return (
{sectionOrder.map((k) => sections[k])}
); }; })();