/* landing-sections.jsx — Compliant AI Readiness landing (rebuild per Site Brief 08).
The destination frontier. Dark frontier, green theme. Eight sections:
§1 Hero → §2 The turn → §3 The standard → §4 The method → §5 Mingi →
§6 Why Minerva → §7 Trust and fit → §8 The close. Foundation crosslink is blue;
Method/Mingi crosslinks are green; Trust Gate is gold, Learning Gate is green.
Conventions: no em-dashes, positive framing, no competitor critique, colons in
headings. Never short-form "Compliant AI Readiness"; never split "Compliant AI Readiness." */
const { WheelMark, NavBar, Btn, Eyebrow, HeadlineDivider, Arrow, Icon, CircuitSVG, SiteFooter, STAGE } = window;
const GREEN = "#3FB1E5"; // accent (sky blue)
const GREEN_LT = "#3FB1E5"; // sky blue for text links on dark
const GOLD = "var(--minerva-gold)";
const BLUE_LT = "#6CA8F0"; // foundation crosslink on dark
const KG_HREF = "/knowledge-governance/";
const DIAG = "/start-a-diagnostic/";
/* Green crosslink (Method / Mingi) */
function GreenLink({ href, children }) {
return (
{children} );
}
/* ── §1 · HERO ───────────────────────────────────────────── */
function HeroSection() {
return (
Compliant AI Readiness · The destination
Compliant AI Readiness is how governed knowledge becomes{" "}
results you can defend.
This is the destination of the Minerva Way. AI runs on the knowledge execution layer as a teammate
under human command, traceable at every step, and built to stand up in an audit.
Start a Diagnostic
HUMANS · AI AGENTS · ROBOTS
Knowledge Execution · Human in command
);
}
/* ── Shared: right-side diagram placeholder ──────────────── */
function DiagramPlaceholder({ label, accent = GREEN }) {
return (
{label}Diagram placeholder
);
}
/* Method diagram — the two gates (Trust + Learning). */
function MethodDiagram() {
return (
The Minerva Way · two gates
);
}
/* Pillar glyphs — reused from the Method page's PillarIcon set. */
function PillarGlyph({ name, c, size = 30 }) {
const common = { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: c,
strokeWidth: 1.6, strokeLinecap: "round", strokeLinejoin: "round", style: { flexShrink: 0, display: "block" } };
if (name === "VISDI") return (
);
if (name === "Mingi") return (
);
if (name === "Ledger") return (
);
return (
);
}
/* Pillars diagram — four pillar tiles around one governed source of truth. */
const PILLAR_SKY = "#3FB1E5", PILLAR_GREEN = "#04975e", PILLAR_GOLD = "var(--minerva-gold)", PILLAR_PURPLE = "#8E86C8";
function PillarsDiagram() {
const tiles = [
["VISDI", PILLAR_SKY, "One governed source of truth"],
["Mingi", PILLAR_GREEN, "The person, in command"],
["Ledger", PILLAR_GOLD, "Provenance for everything"],
["CLV", PILLAR_PURPLE, "Validated over time"],
];
return (
{tiles.map(([name, c, sub]) => (
{name}
{sub}
))}
Four pillars · one governed layer
);
}
/* Products diagram — the three staged product cards, reusing the Products-page card art. */
function ProductsDiagram() {
const cards = [
["Diagnostic", "#E0A230", "assets/products-card-diagnose.png", "See it, plan it, prove it"],
["Connect", "#3FB1E5", "assets/products-card-connect.png", "Build the governed layer"],
["Operate", "#04975e", "assets/products-card-operate.png", "Run it, keep it improving"],
];
return (
{cards.map(([name, c, img, sub], i) => (
{i + 1}{name}
{sub}
))}
One staged path
);
}
/* Shared: compact term + one-liner list */
function PillarList({ items, accent = GREEN }) {
return (
{items.map(([term, line]) => (
{term}{line}
))}
);
}
/* Gold flowchart connector between the band diagrams (Method → Pillars → Products).
Lines are drawn long and clipped at each section's overflow:hidden edge, so they
always meet cleanly at the section boundary regardless of diagram height. */
function FlowConnector({ dir }) {
const GOLDC = "var(--minerva-gold)";
if (dir === "bottom") return (
);
return (
);
}
/* Shared: one text-left / diagram-right band */
function ContentBand({ screenLabel, bg, eyebrow, headline, children, diagramLabel, diagram, flowTop, flowBottom }) {
return (
{eyebrow}
{headline}
{children}
{diagram || }
);
}
/* ── §2 · THE METHOD ─────────────────────────────────────── */
function MethodBand() {
return (
} flowBottom>
The Minerva Way runs inside every engagement.
It takes your knowledge and makes it something your people, your AI, and your machines can all act on,
with two gates that keep it trustworthy.
A person verifies at the Trust Gate before anything acts. The system improves at the Learning Gate as it runs.
See the Method
);
}
/* ── §3 · THE PILLARS ────────────────────────────────────── */
function PillarsBand() {
const pillars = [
["VISDI", "one governed source of truth, served to each reader in its own language."],
["Mingi", "the person, amplified and in command."],
["Ledger", "provenance for every piece of knowledge."],
["CLV", "the validated lifecycle that keeps knowledge trustworthy over time."],
];
return (
} flowTop flowBottom>
Together they hold one governed source of truth, keep the person in command, and keep every result
traceable and current.
See the Pillars
);
}
/* ── §4 · THE PRODUCTS ───────────────────────────────────── */
function ProductsBand() {
const products = [
["Diagnostic", "senses, plans, and executes a slice. Prove the value on your highest-priority area."],
["Connect", "expands by connecting and executing. Build the governed layer for the domain."],
["Operate", "monitors, improves, and learns. Run it and compound it under command."],
];
return (
} flowTop>
The method and the pillars ship as three products. Start with a Diagnostic, expand with Connect, sustain
with Operate. Each one leaves you with governed AI you can prove.
Mingi is the persona you create when you command governed AI. The AI senses, drafts, and proposes.
You direct, verify, and approve. Every step is visible and answerable to you. The result is
your judgment, at greater reach.
Meet Mingi
);
}
/* ── §6 · WHY MINERVA + TRUST AND FIT (consolidated) ─────── */
/* Small corner glyphs for the Why Minerva cards — same 1.6-stroke line style as the pillar glyphs. */
function WhyGlyph({ name, c, size = 26 }) {
const common = { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: c,
strokeWidth: 1.6, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true",
style: { display: "block", flexShrink: 0 } };
if (name === "clock") return (
);
if (name === "loop") return (
);
if (name === "eye") return (
);
return null;
}
function WhyMinervaSection() {
const strengths = [
["Twelve years of regulated depth", "The work done in GxP environments, not just described.", "clock"],
["A visual-digital method built for the AI loop", "One governed source that people, agents, and robots read the same way.", "loop"],
["Run in the open", "An architecture we run on ourselves and publish, gates and record included.", "eye"],
];
return (
Why Minerva
Compliant. Auditable. In command.
Minerva brings what regulated AI actually needs. We show you the gates, the record, and exactly how
it works.
{strengths.map(([t, d, icon]) => (
{icon && }
{t}
{d}
))}
Every solution runs inside the discipline you are already held to. Outputs are verified by a qualified
person, traceable to source, and governed under the same data-integrity rigor extended to context.
);
}
/* ── §8 · THE CLOSE (bridge down + Diagnostic) ───────────── */
function CloseSection() {
return (
The close
Start with a Diagnostic.
Map your knowledge, find the gaps, and see defensible AI proven on your own work. You leave with a
plan and an ROI projection, and nothing changes until you decide it.
![A human hand and a cosmic, star-filled robotic hand cradling a glowing orb]({window.__asset("assets/hero-gi-hands.png")})
![Mingi in three forms]({window.__asset("assets/mingi-trio.png")})
![Scattered knowledge rises through the Minerva Way into executable knowledge, held between a human hand and a governed hand.]({window.__asset("assets/cair-executable-knowledge-stack.png")})