## 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/flowo/46dcd8ed-31a5-4fb1-ab3b-3d3a2b966cfb-1791439601-3.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/flowo/46dcd8ed-31a5-4fb1-ab3b-3d3a2b966cfb-1791439391035-full.webp
- Component on Kage: https://kage.design/component/flowo-feature-grid-2

## Before you start
Ask what four or five principles define the user's product and what order makes sense for its audience. Translate those principles into original section titles and descriptions.

Build an editorial feature sequence that explains a product's workflow through four or five vertically stacked stories. Each story should have a clear title, one short paragraph, and optional product UI or subtle visual treatment; prioritize comprehension and rhythm over decorative cards.

- Use a centered max-width around 400–500px, with consistent left alignment for each story.
- Give each item 120–220px of vertical breathing room and separate items with faint rules or large whitespace.
- Use 28–36px bold headings, 13–15px supporting text, and a restrained muted gray (`#6F6F6F`).
- Alternate alignment or add a small eyebrow only when it improves scanning; do not create arbitrary visual noise.
- Keep the canvas near-white (`#FAFAF8`) with black text and occasional deep teal accents (`#073847`).
- If product screenshots are included, use one consistent frame style with 12–18px radius and subtle shadow.
- On mobile, preserve the vertical sequence and make each interactive preview tap-friendly.

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