Front end
Static, hand-built
HTML, CSS custom properties, and vanilla JS. No React, no bundler, no build pipeline.
Build breakdown · No. 01
How this site was built.
We are a new firm, so we have no client case studies yet and will not invent any. What we do have is this site — designed, built, and shipped by us, with two working products running on it. Here is exactly how it is put together.
The stack
No framework. No build step.
Hand-written HTML and CSS, about 200 lines of vanilla JavaScript, and serverless functions at the edge. Nothing to npm install, nothing to keep patched, nothing that breaks when a dependency changes owner.
Edge
Cloudflare Pages Functions
Four serverless endpoints for the agent, the teardown, form intake, and cohort status.
Data & AI
Workers KV + Workers AI
Leads persist to KV. The intake agent runs on Llama 3.3 70B at the edge — no third-party API.
What is running
Two products, live on the page.
Both are things we sell. Neither is a mockup.
01
AI intake agent
Answers questions about the firm, works out what a visitor needs, and routes them. Guardrailed so it will not quote prices or invent case studies, rate-limited per visitor, and it writes a real lead record when someone shares an email — a chat transcript is not a lead.
02
Instant teardown
Fetches any public page and measures it live: response time, document weight, render-blocking scripts, third-party domains, metadata, headings, alt text, structured data. Every number is measured, never estimated. Hardened against SSRF — private ranges, loopback, link-local and non-HTTP schemes are all refused.
Performance budget
The hero video is smaller than most hero images.
Video
0.56 MB
A 7.3MB source, re-encoded to a seamless 20-second loop. Silent, greyscale, faststart, with a WebM alternate at 0.39MB and a poster frame for reduced-motion.
CSS + JS
Under 30 KB
Combined, uncompressed, for the entire site including both live products.
Dependencies
Zero
No libraries in the browser. The only external request is the web font.
Security & correctness
The unglamorous half.
Most of this is invisible to a visitor. It is the part that decides whether a site keeps working.
01
Content Security Policy
Locked to same-origin for scripts, media and connections, with fonts explicitly allowlisted. Plus nosniff, frame-options and a strict referrer policy.
02
Forms fail loudly, never silently
If a submission cannot be persisted, the endpoint returns an error and the form shows an email fallback. A form that says "thanks" while dropping the lead is worse than one that admits it failed.
03
Abuse limits on every open endpoint
Per-IP rate limiting on the agent and the teardown, message and history caps, and honeypot fields on both forms.
04
Accessible by default
Skip links, live regions on the agent and forms, visible focus rings, 44px touch targets on mobile, and a reduced-motion path that holds the video on a still.
Why this page exists
Every firm claims it builds fast, secure, well-made things. Almost none will show you the inside of their own work. This is the same standard we apply to client projects — and if we would not publish how we built our own site, you should not trust us with yours.