<!-- SPDX-License-Identifier: MIT -->
<!-- SPDX-FileCopyrightText: 2025-2026 Marcus Quinn -->

# Design System: Corporate Traditional — Colour Palette & Roles

| Group | Role | Hex | CSS Variable | Usage |
|-------|------|-----|--------------|-------|
| Primary | Primary | `#1B365D` | `--color-primary` | Headers, primary buttons, navigation background |
| Primary | Primary Light | `#2A4A7F` | `--color-primary-light` | Hover states, secondary elements |
| Primary | Primary Dark | `#0F2341` | `--color-primary-dark` | Active states, footer background |
| Accent | Gold | `#B8860B` | `--color-gold` | CTAs, highlights, award badges, key links |
| Accent | Gold Light | `#D4A843` | `--color-gold-light` | Hover on gold elements |
| Accent | Gold Muted | `#C9B97A` | `--color-gold-muted` | Decorative borders, subtle highlights |
| Text | Heading | `#1B365D` | `--color-text-heading` | All headings h1–h6 |
| Text | Body | `#333333` | `--color-text-body` | Paragraph text, descriptions |
| Text | Secondary | `#6B7280` | `--color-text-secondary` | Captions, metadata, timestamps |
| Text | Inverse | `#FFFFFF` | `--color-text-inverse` | Text on dark backgrounds |
| Surface | Background | `#FFFFFF` | `--color-bg` | Page background |
| Surface | Surface Alt | `#F5F5F0` | `--color-surface-alt` | Alternating sections, sidebar |
| Surface | Surface Accent | `#EEF0F4` | `--color-surface-accent` | Card backgrounds, table headers |
| Surface | Border | `#D1D5DB` | `--color-border` | Dividers, table borders, input borders |
| Surface | Border Strong | `#9CA3AF` | `--color-border-strong` | Active input borders |
| Semantic | Success | `#166534` | `--color-success` | Confirmations, positive indicators |
| Semantic | Warning | `#92400E` | `--color-warning` | Caution messages |
| Semantic | Error | `#991B1B` | `--color-error` | Error states, required fields |
| Semantic | Info | `#1E40AF` | `--color-info` | Informational callouts |
| Shadows | Shadow | `rgba(27, 54, 93, 0.08)` | `--shadow-color` | All shadow definitions |
| Shadows | Shadow Strong | `rgba(27, 54, 93, 0.15)` | `--shadow-color-strong` | Elevated elements |
