feat(brand): adopt official Kode brand guidelines

- Brand palette: purple #6B35A7 (primary), #000000 (ink), #FFFFFF, #F5F4F0 (canvas)
- Typography: Manrope (UI, 200-800) + Opificio Bold (wordmark/display); drop Inter
- design.md: add wordmarkSecondary token, new display scale (Opificio 72/80)
- foundations: refresh swatches and typography README to match guidelines
- assets/fonts: replace Inter folder with Manrope; add Opificio cuts (Bold/Rounded/Regular)
- fonts.css: register Manrope variable + Opificio cuts; keep Roboto Mono for code only
- examples/web: render the kode wordmark lockup on the off-white canvas
- brand-guidelines: real specs (lockup, palette, typography, logo variant rules)
- README: add brand-at-a-glance, bump version to beta

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

brand/brand-guidelines/README.md

@@ -1,12 +1,40 @@
 # Brand Guidelines
 
-Placeholder. Replace with the formal KDC brand book covering:
+## Wordmark
 
-- Mission, vision, and personality
-- Logo clear-space and minimum sizes
-- Approved color usage
-- Typography in marketing
-- Photography & illustration direction
-- Voice and tone
-- Co-branding rules
-- Do's and don'ts (with examples)
+**Primary lockup** — `kode` set in **Opificio Bold**, 72pt size with 52pt spacing.
+
+**Secondary lockup** — `kode` (Opificio Bold, 72pt / 52pt) above `design consultants` (Manrope ExtraLight, 20pt / 76pt spacing).
+
+Use the secondary lockup wherever clarity about the legal name is required (legal documents, contracts, invoices, footers, first-mention contexts). Use the primary single-line `kode` wherever the brand is already established (favicons, app bar, signed emails, swag).
+
+## Color palette
+
+| Color | Hex | Use |
+|-------|-----|-----|
+| Kode purple | `#6B35A7` | Primary brand color, links, primary actions. |
+| Black       | `#000000` | Wordmark, high-emphasis text. |
+| White       | `#FFFFFF` | Cards, modals, contrast surface. |
+| Off-white   | `#F5F4F0` | Default page background. |
+
+## Typography
+
+| Use | Family |
+|-----|--------|
+| Wordmark / display | **Opificio Bold** (Rounded and Regular cuts available for editorial moments) |
+| All UI (headings, body, labels) | **Manrope** — weights 200, 300, 400, 500, 600, 700, 800 |
+| Code / tabular figures | Roboto Mono (system fallback) |
+
+## Logo variants
+
+The brand mark must always appear in one of:
+
+- Solid Kode purple (`#6B35A7`) on white or off-white
+- Solid black on white or off-white
+- Outlined (white interior) on a Kode purple or photographic background
+
+Never re-color, re-stretch, drop-shadow, or place the wordmark on busy or low-contrast imagery.
+
+## Reference
+
+The canonical asset board (kode wordmark, color blocks, typography ramps) lives in [`../logos-source/`](../logos-source/). Replace the placeholders there with the official source artwork before use.