Update src/app/page.tsx

src/app/page.tsx

@@ -4,11 +4,11 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import AboutMetric from '@/components/sections/about/AboutMetric';
 import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
-import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
+import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
 import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
 import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
+import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
 import { Award, CheckCircle, Zap } from "lucide-react";
 
 export default function LandingPage() {
@@ -30,21 +30,13 @@ export default function LandingPage() {
       <NavbarStyleFullscreen
       navItems={[
         {
-          name: "Home",
+          name: "Home",          id: "hero"},
-          id: "hero",
-        },
         {
-          name: "About",
+          name: "About",          id: "about"},
-          id: "about",
-        },
         {
-          name: "Work",
+          name: "Work",          id: "work"},
-          id: "work",
-        },
         {
-          name: "Contact",
+          name: "Contact",          id: "contact"},
-          id: "contact",
-        },
       ]}
       brandName="Portfolio"
     />
@@ -56,35 +48,15 @@ export default function LandingPage() {
       description="Crafting digital experiences that tell unique stories. I turn ideas into elegant, functional designs."
       buttons={[
         {
-          text: "View Projects",
+          text: "View Projects",          href: "#work"},
-          href: "#work",
-        },
       ]}
       slides={[
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/black-girl-denim-sitting-table-with-stationery-touching-computer-screen_197531-4896.jpg",
+          imageSrc: "http://img.b2bpic.net/free-photo/black-girl-denim-sitting-table-with-stationery-touching-computer-screen_197531-4896.jpg?_wi=1",          imageAlt: "Creative project 1"},
-          imageAlt: "Creative project 1",
-        },
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/young-man-going-art-gallery_23-2149709125.jpg",
+          imageSrc: "http://img.b2bpic.net/free-photo/young-man-going-art-gallery_23-2149709125.jpg",          imageAlt: "Creative project 2"},
-          imageAlt: "Creative project 2",
-        },
         {
-          imageSrc: "http://img.b2bpic.net/free-photo/web-template-layout-draft-sketch_53876-167110.jpg",
+          imageSrc: "http://img.b2bpic.net/free-photo/web-template-layout-draft-sketch_53876-167110.jpg?_wi=1",          imageAlt: "Creative project 3"},
-          imageAlt: "Creative project 3",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/abstract-blue-acrylic-balls-water-with-copy-space_23-2148469383.jpg",
-          imageAlt: "Creative project 4",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/african-american-woman-as-professional-architect_482257-8100.jpg",
-          imageAlt: "Creative project 5",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-fresh-caught-pike-fish_23-2147894172.jpg",
-          imageAlt: "Creative project 6",
-        },
       ]}
     />
   </div>
@@ -96,110 +68,54 @@ export default function LandingPage() {
       metrics={[
         {
           icon: Award,
-          label: "Years Experience",
+          label: "Years Experience",          value: "5+"},
-          value: "5+",
-        },
         {
           icon: CheckCircle,
-          label: "Projects Completed",
+          label: "Projects Completed",          value: "40+"},
-          value: "40+",
-        },
         {
           icon: Zap,
-          label: "Clients Served",
+          label: "Clients Served",          value: "25+"},
-          value: "25+",
-        },
       ]}
       metricsAnimation="slide-up"
     />
   </div>
 
   <div id="work" data-section="work">
-      <FeatureCardTwelve
+      <FeatureCardTwentyFive
-      animationType="slide-up"
+      animationType="depth-3d"
-      textboxLayout="default"
+      textboxLayout="split"
       useInvertedBackground={true}
+      title="Selected Work"
+      description="A collection of my most impactful creative projects with immersive depth."
       features={[
         {
-          id: "1",
+          title: "Brand Identity",          description: "Full brand ecosystem development.",          icon: Award,
-          label: "UI/UX",
+          mediaItems: [
-          title: "Brand Identity Redesign",
+            { imageSrc: "http://img.b2bpic.net/free-photo/web-template-layout-draft-sketch_53876-167110.jpg?_wi=2" },
-          items: [
+            { imageSrc: "http://img.b2bpic.net/free-photo/black-girl-denim-sitting-table-with-stationery-touching-computer-screen_197531-4896.jpg?_wi=2" }
-            "User research",
+          ]
-            "Visual system",
+        }
-            "Interaction flow",
-          ],
-        },
-        {
-          id: "2",
-          label: "Development",
-          title: "E-commerce Platform",
-          items: [
-            "Performance optimization",
-            "Responsive design",
-            "Checkout flow",
-          ],
-        },
-        {
-          id: "3",
-          label: "Branding",
-          title: "Corporate Design System",
-          items: [
-            "Typography study",
-            "Color palette",
-            "Brand guidelines",
-          ],
-        },
       ]}
-      title="Selected Work"
-      description="A collection of my most impactful creative projects."
     />
   </div>
 
   <div id="testimonials" data-section="testimonials">
-      <TestimonialCardSix
+      <TestimonialCardSixteen
-      animationType="slide-up"
+      animationType="depth-3d"
-      textboxLayout="default"
+      textboxLayout="split"
       useInvertedBackground={false}
-      testimonials={[
-        {
-          id: "1",
-          name: "Sarah Johnson",
-          handle: "@sarahj",
-          testimonial: "Exceptional eye for detail and a truly professional approach to every challenge.",
-          imageSrc: "http://img.b2bpic.net/free-photo/happy-man-with-eyeglasses-smiling-office_329181-14553.jpg",
-        },
-        {
-          id: "2",
-          name: "Michael Chen",
-          handle: "@mikechen",
-          testimonial: "The best creative partner I've had. Consistently exceeds expectations.",
-          imageSrc: "http://img.b2bpic.net/free-photo/happy-man-white_1368-6366.jpg",
-        },
-        {
-          id: "3",
-          name: "Emily Rodriguez",
-          handle: "@erod",
-          testimonial: "Highly recommended for any complex design needs. Very innovative.",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-office-worker-woman-sitting-office-desk-using-laptop-computer-looking-aside-thinking-with-pensive-expression-working-office_141793-21259.jpg",
-        },
-        {
-          id: "4",
-          name: "David Kim",
-          handle: "@dkim",
-          testimonial: "Incredible communication and beautiful final output. Will work again.",
-          imageSrc: "http://img.b2bpic.net/free-photo/confident-businessman-smiling_107420-84734.jpg",
-        },
-        {
-          id: "5",
-          name: "Alice Wang",
-          handle: "@awang",
-          testimonial: "Transformed our digital presence completely. Truly brilliant work.",
-          imageSrc: "http://img.b2bpic.net/free-photo/smiling-pretty-woman-with-short-curly-hair-dressed-jacket-glasses-poses-pink-with-clasped-hands-wonderful-smile_291650-1138.jpg",
-        },
-      ]}
       title="Client Feedback"
       description="What partners have said about my work."
+      kpiItems={[
+        { value: "98%", label: "Satisfaction" },
+        { value: "50+", label: "Projects" },
+        { value: "20+", label: "Countries" }
+      ]}
+      testimonials={[
+        {
+          id: "1",          name: "Sarah Johnson",          role: "Design Lead",          company: "Creative Co",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/happy-man-with-eyeglasses-smiling-office_329181-14553.jpg"}
+      ]}
     />
   </div>
 
@@ -210,22 +126,14 @@ export default function LandingPage() {
       description="Interested in working together? Let's discuss your project."
       inputs={[
         {
-          name: "name",
+          name: "name",          type: "text",          placeholder: "Your Name",          required: true,
-          type: "text",
-          placeholder: "Your Name",
-          required: true,
         },
         {
-          name: "email",
+          name: "email",          type: "email",          placeholder: "Your Email",          required: true,
-          type: "email",
-          placeholder: "Your Email",
-          required: true,
         },
       ]}
       textarea={{
-        name: "message",
+        name: "message",        placeholder: "Project Details",        rows: 4,
-        placeholder: "Project Details",
-        rows: 4,
       }}
       imageSrc="http://img.b2bpic.net/free-photo/high-angle-paper-colorful-paint-table_23-2149632412.jpg"
     />
@@ -236,29 +144,19 @@ export default function LandingPage() {
       logoText="PORTFOLIO"
       columns={[
         {
-          title: "Navigation",
+          title: "Navigation",          items: [
-          items: [
             {
-              label: "Home",
+              label: "Home",              href: "#hero"},
-              href: "#hero",
-            },
             {
-              label: "Work",
+              label: "Work",              href: "#work"},
-              href: "#work",
-            },
           ],
         },
         {
-          title: "Socials",
+          title: "Socials",          items: [
-          items: [
             {
-              label: "LinkedIn",
+              label: "LinkedIn",              href: "#"},
-              href: "#",
-            },
             {
-              label: "Twitter",
+              label: "Twitter",              href: "#"},
-              href: "#",
-            },
           ],
         },
       ]}
@@ -268,4 +166,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}