## 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/chime-com/8a783617-6b1d-44ef-a500-84b69ae63fa0-1789146543-7.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/chime-com/8a783617-6b1d-44ef-a500-84b69ae63fa0-1789146449552-full.webp
- Component on Kage: https://kage.design/component/chime-faq

## Before you start
Ask what questions users need answered before converting and what tone and legal constraints apply to the user's product. Then build an accessible FAQ.

Create a clean FAQ section on white or near-white background with a bold 28–36px heading and a vertical accordion list below. Each row should have a 16–18px question aligned left, a plus/minus control aligned right, and a thin divider around #D8E1DB. Use 20–24px vertical padding, dark green text around #12352B, and a clear hover/focus state. Animate expansion with a short height/opacity transition while respecting reduced-motion preferences. Use semantic buttons and regions, one expanded item at a time unless the product needs otherwise. Keep the content width constrained to roughly 90–94% of the viewport and leave comfortable whitespace around the list.

Never: copy the reference's questions, answers, wording, product name, icons, or exact copy.