Act as a product designer and front-end engineer. Build a hero for {{business_name}} with a small working demo of one thing from {{features}}, styled in {{visual_style}}. Keep the current stack and components. Pick the demo: the single action that shows value in one step (paste a sample, get a result). Tell me which you picked and why before building. The demo: - prefilled with a realistic sample so it works with zero typing; three example chips swap the input - output is real: computed in the browser, or from a rate-limited server endpoint; no API keys in client code - the input has a visible label; Enter runs it; results land in an aria-live="polite" region - after a result, the call to action carries the visitor's input into sign-up ("Save this result") States: focus-visible rings on the input, chips and buttons; idle with the sample; running, with a skeleton shaped like the output, shown only after 300ms to avoid a flash; result; empty input, where the button explains why it's disabled; error with plain words and Retry; rate limited with when to try again. Layout: 1280: headline and subhead 5 columns, demo 7, aligned to the top; 768: stacked, demo full width; 360: stacked, demo input 16px or larger so iOS doesn't zoom, buttons 48px tall. Demo card on a surface token, 1px border, 12px radius. Type: headline 36 / 48 / 60px, tracking -0.02em; demo output in the body size, mono only for code. Performance: the headline is the LCP element and renders without the demo; load demo code after first paint; reserve the demo's height so nothing shifts. Motion: result fades and rises 8px in 200ms; instant under prefers-reduced-motion. Avoid: a fake typing animation passed off as a demo, an autoplay video labeled "interactive", demanding an email before the demo works, made-up output. End with a change list and how you'd measure whether the demo raises sign-ups.