## 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-1.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-hero

## 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.

Create a full-width hero immediately below the navigation, approximately 450px tall on desktop. Use a high-quality product-relevant image or video as a cover background with a darkened gradient where text sits. Place one large editorial serif headline in the lower-left, with tight line-height, a maximum width of about 600px, and white text. Preserve a clear focal point in the image and keep the headline readable without covering the main subject. Use responsive typography that scales down on mobile; keep the hero's content vertically anchored near the bottom. Approximate colours: text `#FFFFFF`, subtle overlay `rgba(0,0,0,.18)`.

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