// Parallex marketing site — shared React components // All components export to window at the bottom. const { useState, useEffect } = React; // ──────────────────────────────────────────────────────────── // Primitives // ──────────────────────────────────────────────────────────── const Eyebrow = ({ children, className = "", style }) => (
{children}
); const Button = ({ variant = "primary", size = "md", children, onClick, className = "", type = "button" }) => ( ); const Icon = ({ name, size = 20, className = "", style }) => ( ); const SectionHead = ({ eyebrow, title, lede, align = "left" }) => (
{eyebrow && {eyebrow}}

{lede &&

{lede}

}

); // ──────────────────────────────────────────────────────────── // Navigation // ──────────────────────────────────────────────────────────── const NAV_LINKS = [ { id: "services", label: "Services" }, { id: "industries", label: "Industries" }, { id: "work", label: "How we work" }, { id: "technology", label: "Technology" }, { id: "contact", label: "Contact" }, ]; const Nav = ({ activeRoute, onNavigate }) => ( ); // ──────────────────────────────────────────────────────────── // Hero (Home) // ──────────────────────────────────────────────────────────── const OrbitalFrame = () => ( ); const Hero = ({ onCTA, onSecondary }) => (
SYS · PARALLEX_AI v1.0 / DIMENSION SHIFT EST. RUNTIME 2026

Shift your business
into a new dimension.

Parallex runs AI-driven workflows, analytics, and integrations inside the systems your team already uses. Same stack. Higher axis. Automation that adds capacity — not complexity.

Automation Analysis Integration Operations
); // Page hero (smaller, for inner pages) const PageHero = ({ eyebrow, title, lede }) => (
{eyebrow}

{lede &&

{lede}

}

); // ──────────────────────────────────────────────────────────── // Pillars // ──────────────────────────────────────────────────────────── const PILLARS = [ { num: "01", icon: "workflow", title: "AI workflow automation", slug: "automation", body: "Automate support triage, reporting, approvals, and operational workflows inside the systems your team already runs.", scope: ["Process identification", "Automation design", "Tool selection or build", "Monitoring and iteration"] }, { num: "02", icon: "line-chart", title: "Intelligent data analysis", slug: "analysis", body: "Use machine learning to surface trends, anomalies, and forecasts — grounded in your data quality and governance.", scope: ["Analysis design", "Model or pipeline development", "Visualization and reporting", "Handoff to stakeholders"] }, { num: "03", icon: "plug", title: "AI integration", slug: "integration", body: "APIs, middleware, and event-driven flows that plug AI into the software and stack you're already on.", scope: ["API design or consumption", "Middleware", "Event-driven flows", "Security boundaries"] }, { num: "04", icon: "gauge", title: "Smart business operations", slug: "operations", body: "Combine automation with predictive analytics and decision support — always grounded in measurable workflows.", scope: ["Operational diagnostics", "Automation prioritization", "Decision support", "Ongoing optimization"] }, ]; const Pillars = ({ onNavigate }) => (
{PILLARS.map(p => (
onNavigate && onNavigate("services")}>
{p.num}

{p.title}

{p.body}

Read more
))}
); // Detailed services list (Services page) const ServicesDetail = ({ onContact }) => (
{PILLARS.map((p, i) => (
{p.num} / {p.slug.toUpperCase()}

{p.title}

{p.body}

Talk to us about {p.slug}
Scope
    {p.scope.map(s =>
  • {s}
  • )}
))}
); // ──────────────────────────────────────────────────────────── // Industries // ──────────────────────────────────────────────────────────── const INDUSTRIES = [ { name: "Healthcare", body: "Operational workflows, documentation support, and analytics — where regulation applies, we work within it.", examples: ["Care operations dashboards", "Clinical documentation assistance", "Claims and referral workflows"] }, { name: "Finance", body: "Reporting automation, risk-related analytics, and compliance-adjacent workflows.", examples: ["Reporting automation", "Risk-signal analytics", "KYC workflow support"] }, { name: "Retail", body: "Demand signals, inventory and ops analytics, and customer-operations automation.", examples: ["Demand forecasting", "Inventory health alerts", "Support triage and deflection"] }, { name: "Manufacturing", body: "Production and quality data, maintenance planning, and supply visibility.", examples: ["Production quality analytics", "Predictive maintenance inputs", "Supply-chain visibility"] }, ]; const IndustriesTeaser = () => (
{INDUSTRIES.map((ind, i) => (
0{i+1}

{ind.name}

{ind.body}

))}
); const IndustriesDetail = () => (
{INDUSTRIES.map((ind, i) => (
0{i+1}

{ind.name}

{ind.body}

Example problem areas
    {ind.examples.map(e =>
  • {e}
  • )}
))}
); // ──────────────────────────────────────────────────────────── // How we work // ──────────────────────────────────────────────────────────── const STEPS = [ { n: "01", t: "Discovery", b: "Map workflows, data, and where AI actually adds value. Identify constraints before we propose anything." }, { n: "02", t: "Design", b: "Scope the automation, integration points, and measurement. Agree on what 'done' looks like." }, { n: "03", t: "Build", b: "Implement inside your stack. Instrument everything so outcomes are observable, not assumed." }, { n: "04", t: "Deploy", b: "Staged rollout with monitoring and guardrails. Humans stay in the loop where judgment matters." }, { n: "05", t: "Support", b: "Iterate on outcomes as your systems change. Automation is never finished." }, ]; const HowWeWork = () => (
{STEPS.map((s) => (
{s.n}

{s.t}

{s.b}

))}
); // ──────────────────────────────────────────────────────────── // Technology // ──────────────────────────────────────────────────────────── const Technology = () => (
TECHNOLOGY

We're opinionated, not dogmatic.

Cloud-based infrastructure. ML models chosen per use case. Real-time when latency matters. Security and access control that follows your policies.

Cloud
Scalable managed services where they fit. Deployment model follows your requirements.
Machine learning
Models and vendors chosen per workload — no single-stack dogma.
Real-time
Where latency justifies it. Not every use case requires real-time.
Security
Access control and data handling that follow your policies and applicable law.
); // Stack diagram (Technology page) const StackDiagram = () => (
{[ { n: "L4", t: "Experience", b: "Dashboards, assistive UI, workflow surfaces. Where humans intervene and decide." }, { n: "L3", t: "Agents & models", b: "Task-scoped models, retrieval, agents. Chosen per workload, not bet on one stack." }, { n: "L2", t: "Integration", b: "APIs, middleware, event streams. How AI reaches the systems you already run." }, { n: "L1", t: "Data foundation", b: "Sources, quality, access control. Nothing above this layer works without it." }, ].map(l => (
{l.n}

{l.t}

{l.b}

))}
); // ──────────────────────────────────────────────────────────── // Trust — principles, not badges // ──────────────────────────────────────────────────────────── const Trust = () => (
{[ { icon: "shield", t: "Security by design", b: "Access control, audit trails, and data handling aligned with your policies and applicable law." }, { icon: "eye-off", t: "Data minimization", b: "We process only what the workflow requires. Retention is explicit, not incidental." }, { icon: "git-branch", t: "Versioned change", b: "Models, prompts, and pipelines are versioned. Changes are reviewable and reversible." }, { icon: "users", t: "Human-in-the-loop", b: "Automation has escape hatches. People stay in the loop wherever judgment matters." }, ].map(item => (

{item.t}

{item.b}

))}
); // ──────────────────────────────────────────────────────────── // CTA band // ──────────────────────────────────────────────────────────── const CTABand = ({ onContact }) => (

Shift into a new dimension.

Tell us what you're trying to automate. We'll respond within two business days.

); // ──────────────────────────────────────────────────────────── // Contact // ──────────────────────────────────────────────────────────── const Contact = () => { const [state, setState] = useState("idle"); // "idle" | "sending" | "sent" | "error" const [errMsg, setErrMsg] = useState(""); const submit = async (e) => { e.preventDefault(); setState("sending"); const fd = new FormData(e.target); const body = { name: fd.get("name"), email: fd.get("email"), company: fd.get("company"), message: fd.get("message"), }; try { const res = await fetch("/sent-mail.php", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(body), }); if (!res.ok) { const data = await res.json().catch(() => ({})); throw new Error(data.error || "Server error"); } setState("sent"); } catch (err) { setErrMsg(err.message || "Something went wrong. Please try again."); setState("error"); } }; return (
CONTACT

Start a conversation.

Tell us what you're trying to automate. We'll respond within two business days.

EMAIL
support@parallex.in
REGION
Global · English
{state === "sent" ? (

Message received.

Check your inbox — we've sent a confirmation. We'll follow up within two business days.

) : ( <>
{state === "error" && (

⚠ {errMsg}

)} )}
); }; // ──────────────────────────────────────────────────────────── // Footer // ──────────────────────────────────────────────────────────── const Footer = ({ onNavigate }) => ( ); Object.assign(window, { Eyebrow, Button, Icon, SectionHead, Nav, Hero, OrbitalFrame, PageHero, Pillars, ServicesDetail, IndustriesTeaser, IndustriesDetail, HowWeWork, Technology, StackDiagram, Trust, CTABand, Contact, Footer, });