Fix hero buttons overflowing on narrow screens

The button row used flex with fixed margin-left spacing and no
wrapping, so on small viewports the first and last buttons got
clipped by the hero's overflow:hidden. Switch to flex-wrap with a
gap so buttons stack cleanly instead of overflowing.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

Author: ndoo

src/pages/index.js

@@ -23,12 +23,12 @@ function HomepageHeader() {
             Join the Mesh
           </Link>
           <Link
-            className="button button--secondary button--lg margin-left--md"
+            className="button button--secondary button--lg"
             to="/about">
             Learn More
           </Link>
           <Link
-            className="button button--secondary button--lg margin-left--md"
+            className="button button--secondary button--lg"
             to="/events">
             Upcoming Events
           </Link>

src/pages/index.module.css

@@ -18,6 +18,8 @@
 
 .buttons {
   display: flex;
+  flex-wrap: wrap;
   align-items: center;
   justify-content: center;
+  gap: 1rem;
 }