Update src/app/page.tsx

src/app/globals.css

@@ -9,8 +9,8 @@
   --foreground: #00120ae6;;
   --primary-cta: #15ad59;;
   --secondary-cta: #ffffff;;
-  --accent: #e2e2e2;;
-  --background-accent: #c4c4c4;;
+  --accent: #9ca3af;;
+  --background-accent: #e5e7eb;;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);

src/app/page.tsx

@@ -5,13 +5,14 @@ import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleAp
 import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
 import ParallaxAbout from '@/components/sections/about/ParallaxAbout';
 import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
-import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
-import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
-import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
-import TestimonialCardEight from '@/components/sections/testimonial/TestimonialCardEight';
-import ContactText from '@/components/sections/contact/ContactText';
-import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
-import { Sparkles, CheckCircle, Star, DollarSign, Users, Crown, TrendingUp, Building, Globe, Award } from "lucide-react";
+import FeatureCardFifteen from '@/components/sections/feature/FeatureCardFifteen';
+import ProductCardSeven from '@/components/sections/product/ProductCardSeven';
+import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
+import MetricCardFive from '@/components/sections/metrics/MetricCardFive';
+import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
+import FooterCard from '@/components/sections/footer/FooterCard';
+import { Sparkles, CheckCircle, Star, DollarSign, Users, Crown, TrendingUp, Building, Globe, Award, Package } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -82,28 +83,28 @@ export default function LandingPage() {
           tagIcon={CheckCircle}
           features={[
             {
-              id: "01",
+              id: "1",
               title: "Advanced Analytics",
               description: "Real-time insights and comprehensive reporting to drive informed decision-making",
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697694989-2tzhxsyk.jpg",
               imageAlt: "Analytics dashboard"
             },
             {
-              id: "02",
+              id: "2",
               title: "Smart Automation",
               description: "Streamline repetitive tasks and focus on what matters most to your business",
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697695831-3m347obl.jpg",
               imageAlt: "Automation workflow"
             },
             {
-              id: "03",
+              id: "3",
               title: "Enterprise Security",
               description: "Bank-grade encryption and compliance standards to protect your sensitive data",
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697696774-ms83vt7x.jpg",
               imageAlt: "Security protection"
             },
             {
-              id: "04",
+              id: "4",
               title: "Team Collaboration",
               description: "Work together seamlessly with integrated communication and project management tools",
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697697861-n3ip2w85.jpg",
@@ -120,8 +121,64 @@ export default function LandingPage() {
         />
       </div>
 
+      <div id="feature-card-six" data-section="feature-card-six">
+        <FeatureCardFifteen 
+          title="Additional Features"
+          description="Discover more capabilities that power your success"
+          features={[
+            {
+              id: "1",
+              title: "Real-time Monitoring",
+              description: "Track everything in real-time with instant notifications",
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697694989-2tzhxsyk.jpg",
+              imageAlt: "Monitoring dashboard"
+            },
+            {
+              id: "2",
+              title: "API Integration",
+              description: "Seamlessly integrate with your favorite tools and services",
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697695831-3m347obl.jpg",
+              imageAlt: "API integration"
+            },
+            {
+              id: "3",
+              title: "Custom Workflows",
+              description: "Build workflows tailored to your business needs",
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697696774-ms83vt7x.jpg",
+              imageAlt: "Custom workflows"
+            },
+            {
+              id: "4",
+              title: "Advanced Reporting",
+              description: "Generate comprehensive reports with detailed analytics",
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697697861-n3ip2w85.jpg",
+              imageAlt: "Advanced reporting"
+            },
+            {
+              id: "5",
+              title: "Data Export",
+              description: "Export your data in multiple formats for analysis",
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697694989-2tzhxsyk.jpg",
+              imageAlt: "Data export"
+            },
+            {
+              id: "6",
+              title: "Performance Optimization",
+              description: "Optimize your workflow performance with advanced tools",
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697695831-3m347obl.jpg",
+              imageAlt: "Performance optimization"
+            }
+          ]}
+          animationType="slide-up"
+          textboxLayout="default"
+          useInvertedBackground="noInvert"
+          speed={40}
+          topMarqueeDirection="left"
+        />
+      </div>
+
       <div id="products" data-section="products">
-        <ProductCardTwo 
+        <ProductCardSeven 
           title="Premium Solutions"
           description="Discover our suite of industry-leading products trusted by thousands of organizations"
           tag="Product Lineup"
@@ -129,31 +186,22 @@ export default function LandingPage() {
           products={[
             {
               id: "1",
-              brand: "CorePlatform",
               name: "Enterprise Dashboard Pro",
               price: "$2,499/month",
-              rating: 5,
-              reviewCount: "8.4k",
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697699024-xunffv89.jpg",
               imageAlt: "Enterprise dashboard"
             },
             {
               id: "2",
-              brand: "CloudSync",
               name: "Integration Suite Plus",
               price: "$1,899/month",
-              rating: 5,
-              reviewCount: "6.2k",
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697699859-58a6nfjk.jpg",
               imageAlt: "Cloud integration"
             },
             {
               id: "3",
-              brand: "DataVault",
               name: "Analytics Intelligence Hub",
               price: "$3,299/month",
-              rating: 5,
-              reviewCount: "9.1k",
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697700562-a619kf58.jpg",
               imageAlt: "Analytics platform"
             }
@@ -169,7 +217,7 @@ export default function LandingPage() {
       </div>
 
       <div id="pricing" data-section="pricing">
-        <PricingCardOne 
+        <PricingCardNine 
           title="Choose Your Plan"
           description="Flexible pricing designed to scale with your organization"
           tag="Transparent Pricing"
@@ -177,24 +225,30 @@ export default function LandingPage() {
           plans={[
             {
               id: "starter",
-              badge: "Best for Teams",
-              badgeIcon: Users,
-              price: "$499/mo",
-              subtitle: "Perfect for growing teams",
+              title: "Starter",
+              price: "$499",
+              period: "/month",
+              imageSrc: "/placeholders/placeholder1.webp",
+              imageAlt: "Starter plan",
               features: [
                 "Up to 10 team members",
                 "Basic analytics",
                 "Email support",
                 "50GB storage",
                 "Monthly reports"
-              ]
+              ],
+              button: {
+                text: "Get Started",
+                href: "contact"
+              }
             },
             {
               id: "professional",
-              badge: "Most Popular",
-              badgeIcon: Sparkles,
-              price: "$1,299/mo",
-              subtitle: "For scaling businesses",
+              title: "Professional",
+              price: "$1,299",
+              period: "/month",
+              imageSrc: "/placeholders/placeholder1.webp",
+              imageAlt: "Professional plan",
               features: [
                 "Up to 50 team members",
                 "Advanced analytics",
@@ -202,14 +256,19 @@ export default function LandingPage() {
                 "500GB storage",
                 "Real-time dashboards",
                 "Custom integrations"
-              ]
+              ],
+              button: {
+                text: "Get Started",
+                href: "contact"
+              }
             },
             {
               id: "enterprise",
-              badge: "Custom Power",
-              badgeIcon: Crown,
+              title: "Enterprise",
               price: "Custom",
-              subtitle: "For enterprise needs",
+              period: "",
+              imageSrc: "/placeholders/placeholder1.webp",
+              imageAlt: "Enterprise plan",
               features: [
                 "Unlimited team members",
                 "Enterprise analytics",
@@ -217,7 +276,11 @@ export default function LandingPage() {
                 "Unlimited storage",
                 "Advanced security",
                 "SLA guarantee"
-              ]
+              ],
+              button: {
+                text: "Contact Sales",
+                href: "contact"
+              }
             }
           ]}
           animationType="slide-up"
@@ -230,7 +293,7 @@ export default function LandingPage() {
       </div>
 
       <div id="metrics" data-section="metrics">
-        <MetricCardThree 
+        <MetricCardFive 
           title="Proven Track Record"
           description="Join thousands of companies that have transformed their operations with our platform"
           tag="Impact & Growth"
@@ -238,30 +301,25 @@ export default function LandingPage() {
           metrics={[
             {
               id: "1",
-              icon: Users,
-              title: "Active Users",
-              value: "50,000+"
+              value: "50,000+",
+              description: "Active users trusting our platform for their daily operations"
             },
             {
               id: "2",
-              icon: Building,
-              title: "Enterprise Clients",
-              value: "1,200+"
+              value: "1,200+",
+              description: "Enterprise clients have transformed their business with our solutions"
             },
             {
               id: "3",
-              icon: TrendingUp,
-              title: "Revenue Growth",
-              value: "340%"
+              value: "340%",
+              description: "Average revenue growth reported by our enterprise customers"
             },
             {
               id: "4",
-              icon: Globe,
-              title: "Global Coverage",
-              value: "85 Countries"
+              value: "85",
+              description: "Countries where our platform is actively used by businesses"
             }
           ]}
-          gridVariant="uniform-all-items-equal"
           animationType="slide-up"
           textboxLayout="default"
           useInvertedBackground="noInvert"
@@ -269,7 +327,7 @@ export default function LandingPage() {
       </div>
 
       <div id="testimonials" data-section="testimonials">
-        <TestimonialCardEight 
+        <TestimonialCardTwo 
           title="Customer Stories"
           description="See how leading organizations are achieving extraordinary results"
           tag="Success Stories"
@@ -280,108 +338,98 @@ export default function LandingPage() {
             {
               id: "1",
               name: "Sarah Chen",
-              role: "Chief Product Officer",
-              company: "TechVentures Inc.",
-              rating: 5,
+              role: "Chief Product Officer at TechVentures Inc.",
+              testimonial: "The platform has transformed how we approach product development. The analytics insights have been game-changing for our team.",
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697701589-74m0l190.jpg",
               imageAlt: "Sarah Chen"
             },
             {
               id: "2",
               name: "Michael Rodriguez",
-              role: "VP of Operations",
-              company: "Global Solutions Ltd.",
-              rating: 5,
+              role: "VP of Operations at Global Solutions Ltd.",
+              testimonial: "Implementation was seamless and the support team was exceptional. We saw immediate improvements in our operational efficiency.",
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697702404-3f9g9pg8.jpg",
               imageAlt: "Michael Rodriguez"
             },
             {
               id: "3",
               name: "Emily Patterson",
-              role: "Founder & CEO",
-              company: "StartupX Labs",
-              rating: 5,
+              role: "Founder & CEO at StartupX Labs",
+              testimonial: "As a startup, we needed tools that could scale with us. This platform delivered exactly what we needed to grow rapidly.",
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697703019-hp2chfts.jpg",
               imageAlt: "Emily Patterson"
             },
             {
               id: "4",
               name: "David Kim",
-              role: "Director of Strategy",
-              company: "Enterprise Solutions Co.",
-              rating: 5,
+              role: "Director of Strategy at Enterprise Solutions Co.",
+              testimonial: "The automation features have saved us countless hours each week. Our team can now focus on strategic initiatives instead of manual tasks.",
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697703901-ucj0io9f.jpg",
               imageAlt: "David Kim"
             },
             {
               id: "5",
               name: "Jessica Anderson",
-              role: "Head of Digital",
-              company: "Innovation Hub Partners",
-              rating: 5,
+              role: "Head of Digital at Innovation Hub Partners",
+              testimonial: "The real-time collaboration features have revolutionized how our distributed team works together. Highly recommend!",
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697704883-1ocaj213.jpg",
               imageAlt: "Jessica Anderson"
             },
             {
               id: "6",
               name: "James Matthews",
-              role: "Executive Director",
-              company: "Growth Accelerators",
-              rating: 5,
+              role: "Executive Director at Growth Accelerators",
+              testimonial: "The platform's security features give us complete confidence in handling sensitive client data. Outstanding solution!",
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697706400-gxjdwov7.jpg",
               imageAlt: "James Matthews"
             }
           ]}
+          animationType="slide-up"
         />
       </div>
 
       <div id="contact" data-section="contact">
-        <ContactText 
-          text="Ready to transform your business? Join hundreds of successful companies already using our platform. Start your free trial today."
-          animationType="background-highlight"
-          buttons={[
-            {text: "Start Free Trial", href: "https://example.com/signup"},
-            {text: "Schedule Demo", href: "contact"}
+        <ContactSplitForm 
+          title="Ready to Transform Your Business?"
+          description="Join hundreds of successful companies already using our platform. Start your free trial today and see the difference intelligent automation can make."
+          inputs={[
+            {
+              name: "name",
+              type: "text",
+              placeholder: "Your Name",
+              required: true
+            },
+            {
+              name: "email",
+              type: "email",
+              placeholder: "Email Address",
+              required: true
+            },
+            {
+              name: "company",
+              type: "text",
+              placeholder: "Company Name",
+              required: false
+            }
           ]}
+          textarea={{
+            name: "message",
+            placeholder: "Tell us about your project or ask any questions...",
+            rows: 5,
+            required: false
+          }}
+          buttonText="Start Free Trial"
           useInvertedBackground="noInvert"
-          textClassName="text-3xl md:text-4xl font-bold"
-          containerClassName="rounded-soft"
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767697692413-ceqqaha8.jpg"
+          imageAlt="Platform dashboard preview"
+          mediaPosition="right"
         />
       </div>
 
       <div id="footer" data-section="footer">
-        <FooterBaseReveal 
-          columns={[
-            {
-              title: "Product",
-              items: [
-                {label: "Features", href: "features"},
-                {label: "Pricing", href: "pricing"},
-                {label: "Security", href: "#"},
-                {label: "Roadmap", href: "#"}
-              ]
-            },
-            {
-              title: "Company",
-              items: [
-                {label: "About", href: "about"},
-                {label: "Blog", href: "#"},
-                {label: "Careers", href: "#"},
-                {label: "Contact", href: "contact"}
-              ]
-            },
-            {
-              title: "Legal",
-              items: [
-                {label: "Privacy", href: "#"},
-                {label: "Terms", href: "#"},
-                {label: "Cookies", href: "#"},
-                {label: "Compliance", href: "#"}
-              ]
-            }
-          ]}
+        <FooterCard 
+          logoText="Webild"
           copyrightText="© 2025 Webild. All rights reserved."
-          ariaLabel="Footer"
         />
       </div>
     </ThemeProvider>