// Section components for Man + Machine const { useState, useEffect, useRef, useMemo } = React; const Arrow = ({ size = 14 }) => ( ); const Signal = () => ( ); /* Pixel-perfect Man + Machine logo */ function MMLogo({ size = 20, color }) { return ( MAN and MACHINE ); } /* ——— Nav ——— */ function Nav({ active, onNav }) { const [scrolled, setScrolled] = useState(false); useEffect(() => { const f = () => setScrolled(window.scrollY > 40); f(); window.addEventListener("scroll", f, { passive: true }); return () => window.removeEventListener("scroll", f); }, []); return ( ); } /* ——— Hero ——— */ function Hero() { const h = MM_DATA.hero; return (
{h.eyebrow} {h.series}
Pilot Slate · 2026 ◆ Confidential

{h.display[0]} {h.display[1]} {h.display[2]}

{h.deck.map((d, i) => (
0{i+1} / {d.k}

{d.v}

))}

{h.bottomLine}

{ e.preventDefault(); document.getElementById("slate").scrollIntoView({ behavior: "smooth" }); }}> View Pilot Slate { e.preventDefault(); document.getElementById("contact").scrollIntoView({ behavior: "smooth" }); }}> Request Memo
{[...h.ticker, ...h.ticker, ...h.ticker].map((t, i) => ( ◆{t} ))}
); } /* ——— Section header ——— */ function SecHead({ num, label, headline, right, lede }) { return (
{num}—{label}
{headline && (

{headline.map((t, i) => i % 2 === 1 ? {t} : {t})}

)}
{lede &&

{lede}

} {right}
); } /* ——— Thesis ——— */ function Thesis() { const t = MM_DATA.thesis; return (
{t.cells.map((c) => (
{c.n} State

{c.h.map((t, i) => i % 2 === 1 ? {t} : {t})}

{c.p}

— {c.f}
))}
); } /* ——— Why Now ——— */ function WhyNow() { const w = MM_DATA.whyNow; return (

Five forces are open at the same time. They rarely are.

{w.points.map((p, i) => (
0{i+1} · {p.k} {p.v}
))}
); } /* ——— Pilot Slate ——— */ function Slate({ onOpen }) { const [filter, setFilter] = useState("All"); const allTags = ["All", "Craft", "Entertainment", "Hospitality", "Sports", "Wellness", "Impact Tech"]; const tagMap = { Craft: "Craft", Entertainment: "Entertainment", Hospitality: "Hospitality", Sports: "Sports", Wellness: "Wellness", "Impact Tech": "Impact Tech", }; const filtered = filter === "All" ? MM_DATA.pilots : MM_DATA.pilots.filter((p) => p.tag === tagMap[filter]); return (
{allTags.map((t) => ( ))}
{filtered.length} of {MM_DATA.pilots.length} platforms · 2026 slate
{filtered.map((p) => (
onOpen(p)}>
{p.tag} {p.placeholder}
{p.n} · Platform{p.city}

{p.title.map((t, i) => i % 2 === 1 ? {t} : {t})}

{p.signal}

{p.tags.map((t) => {t})}
Open dossier →
))}
); } /* Pilot drawer */ function Drawer({ pilot, onClose }) { useEffect(() => { const k = (e) => e.key === "Escape" && onClose(); if (pilot) window.addEventListener("keydown", k); return () => window.removeEventListener("keydown", k); }, [pilot, onClose]); return (
); } /* ——— Operating model ——— */ function Model() { const m = MM_DATA.model; return (
{m.steps.map((s, i) => (
{s.n}
{s.h}

{s.p}

{i < m.steps.length - 1 && }
))}
); } /* ——— Capital ——— */ function Capital() { const c = MM_DATA.capital; return (

Six reasons capital should care.

We treat audience, archive, and distribution as enterprise assets — not marketing line items. That changes what capital is buying when it backs us.

{c.points.map((p) => (
{p.n}

{p.h}

{p.d}

))}
); } /* ——— Studio / Founder ——— */ function Studio() { const s = MM_DATA.studio; return (
Field Frame 014 ◆ Operator
FIELD PORTRAIT · OPERATOR 4 × 5 — Drop image here
{s.quote.map((t, i) => i === 1 || i === 3 ? {t} : {t})}
{s.chips.map((c) => (
{c.k} {c.v}
))}
); } /* ——— AI Engine ——— */ function Engine() { const e = MM_DATA.engine; return (

Clipper-led distribution. AI-driven throughput.

Independent clippers now power short-form for the largest creators, podcasts, and studios in the world — global pools of tens of thousands of editors paid on verified views. Man + Machine adopts the same model: vetted clippers briefed per asset, AI agents underneath them handling transcription, moment detection, captioning, and scheduling. One field day, hundreds of platform-native cuts, every relevant channel.

{e.note.map((t, i) => i % 2 === 1 ? {t} : {t})}

{e.pipeline.map((p) => (
{p.n}
{p.h}

{p.p}

))}
); } /* ——— Field Notes ——— */ function Notes() { const n = MM_DATA.notes; return (
{n.items.map((it, i) => (
{it.date} · {it.cat}{it.read}
{it.title}

{it.excerpt}

Read note →
))}
); } /* ——— Contact ——— */ function Contact() { const c = MM_DATA.contact; const [form, setForm] = useState({ name: "", firm: "", email: "", capital: "Family Office", interests: [], memo: true, call: false, notes: "" }); const [submitted, setSubmitted] = useState(false); const set = (k, v) => setForm((f) => ({ ...f, [k]: v })); const toggle = (k) => set("interests", form.interests.includes(k) ? form.interests.filter((x) => x !== k) : [...form.interests, k] ); const onSubmit = (e) => { e.preventDefault(); setSubmitted(true); window.scrollTo({ top: document.getElementById("contact").offsetTop - 40, behavior: "smooth" }); }; if (submitted) { return (
◆ Memo request received

The investment memo and pilot slate dossier are on their way.

We'll be in touch within 48 hours from the Athens or New York office. Thank you for the interest — we take these conversations seriously.

); } return (
set("name", e.target.value)} placeholder="Full name" />
set("firm", e.target.value)} placeholder="Firm or family office" />
set("email", e.target.value)} placeholder="you@firm.com" />
{c.capitalTypes.map((t) => ( ))}
{c.interests.map((i) => ( ))}

What happens next.

We respond within 48 hours from our Athens or New York office with a tailored response — investment memo, pilot dossier, or an introductory call with the founder.

Offices
{c.contact.newYork} {c.contact.berlin} {c.contact.athens} {c.contact.bali} {c.contact.email}
Confidential · Investor intake
); } /* ——— Footer ——— */ function Foot() { const l = MM_DATA.legal; return ( ); } Object.assign(window, { Nav, Hero, Thesis, WhyNow, Slate, Drawer, Model, Capital, Studio, Engine, Notes, Contact, Foot, MMLogo });