## 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/copilot-money/645bb157-e222-4315-91ed-1b76fbb9bd6b-1789146603-7.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/copilot-money/645bb157-e222-4315-91ed-1b76fbb9bd6b-1789146540058-full.webp
- Component on Kage: https://kage.design/component/copilot-money-testimonials

## Before you start
Ask what the user's product is, who it serves, and what its brand voice and colours are. Apply the principles below to that product rather than reproducing this reference.

Create a testimonial masonry section:
- Use a centered heading around 36–42px with a 40–56px gap before the reviews.
- Arrange authentic review cards in three columns on desktop, with varied heights but consistent 18px radius, 20px padding, and 14–18px gaps.
- Each card may include an avatar, reviewer name/handle, 5-star rating, short quote, and optional product/social image; keep metadata visually subordinate.
- Use #020d1b background, cards #061a30, primary text #dce5ef, muted text #8ea1b5, and warm yellow stars #f3c94f.
- Implement CSS columns or a deliberate grid that becomes two columns then one; avoid awkward reading order and ensure all text remains accessible.
- If reviews are user-generated, support moderation, attribution consent, and an optional carousel on mobile.

Never:
- use logos, product names, copy, illustrations, or imagery from the reference;
- fabricate customer identities or endorsements;
- reproduce the exact review text, avatars, or social-media marks.