Layout & spacing
A 12-column grid, a 4px spacing scale, and a small set of radii. Density is low on marketing pages and moderate on content pages.
| Token | Value | Notes |
|---|---|---|
| Container | 1200px max, fluid padding 20 to 44px | Text columns cap at 72ch inside it |
| Grid | 12 columns, 24px gutters desktop | 4 columns / 16px gutters under 768px |
| Spacing scale | 4 · 8 · 12 · 16 · 24 · 32 · 48 · 64 · 96 · 128 | Section padding: 96 to 128 desktop, 64 mobile |
| Radii | 4 (tags) · 8 (buttons, inputs) · 14 (cards) · 22 (feature panels) · full (pills) | Soft geometry echoes the rounded wordmark |
| Borders | 1px mist-200 on Day, 1px navy-800 on Night | Borders over shadows; shadows only on hover and overlays |
| Shadows | shadow-sm, shadow-md (navy-tinted, defined in tokens) | Never on Night surfaces |
| Header | 76px, sticky, blurs after 24px scroll | Day pages: white blur + colour logo. Night: navy blur + reversed logo |