// Pages.jsx — secondary pages (capabilities, about, contact) so all drawer routes resolve. // (Identical to your file — only CapabilitiesPage was changed: each row is now an // linking to the long-form deep-dive in // content/entries.json. Everything else is preserved.) function PageHeader({ idx, title, lede }) { return (
{idx}

{title}

{lede &&

{lede}

}
); } function CapabilitiesPage({ onNavigate }) { const caps = [ { n: "01", slug: "capability-app-dev", title: "Custom Application Development", body: "Every organization has technology requirements. Some adopt cookie-cutter products. In our experience, custom applications answer requirements far better — especially when the requirements come from the field, not the slide deck.", points: ["Custom application development", "API design & integration", "Mobile-first interfaces", "Operational UX research"] }, { n: "02", slug: "capability-it-risk-management", title: "IT Risk Management", body: "Leaders deal in risk every day. Many organizations fail to review their data infrastructure as vulnerable. We treat unknown risk as the worst kind, and surface it.", points: ["Risk identification & ranking", "Data infrastructure review", "Vendor & supply-chain risk", "Continuous monitoring"] }, { n: "03", slug: "capability-infosec-audit", title: "Information Security Auditing", body: "Organizations must review their information technology controls to keep a competitive edge. Lulius has a unique experience base in these engagements.", points: ["Controls & policy audit", "Penetration & posture review", "Compliance roadmaps", "Independent assessments"] }, { n: "04", slug: "capability-it-strategy", title: "IT Design & Strategy", body: "We've helped commercial, government, and non-profit leaders leverage technology in accomplishing their objectives. Independent review without product bias.", points: ["Technology strategy", "Architecture review", "Initiative diligence", "Organizational design"] }, ]; const go = (slug) => (e) => { e.preventDefault(); onNavigate(`/entry/${slug}`); }; return (
Niche by design.
Operational by necessity.} lede="We don't try to be all things to all customers. Four practices, deep experience, and the discipline to say no to engagements outside them." />
{caps.map((c) => (
{c.n} ——

{c.title}

{c.body}

    {c.points.map((p) => (
  • {p}
    • ))}
→
 ))}
); } function AboutPage({ onNavigate }) { return (
A small firm,
built around operators.} lede="Lulius Innovation is a Veteran-owned company focused on software development and IT consulting. Our employees are some of the industry's most experienced. Our customers fly aircraft, run programs, and answer to commanders." />
01 / Posture

We are veteran-owned and built around people who have shipped in conditions where the work has to hold up. A four-star general sits on our board. The U.S. Army puts our software in the field.

We've been operating from Reno, Nevada since 2014 — quietly, consistently, and on engagements where deep experience compounds.

02 / Board & Recognition
{[ { eyebrow: "BOARD · 2023", title: "Gen. James D. Thurman (Ret.)", body: "Four-star Army general and experienced aviator. Joins a board of other highly decorated veterans working to advance the Lulius mission." }, { eyebrow: "RECOGNITION · 2023", title: "Rich Ferguson — NCET Technologist of the Year", body: "Recognized by the Nevada Center for Entrepreneurship & Technology for sustained contribution to the regional technology community." }, ].map((it) => (
{it.eyebrow}
{it.title}

{it.body}

))}
03 / SkillBridge & Internship Program

A path from
service to shipping software.

Lulius offers multiple internship paths — software development, project management, and product marketing — including DOD SkillBridge placement for transitioning service members.

info@luli.us →
); } function ContactPage({ onNavigate }) { // status: "idle" | "submitting" | "submitted" | "error" const [status, setStatus] = React.useState("idle"); const [errorMsg, setErrorMsg] = React.useState(""); const [form, setForm] = React.useState({ name: "", org: "", email: "", topic: "Engagement", message: "" }); const [hpCheck, setHpCheck] = React.useState(false); // honeypot — must stay false const [turnstileToken, setTurnstileToken] = React.useState(""); const turnstileMountRef = React.useRef(null); const turnstileWidgetIdRef = React.useRef(null); const set = (k) => (e) => setForm({ ...form, [k]: e.target.value }); // Mount Turnstile widget once the script loads. Re-render on each form mount. React.useEffect(() => { let cancelled = false; const mount = () => { if (cancelled || !turnstileMountRef.current || !window.turnstile) return; if (turnstileWidgetIdRef.current !== null) return; turnstileWidgetIdRef.current = window.turnstile.render(turnstileMountRef.current, { sitekey: window.TURNSTILE_SITE_KEY || "", theme: "dark", callback: (token) => setTurnstileToken(token), "error-callback": () => setTurnstileToken(""), "expired-callback": () => setTurnstileToken(""), }); }; if (window.turnstile) { mount(); } else { const i = setInterval(() => { if (window.turnstile) { clearInterval(i); mount(); } }, 150); return () => { cancelled = true; clearInterval(i); }; } return () => { cancelled = true; }; }, [status]); // re-mount when returning from "submitted" → "idle" const submit = async (e) => { e.preventDefault(); if (status === "submitting") return; setStatus("submitting"); setErrorMsg(""); try { const r = await fetch("/api/contact", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ ...form, _hp_check: hpCheck, turnstileToken }), }); const j = await r.json().catch(() => ({ ok: false, error: "Bad server response." })); if (r.ok && j.ok) { setStatus("submitted"); } else { setErrorMsg(j.error || "Something went wrong. Try again in a moment."); setStatus("error"); if (window.turnstile && turnstileWidgetIdRef.current !== null) { window.turnstile.reset(turnstileWidgetIdRef.current); } setTurnstileToken(""); } } catch (err) { setErrorMsg("Network error. Check your connection and try again."); setStatus("error"); } }; const inputStyle = { background: "transparent", border: "none", borderBottom: "1px solid var(--line-2)", color: "var(--paper)", padding: "14px 0 12px", fontFamily: "var(--f-body)", fontSize: 16, width: "100%", outline: "none", }; const labelStyle = { fontFamily: "var(--f-mono)", fontSize: 12, letterSpacing: ".14em", textTransform: "uppercase", color: "var(--mute)", display: "block", marginBottom: 8, }; return (
Open a file.} lede={<>Tell us about the requirement. We'll route it to the right operator. Or { e.preventDefault(); onNavigate("/correspondence"); }} className="accent-text" style={{ textDecoration: "underline", textUnderlineOffset: 4 }}>sign up for our periodic correspondence.} />
{status !== "submitted" ? (
{/* Honeypot — a checkbox (NOT a text input) because Chrome's profile autofill aggressively fills text fields even with autocomplete="off" + data-*-ignore. Checkboxes are immune to that autofill, but naive bots that toggle every input still trip it. */}
{["Engagement", "Platform demo", "SkillBridge", "Press / Other"].map((t) => ( ))}