From b2bbc4912747679686891e7ca0139d2bcbecb6f0 Mon Sep 17 00:00:00 2001
From: Brendan Ryan <brendanjryan@users.noreply.github.com>
Date: Tue, 17 Mar 2026 22:17:47 -0700
Subject: [PATCH] fix: add padding to hero CTA buttons on mobile

---
 src/components/LandingPage.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/LandingPage.tsx b/src/components/LandingPage.tsx
index 059c7cee..e9fdc264 100644
--- a/src/components/LandingPage.tsx
+++ b/src/components/LandingPage.tsx
@@ -499,10 +499,10 @@ function Hero() {
         </div>
         <div className="hero-right">
           <Tagline />
-          <div className="flex items-center gap-4 mt-3 landing-ctas">
+          <div className="flex items-center gap-3 sm:gap-4 mt-3 px-4 sm:px-0 landing-ctas">
             <Link
               to="/quickstart/agent"
-              className="no-underline! px-5 py-2.5 rounded-lg transition-opacity hover:opacity-80"
+              className="no-underline! px-3 sm:px-5 py-2.5 rounded-lg transition-opacity hover:opacity-80"
               style={{
                 fontSize: "0.9375rem",
                 fontWeight: 500,
@@ -521,7 +521,7 @@ function Hero() {
             </Link>
             <Link
               to="/quickstart/server"
-              className="no-underline! px-5 py-2.5 rounded-lg transition-opacity hover:opacity-80"
+              className="no-underline! px-3 sm:px-5 py-2.5 rounded-lg transition-opacity hover:opacity-80"
               style={{
                 fontSize: "0.9375rem",
                 fontWeight: 500,