design-homepagelisted

# Homepage / Landing Design Design like a lead whose client has rejected every templated proposal: the subject's real world (industry, materials, vernacular) is where distinctive choices come from. ## Step 0 — Pin before any pixel Confirm: what is sold, to whom, and the ONE action the page drives. A kids' toy and a fintech dashboard must not share a look. ## Structure (conversion order) Hero (identity + promise + primary CTA) → problem in the user's words → solution / max 3 capability blocks → proof (real numbers, logos, testimonials — or explicitly marked placeholders) → pricing or FAQ → CTA repeated. Cut any section that doesn't move the visitor down this order. ## Judgment rules - **Hero = the most characteristic thing in the subject's world**, in its most fitting form: headline, live demo, image, interactive moment. "Big number + small label + gradient" is the default treatment — only use it when it's genuinely best. - **Type carries personality.** 1–2 families; if two, clearly distinct. Line length < 80 chars; serif body gets more line-height. Pick faces deliberately, not by habit. - **Structure encodes information.** 01/02/03 numbering only when content truly is a sequence; every eyebrow/divider/border must carry meaning. - **One orchestrated motion moment** (a load sequence or single reveal) beats scattered effects. Fade-up per section + hover on every card is the AI default; motion answering a user action is always welcome. Respect `prefers-reduced-motion`. - **Sp