How this thing is built.
Notes on the stack, the fonts, the illustrations and the decisions behind the design. If you're hiring a studio, this is the kind of detail we care about — so we extend the same courtesy back.
Stack
Static Astro 5 build, no client-side framework, no hydration unless strictly needed. The whole site is plain HTML + CSS, with a sprinkle of vanilla JavaScript for the page-intro curtain, the case-study chat animation, and the mobile nav. Served by nginx with HTTP/3. Built and deployed from a self-hosted Git runner.
Type
Zodiak (Italic and Regular, by Indian Type Foundry,
served from Fontshare) carries the display headlines and the
pull-quotes. General Sans (by Indian Type Foundry,
also Fontshare) handles body, UI and the small-caps eyebrows.
Both are self-hosted from /fonts/ — no Google Fonts
request, no third-party CDN.
Color & motion
A small palette anchored on a near-black ink
(#0A1F3D), a paper-white background and one
accent blue (#2563EB) for state, links and the
small italic emphasis. Motion is restrained: a 2.2s page-intro
curtain on first visit, an IntersectionObserver-driven
typewriter on the case study, and standard CSS transitions
on hover. Every animation respects
prefers-reduced-motion: reduce.
Icons & illustration
All icons and the case-study illustration are inline SVG, hand-drawn in the same vector language as the rest of the layout. Zero raster images on the landing page, which keeps the page weight under 35 KB before fonts.
Source
The site is small enough that we don't need a CMS. The blog
is an Astro content collection (src/content/blog/)
with a Zod schema, and the rest of the copy lives directly
in the components. We treat both as code: every change is a
commit, every commit is reviewable.
Credits
Design, build and words by Carlos & Benjamin. Page weight audited with the Chrome DevTools network panel, not with marketing.