## Reference images

Study these alongside the description below: hierarchy, rhythm, spacing, colour. Build for the product you are asked about, using this design language.

- Component: https://kage-design-assets.t3.tigrisfiles.io/components/duvi/fdecc34f-2fb4-47cd-8615-09e917d211ca-1789884151-0.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/duvi/fdecc34f-2fb4-47cd-8615-09e917d211ca-1789884106277-full.webp
- Component on Kage: https://kage.design/component/duvi-navigation

## Before you start
Ask what the user's product, audience, and brand are, then apply these principles to that product rather than reproducing the reference.

Build a responsive global navigation for a dark SaaS marketing site. Use a full-width near-black background (#080a0b), a slim 1px top accent line, and a centered max-width content row with generous side padding. Place a compact brand mark and wordmark at left, a small set of evenly spaced navigation links in the middle, and one pale primary button at right with a subtle arrow icon. Use a restrained grotesk sans-serif, 12–13px navigation text, medium weight, and muted gray-white text. Keep the header approximately 64px tall; use 8–10px corner radius on the button, a very thin border, and clear hover/focus states. Collapse links into a menu on mobile without changing the visual hierarchy.

Never use logos, product names, copy, illustrations, or imagery from the reference.