diff --git a/src/app/page.tsx b/src/app/page.tsx
index 987eddb..ed221d6 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,6 +1,4 @@
-'use client';
-
-import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
 import ProductCardFour from '@/components/sections/product/ProductCardFour';
@@ -8,89 +6,70 @@ import TextAbout from '@/components/sections/about/TextAbout';
 import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
 import ContactText from '@/components/sections/contact/ContactText';
 import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+import { Star } from 'lucide-react';
 
-export default function HomePage() {
-  const navItems = [{ name: 'Home', id: '/' }, { name: 'About', id: '/about' }, { name: 'Contact', id: '/contact' }];
-  
+const navItems = [{ name: "Home", id: "/" }];
+
+export default function Page() {
   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">
-        <NavbarStyleCentered navItems={navItems} />
+        <NavbarStyleCentered navItems={navItems} brandName="Webild" />
       </div>
-      
       <div id="hero" data-section="hero">
-        <HeroLogoBillboard
+        <HeroLogoBillboard 
           logoText="Webild"
-          description="Experience the future of digital presence."
-          buttons={[{ text: 'Get Started', href: '#reservas' }]}
-          background={{ variant: 'gradient-bars' }}
+          description="Professional web development and digital solutions."
+          buttons={[{ text: "Get Started", href: "#reservas" }]}
+          background={{ variant: "gradient-bars" }}
+          mediaAnimation="opacity"
         />
       </div>
-
       <div id="especialidades" data-section="especialidades">
-        <ProductCardFour
+        <ProductCardFour 
           title="Our Services"
-          description="Tailored solutions for your business."
+          description="We provide top-tier digital development services."
+          products={[
+            { id: "1", name: "Web Design", price: "$500", variant: "Basic", imageSrc: "https://images.unsplash.com/photo-1547658719-da2b51169165?auto=format&fit=crop&q=80&w=800" },
+            { id: "2", name: "App Development", price: "$1200", variant: "Pro", imageSrc: "https://images.unsplash.com/photo-1551650975-87de11494a6b?auto=format&fit=crop&q=80&w=800" },
+            { id: "3", name: "Cloud Solutions", price: "$2000", variant: "Enterprise", imageSrc: "https://images.unsplash.com/photo-1451187580459-43490279c0fa?auto=format&fit=crop&q=80&w=800" }
+          ]}
           gridVariant="three-columns-all-equal-width"
           animationType="slide-up"
           textboxLayout="default"
           useInvertedBackground={false}
-          products={[
-            { id: '1', name: 'Web Design', price: '$999', variant: 'Professional', imageSrc: 'https://images.unsplash.com/photo-1547658719-da2b51169165' },
-            { id: '2', name: 'App Development', price: '$1999', variant: 'Advanced', imageSrc: 'https://images.unsplash.com/photo-1555949963-aa9fe0c977eb' },
-            { id: '3', name: 'SEO Marketing', price: '$499', variant: 'Standard', imageSrc: 'https://images.unsplash.com/photo-1563986768609-322da13575f3' }
-          ]}
         />
       </div>
-
       <div id="sobre-nosotros" data-section="sobre-nosotros">
-        <TextAbout
-          title="About Webild"
+        <TextAbout 
+          title="About Us"
           useInvertedBackground={true}
         />
       </div>
-
       <div id="reseñas" data-section="reseñas">
-        <TestimonialCardSixteen
-          title="Client Reviews"
-          description="What our partners say about us."
-          kpiItems={[
-            { value: '500+', label: 'Projects' },
-            { value: '99%', label: 'Satisfaction' },
-            { value: '24/7', label: 'Support' }
-          ]}
-          animationType="slide-up"
-          textboxLayout="split"
-          useInvertedBackground={false}
+        <TestimonialCardSixteen 
+          title="Testimonials"
+          description="What our clients say"
           testimonials={[
-            { id: 't1', name: 'Alice', role: 'CEO', company: 'TechCo', rating: 5 }
+            { id: "1", name: "John Doe", role: "CEO", company: "Tech Corp", rating: 5, imageSrc: "https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?auto=format&fit=crop&q=80&w=200" }
           ]}
+          kpiItems={[{ value: "100+", label: "Clients" }, { value: "500+", label: "Projects" }, { value: "10+", label: "Years" }]}
+          animationType="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={false}
         />
       </div>
-
       <div id="reservas" data-section="reservas">
-        <ContactText
+        <ContactText 
           text="Ready to start your project? Contact us today!"
-          background={{ variant: 'plain' }}
-          useInvertedBackground={true}
+          background={{ variant: "gradient-bars" }}
+          useInvertedBackground={false}
         />
       </div>
-
       <div id="footer" data-section="footer">
-        <FooterBaseCard
+        <FooterBaseCard 
           logoText="Webild"
-          columns={[{ title: 'Company', items: [{ label: 'About', href: '#' }] }]}
+          columns={[{ title: "Company", items: [{ label: "About", href: "/about" }] }]} 
         />
       </div>
     </ThemeProvider>