Hero section

## The starting point Count the problems. ## Layer 1: Copywriting ### Fix the headline **Before:** "Build Better Websites with Our Platform" **After:** "Ship interfaces your users actually notice" ### Fix the subheadline **Before:** "Our innovative solution helps you create beautiful, fast, and reliable websites with ease." **After:** "The thousand small decisions (the right easing curve, the curly apostrophe, the CTA that says exactly what happens next) are the difference between forgettable and remarkable." ### Fix the CTA **Before:** "Learn More" **After:** "Start the course, free" ## Layer 2: Typography ### Eyebrow text ### Headline sizing ### Subheadline typography ### Proper punctuation ## Layer 3: Craft ### Spacing system ### Button styling `<a>`, not `<button>`. `h-11` is a 44px touch target. ### Secondary action Primary has a background, secondary is text-only. ## Layer 4: Animation ### Stagger entrance ### Reduced motion When `initial` is `false`, motion/react skips the entrance entirely.