## 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/eventbrite-com/7528d4f6-3311-4de9-a3b5-4d616b4b671a-1789146266-4.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/eventbrite-com/7528d4f6-3311-4de9-a3b5-4d616b4b671a-1789146238794-full.webp
- Component on Kage: https://kage.design/component/eventbrite-feature-grid-2

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

Build a responsive event results section with a section heading and a 4-column desktop card grid that becomes 2 columns on tablet and 1 on mobile. Each card should have a 16:9 image with 4px rounding, an optional small urgency badge below or overlapping the image, favorite and share icon buttons, a two-line clamped title, compact date/time, venue, and bold price line. Use 20–24px column gaps and 34–42px row gaps. Keep cards borderless on white, with #24232b text, #65636b metadata, 12–14px body type, 16–18px semibold titles, and circular white controls with subtle shadows. Preserve consistent image heights and align metadata even when titles differ. Add hover lift, image zoom kept within the frame, and accessible labels for all icon buttons.

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