## 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/sendinvo-com/4a31d5e4-cfef-4553-9e1a-9dbc27d89a1a-1789890398-0.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/sendinvo-com/4a31d5e4-cfef-4553-9e1a-9dbc27d89a1a-1789890376670-full.webp
- Component on Kage: https://kage.design/component/sendinvo-navigation

## Before you start
Ask what the user's product is, who it serves, and what its brand personality and primary colour are. Apply the principles below to that product rather than reproducing the reference.

Build a responsive SaaS navigation bar with a clean, low-density layout. Keep the logo or wordmark aligned to the left inside a centered max-width container, place a small set of product links near the middle, and group a low-emphasis sign-in action with one high-emphasis rounded primary action on the right. Use a white or near-white background, black text around `#111111`, muted links around `#666666`, and a blue primary action around `#4F79D9` with white text. Use a modern sans-serif, 14–16px navigation text, medium weight for the primary action, and approximately 24–32px horizontal padding with 28–36px vertical breathing room. The header should remain visually quiet and adapt to mobile with a menu trigger and preserved primary action. Use subtle hover colour changes and a compact focus ring; avoid heavy borders and shadows.

### Never
- Never use the reference's logo, product name, exact copy, illustrations, or imagery.
- Never make the header visually louder than the hero.
- Never overcrowd the navigation with every possible destination.