Update src/app/page.tsx

Merge version_3 into main

src/app/page.tsx

@@ -9,7 +9,7 @@ import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleC
 import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
 import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
-import { Activity, Check, Code, Globe, Layout, ThumbsUp, Wallet } from "lucide-react";
+import { CheckCircle, Code, LayoutGrid, Stethoscope, Briefcase } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -19,22 +19,21 @@ export default function LandingPage() {
         borderRadius="pill"
         contentWidth="smallMedium"
         sizing="mediumLargeSizeMediumTitles"
-        background="fluid"
+        background="none"
-        cardStyle="gradient-mesh"
+        cardStyle="solid"
-        primaryButtonStyle="double-inset"
+        primaryButtonStyle="flat"
         secondaryButtonStyle="solid"
-        headingFontWeight="normal"
+        headingFontWeight="semibold"
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
       <NavbarLayoutFloatingOverlay
       navItems={[
-        {
+        { name: "Home", id: "hero" },
-          name: "Home",          id: "hero"},
+        { name: "About", id: "about" },
-        {
+        { name: "Services", id: "services" },
-          name: "Services",          id: "services"},
+        { name: "Offer", id: "offer" },
-        {
+        { name: "Contact", id: "contact" }
-          name: "Contact",          id: "contact"},
       ]}
       brandName="VS Developer"
     />
@@ -42,139 +41,68 @@ export default function LandingPage() {
 
   <div id="hero" data-section="hero">
       <HeroSplitDoubleCarousel
-      background={{
+      title="Grow Your Business With a Professional Website in Just 3 Days"
-        variant: "plain"}}
-      title="Launch Your Professional Business Website in Days"
       description="Professional, affordable web development tailored for your growth."
-      leftCarouselItems={[
+      leftCarouselItems={[{ imageSrc: "https://images.unsplash.com/photo-1460925895917-afdab827c52f?q=80&w=2426&auto=format&fit=crop" }]}
-        {
+      rightCarouselItems={[{ imageSrc: "https://images.unsplash.com/photo-1581291518633-83b4ebd1d83e?q=80&w=2340&auto=format&fit=crop" }]}
-          imageSrc: "http://img.b2bpic.net/free-photo/gray-laptop-simple-wooden-desk_23-2148267466.jpg?_wi=1",          imageAlt: "Gray laptop on simple wooden desk"},
+      background={{ variant: "plain" }}
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/laptop-wooden-table_53876-16546.jpg?_wi=1",          imageAlt: "Laptop on a wooden table"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/open-laptop-with-coffee-cup-pen-wooden-background_23-2147923279.jpg?_wi=1",          imageAlt: "An open laptop with coffee cup and pen on wooden background"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/laptop-with-blank-white-screen-soft-fur-front-wooden-wall_23-2147924325.jpg?_wi=1",          imageAlt: "Laptop with blank white screen on soft fur in front of wooden wall"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/laptop-with-white-tulips-vase-wooden-table_23-2148036926.jpg?_wi=1",          imageAlt: "modern desk workspace minimalist"},
-      ]}
-      rightCarouselItems={[
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/laptop-wooden-table_53876-16546.jpg?_wi=2",          imageAlt: "Laptop on a wooden table"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/open-laptop-with-coffee-cup-pen-wooden-background_23-2147923279.jpg?_wi=2",          imageAlt: "An open laptop with coffee cup and pen on wooden background"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/laptop-with-blank-white-screen-soft-fur-front-wooden-wall_23-2147924325.jpg?_wi=2",          imageAlt: "Laptop with blank white screen on soft fur in front of wooden wall"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/laptop-with-white-tulips-vase-wooden-table_23-2148036926.jpg?_wi=2",          imageAlt: "modern desk workspace minimalist"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/gray-laptop-simple-wooden-desk_23-2148267466.jpg?_wi=2",          imageAlt: "Gray laptop on simple wooden desk"},
-      ]}
       buttons={[
-        {
+        { text: "WhatsApp Now", href: "https://wa.me/9286946493" }
-          text: "WhatsApp Now",          href: "https://wa.me/919286946493"},
-      ]}
-      avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/gray-laptop-simple-wooden-desk_23-2148267466.jpg",          alt: "Client 1"},
-        {
-          src: "http://img.b2bpic.net/free-photo/laptop-wooden-table_53876-16546.jpg",          alt: "Client 2"},
-        {
-          src: "http://img.b2bpic.net/free-photo/open-laptop-with-coffee-cup-pen-wooden-background_23-2147923279.jpg",          alt: "Client 3"},
-        {
-          src: "http://img.b2bpic.net/free-photo/laptop-with-blank-white-screen-soft-fur-front-wooden-wall_23-2147924325.jpg",          alt: "Client 4"},
-        {
-          src: "http://img.b2bpic.net/free-photo/laptop-with-white-tulips-vase-wooden-table_23-2148036926.jpg",          alt: "Client 5"},
-      ]}
-      avatarText="Trusted by 50+ local businesses"
-      marqueeItems={[
-        {
-          type: "image",          src: "http://img.b2bpic.net/free-photo/gray-laptop-simple-wooden-desk_23-2148267466.jpg",          alt: "Client Logo 1"},
-        {
-          type: "image",          src: "http://img.b2bpic.net/free-photo/laptop-wooden-table_53876-16546.jpg",          alt: "Client Logo 2"},
-        {
-          type: "image",          src: "http://img.b2bpic.net/free-photo/open-laptop-with-coffee-cup-pen-wooden-background_23-2147923279.jpg",          alt: "Client Logo 3"},
-        {
-          type: "image",          src: "http://img.b2bpic.net/free-photo/laptop-with-blank-white-screen-soft-fur-front-wooden-wall_23-2147924325.jpg",          alt: "Client Logo 4"},
-        {
-          type: "image",          src: "http://img.b2bpic.net/free-photo/laptop-with-white-tulips-vase-wooden-table_23-2148036926.jpg",          alt: "Client Logo 5"},
       ]}
     />
   </div>
 
   <div id="about" data-section="about">
       <TestimonialAboutCard
-      useInvertedBackground={false}
+      tag="About"
-      tag="About Us"
+      title="Our Mission"
-      title="VS Developer"
       description="We create simple and affordable websites for businesses."
-      subdescription="Your digital presence simplified."
+      subdescription="We build digital solutions that help your business scale effortlessly."
       icon={Code}
-      imageSrc="http://img.b2bpic.net/free-photo/laptop-with-white-tulips-vase-wooden-table_23-2148036926.jpg?_wi=3"
+      videoSrc="https://www.youtube.com/watch?v=dQw4w9WgXcQ"
-      mediaAnimation="none"
+      useInvertedBackground={false}
     />
   </div>
 
   <div id="services" data-section="services">
       <FeatureBorderGlow
-      animationType="none"
+      title="Our Services"
+      description="Development solutions tailored to your business needs."
+      features={[
+        { icon: Briefcase, title: "Business Websites", description: "High-performance corporate sites." },
+        { icon: Stethoscope, title: "Clinic Websites", description: "Engaging sites for medical clinics." },
+        { icon: LayoutGrid, title: "Landing Pages", description: "High-converting landing pages." }
+      ]}
+      animationType="blur-reveal"
       textboxLayout="default"
       useInvertedBackground={false}
-      features={[
-        {
-          icon: Globe,
-          title: "Business Websites",          description: "Professional sites for your company."},
-        {
-          icon: Activity,
-          title: "Clinic Websites",          description: "Dedicated sites for medical practices."},
-        {
-          icon: Layout,
-          title: "Landing Pages",          description: "High-converting single-page designs."},
-      ]}
-      title="Our Services"
-      description="Development solutions for every need."
     />
   </div>
 
   <div id="offer" data-section="offer">
       <MetricCardThree
-      animationType="none"
+      title="Special Offer"
+      description="Start your project with confidence."
+      metrics={[
+        { id: "demo", icon: CheckCircle, title: "Guarantee", value: "Free demo before payment" }
+      ]}
+      animationType="blur-reveal"
       textboxLayout="default"
       useInvertedBackground={false}
-      metrics={[
-        {
-          id: "1",          icon: Check,
-          title: "Demo Offer",          value: "Free Demo"},
-        {
-          id: "2",          icon: ThumbsUp,
-          title: "Satisfaction",          value: "Guaranteed"},
-        {
-          id: "3",          icon: Wallet,
-          title: "Payment",          value: "Post-Demo"},
-      ]}
-      title="Our Guarantee"
-      description="We believe in our work."
     />
   </div>
 
   <div id="contact" data-section="contact">
       <ContactSplitForm
-      useInvertedBackground={false}
       title="Get in Touch"
       description="Ready to build your website? Let's talk."
       inputs={[
-        {
+        { name: "name", type: "text", placeholder: "Your Name", required: true },
-          name: "name",          type: "text",          placeholder: "Your Name",          required: true,
+        { name: "email", type: "email", placeholder: "Your Email", required: true }
-        },
-        {
-          name: "email",          type: "email",          placeholder: "Email Address",          required: true,
-        },
       ]}
-      textarea={{
+      textarea={{ name: "message", placeholder: "Tell us about your project", rows: 4 }}
-        name: "message",        placeholder: "How can we help?",        rows: 4,
+      buttonText="Submit"
-        required: true,
+      useInvertedBackground={false}
-      }}
-      imageSrc="http://img.b2bpic.net/free-photo/laptop-with-white-tulips-vase-wooden-table_23-2148036926.jpg?_wi=4"
     />
   </div>
 
@@ -184,12 +112,10 @@ export default function LandingPage() {
       columns={[
         {
           title: "Contact",          items: [
-            {
+            { label: "WhatsApp: 9286946493", href: "https://wa.me/9286946493" },
-              label: "WhatsApp: 9286946493",              href: "https://wa.me/919286946493"},
+            { label: "Email: VS.developerr@gmail.com", href: "mailto:VS.developerr@gmail.com" }
-            {
+          ]
-              label: "Email: VS.developerr@gmail.com",              href: "mailto:VS.developerr@gmail.com"},
+        }
-          ],
-        },
       ]}
       copyrightText="© 2025 VS Developer"
     />