// SYNCAI app — sections + interactivity const { useState, useEffect, useRef } = React; const Wordmark = ({ size = 22, accentHue = 250 }) => ( ); function Nav({ accentHue }) { return ( ); } function Hero({ accentHue, tagline }) { const [time, setTime] = useState(() => new Date()); useEffect(() => { const id = setInterval(() => setTime(new Date()), 1000); return () => clearInterval(id); }, []); const stamp = time.toISOString().replace('T', ' ').slice(0, 19) + 'Z'; return (
⊙ Synchronized Edge · Lab 01

Intelligence,
synchronized
// to the edge.

{tagline}

Explore the stack ↘ Our approach
LIVE · neuro-symbolic inference STREAM_ID 0xA17F
Latency
31ms
Footprint
184KB
Power
64mW
{stamp} LAT 24.7136°N · LON 46.6753°E NODE-04 · primary lab Scroll ↓
); } function Marquee() { const items = [ 'Applied Neuro-Symbolic Intelligence', 'TinyML · TinyGNN · ESP32', 'Domain-specific LLMs', 'Predictive Digital Twins', 'Bio-Informatics & DICOM', 'Hardware-Aware AI', 'Hybrid Reasoning', 'NCAI-grade rigor', ]; const all = [...items, ...items]; return (
{all.map((t, i) => ( {t}◆ ))}
); } function Verticals({ accentHue }) { const [active, setActive] = useState(0); const data = window.SYNCAI_DATA.verticals; const v = data[active]; return (
02 · Technical Verticals

Four directions.
One architectural language.

Every vertical we work in shares the same backbone: hardware-aware design, hybrid reasoning, and a refusal to wrap somebody else's model.

{data.map((d, i) => ( ))}

{v.headline}

◆ {v.essence}

{v.desc}

{v.bullets.map(([k, val]) => (
{k}
{val}
))}
{v.spec.map(([k, val]) => (
{k}_{val}
))}
); } function Approach({ accentHue }) { const stages = window.SYNCAI_DATA.approachStages; const [active, setActive] = useState(0); const refs = useRef([]); useEffect(() => { const obs = new IntersectionObserver( (entries) => { for (const e of entries) { if (e.isIntersecting) { const idx = parseInt(e.target.dataset.idx); if (!isNaN(idx)) setActive(idx); } } }, { rootMargin: '-40% 0px -40% 0px', threshold: 0 } ); refs.current.forEach((el) => el && obs.observe(el)); return () => obs.disconnect(); }, []); return (
03 · The Method

From the device up.
Never from the API down.

Method · stage {String(active + 1).padStart(2, '0')} of 04
{stages[active].step}
{stages.map((s, i) => (
(refs.current[i] = el)} data-idx={i} className={`approach-stage ${i === active ? 'active' : ''}`} >
{s.step}

{s.title}

{s.body}

))}
); } function Cases({ accentHue }) { const data = window.SYNCAI_DATA.cases; const [open, setOpen] = useState(null); return (
04 · Field Deployments

Cases. Not pilots.

Every project ships to production. Every result is measured against operator-grade KPIs, not benchmark leaderboards.

{data.map((c) => (
setOpen(c)}>
{c.id} ↗
{c.title}
{c.meta.map(([k, v]) => (
{k}{v}
))}
{c.tags.map((t) => {t})}
))}
{open && setOpen(null)} accentHue={accentHue} />}
); } function CaseModal({ c, onClose, accentHue }) { useEffect(() => { const k = (e) => e.key === 'Escape' && onClose(); window.addEventListener('keydown', k); document.body.style.overflow = 'hidden'; return () => { window.removeEventListener('keydown', k); document.body.style.overflow = ''; }; }, [onClose]); return (
e.stopPropagation()} style={{background: 'var(--bg)', border: '1px solid var(--line)', borderRadius: 4, maxWidth: 880, width: '100%', maxHeight: '85vh', overflow: 'auto', padding: 40}}>
{c.id} · CASE STUDY

{c.title}

{c.meta.map(([k, v]) => (
{k}
{v}
))}

BRIEF

{c.brief}

OUTCOME

{c.outcome}

{c.tags.map((t) => {t})}
); } function Team() { const data = window.SYNCAI_DATA.team; return (
05 · The People

Engineers, clinicians,
jurists, mariners.

We hire across disciplines because edge intelligence is a discipline-spanning problem. Domain expertise sits inside the team, not behind a consulting wall.

{data.map((p) => (
{p.name}
{p.role}
{p.bio}
))}
); } function Careers() { const data = window.SYNCAI_DATA.careers; const [open, setOpen] = useState(null); return (
06 · Open Roles

Build the next layer
of the lab.

We're a small team optimizing for depth. If you've deployed models into the field — or you've operated systems that needed them — we want to talk.

{data.map((c) => (
setOpen(c)}> {c.id} {c.title} {c.team} {c.loc} →
))}
{open && setOpen(null)} />}
); } function ApplyModal({ role, onClose }) { const [sent, setSent] = useState(false); useEffect(() => { const k = (e) => e.key === 'Escape' && onClose(); window.addEventListener('keydown', k); document.body.style.overflow = 'hidden'; return () => { window.removeEventListener('keydown', k); document.body.style.overflow = ''; }; }, [onClose]); const submit = (e) => { e.preventDefault(); setSent(true); }; return (
e.stopPropagation()} style={{background: 'var(--bg)', border: '1px solid var(--line)', borderRadius: 4, maxWidth: 640, width: '100%', padding: 40}}>
{role.id} · {role.team.toUpperCase()}

{role.title}

{role.loc}
{sent ? (
● APPLICATION RECEIVED

Thanks. We'll respond within 5 business days.

) : (
)}
); } function FormField({ label, name, type = 'text', multiline, required }) { const style = { background: 'var(--bg-2)', border: '1px solid var(--line)', borderRadius: 2, padding: '12px 14px', fontFamily: 'inherit', fontSize: 14, color: 'var(--ink)', outline: 'none', width: '100%', resize: 'vertical', }; return (