// Shared components — Nav, Footer, Wordmark, simple primitives const Wordmark = ({ size = 15, color }) => ( 7ARAKA ); const Eyebrow = ({ children, color }) => ( {children} ); const Button = ({ children, variant = "primary", size, icon, iconRight, onClick, href, type, style, disabled }) => { const cls = `btn btn-${variant} ${size === "lg" ? "btn-lg" : size === "sm" ? "btn-sm" : ""}`; const inner = ( <> {icon && } {children} {iconRight && } ); if (href) return {inner}; return ; }; const ArrowBtn = ({ light, onClick, href, label = "Open" }) => { const cls = `btn-arrow ${light ? "light" : ""}`; if (href) return ; return ; }; // --- Nav --- const NAV_ITEMS = [ { id: "home", label: "Home" }, { id: "about", label: "About" }, { id: "services", label: "Services" }, { id: "testimonials", label: "Testimonials" }, { id: "contact", label: "Contact" }, ]; const Nav = ({ route, navigate }) => { const [menuOpen, setMenuOpen] = React.useState(false); const go = (id) => { setMenuOpen(false); navigate(id); }; return (
{ e.preventDefault(); go("home"); }}>
); }; // --- Footer --- const Footer = ({ navigate }) => ( ); // --- Stat strip used on home + about --- const StatsStrip = ({ items }) => (
{items.map((s, i) => (
{s.num}
{s.label}
))}
); // --- Section heading helper --- const SectionHead = ({ eyebrow, title, kicker, align = "left", maxWidth }) => (
{eyebrow && {eyebrow}}

{title}

{kicker &&

{kicker}

}
); // --- Pillar card --- const PillarCard = ({ icon, label, title, body, dark }) => (
{label}

{title}

{body}

); // --- CTA band (above footer) --- const CTABand = ({ navigate, openApply }) => (

Train smarter, recover stronger, and live with intent.

); // --- Page wrapper handles transition --- const Page = ({ children }) => (
{children}
); Object.assign(window, { Wordmark, Eyebrow, Button, ArrowBtn, Nav, Footer, StatsStrip, SectionHead, PillarCard, CTABand, Page, NAV_ITEMS, });