## 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/milliseconds-ai/6fac96f3-e489-4913-80bc-8c862b5f9e82-1790056993-4.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/milliseconds-ai/6fac96f3-e489-4913-80bc-8c862b5f9e82-1790056904819-full.webp
- Component on Kage: https://kage.design/component/milliseconds-feature-grid-2

## Before you start
Ask which 2–4 workflows best demonstrate the user's product and what artifact or result each workflow should show. Translate those into a coherent showcase for the user's brand.

Build a dark case-study showcase section on `#19181d` with 44px gutters, 90px top padding, and generous dividers (`#333138`). Open with a small uppercase monospace eyebrow, a bold 44–50px two-line heading, and a short supporting paragraph. Then stack three full-width feature rows with 72–100px vertical padding. Alternate the text and visual emphasis where useful, but preserve a consistent two-column grid.

For each row, include a tiny category label, a 28–34px headline, a 15–16px explanation, and an underlined action link. Pair it with a restrained product artifact: an off-white invoice card plus dark extracted-record panel; a message card with highlighted routing tags; and a transcript card with sensitive spans visually redacted. Use off-white `#f2eee8`, violet `#6845ff`, neon lime `#d7ff36`, and muted gray text. Keep borders 1px, radius 1–3px, and shadows minimal. Add responsive stacking, preserve reading order, and animate only small highlights or card translations on hover.

Never: copy the reference workflows, names, product name, logo, exact copy, illustrations, imagery, or artifact contents.