feat: add prominent explore banner and new testimonials

- Add horizontal banner-style navigation above footer with icons
- Three cards: Integrations, Shoutouts, Showcase
- Consistent hover animations with other cards
- Mobile responsive (single column on small screens)
- Add testimonials from @coyotevn and @AlbertMoral

Author: steipete

src/data/testimonials.json

@@ -1,4 +1,14 @@
 [
+  {
+    "quote": "It is one of the most delightful thing (app, agent, product) I've used in a few years.",
+    "author": "coyotevn",
+    "url": "https://x.com/coyotevn/status/2010270055985295529"
+  },
+  {
+    "quote": "Just set up @clawdbot on my Raspberry Pi with Cloudflare, and it feels magical. Built a website from my phone in minutes and connected WHOOP to check my metrics.",
+    "author": "AlbertMoral",
+    "url": "https://x.com/AlbertMoral/status/2010288787885064227"
+  },
   {
     "quote": "What @steipete has built with @clawdbot is out of this world.",
     "author": "KrauseFx",

src/pages/index.astro

@@ -460,15 +460,35 @@ const duration2 = (row2.length / 2 * pixelsPerItem) / pixelsPerSecond;
       </a>
     </nav>
 
+    <!-- Explore More Banner -->
+    <section class="explore-banner">
+      <div class="explore-links">
+        <a href="/integrations" class="explore-link">
+          <svg class="explore-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <circle cx="12" cy="12" r="3"/><path d="M12 1v6m0 6v6m5.2-13.2l-4.2 4.2m0 6l4.2 4.2M23 12h-6m-6 0H1m18.2-5.2l-4.2 4.2m0 6l4.2 4.2"/>
+          </svg>
+          <span class="explore-label">Integrations</span>
+          <span class="explore-desc">50+ apps & services</span>
+        </a>
+        <a href="/shoutouts" class="explore-link">
+          <svg class="explore-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/>
+          </svg>
+          <span class="explore-label">Shoutouts</span>
+          <span class="explore-desc">Community love</span>
+        </a>
+        <a href="https://docs.clawd.bot/start/showcase" target="_blank" rel="noopener" class="explore-link">
+          <svg class="explore-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/>
+          </svg>
+          <span class="explore-label">Showcase</span>
+          <span class="explore-desc">Impressive builds</span>
+        </a>
+      </div>
+    </section>
+
     <!-- Footer -->
     <footer class="footer">
-      <nav class="footer-nav">
-        <a href="/integrations">Integrations</a>
-        <span class="footer-separator">·</span>
-        <a href="/shoutouts">Shoutouts</a>
-        <span class="footer-separator">·</span>
-        <a href="https://docs.clawd.bot/start/showcase" target="_blank" rel="noopener">Showcase</a>
-      </nav>
       <p>Built by <a href="https://clawd.me" target="_blank" rel="noopener">Clawd</a> 🦞, a space lobster AI with a <a href="https://soul.md" target="_blank" rel="noopener">soul</a>, by <a href="https://steipete.me" target="_blank" rel="noopener">Peter Steinberger</a> & <a href="https://github.com/clawdbot/clawdbot#community" target="_blank" rel="noopener">community</a>.</p>
     </footer>
   </main>
@@ -1203,6 +1223,59 @@ const duration2 = (row2.length / 2 * pixelsPerItem) / pixelsPerSecond;
     color: var(--coral-bright);
   }
 
+  /* Explore Banner */
+  .explore-banner {
+    margin: 56px 0 40px 0;
+    animation: fadeInUp 0.8s ease-out 0.8s both;
+  }
+
+  .explore-links {
+    display: grid;
+    grid-template-columns: repeat(3, 1fr);
+    gap: 20px;
+  }
+
+  .explore-link {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    text-align: center;
+    padding: 32px 24px;
+    border-radius: 16px;
+    border: 1px solid var(--border-subtle);
+    background: rgba(10, 15, 26, 0.6);
+    backdrop-filter: blur(12px);
+    text-decoration: none;
+    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
+  }
+
+  .explore-link:hover {
+    transform: translateY(-4px);
+    border-color: var(--coral-bright);
+    box-shadow: 0 12px 40px color-mix(in srgb, var(--coral-bright) 20%, transparent);
+  }
+
+  .explore-icon {
+    width: 40px;
+    height: 40px;
+    color: var(--coral-bright);
+    margin-bottom: 16px;
+    stroke-width: 2;
+  }
+
+  .explore-label {
+    font-family: var(--font-display);
+    font-size: 1.2rem;
+    font-weight: 600;
+    color: var(--text-primary);
+    margin-bottom: 8px;
+  }
+
+  .explore-desc {
+    font-size: 0.9rem;
+    color: var(--text-muted);
+  }
+
   /* Responsive */
   @media (max-width: 480px) {
     .container {
@@ -1251,5 +1324,9 @@ const duration2 = (row2.length / 2 * pixelsPerItem) / pixelsPerSecond;
     .testimonial-quote {
       font-size: 0.85rem;
     }
+
+    .explore-links {
+      grid-template-columns: 1fr;
+    }
   }
 </style>