## 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/partiful-com/97ae038c-0277-4e29-93fa-45b4a481f7ba-1789146244-7.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/partiful-com/97ae038c-0277-4e29-93fa-45b4a481f7ba-1789146205210-full.webp
- Component on Kage: https://kage.design/component/partiful-feature-grid-2

## 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 three-row feature narrative:
- Use a light background with each row in a generous two-column grid: one side for a UI mockup, one side for a short heading, explanation, and CTA.
- Alternate the image/text order between rows to create rhythm and keep the page from feeling repetitive.
- Give each row substantial vertical padding, with soft blue/pink ambient gradients behind the mockups.
- UI visuals should look like believable interface snapshots in rounded cards, with layered messages, avatars, and status chips where relevant.
- Use 24–30px headings, 16–18px body copy, and compact black buttons; align text vertically near the visual center.
- Collapse to one column on mobile while maintaining clear reading order.

Never:
- Never use logos, product names, copy, illustrations, or imagery from the reference.
- Never copy the exact chat screenshots or feature claims.