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

# Design System: Corporate Friendly — Do's and Don'ts

## Do's

1. **Do** use rounded corners consistently — 12px for small components, 16px for cards, 20px for major sections
2. **Do** pair blue with orange intentionally — blue for primary actions, orange for secondary emphasis
3. **Do** use warm, natural photography showing real people in positive contexts
4. **Do** maintain generous line-height (1.65) for body text to maximise readability
5. **Do** include helpful microcopy — tooltips, helper text, success messages
6. **Do** use the warm surface tones (`#FFFBF5`) for testimonial and trust sections
7. **Do** animate interactions gently — hover lifts, smooth colour transitions, subtle feedback
8. **Do** ensure at least 48px vertical space between distinct content sections

## Don'ts

1. **Don't** use sharp corners (0–4px radius) — they conflict with the friendly aesthetic
2. **Don't** combine blue and orange at equal visual weight — one should clearly dominate
3. **Don't** use dark mode as default — this system is light-mode-first for warmth
4. **Don't** pack content tightly — if a section feels dense, add more whitespace
5. **Don't** use aggressive micro-interactions (shake, bounce, pulse) for errors — gentle colour changes suffice
6. **Don't** place orange (`#f97316`) text on white backgrounds for body copy — insufficient contrast
7. **Don't** use stock photography that feels cold, staged, or corporate — prioritise warmth and authenticity
8. **Don't** hide critical navigation behind icons without labels — always include text labels on primary nav
