## 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/lleverage/862048bd-3dd3-4c2e-9d3c-aadeb65c3eec-1792130576-0.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/lleverage/862048bd-3dd3-4c2e-9d3c-aadeb65c3eec-1792130486253-full.webp
- Component on Kage: https://kage.design/component/lleverage-navigation

## Before you start
Ask what the user's product is, who it serves, and what their brand voice and visual identity are. Apply the principles below to that product rather than reproducing the reference.

Build a transparent, over-image desktop navigation. Use a compact left-aligned wordmark area, a centered or nearby set of low-emphasis navigation links, and right-aligned login plus one primary CTA. Keep the bar about 72–88px tall with generous horizontal padding and vertically centered controls. Use a quiet sans-serif at 11–13px for links, a slightly stronger wordmark, and an orange primary button around #F47A18 with dark text or white text depending on contrast. Use white or near-white navigation text over a darkened image, with subtle hover opacity and underline transitions. Buttons should have modest 0–2px radius, thin borders, and compact padding; avoid pill styling. Keep the header usable on mobile by collapsing links into a menu.

Never: use the reference's logos, product names, copy, illustrations, imagery, or exact navigation labels.