## 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/hinge-co/fc8d8d16-7276-4f4c-b1c9-567702ba4b3c-1789146937-0.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/hinge-co/fc8d8d16-7276-4f4c-b1c9-567702ba4b3c-1789146918698-full.webp
- Component on Kage: https://kage.design/component/hinge-navigation

## Before you start
Ask what the user's product and brand are, then apply the principles below to their context rather than reproducing this reference.

Build a transparent, overlaid desktop navigation for a full-bleed hero. Keep the bar around 56px tall, use a three-zone layout with primary links on the left, a centered brand mark, and secondary links on the right. Use small high-contrast sans-serif text, generous horizontal padding, and a subtle fixed or absolute positioning treatment so the hero remains visible underneath. Use white text over imagery, with a restrained hover underline or opacity transition. Approximate colours: white `#FFFFFF`, translucent black overlay `rgba(0,0,0,.12)`. Keep links evenly spaced and vertically centered.

Never use the reference logo, product name, exact labels, copy, illustrations, or imagery.