v2 · foundation
Dark field, three signals,
one body of colour.
Every ratio below was measured at runtime from the rendered pixels behind each text node, not calculated from the stylesheet — because on a moving colour field the stylesheet does not know what is actually behind a word.
01 · Type
Very tight large Sora against very loose small mono.
Easiest to find.
Pick the room you work in.
Good jobs go to the competitor who was easier to find and faster to answer.
Built to be read on a phone in six minutes, not to win an award. Fast, indexable, and wired to the phone.
Week one · site live
Sizes are fixed px per breakpoint, never clamp(). A missing space around a+ inside clamp() is invalid, falls back to 16px, and reports no error — it silently broke every display size on five pages at once.
02 · Surfaces and ink
Every neutral is tinted toward the logo, not left grey.
| Ink | Value | Role | On the field |
|---|---|---|---|
| --fg | #EFF4FC | body + display | 17.4:1 |
| --fg-muted | #AEB9CB | secondary copy | 9.9:1 |
| --fg-subtle | #A2AEC3 | labels, mono | 9.6:1 field · 5.6:1 lit |
| --brand-text | #5DA4FF | links, category ink | 9.6:1 field · 5.6:1 lit |
| --line | #61729B | functional borders | 3.95:1 · UI floor is 3:1 |
--fg-subtle, --brand-text and --line are lighter than they look like they should be on purpose. They have to survive the brightest 5% of the fluid field, where a colour keeps roughly a fifth of the headroom it has on plain navy — so the lit number is the one that governs, not the base one.
03 · The three signals
Cyan anywhere. Orange as light. Red once.
--s-cyan
13.46 / 12.10 / 10.26 / 7.94
Traxyn signal — ink, hairline, meter fill, glow. Anywhere.
--s-red
4.89 / 4.40 / 3.73 / 3.16
One display-size figure per page. Nothing else on the site.
--s-orange
7.25 / 6.52 / 5.53 / 4.68
Legal as ink, but its job is light. Never above 15% in a blob.
The one permitted use of red, at the one permitted size
$5,400a month, at the sample figures on the Traxyn ROI block — the only red figure on the only page that carries one.
At 56px the 3:1 large-text floor applies and #FF1B1C clears it on the field at 4.89:1. At 15px it needs 4.5 and measures 4.46:1 on glass. This gate caught exactly that on the first run of this page — the token names above were painted in their own hue, and red was the one that failed.
Ratios read field / panel / raised / lit field. Red passes on the plain field and nowhere brighter, which is why it is capped at one figure per page at display size, where the 3:1 large-text floor applies. The category pages get none of these three — red sits beside the restaurants hue and orange beside the home-services hue, and blurring that would cost the colour-coded rail.
04 · Category family
One page, one hue, plus blue.
--a-orange
Home services
#FF7A3D
--a-red
Restaurants & bars
#FF7C8A
--a-green
Gyms & studios
#12BE2B
--a-teal
Med spa & salon
#00BDB4
--a-amber
Legal & professional
#E5951A
A category page overrides --cat / --catf at the page root and nothing else changes — no per-page CSS. Blue still holds the nav, the footer, the links and every button on every page. The homepage is the only place all five appear at once, where seeing the family together reads as an index rather than noise.
05 · Primitives
Two CTA strings on the whole site.
The primary carries a coloured shadow and it is the only element on a page that glows. White on #146EF5 is 4.50:1 — passing, but with 0.002 to spare, so it is not a value to nudge darker.
Glass
The field keeps flowing through it.
Where a surface is genuinely needed it is rgba(14,32,74,.58) over a 22px backdrop blur — never a solid fill, which would punch a hole in the field.
Card
Lifted, not outlined.
An inset 0 1px 0 rgba(255,255,255,.09) top edge plus two navy-black shadows — one tight contact, one wide ambient. Grey shadows read as dirt here.
06 · The placeholder register
Anything we do not have stays bracketed.
A made-up review count reads as a lie about everything else on the page, so no figure is ever invented. Unset values render like this, in italic accent, visible in review:
[FILL: hours][client logo][Client testimonial][$X,XXX]/mo[XX]%
Two labelled exceptions, because the arithmetic has to demonstrate something: the product dashboard carries a Sample data chip, and the ROI block's inputs are each taggedSample. Both are visible on the page, not in a footnote. The current plans are $199/month for Website Care and $449/month with the AI receptionist. Setup and usage are disclosed on the pricing page.