SUPERSEDED. This page was a second copy of the style guide from when Fri3nds and Direct were two skins of one system. Since the token flip on 2026-09-07 there is one brand and one style guide, at /style-guide. The values printed below this line are stale and should not be trusted or copied. Go to /style-guide instead.
Five decorative colours, used only on team cards, why-choose-us cards, principle cards and the colour wave. Never for text, never as a page ground.
u-grid-12 is the page grid. It halves to six columns at 479 and below, where the row gap stops matching the column gap: 24px between rows against 12px between columns. There is no max-width container, so the grid runs the full viewport inside the page inset.
This section carries u-bg-dark, which applies the Dark variable mode. Background, text and surface tokens resolve to their dark values with no extra classes on the children.
u-text-body is the paragraph style. On the source site a paragraph was forced to uppercase mono, so body copy lived in divs. Here a paragraph is a paragraph, set in Public Sans at 16px with a line height of 1.5 so wrapped copy reads properly.
Values are the pixels the source site renders at 1440. The stepped root font size that made these scale per breakpoint has been removed, so a space token is one number everywhere.