## 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/monarchmoney-com/635efc73-78c7-4e34-907f-7c8ed3a65d95-1789146615-4.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/monarchmoney-com/635efc73-78c7-4e34-907f-7c8ed3a65d95-1789146549196-full.webp
- Component on Kage: https://kage.design/component/monarchmoney-feature-grid

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

Build a large rounded feature panel on a slightly darker warm-gray surface `#efeeeb`. Arrange four feature blocks in a two-by-two composition around a centered device or product mockup. Each block should have a small orange uppercase category label, a short sans-serif title, two to three lines of supporting copy, and a compact rounded text CTA. Use white cards only where needed, 14–18px radii, minimal borders, and soft shadows. The central visual should overlap the grid subtly and remain the focal point. Maintain clear alignment across columns and generous internal padding. On mobile, stack the feature blocks around the visual in a logical reading order.

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