From 4699f2dd5ab1a2f490a2f3e688d03088ff0be6f4 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sun, 10 May 2026 20:24:25 +0000
Subject: [PATCH] Update src/app/page.tsx

---
 src/app/page.tsx | 163 ++++++++++++++++++++++++-----------------------
 1 file changed, 84 insertions(+), 79 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 75488c2..beb3277 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -5,13 +5,13 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
 import HeroSplitDoubleCarousel from "@/components/sections/hero/HeroSplitDoubleCarousel";
 import FeatureBento from "@/components/sections/feature/FeatureBento";
-import FeatureCardTwentySix from "@/components/sections/feature/FeatureCardTwentySix";
-import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
-import TeamCardFive from "@/components/sections/team/TeamCardFive";
-import FaqBase from "@/components/sections/faq/FaqBase";
-import ContactCTA from "@/components/sections/contact/ContactCTA";
-import FooterBase from "@/components/sections/footer/FooterBase";
-import TestimonialCardFifteen from "@/components/sections/testimonial/TestimonialCardFifteen";
+import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
+import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
+import TeamCardOne from "@/components/sections/team/TeamCardOne";
+import FaqDouble from "@/components/sections/faq/FaqDouble";
+import ContactSplit from "@/components/sections/contact/ContactSplit";
+import FooterSimple from "@/components/sections/footer/FooterSimple";
+import TestimonialCardFive from "@/components/sections/testimonial/TestimonialCardFive";
 import { Sparkles, Search, ArrowUpRight, Award, Users, TrendingUp, MessageCircle } from "lucide-react";
 
 export default function WebAgency2Page() {
@@ -40,18 +40,20 @@ export default function WebAgency2Page() {
           </a>
         </div>
 
-        <NavbarLayoutFloatingOverlay
-          brandName="WebOrigin"
-          navItems={[
-            { name: "Work", id: "work" },
-            { name: "Services", id: "services" },
-            { name: "About", id: "about" },
-            { name: "Contact", id: "contact" },
-          ]}
-          button={{ text: "Get Started", href: "#contact" }}
-        />
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingOverlay
+            brandName="WebOrigin"
+            navItems={[
+              { name: "Work", id: "work" },
+              { name: "Services", id: "services" },
+              { name: "About", id: "about" },
+              { name: "Contact", id: "contact" },
+            ]}
+            button={{ text: "Get Started", href: "#contact" }}
+          />
+        </div>
         
-        <div id="hero" className="animate-in fade-in duration-1000">
+        <div id="hero" data-section="hero">
           <HeroSplitDoubleCarousel
             title="We Engineer Digital Growth at WebOrigin"
             description="Go beyond standard web design. We build high-performance, conversion-focused digital ecosystems engineered to deliver measurable revenue growth and market dominance for your business."
@@ -64,25 +66,18 @@ export default function WebAgency2Page() {
               { text: "View Work", href: "#work" },
             ]}
             buttonAnimation="slide-up"
-            carouselPosition="right"
-            leftCarouselItems={[
-              { imageSrc: "http://img.b2bpic.net/free-photo/glowing-green-checkmark-success-symbol-dark-cosmic-background_84443-91492.jpg", imageAlt: "UI UX Design" },
-              { imageSrc: "http://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150104516.jpg", imageAlt: "UI UX Design" },
-              { imageSrc: "http://img.b2bpic.net/free-photo/tablet-near-nice-decorative-cosmetics_23-2147742653.jpg", imageAlt: "UI UX Design" },
-              { imageSrc: "http://img.b2bpic.net/free-photo/e-learing-distance-education-icons-interface_53876-124201.jpg", imageAlt: "UI UX Design" },
-              { imageSrc: "http://img.b2bpic.net/free-photo/leisure-calm-peace-relaxation-resting-serenity_53876-13860.jpg", imageAlt: "UI UX Design" },
+            carouselItems={[
+              { id: "1", imageSrc: "http://img.b2bpic.net/free-photo/glowing-green-checkmark-success-symbol-dark-cosmic-background_84443-91492.jpg", imageAlt: "UI UX Design" },
+              { id: "2", imageSrc: "http://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150104516.jpg", imageAlt: "UI UX Design" },
+              { id: "3", imageSrc: "http://img.b2bpic.net/free-photo/tablet-near-nice-decorative-cosmetics_23-2147742653.jpg", imageAlt: "UI UX Design" },
+              { id: "4", imageSrc: "http://img.b2bpic.net/free-photo/e-learing-distance-education-icons-interface_53876-124201.jpg", imageAlt: "UI UX Design" },
+              { id: "5", imageSrc: "http://img.b2bpic.net/free-photo/leisure-calm-peace-relaxation-resting-serenity_53876-13860.jpg", imageAlt: "UI UX Design" },
+              { id: "6", imageSrc: "http://img.b2bpic.net/free-photo/login-box-username-password-inputs-virtual-digital-display_169016-40044.jpg", imageAlt: "UI UX Design" },
             ]}
-            rightCarouselItems={[
-              { imageSrc: "http://img.b2bpic.net/free-photo/login-box-username-password-inputs-virtual-digital-display_169016-40044.jpg", imageAlt: "UI UX Design" },
-              { imageSrc: "http://img.b2bpic.net/free-photo/scientists-conduct-visual-data-tests-using-chroma-key-smartphone_482257-126579.jpg", imageAlt: "UI UX Design" },
-              { imageSrc: "http://img.b2bpic.net/free-photo/person-working-animation-porject_23-2149269877.jpg", imageAlt: "UI UX Design" },
-              { imageSrc: "http://img.b2bpic.net/free-photo/professional-person-engaging-with-ai-chatbot-computer-screen_482257-126263.jpg", imageAlt: "UI UX Design" },
-            ]}
-            carouselItemClassName="!aspect-[4/5] backdrop-blur-md bg-white/10"
           />
         </div>
 
-        <div id="services">
+        <div id="services" data-section="services">
           <FeatureBento
             title="Our WebOrigin Services"
             description="We offer a full suite of digital services to help your brand stand out online."
@@ -93,64 +88,71 @@ export default function WebAgency2Page() {
             buttonAnimation="slide-up"
             features={[
               { title: "SEO", description: "WebOrigin optimizes your website to rank higher.", bentoComponent: "marquee", centerIcon: Search, variant: "text", texts: ["Growth", "Visibility", "Performance", "Strategy"] },
-              { title: "Web Development", description: "Custom-built, scalable websites.", bentoComponent: "media-stack", items: [{ imageSrc: "http://img.b2bpic.net/free-photo/structured-building-construction-design-plan-concept_53876-132321.jpg", imageAlt: "Web development" }] },
-              { title: "Brand Strategy", description: "Build a memorable identity.", bentoComponent: "media-stack", items: [{ imageSrc: "http://img.b2bpic.net/free-photo/female-web-designer-taking-notes-office_23-2149749859.jpg", imageAlt: "Brand project" }] },
+              { title: "Web Development", description: "Custom-built, scalable websites.", bentoComponent: "media-stack", items: [{ imageSrc: "http://img.b2bpic.net/free-photo/structured-building-construction-design-plan-concept_53876-132321.jpg", imageAlt: "Web development" }, { imageSrc: "http://img.b2bpic.net/free-photo/structured-building-construction-design-plan-concept_53876-132321.jpg", imageAlt: "Web development" }] },
+              { title: "Brand Strategy", description: "Build a memorable identity.", bentoComponent: "media-stack", items: [{ imageSrc: "http://img.b2bpic.net/free-photo/female-web-designer-taking-notes-office_23-2149749859.jpg", imageAlt: "Brand project" }, { imageSrc: "http://img.b2bpic.net/free-photo/female-web-designer-taking-notes-office_23-2149749859.jpg", imageAlt: "Brand project" }] },
             ]}
           />
         </div>
         
-        <div id="work">
-          <FeatureCardTwentySix
+        <div id="work" data-section="work">
+          <FeatureCardTwentyFive
             title="Projects Crafted by WebOrigin"
             description="A selection of projects we've crafted for clients across diverse industries."
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
             features={[
-              { title: "Digital Revamp", description: "Modern e-commerce", imageSrc: "http://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150104479.jpg", imageAlt: "Project 1", buttonIcon: ArrowUpRight },
-              { title: "Brand Identity", description: "Corporate identity", imageSrc: "http://img.b2bpic.net/free-photo/business-professional-holding-blank-white-business-card_9975-133092.jpg", imageAlt: "Project 2", buttonIcon: ArrowUpRight },
+              { title: "Digital Revamp", description: "Modern e-commerce", icon: ArrowUpRight, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150104479.jpg", imageAlt: "Project 1" }, { imageSrc: "http://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150104479.jpg", imageAlt: "Project 1" }] },
+              { title: "Brand Identity", description: "Corporate identity", icon: ArrowUpRight, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/business-professional-holding-blank-white-business-card_9975-133092.jpg", imageAlt: "Project 2" }, { imageSrc: "http://img.b2bpic.net/free-photo/business-professional-holding-blank-white-business-card_9975-133092.jpg", imageAlt: "Project 2" }] }
             ]}
-            animationType="slide-up"
+          />
+        </div>
+
+        <div id="about" data-section="about">
+           <TestimonialCardFive
+            title="What Clients Say"
+            description="Trust built on excellence."
             textboxLayout="default"
             useInvertedBackground={false}
+            testimonials={[
+              {
+                id: "t1",                name: "Creative Director",                date: "2025",                title: "Excellent Service",                quote: "WebOrigin completely transformed our online presence. The team delivered a stunning website that exceeded our expectations and significantly impacted our growth.",                tag: "5 Stars",                avatarSrc: "http://img.b2bpic.net/free-photo/black-businessman-happy-expression_1194-2580.jpg"
+              }
+            ]}
           />
         </div>
 
-        <div id="about">
-           <TestimonialCardFifteen
-            testimonial="WebOrigin completely transformed our online presence. The team delivered a stunning website that exceeded our expectations and significantly impacted our growth."
-            rating={5}
-            author="— Creative Director"
-            avatars={[{ src: "http://img.b2bpic.net/free-photo/black-businessman-happy-expression_1194-2580.jpg", alt: "Client" }]}
-            useInvertedBackground={false}
-          />
-        </div>
-
-        <div id="metrics">
-          <MetricCardOne
+        <div id="metrics" data-section="metrics">
+          <MetricCardThree
             title="Trusted Results by WebOrigin"
-            metrics={[
-              { id: "p1", value: "150+", title: "Projects", description: "Precision delivered", icon: Award },
-              { id: "p2", value: "98%", title: "Satisfaction", description: "Client success rate", icon: Users },
-              { id: "p3", value: "10+", title: "Years", description: "Of digital mastery", icon: TrendingUp },
-            ]}
             animationType="slide-up"
             textboxLayout="default"
             useInvertedBackground={false}
+            metrics={[
+              { id: "p1", title: "Projects", value: "150+", icon: Award },
+              { id: "p2", title: "Satisfaction", value: "98%", icon: Users },
+              { id: "p3", title: "Years", value: "10+", icon: TrendingUp },
+            ]}
           />
         </div>
 
-        <TeamCardFive
-          title="The WebOrigin Experts"
-          description="The creative minds and technical wizards behind every project."
-          textboxLayout="default"
-          useInvertedBackground={false}
-          animationType="slide-up"
-          team={[
-            { id: "t1", name: "Alex Rivers", role: "Lead Developer", imageSrc: "http://img.b2bpic.net/free-photo/gamer-streaming-greeting-audience-preparing-showcase-gameplay_482257-103544.jpg", imageAlt: "Alex" },
-            { id: "t2", name: "Elena Vane", role: "Design Lead", imageSrc: "http://img.b2bpic.net/free-photo/smiley-tattoo-artist-indoors-side-view_23-2149445974.jpg", imageAlt: "Elena" },
-          ]}
-        />
+        <div id="team" data-section="team">
+          <TeamCardOne
+            title="The WebOrigin Experts"
+            description="The creative minds and technical wizards behind every project."
+            textboxLayout="default"
+            useInvertedBackground={false}
+            gridVariant="three-columns-all-equal-width"
+            animationType="slide-up"
+            members={[
+              { id: "t1", name: "Alex Rivers", role: "Lead Developer", imageSrc: "http://img.b2bpic.net/free-photo/gamer-streaming-greeting-audience-preparing-showcase-gameplay_482257-103544.jpg" },
+              { id: "t2", name: "Elena Vane", role: "Design Lead", imageSrc: "http://img.b2bpic.net/free-photo/smiley-tattoo-artist-indoors-side-view_23-2149445974.jpg" },
+            ]}
+          />
+        </div>
         
-        <div id="faq">
-          <FaqBase
+        <div id="faq" data-section="faq">
+          <FaqDouble
             title="Frequently Asked Questions"
             description="Learn more about partnering with the WebOrigin team."
             faqsAnimation="slide-up"
@@ -162,21 +164,24 @@ export default function WebAgency2Page() {
           />
         </div>
 
-        <div id="contact">
-          <ContactCTA
+        <div id="contact" data-section="contact">
+          <ContactSplit
             title="Let's Build with WebOrigin"
             description="Ready to elevate your digital footprint? Reach out to our team today."
+            tag="Contact Us"
             background={{ variant: "rotated-rays-animated" }}
+            useInvertedBackground={false}
           />
         </div>
 
-        <FooterBase
-          logoText="WebOrigin"
-          copyrightText="© 2026 | WebOrigin"
-          columns={[
-            { title: "Company", items: [{ label: "About", href: "#about" }, { label: "Services", href: "#services" }] },
-          ]}
-        />
+        <div id="footer" data-section="footer">
+          <FooterSimple
+            bottomLeftText="© 2026 | WebOrigin"
+            columns={[
+              { title: "Company", items: [{ label: "About", href: "#about" }, { label: "Services", href: "#services" }] },
+            ]}
+          />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );
-- 
2.49.1