/** Obney marketing UI kit — JSX components. * Visual recreation of a consultancy marketing site using the Obney * design tokens. No existing codebase or Figma was provided, so these * patterns are *applied design system*, not copies. Flag for review. */ const Logo = ({ variant = "default" }) => { const src = variant === "white" ? "../../assets/logos/logo-white.svg" : "../../assets/logos/logo-midnight-and-ocean.svg"; return Obney.ai; }; const Nav = () => (
); const Button = ({ children, variant = "primary", onClick, ...rest }) => { const base = { display: "inline-flex", alignItems: "center", justifyContent: "center", gap: 8, fontFamily: "var(--font-sans)", fontWeight: 600, borderRadius: 999, padding: "11px 22px", border: "1.5px solid transparent", cursor: "pointer", transition: "all 160ms cubic-bezier(.2,.7,.1,1)", fontSize: 15, lineHeight: 1, whiteSpace: "nowrap", }; const variants = { primary: { background: "#142C37", color: "#fff" }, accent: { background: "#68E4E9", color: "#142C37" }, secondary: { background: "#fff", color: "#142C37", borderColor: "#142C37" }, ghost: { background: "transparent", color: "#142C37" }, }; return ; }; const Eyebrow = ({ children, color = "var(--fg-3)" }) => (
{children}
); const Label = ({ children, color = "#142C37", bg = "#F4F7F8" }) => ( {children} ); const Hero = () => (
— Greenfield software · Baton Rouge, LA

Build it once.
Build it to last.

We're a small, opinionated team that builds new software systems with the architectural deliberateness to absorb whatever tooling comes next — without a rebuild every time the landscape shifts.

); const Values = () => { const items = [ { n: "01", title: "Our best, at our expense", body: "If there's a tradeoff to be made, we pick quality. We absorb cost or effort rather than lower the standard." }, { n: "02", title: "Our word is a contract", body: "We say what we mean. If something changes, we communicate early — never letting partners be surprised later." }, { n: "03", title: "Partners, not projects", body: "We make decisions with our partners' long-term interests in mind, even when it's harder for us in the short term." }, { n: "04", title: "Outcomes, not tasks", body: "If it's ours, we see it through. We're responsible for results, not just for doing the work." }, { n: "05", title: "How, not if", body: "We assume problems are solvable. The question isn't whether — it's how to make progress and keep moving." }, ]; return (
— Values

Five rules that shape every greenfield decision we make.

{items.map((it) => (
{it.n}

{it.title}

{it.body}

))}
); }; const CaseStudy = ({ kicker, title, summary, label, tone = "default" }) => { const tones = { default: { bg: "#fff", border: "1px solid var(--border)", fg: "#142C37" }, accent: { bg: "#DCF8F9", border: "1px solid #B5F2F4", fg: "#142C37" }, dark: { bg: "#142C37", border: "none", fg: "#fff" }, }; const t = tones[tone]; return (
{kicker} {label && }

{title}

{summary}

Read the case study →
); }; const Work = () => (
— Selected work

Greenfield systems, built to absorb what's coming.

); const Method = () => (
— The method

Deliberate up front. Replaceable in the middle. Useful at the edges.

{[ { n: "01", t: "Discovery as a deliverable", b: "We document the system before we build it. Architecture decisions become artifacts our partners keep." }, { n: "02", t: "Internal frameworks", b: "Eighteen months of work codified into the patterns we use on every greenfield engagement." }, { n: "03", t: "Built for the next tool", b: "Every interface, schema, and seam is shaped to absorb the tooling that hasn't shipped yet." }, ].map(s => (
{s.n}

{s.t}

{s.b}

))}
); const CTA = () => (
— Let's talk

Bring us
your hardest build.

We take on a small number of greenfield engagements each year. Tell us what you're trying to build — we'll tell you if we're the right team.

); const Footer = () => ( ); const App = () => (
); Object.assign(window, { App, Nav, Hero, Work, Values, Method, CTA, Footer, Button, Label, Eyebrow, CaseStudy, Logo });