diff --git a/src/app/page.tsx b/src/app/page.tsx
index a1be8e1..327c909 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -3,18 +3,18 @@
 import ReactLenis from "lenis/react";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
-import HeroBillboardScroll from "@/components/sections/hero/HeroBillboardScroll";
+import HeroSplitDoubleCarousel from "@/components/sections/hero/HeroSplitDoubleCarousel";
 import FeatureBento from "@/components/sections/feature/FeatureBento";
-import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
+import FeatureCardTwentySix from "@/components/sections/feature/FeatureCardTwentySix";
 import MetricCardFourteen from "@/components/sections/metrics/MetricCardFourteen";
-import TimelineProcessFlow from "@/components/cardStack/layouts/timelines/TimelineProcessFlow";
 import TeamCardTwo from "@/components/sections/team/TeamCardTwo";
 import FaqSplitMedia from "@/components/sections/faq/FaqSplitMedia";
 import ContactSplit from "@/components/sections/contact/ContactSplit";
 import FooterSimple from "@/components/sections/footer/FooterSimple";
-import { Sparkles, CheckCircle } from "lucide-react";
+import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
+import { Sparkles, Search, ArrowUpRight, Monitor, Shield, Zap, Puzzle, TrendingUp, Lock, Phone, MessageCircle, BookOpen, Tv, Camera, Music, Settings, Award, Users } from "lucide-react";
 
-export default function Ads2GetherPage() {
+export default function WebAgency2Page() {
   return (
     <ThemeProvider
       defaultButtonVariant="text-stagger"
@@ -26,7 +26,7 @@ export default function Ads2GetherPage() {
       cardStyle="glass-elevated"
       primaryButtonStyle="gradient"
       secondaryButtonStyle="glass"
-      headingFontWeight="semibold"
+      headingFontWeight="medium"
     >
       <ReactLenis root>
         <NavbarLayoutFloatingOverlay
@@ -37,111 +37,111 @@ export default function Ads2GetherPage() {
             { name: "About", id: "about" },
             { name: "Contact", id: "contact" },
           ]}
+          button={{ text: "Get Started", href: "#contact" }}
         />
         <div id="hero">
-          <HeroBillboardScroll
-            title="Amplifying Your Digital Reach"
-            description="Data-driven advertising strategies for forward-thinking brands. We turn clicks into loyal customers with precision and creativity."
-            tag="Strategic Web & Ad Agency"
-            tagIcon={Sparkles}
-            background={{ variant: "downward-rays-animated" }}
-            buttons={[{ text: "Get Started", href: "#contact" }]}
-          />
+            <HeroSplitDoubleCarousel
+              title="We Build Digital Experiences"
+              description="Transform your brand with cutting-edge web design and development. We craft stunning websites that convert visitors into customers."
+              tag="Ads2Gether - Strategic Design"
+              tagIcon={Sparkles}
+              tagAnimation="slide-up"
+              background={{ variant: "canvas-reveal" }}
+              buttons={[
+                { text: "Start Project", href: "#contact" },
+                { text: "View Work", href: "#work" },
+              ]}
+              buttonAnimation="slide-up"
+              carouselPosition="right"
+              leftCarouselItems={[
+                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-1.webp", imageAlt: "UI UX Design" },
+                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-4.webp", imageAlt: "UI UX Design" },
+              ]}
+              rightCarouselItems={[
+                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-2.webp", imageAlt: "UI UX Design" },
+                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-5.webp", imageAlt: "UI UX Design" },
+              ]}
+            />
         </div>
         <div id="services">
-          <FeatureBento
-            title="Comprehensive Growth Services"
-            description="A full suite of advertising and development solutions."
-            textboxLayout="default"
-            animationType="slide-up"
-            useInvertedBackground={false}
-            features={[
-              { title: "Paid Social", description: "High-converting ad campaigns across platforms.", media: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-1.webp" }, items: [{ icon: Sparkles, text: "Scalable Ad Spend" }, { icon: Sparkles, text: "Real-time Analytics" }, { icon: Sparkles, text: "Audience Targeting" }], reverse: false },
-              { title: "Conversion Web Design", description: "Landing pages that turn traffic into sales.", media: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-2.webp" }, items: [{ icon: Sparkles, text: "Responsive Design" }, { icon: Sparkles, text: "A/B Testing Ready" }, { icon: Sparkles, text: "Speed Optimized" }], reverse: true },
-            ]}
-          />
+            <FeatureBento
+              title="Our Services"
+              description="Data-driven digital solutions built for growth."
+              textboxLayout="default"
+              animationType="slide-up"
+              features={[
+                { title: "SEO", description: "Rank higher and grow faster.", bentoComponent: "marquee", centerIcon: Search, variant: "text", texts: ["SEO", "Backlinks", "Analytics"] },
+                { title: "Web Dev", description: "High-performance, custom builds.", bentoComponent: "media-stack", items: [{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/dev-1.webp" }] },
+                { title: "Branding", description: "Memorable brand identities.", bentoComponent: "media-stack", items: [{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-6.webp" }] },
+              ]}
+            />
         </div>
-        <div id="process">
-            <TimelineProcessFlow 
-                title="Our Growth Framework"
-                description="From discovery to massive performance scaling."
-                items={[
-                    { content: "Discovery & Strategy alignment", media: "", reverse: false },
-                    { content: "Creative production & testing", media: "", reverse: true },
-                    { content: "Campaign launch & optimization", media: "", reverse: false }
+        <div id="work">
+            <FeatureCardTwentySix
+              title="Performance Metrics"
+              description="Results-focused project delivery."
+              features={[
+                { title: "Scale-Up", description: "Result oriented", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-1.webp", buttonIcon: ArrowUpRight },
+                { title: "Brand Lift", description: "Market engagement", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-2.webp", buttonIcon: ArrowUpRight }
+              ]}
+            />
+        </div>
+        <div id="metrics">
+            <MetricCardFourteen
+                title="Results by Numbers"
+                tag="Efficiency"
+                metrics={[
+                    { id: "m1", value: "150+", description: "Projects delivered" },
+                    { id: "m2", value: "98%", description: "Client retention" },
+                    { id: "m3", value: "10X", description: "Traffic growth" }
                 ]}
-                textboxLayout="default"
-                animationType="blur-reveal"
             />
         </div>
         <div id="testimonials">
-          <TestimonialCardThirteen
-            title="Success Stories"
-            description="What our clients say about our growth strategies."
-            showRating={true}
-            animationType="depth-3d"
-            textboxLayout="default"
-            useInvertedBackground={false}
-            testimonials={[
-              { id: "1", name: "Alex Rivers", handle: "@rivers", testimonial: "Ads2Gether scaled our reach by 300% in just one quarter. Absolute masters of the craft.", rating: 5, icon: CheckCircle }
-            ]}
-          />
+            <TestimonialCardThirteen
+                title="Client Success Stories"
+                testimonials={[
+                    { id: "t1", name: "John Doe", handle: "@client", testimonial: "Ads2Gether delivered beyond our expectations!", rating: 5 }
+                ]}
+                showRating={true}
+                animationType="slide-up"
+            />
         </div>
-        <div id="metrics">
-          <MetricCardFourteen
-            title="Performance Data"
-            tag="Proven Results"
-            metrics={[
-                { id: "roi", value: "4.5x", description: "Average ROAS achieved" },
-                { id: "scale", value: "$2M+", description: "Ad spend managed" }
-            ]}
-            useInvertedBackground={false}
-          />
-        </div>
-        <div id="team">
-          <TeamCardTwo
-            title="Our Experts"
-            description="Meet the team behind the success."
-            textboxLayout="default"
-            useInvertedBackground={false}
-            gridVariant="three-columns-all-equal-width"
-            animationType="slide-up"
-            members={[
-                { id: "1", name: "Jane Smith", role: "Director of Strategy", description: "Industry veteran with 10+ years in digital advertising." },
-                { id: "2", name: "Mark Lee", role: "Head of Tech", description: "Development wizard and optimization expert." }
-            ]}
-          />
+        <div id="about">
+            <TeamCardTwo
+                title="The Team"
+                description="Expert digital architects."
+                gridVariant="bento-grid"
+                animationType="slide-up"
+                members={[
+                    { id: "p1", name: "Alex P.", role: "Founder", description: "Strategic lead." }
+                ]}
+            />
         </div>
         <div id="faq">
-          <FaqSplitMedia
-            title="Common Inquiries"
-            description="Frequently asked questions about our process."
-            faqs={[
-              { id: "1", title: "How do you start a campaign?", content: "We begin with a deep dive audit of your current assets and goals." },
-              { id: "2", title: "Do you work with startups?", content: "Yes, we specialize in high-growth scaling for startups." }
-            ]}
-            faqsAnimation="blur-reveal"
-            textboxLayout="default"
-            useInvertedBackground={false}
-          />
+            <FaqSplitMedia
+                title="Common Questions"
+                faqs={[
+                    { id: "f1", title: "How do we start?", content: "Contact us through the form below." }
+                ]}
+                faqsAnimation="slide-up"
+                textboxLayout="split"
+            />
         </div>
         <div id="contact">
-          <ContactSplit
-            tag="Let's Connect"
-            title="Ready to scale?"
-            description="Schedule your consultation today and discover your growth potential."
-            buttonText="Send Request"
-            background={{ variant: "plain" }}
-            useInvertedBackground={false}
-          />
+            <ContactSplit
+                title="Get in touch"
+                description="Discuss your next growth move."
+                mediaPosition="right"
+            />
         </div>
         <FooterSimple 
             columns={[
-                { title: "Agency", items: [{ label: "Home" }, { label: "Work" }] },
-                { title: "Solutions", items: [{ label: "SEO" }, { label: "Ad Mgmt" }] }
+                { title: "Agency", items: [{ label: "Home" }, { label: "About" }] },
+                { title: "Services", items: [{ label: "SEO" }, { label: "Web Design" }] }
             ]}
-            bottomLeftText="Ads2Gether Agency"
-            bottomRightText="hello@ads2gether.com"
+            bottomLeftText="Ads2Gether 2026"
+            bottomRightText="All rights reserved"
         />
       </ReactLenis>
     </ThemeProvider>
diff --git a/src/app/styles/variables.css b/src/app/styles/variables.css
index 2ad3ddc..432caac 100644
--- a/src/app/styles/variables.css
+++ b/src/app/styles/variables.css
@@ -12,13 +12,13 @@
 
   --background: #ffffff;
   --card: #f9f9f9;
-  --foreground: #000612e6;
+  --foreground: #1c1c1c;
   --primary-cta: #224CA1;
   --primary-cta-text: #0a0a0a;
   --secondary-cta: #F0C060;
   --secondary-cta-text: #e0e0e0;
-  --accent: #e2e2e2;
-  --background-accent: #c4c4c4;
+  --accent: #F0C060;
+  --background-accent: #224CA1;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);