## 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/basedash-view-only-members/6dbd0b50-cdba-4977-b7dc-6a7ba68a352e-1793253917-1.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/basedash-view-only-members/6dbd0b50-cdba-4977-b7dc-6a7ba68a352e-1793253800610-full.webp
- Component on Kage: https://kage.design/component/basedash-view-only-members-hero

## Before you start
Ask what the user's product is, who the audience is, and what brand voice and action matter most. Use the following as reusable design guidance for that product, not as a visual copy.

Create a spacious centered SaaS hero below the navigation. Put a large one-line or two-line headline near the top, a restrained two-line supporting paragraph below it, and two horizontally aligned actions: a dark filled primary button and a light bordered secondary button. Reserve substantial whitespace before a wide, softly elevated product UI preview. The preview should be a believable dashboard with cards, charts, table rows, and an assistant/chat rail, but use the user's domain and data. Align the hero to a max-width around 780px for text and a wider 780px visual; let the visual have a 1px #e9e9e9 border, 12–16px radius, faint shadow, and mostly white surfaces. Use near-black #171717 typography, gray #666 body copy, white background, and optional warm muted accent labels. Headline should be roughly 44–52px desktop with tight line-height; body 16px; buttons 14px semibold. Ensure responsive stacking and keep the dashboard from becoming unreadably small.

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