Design System

Components

IO component library. Each component uses design tokens from tokens.css.

Buttons

.btn-primary (blue fill), .btn-secondary (blue outline), .btn-dark-primary (accent fill on dark), .btn-dark-secondary (accent outline on dark)

Cards

.card-io (light bg), .card-io-dark (dark bg with border)

Navigation

Frosted glass nav, transparent on top, blurs on scroll. Component: components/nav.tsx

Footer

4-column link grid + legal row. Component: components/footer.tsx

Layout

.container-io (980px), .container-io-wide (1200px), .container-io-narrow (640px), .section-padding (80px), .section-padding-lg (120px)