diff --git a/src/app/page.tsx b/src/app/page.tsx
index 0bc1af3..c355066 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,4 +1,5 @@
 'use client';
+
 import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
 import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
 import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
@@ -10,47 +11,42 @@ import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
 import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
 import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import FooterCard from '@/components/sections/footer/FooterCard';
-import { Star, Globe } from 'lucide-react';
+import { Globe, Shield, Star, CheckCircle } from 'lucide-react';
 
 const navItems = [{ name: 'Home', id: '/' }];
 
-export default function Page() {
+export default function Home() {
   return (
-    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
+    <ThemeProvider>
       <div id="nav" data-section="nav">
-        <NavbarLayoutFloatingInline navItems={navItems} button={{ text: 'Get Started' }} />
+        <NavbarLayoutFloatingInline navItems={navItems} brandName="Webild" />
       </div>
       <div id="hero" data-section="hero">
-        <HeroBillboardRotatedCarousel 
-          title="Welcome" 
-          description="Experience our platform." 
-          background={{ variant: 'animated-grid' }}
-          carouselItems={Array.from({ length: 6 }).map((_, i) => ({ id: `h${i}`, imageSrc: 'https://images.unsplash.com/photo-1614064641938-06bee5d6150a' }))}
-        />
+        <HeroBillboardRotatedCarousel title="Title" description="Desc" background={{ variant: 'plain' }} carouselItems={[]} />
       </div>
       <div id="about" data-section="about">
-        <MediaAbout title="About Us" description="Dedicated to excellence." useInvertedBackground={false} />
+        <MediaAbout title="About" description="About content" />
       </div>
       <div id="menu" data-section="menu">
-        <FeatureCardSix title="Features" description="Discover what we offer." textboxLayout="default" useInvertedBackground={false} features={[{ title: 'Fast', description: 'Very fast' }, { title: 'Secure', description: 'Very secure' }]} />
+        <FeatureCardSix title="Features" description="Features content" features={[]} textboxLayout="default" />
       </div>
       <div id="metrics" data-section="metrics">
-        <MetricCardFourteen title="Metrics" tag="Stats" metrics={[{ id: 'm1', value: '100+', description: 'Users' }]} metricsAnimation="opacity" useInvertedBackground={false} />
+        <MetricCardFourteen title="Metrics" metrics={[]} metricsAnimation="opacity" />
       </div>
       <div id="testimonials" data-section="testimonials">
-        <TestimonialCardTwo title="Testimonials" description="What they say" animationType="opacity" textboxLayout="default" useInvertedBackground={false} testimonials={[{ id: 't1', name: 'John', role: 'Dev', testimonial: 'Great!', icon: Star }]} />
+        <TestimonialCardTwo title="Testimonials" description="Reviews" testimonials={[]} animationType="opacity" textboxLayout="default" />
       </div>
       <div id="faq" data-section="faq">
-        <FaqSplitMedia title="FAQ" description="Your questions answered" faqs={[{ id: 'f1', title: 'Question', content: 'Answer' }]} faqsAnimation="opacity" textboxLayout="default" mediaAnimation="opacity" useInvertedBackground={false} />
+        <FaqSplitMedia title="FAQ" description="Questions" faqs={[]} faqsAnimation="opacity" textboxLayout="default" />
       </div>
       <div id="social-proof" data-section="social-proof">
-        <SocialProofOne title="Trusted By" description="Industry leaders" names={['Company A', 'Company B']} textboxLayout="default" useInvertedBackground={false} />
+        <SocialProofOne title="Social Proof" names={[]} textboxLayout="default" />
       </div>
       <div id="contact" data-section="contact">
-        <ContactSplitForm title="Contact" description="Let's talk" inputs={[{ name: 'email', type: 'email', placeholder: 'Email' }, { name: 'msg', type: 'text', placeholder: 'Message' }]} useInvertedBackground={false} />
+        <ContactSplitForm title="Contact" description="Contact us" inputs={[]} />
       </div>
       <div id="footer" data-section="footer">
-        <FooterCard logoText="Brand" socialLinks={[{ icon: Globe, href: '#', ariaLabel: 'Web' }]} />
+        <FooterCard logoText="Webild" />
       </div>
     </ThemeProvider>
   );