src/app/page.tsx

@@ -9,14 +9,13 @@ import FaqBase from '@/components/sections/faq/FaqBase';
 import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
 import ContactCenter from '@/components/sections/contact/ContactCenter';
 import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
-import { ArrowRight, Star, Shield, Zap } from 'lucide-react';
-import Link from 'next/link';
+import { Zap, Shield } from 'lucide-react';
 
 const navItems = [{ name: "Home", id: "/" }];
 
 export default function Page() {
   return (
-    <ThemeProvider>
+    <ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
       <div id="nav" data-section="nav">
         <NavbarStyleApple navItems={navItems} brandName="Webild" />
       </div>
@@ -32,10 +31,9 @@ export default function Page() {
           title="Powerful Features"
           description="Everything you need to scale."
           features={[
-            { title: "Speed", description: "Optimized performance." },
-            { title: "Security", description: "Built-in protection." }
+            { title: "Speed", description: "Optimized performance.", imageSrc: "/placeholder.jpg" },
+            { title: "Security", description: "Built-in protection.", imageSrc: "/placeholder.jpg" }
           ]}
-          animationType="slide-up"
           textboxLayout="default"
           useInvertedBackground={false}
         />
@@ -51,6 +49,7 @@ export default function Page() {
           gridVariant="uniform-all-items-equal"
           animationType="slide-up"
           textboxLayout="default"
+          useInvertedBackground={false}
         />
       </div>
       <div id="testimonials" data-section="testimonials">
@@ -71,6 +70,7 @@ export default function Page() {
           faqs={[{ id: "1", title: "How do I start?", content: "Sign up today." }]}
           faqsAnimation="slide-up"
           textboxLayout="default"
+          useInvertedBackground={false}
         />
       </div>
       <div id="about" data-section="about">
@@ -78,6 +78,7 @@ export default function Page() {
           title="Our Vision"
           description="Redefining the standard."
           metrics={[{ value: "10 Years", title: "Experience" }]}
+          useInvertedBackground={false}
         />
       </div>
       <div id="contact" data-section="contact">
@@ -85,6 +86,8 @@ export default function Page() {
           tag="Ready?"
           title="Get in Touch"
           description="Let's build something great."
+          background={{ variant: "plain" }}
+          useInvertedBackground={false}
         />
       </div>
       <div id="footer" data-section="footer">