Bob AI: change hero section to [Block: Hero Billboard]

src/app/page.tsx

@@ -2,7 +2,7 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
-import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
+import HeroBillboard from '@/components/sections/hero/HeroBillboard';
 import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
 import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
 import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
@@ -44,22 +44,16 @@ export default function LandingPage() {
       </div>
 
       <div id="hero" data-section="hero">
-        <HeroSplitKpi
+        <HeroBillboard
-          title="The Future of Supply Chain"
+          title="Welcome to Follow Trade"
-          description="Ship globally within 3 days post-production with smart fulfillment"
+          description="Experience seamless global shipping and unparalleled order accuracy with our smart fulfillment solutions."
           background={{ variant: "animated-grid" }}
-          kpis={[
-            { value: "4-10 Days", label: "Worldwide Delivery" },
-            { value: "99.8%", label: "Order Accuracy" },
-            { value: "10x", label: "Faster Lead Times" }
-          ]}
-          enableKpiAnimation={true}
           tag="Trusted by 150+ Brands"
           buttons={[
-            { text: "Get Started", href: "#pricing" },
+            { label: "Get Started", href: "#pricing", dataWebildId: "button1" },
-            { text: "Learn More", href: "#features" }
+            { label: "Learn More", href: "#features", dataWebildId: "button2" }
           ]}
-          imageSrc="https://img.b2bpic.net/free-photo/close-up-with-businessman-patching-something-keyboard-graphics-monitor_482257-32827.jpg"
+          imageSrc="https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80"
           imageAlt="Supply chain and fulfillment"
           mediaAnimation="opacity"
           imagePosition="right"

src/app/styles/variables.css

@@ -3,20 +3,20 @@
   /* --vw is set by ThemeProvider */
 
   /* --background: #0a0a0a;;
-  --card: #1a1a1a;;
+  --card: #000000;;
-  --foreground: #ffffffe6;;
+  --foreground: #ff0000;;
-  --primary-cta: #e63946;;
+  --primary-cta: #ff0000;;
-  --secondary-cta: #1a1a1a;;
+  --secondary-cta: #000000;;
-  --accent: #737373;;
+  --accent: #ff0000;;
-  --background-accent: #737373;; */
+  --background-accent: #000000;; */
 
-  --background: #0a0a0a;;
+  --background: #000000;;
-  --card: #1a1a1a;;
+  --card: #000000;;
-  --foreground: #ffffffe6;;
+  --foreground: #ff0000;;
-  --primary-cta: #e63946;;
+  --primary-cta: #ff0000;;
-  --secondary-cta: #1a1a1a;;
+  --secondary-cta: #000000;;
-  --accent: #737373;;
+  --accent: #ff0000;;
-  --background-accent: #737373;;
+  --background-accent: #000000;;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);