Update src/app/page.tsx

Merge version_5 into main

src/app/about/page.tsx

@@ -3,10 +3,10 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
 import MetricSplitMediaAbout from "@/components/sections/about/MetricSplitMediaAbout";
-import FeatureCardTwentyFour from "@/components/sections/feature/FeatureCardTwentyFour";
+import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
 import FooterSimple from "@/components/sections/footer/FooterSimple";
 import Link from "next/link";
-import { Rocket, Zap } from "lucide-react";
+import { Rocket, TrendingUp, Zap as ZapIcon, Users } from "lucide-react";
 
 export default function AboutPage() {
   const footerColumns = [
@@ -94,23 +94,26 @@ export default function AboutPage() {
       </div>
 
       <div id="features" data-section="features">
-        <FeatureCardTwentyFour
+        <MetricCardThree
-          features={[
+          metrics={[
             {
-              id: "1",              title: "Advanced Security",              author: "Security Team",              description: "Military-grade encryption, multi-factor authentication, and comprehensive compliance frameworks including HIPAA, SOC 2, and ISO 27001 certifications.",              tags: ["Security", "Compliance"],
+              id: "1",              icon: TrendingUp,
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/abstract-visualization-of-cloud-security-1773144532588-9315b3bb.png?_wi=2",              imageAlt: "Cloud Security Features"},
+              title: "Advanced Analytics",              value: "3.2x"
+            },
             {
-              id: "2",              title: "Intelligent Automation",              author: "Product Team",              description: "AI-powered workflow automation that learns from patterns, reduces manual tasks by up to 80%, and improves operational efficiency across your organization.",              tags: ["AI", "Automation"],
+              id: "2",              icon: ZapIcon,
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/modern-automation-workflow-visualization-1773144537987-5ca7d5b2.jpg?_wi=2",              imageAlt: "Automation Workflow"},
+              title: "Performance Boost",              value: "45%"
+            },
             {
-              id: "3",              title: "Unlimited Scalability",              author: "Infrastructure Team",              description: "Cloud-native architecture that scales seamlessly from startup to enterprise, supporting millions of transactions per second without performance degradation.",              tags: ["Scalability", "Cloud"],
+              id: "3",              icon: Users,
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/abstract-representation-of-scalability-a-1773144535133-0294c819.jpg?_wi=2",              imageAlt: "Scalable Architecture"},
+              title: "Team Efficiency",              value: "98%"
+            }
           ]}
           animationType="slide-up"
-          title="Powerful Features"
+          title="Key Performance Metrics"
-          description="Comprehensive capabilities designed to accelerate your digital transformation journey and maximize ROI."
+          description="Comprehensive metrics that drive real business results and measurable ROI."
-          tag="Enterprise Features"
+          tag="Features"
-          tagIcon={Zap}
+          tagIcon={ZapIcon}
           textboxLayout="default"
           useInvertedBackground={false}
           tagAnimation="opacity"

src/app/layout.tsx

@@ -6,6 +6,7 @@ import { ServiceWrapper } from "@/components/ServiceWrapper";
 import Tag from "@/tag/Tag";
 import { getVisualEditScript } from "@/utils/visual-edit-script";
 import { Libre_Baskerville } from "next/font/google";
+import { Lobster_Two } from "next/font/google";
 
 
 
@@ -44,15 +45,11 @@ export const metadata: Metadata = {
   },
 };
 
-const libreBaskerville = Libre_Baskerville({
+
-  variable: "--font-libre-baskerville",
+const lobsterTwo = Lobster_Two({
-  subsets: ["latin"],
+  variable: "--font-lobster-two",  subsets: ["latin"],
   weight: ["400", "700"],
 });
-const inter = Inter({
-  variable: "--font-inter",
-  subsets: ["latin"],
-});
 
 export default function RootLayout({
   children,
@@ -62,7 +59,7 @@ export default function RootLayout({
   return (
     <html lang="en" suppressHydrationWarning>
       <ServiceWrapper>
-        <body className={`${libreBaskerville.variable} ${inter.variable} antialiased`}>
+        <body className={`${lobsterTwo.variable} antialiased`}>
           <Tag />
           {children}
           <script

src/app/page.tsx

@@ -4,13 +4,13 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
 import HeroBillboard from "@/components/sections/hero/HeroBillboard";
 import MetricSplitMediaAbout from "@/components/sections/about/MetricSplitMediaAbout";
-import FeatureCardTwentyFour from "@/components/sections/feature/FeatureCardTwentyFour";
+import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
 import MetricCardFourteen from "@/components/sections/metrics/MetricCardFourteen";
 import TestimonialCardTen from "@/components/sections/testimonial/TestimonialCardTen";
 import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
 import FooterSimple from "@/components/sections/footer/FooterSimple";
 import Link from "next/link";
-import { Rocket, Zap, Star, CheckCircle, Sparkles } from "lucide-react";
+import { Rocket, Zap, Star, CheckCircle, Sparkles, TrendingUp, Zap as ZapIcon, Users } from "lucide-react";
 
 export default function HomePage() {
   const footerColumns = [
@@ -107,7 +107,7 @@ export default function HomePage() {
             { type: "image", src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/amazon-company-logo-recognizable-ecommer-1773144533201-8d42dc8f.png", alt: "Amazon" },
             { type: "image", src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/salesforce-company-logo-crm-software-and-1773144540135-77f0bf19.jpg", alt: "Salesforce" },
             { type: "image", src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/ibm-company-logo-enterprise-technology-a-1773144542517-c650ca73.jpg", alt: "IBM" },
-            { type: "image", src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/oracle-company-logo-database-and-enterpr-1773144534714-ed7bc395.jpg", alt: "Oracle" },
+            { type: "image", src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/oracle-company-logo-database-and-enterpri-1773144534714-ed7bc395.jpg", alt: "Oracle" },
           ]}
           marqueeSpeed={30}
           showMarqueeCard={true}
@@ -136,22 +136,25 @@ export default function HomePage() {
       </div>
 
       <div id="features" data-section="features">
-        <FeatureCardTwentyFour
+        <MetricCardThree
-          features={[
+          metrics={[
             {
-              id: "1",              title: "Advanced Security",              author: "Security Team",              description: "Military-grade encryption, multi-factor authentication, and comprehensive compliance frameworks including HIPAA, SOC 2, and ISO 27001 certifications.",              tags: ["Security", "Compliance"],
+              id: "1",              icon: TrendingUp,
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/abstract-visualization-of-cloud-security-1773144532588-9315b3bb.png?_wi=1",              imageAlt: "Cloud Security Features"},
+              title: "Advanced Analytics",              value: "3.2x"
+            },
             {
-              id: "2",              title: "Intelligent Automation",              author: "Product Team",              description: "AI-powered workflow automation that learns from patterns, reduces manual tasks by up to 80%, and improves operational efficiency across your organization.",              tags: ["AI", "Automation"],
+              id: "2",              icon: ZapIcon,
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/modern-automation-workflow-visualization-1773144537987-5ca7d5b2.jpg?_wi=1",              imageAlt: "Automation Workflow"},
+              title: "Performance Boost",              value: "45%"
+            },
             {
-              id: "3",              title: "Unlimited Scalability",              author: "Infrastructure Team",              description: "Cloud-native architecture that scales seamlessly from startup to enterprise, supporting millions of transactions per second without performance degradation.",              tags: ["Scalability", "Cloud"],
+              id: "3",              icon: Users,
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/abstract-representation-of-scalability-a-1773144535133-0294c819.jpg?_wi=1",              imageAlt: "Scalable Architecture"},
+              title: "Team Efficiency",              value: "98%"
+            }
           ]}
           animationType="slide-up"
-          title="Powerful Features"
+          title="Key Performance Metrics"
-          description="Comprehensive capabilities designed to accelerate your digital transformation journey and maximize ROI."
+          description="Comprehensive metrics that drive real business results and measurable ROI."
-          tag="Enterprise Features"
+          tag="Performance"
           tagIcon={Zap}
           textboxLayout="default"
           useInvertedBackground={false}
@@ -215,7 +218,7 @@ export default function HomePage() {
           useInvertedBackground={false}
           names={[]}
           logos={[
-            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/microsoft-company-logo-modern-and-recogn-1773144537677-e897c954.jpg",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/google-company-logo-iconic-colorful-tech-1773144532136-cc6c331d.png",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/amazon-company-logo-recognizable-ecommer-1773144533201-8d42dc8f.png",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/salesforce-company-logo-crm-software-and-1773144540135-77f0bf19.jpg",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/ibm-company-logo-enterprise-technology-a-1773144542517-c650ca73.jpg",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/oracle-company-logo-database-and-enterpr-1773144534714-ed7bc395.jpg",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/cisco-company-logo-networking-and-techno-1773144535270-5a9c9292.jpg",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/adobe-company-logo-creative-software-and-1773144532496-01fb4ce2.png"]}
+            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/microsoft-company-logo-modern-and-recogn-1773144537677-e897c954.jpg",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/google-company-logo-iconic-colorful-tech-1773144532136-cc6c331d.png",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/amazon-company-logo-recognizable-ecommer-1773144533201-8d42dc8f.png",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/salesforce-company-logo-crm-software-and-1773144540135-77f0bf19.jpg",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/ibm-company-logo-enterprise-technology-a-1773144542517-c650ca73.jpg",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/oracle-company-logo-database-and-enterpri-1773144534714-ed7bc395.jpg",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/cisco-company-logo-networking-and-techno-1773144535270-5a9c9292.jpg",            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/adobe-company-logo-creative-software-and-1773144532496-01fb4ce2.png"]}
           speed={40}
           showCard={true}
           tagAnimation="opacity"

src/app/styles/base.css

@@ -11,7 +11,7 @@ html {
 body {
   background-color: var(--background);
   color: var(--foreground);
-  font-family: var(--font-inter), sans-serif;
+  font-family: var(--font-lobster-two), sans-serif;
   position: relative;
   min-height: 100vh;
   overscroll-behavior: none;
@@ -24,5 +24,5 @@ h3,
 h4,
 h5,
 h6 {
-  font-family: var(--font-libre-baskerville), serif;
+  font-family: var(--font-lobster-two), serif;
 }