Bob AI: No the buttons still have sharp corners, I want th...

Merge version_17 into main

src/app/page.tsx

@@ -21,7 +21,7 @@ export default function LandingPage() {
     <ThemeProvider
       defaultButtonVariant="shift-hover"
       defaultTextAnimation="reveal-blur"
-      borderRadius="soft"
+      borderRadius="pill"
       contentWidth="medium"
       sizing="mediumLarge"
       background="circleGradient"

src/components/sections/feature/FeatureCardTwentyFive.tsx

@@ -161,9 +161,9 @@ const FeatureCardTwentyFive = ({
               ))}
             </div>
             <div className="mt-5">
-              <a href="#dishes" className="bg-primary text-background px-4 py-2 rounded-theme transition-colors hover:bg-primary-hover">
+              <button className={cls("bg-primary text-background px-4 py-2 rounded-theme transition-colors hover:bg-primary-dark", textBoxButtonClassName)}>
                 Take a Look at Dishes
-              </a>
+              </button>
             </div>
           </div>
         );

src/components/sections/hero/HeroLogoBillboardSplit.tsx

@@ -87,7 +87,7 @@ const HeroLogoBillboardSplit = ({
     return (
         <section
             aria-label={ariaLabel}
-            className={cls("relative w-full py-hero-page-padding", className)}
+            className={cls("relative w-full py-10", className)}
         >
             <HeroBackgrounds {...background} />
             <div className={cls("w-content-width mx-auto flex flex-col gap-6 md:gap-15 relative z-10", containerClassName)}>
@@ -120,7 +120,7 @@ const HeroLogoBillboardSplit = ({
                 </div>
 
                 {frameStyle === "browser" ? (
-                    <div className={cls("w-full overflow-hidden rounded-theme-capped card", mediaWrapperClassName)}>
+                    <div className={cls("w-full overflow-hidden rounded-theme-capped card mt-4", mediaWrapperClassName)}>
                         <div className={cls("relative z-1 bg-background border-b border-foreground/10 px-4 py-3 flex items-center gap-4", browserBarClassName)}>
                             <div className="flex items-center gap-2">
                                 <div className="h-3 w-auto aspect-square rounded-theme bg-accent" />
@@ -145,7 +145,7 @@ const HeroLogoBillboardSplit = ({
                         </div>
                     </div>
                 ) : (
-                    <div className={cls("w-full overflow-hidden rounded-theme-capped card p-4", mediaWrapperClassName)}>
+                    <div className={cls("w-full overflow-hidden rounded-theme-capped card p-4 mt-4", mediaWrapperClassName)}>
                         <MediaContent
                             imageSrc={imageSrc}
                             videoSrc={videoSrc}