## 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/storyshort-ai/c734da75-ded5-4c81-9b78-0aa9ae185a47-1791551954-8.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/storyshort-ai/c734da75-ded5-4c81-9b78-0aa9ae185a47-1791551915904-full.webp
- Component on Kage: https://kage.design/component/storyshort-faq

## Before you start
Ask what objections and setup questions users have before conversion, and which answers need links, examples, or expanded detail.

Build a centered FAQ section on a black background. Use a bold 28–36px heading, then a narrow vertical accordion list with 6–8 rows. Each row should be a dark near-black surface with a 1px border (#222), 10–12px radius, 14–16px horizontal padding, and a compact chevron at the right. Keep question text white and concise; animate height and chevron rotation when opened. Use 10–12px gaps between rows and enough section padding to separate the FAQ from neighboring content. Ensure keyboard focus, aria-expanded state, and touch-friendly row height.

Never: use the reference's logo, product name, copy, illustrations, imagery, or exact questions.