const { useState, useEffect, useRef } = window.React; /* ═══════════════════════════════════════════════════════════════════════════ Shared site bits — nav, footer, logo, animated mindmap ═══════════════════════════════════════════════════════════════════════════ */ const LogoGlyph = ({ size = 28 }) => ( ); const Nav = ({ lang, setLang }) => ( ); const Footer = ({ lang }) => ( ); /* ─── Animated mindmap for hero B ───────────────────────────────────────── */ const HeroMindmap = ({ width = 680, height = 520 }) => { const CATS = { issue: "#C9583C", question: "#B8864A", idea: "#8F6FA3", decision: "#536A8A", info: "#7A9A85", aside: "#8A7D86" }; const cx = width / 2, cy = height / 2; const kids = [ { k: "idea", a: -Math.PI/2, l: "Semantic search", g: [{ k: "question", l: "Embeddings drift" }, { k: "decision", l: "Cache layer" }] }, { k: "issue", a: -Math.PI/2 + (2*Math.PI/5), l: "Retrieval latency", g: [{ k: "info", l: "Cold starts" }] }, { k: "decision", a: -Math.PI/2 + (4*Math.PI/5), l: "Eval harness", g: [{ k: "idea", l: "Golden set" }, { k: "aside", l: "Regression" }] }, { k: "info", a: -Math.PI/2 + (6*Math.PI/5), l: "Token pricing" }, { k: "question", a: -Math.PI/2 + (8*Math.PI/5), l: "Why 8k ceiling?" }, ]; const R1 = 150, R2 = 230; const n = kids.map(k => ({ ...k, x: cx + R1*Math.cos(k.a), y: cy + R1*Math.sin(k.a) })); return ( {n.map((k, i) => ( {(k.g || []).map((gk, j) => { const spread = 0.5; const gang = k.a + ((j - ((k.g.length - 1)/2)) * spread / Math.max(1, k.g.length)); const gx = cx + R2 * Math.cos(gang); const gy = cy + R2 * Math.sin(gang); return ( {gk.l} ); })} {k.k === "question" && ( )} {k.l} ))} Context windows ); }; Object.assign(window, { LogoGlyph, Nav, Footer, HeroMindmap });