diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx
new file mode 100644
index 0000000..fa5b7d7
--- /dev/null
+++ b/src/app/about/page.tsx
@@ -0,0 +1,127 @@
+"use client";
+
+import ReactLenis from "lenis/react";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
+import TextSplitAbout from "@/components/sections/about/TextSplitAbout";
+import TeamCardTwo from "@/components/sections/team/TeamCardTwo";
+import FeatureCardSeven from "@/components/sections/feature/FeatureCardSeven";
+import FooterBase from "@/components/sections/footer/FooterBase";
+import { Facebook, Twitter, Linkedin } from "lucide-react";
+
+export default function AboutPage() {
+  const navItems = [
+    { name: "Work", id: "work" },
+    { name: "Services", id: "services" },
+    { name: "About", href: "/about" },
+    { name: "Contact", id: "contact" }
+  ];
+
+  const footerColumns = [
+    {
+      title: "Company",      items: [
+        { label: "About", href: "/about" },
+        { label: "Services", href: "#services" },
+        { label: "Work", href: "#work" },
+        { label: "Contact", href: "#contact" }
+      ]
+    },
+    {
+      title: "Services",      items: [
+        { label: "Web Development", href: "#" },
+        { label: "SEO", href: "#" },
+        { label: "Branding", href: "#" },
+        { label: "UI/UX Design", href: "#" }
+      ]
+    },
+    {
+      title: "Connect",      items: [
+        { label: "Twitter", href: "#" },
+        { label: "LinkedIn", href: "#" },
+        { label: "Instagram", href: "#" },
+        { label: "Dribbble", href: "#" }
+      ]
+    }
+  ];
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="text-stagger"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="pill"
+      contentWidth="medium"
+      sizing="medium"
+      background="none"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="metallic"
+      secondaryButtonStyle="glass"
+      headingFontWeight="medium"
+    >
+      <ReactLenis root>
+        <NavbarLayoutFloatingOverlay
+          brandName="Webild"
+          navItems={navItems}
+          button={{ text: "Get Started", href: "#contact" }}
+        />
+
+        <div id="company-story" data-section="company-story">
+          <TextSplitAbout
+            title="Our Story: Crafting Digital Excellence"
+            description={[
+              "Founded in 2018, Webild began with a simple mission: to empower businesses with stunning, high-performing digital experiences. We noticed a gap in the market for agencies that truly understood both design aesthetics and technical robustness.",              "From our humble beginnings, we've grown into a full-service digital agency, partnering with startups, scale-ups, and established enterprises to bring their visions to life. Our journey is marked by countless successful projects, innovative solutions, and a growing family of satisfied clients.",              "We believe in a collaborative approach, working closely with our clients every step of the way to ensure their unique goals are met with precision and creativity. Our passion for technology and design drives us to constantly evolve, staying ahead of trends to deliver future-proof solutions."
+            ]}
+            useInvertedBackground={false}
+          />
+        </div>
+
+        <div id="team" data-section="team">
+          <TeamCardTwo
+            title="Meet Our Visionary Team"
+            description="The passionate individuals driving our mission forward, bringing diverse expertise and creative energy to every project."
+            textboxLayout="default"
+            useInvertedBackground={false}
+            animationType="slide-up"
+            gridVariant="three-columns-all-equal-width"
+            members={[
+              { id: "1", name: "Alice Johnson", role: "CEO & Founder", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-1.webp", imageAlt: "Alice Johnson", socialLinks: [{ icon: Linkedin, url: "#" }, { icon: Twitter, url: "#" }] },
+              { id: "2", name: "Bob Williams", role: "Lead Developer", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-2.webp", imageAlt: "Bob Williams", socialLinks: [{ icon: Linkedin, url: "#" }, { icon: Facebook, url: "#" }] },
+              { id: "3", name: "Charlie Brown", role: "Creative Director", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-3.webp", imageAlt: "Charlie Brown", socialLinks: [{ icon: Twitter, url: "#" }] },
+              { id: "4", name: "Diana Green", role: "UX/UI Designer", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-4.webp", imageAlt: "Diana Green", socialLinks: [{ icon: Linkedin, url: "#" }] },
+              { id: "5", name: "Eve Davis", role: "Marketing Strategist", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-5.webp", imageAlt: "Eve Davis", socialLinks: [{ icon: Twitter, url: "#" }, { icon: Facebook, url: "#" }] }
+            ]}
+          />
+        </div>
+
+        <div id="values" data-section="values">
+          <FeatureCardSeven
+            title="Our Core Values"
+            description="The foundational principles that guide every decision, project, and interaction at Webild."
+            textboxLayout="default"
+            useInvertedBackground={false}
+            animationType="slide-up"
+            features={[
+              {
+                title: "Innovation",                description: "We constantly explore new technologies and creative approaches to deliver groundbreaking solutions.",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-1.webp",                imageAlt: "Innovation concept"
+              },
+              {
+                title: "Collaboration",                description: "Working hand-in-hand with our clients and within our team fosters success and outstanding results.",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-2.webp",                imageAlt: "Collaboration concept"
+              },
+              {
+                title: "Integrity",                description: "Honesty and transparency are at the heart of everything we do, building trust with every client.",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-3.webp",                imageAlt: "Integrity concept"
+              },
+              {
+                title: "Excellence",                description: "We are committed to delivering the highest quality in design, development, and client service.",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-4.webp",                imageAlt: "Excellence concept"
+              }
+            ]}
+          />
+        </div>
+
+        <FooterBase
+          logoText="Webild"
+          copyrightText="© 2026 | Webild"
+          columns={footerColumns}
+        />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}
\ No newline at end of file
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 0165d48..4d54287 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -16,6 +16,40 @@ import TestimonialCardFifteen from "@/components/sections/testimonial/Testimonia
 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 WebAgency2Page() {
+  const navItems = [
+    { name: "Work", id: "work" },
+    { name: "Services", id: "services" },
+    { name: "About", id: "about" },
+    { name: "Contact", href: "/contact" },
+  ];
+
+  const footerColumns = [
+    {
+      title: "Company",      items: [
+        { label: "About", href: "#about" },
+        { label: "Services", href: "#services" },
+        { label: "Work", href: "#work" },
+        { label: "Contact", href: "/contact" },
+      ],
+    },
+    {
+      title: "Services",      items: [
+        { label: "Web Development", href: "#" },
+        { label: "SEO", href: "#" },
+        { label: "Branding", href: "#" },
+        { label: "UI/UX Design", href: "#" },
+      ],
+    },
+    {
+      title: "Connect",      items: [
+        { label: "Twitter", href: "#" },
+        { label: "LinkedIn", href: "#" },
+        { label: "Instagram", href: "#" },
+        { label: "Dribbble", href: "#" },
+      ],
+    },
+  ];
+
   return (
     <ThemeProvider
       defaultButtonVariant="text-stagger"
@@ -32,13 +66,8 @@ export default function WebAgency2Page() {
       <ReactLenis root>
         <NavbarLayoutFloatingOverlay
           brandName="Webild"
-          navItems={[
-            { name: "Work", id: "work" },
-            { name: "Services", id: "services" },
-            { name: "About", id: "about" },
-            { name: "Contact", id: "contact" },
-          ]}
-          button={{ text: "Get Started", href: "#contact" }}
+          navItems={navItems}
+          button={{ text: "Get Started", href: "/contact" }}
         />
         <HeroSplitDoubleCarousel
           title="We Build Digital Experiences"
@@ -48,7 +77,7 @@ export default function WebAgency2Page() {
           tagAnimation="slide-up"
           background={{ variant: "canvas-reveal" }}
           buttons={[
-            { text: "Start Project", href: "#contact" },
+            { text: "Start Project", href: "/contact" },
             { text: "View Work", href: "#work" },
           ]}
           buttonAnimation="slide-up"
@@ -78,28 +107,18 @@ export default function WebAgency2Page() {
           buttonAnimation="slide-up"
           features={[
             {
-              title: "SEO",
-              description: "We optimize your website to rank higher on search engines and drive organic traffic.",
-              bentoComponent: "marquee",
-              centerIcon: Search,
-              variant: "text",
-              texts: ["Keywords", "Backlinks", "Meta Tags", "Organic Traffic", "Rankings", "Analytics", "SERP", "Indexing"],
+              title: "SEO",              description: "We optimize your website to rank higher on search engines and drive organic traffic.",              bentoComponent: "marquee",              centerIcon: Search,
+              variant: "text",              texts: ["Keywords", "Backlinks", "Meta Tags", "Organic Traffic", "Rankings", "Analytics", "SERP", "Indexing"],
             },
             {
-              title: "Web Development",
-              description: "Custom-built websites that are fast, responsive, and designed to convert.",
-              bentoComponent: "media-stack",
-              items: [
+              title: "Web Development",              description: "Custom-built websites that are fast, responsive, and designed to convert.",              bentoComponent: "media-stack",              items: [
                 { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/dev-2.webp", imageAlt: "Web project - AgentFlow AI platform" },
                 { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/dev-1.webp", imageAlt: "Web project - Architecture studio" },
                 { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/dev-3.webp", imageAlt: "Web project - Summit Roofing" },
               ],
             },
             {
-              title: "Branding",
-              description: "Build a memorable brand identity that resonates with your audience.",
-              bentoComponent: "media-stack",
-              items: [
+              title: "Branding",              description: "Build a memorable brand identity that resonates with your audience.",              bentoComponent: "media-stack",              items: [
                 { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-1.webp", imageAlt: "Brand project 1" },
                 { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-2.webp", imageAlt: "Brand project 2" },
                 { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-4.webp", imageAlt: "Brand project 3" },
@@ -117,45 +136,20 @@ export default function WebAgency2Page() {
           cardClassName="!h-auto aspect-video"
           features={[
             {
-              title: "Umbra Skincare",
-              description: "Luxury fragrance e-commerce",
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-1.webp",
-              imageAlt: "Umbra Skincare website",
-              buttonIcon: ArrowUpRight,
-              buttonHref: "#",
-            },
+              title: "Umbra Skincare",              description: "Luxury fragrance e-commerce",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-1.webp",              imageAlt: "Umbra Skincare website",              buttonIcon: ArrowUpRight,
+              buttonHref: "#"},
             {
-              title: "Luxuria Travel",
-              description: "Bespoke luxury travel experiences",
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-2.webp",
-              imageAlt: "Luxuria Travel website",
-              buttonIcon: ArrowUpRight,
-              buttonHref: "#",
-            },
+              title: "Luxuria Travel",              description: "Bespoke luxury travel experiences",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-2.webp",              imageAlt: "Luxuria Travel website",              buttonIcon: ArrowUpRight,
+              buttonHref: "#"},
             {
-              title: "Dental Care",
-              description: "Premier dental practice",
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-3.webp",
-              imageAlt: "Luxury Dental Care website",
-              buttonIcon: ArrowUpRight,
-              buttonHref: "#",
-            },
+              title: "Dental Care",              description: "Premier dental practice",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-3.webp",              imageAlt: "Luxury Dental Care website",              buttonIcon: ArrowUpRight,
+              buttonHref: "#"},
             {
-              title: "Summit Roofing",
-              description: "Professional roofing services",
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-4.webp",
-              imageAlt: "Summit Roofing website",
-              buttonIcon: ArrowUpRight,
-              buttonHref: "#",
-            },
+              title: "Summit Roofing",              description: "Professional roofing services",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-4.webp",              imageAlt: "Summit Roofing website",              buttonIcon: ArrowUpRight,
+              buttonHref: "#"},
             {
-              title: "Dubai Real Estate",
-              description: "Luxury property listings",
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-5.webp",
-              imageAlt: "Dubai Real Estate website",
-              buttonIcon: ArrowUpRight,
-              buttonHref: "#",
-            },
+              title: "Dubai Real Estate",              description: "Luxury property listings",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-5.webp",              imageAlt: "Dubai Real Estate website",              buttonIcon: ArrowUpRight,
+              buttonHref: "#"},
           ]}
         />
         <FeatureBento
@@ -166,14 +160,9 @@ export default function WebAgency2Page() {
           animationType="slide-up"
           features={[
             {
-              title: "All Devices Optimization",
-              description: "Pixel-perfect websites that look stunning on every screen size and device.",
-              bentoComponent: "phone",
-              statusIcon: Lock,
+              title: "All Devices Optimization",              description: "Pixel-perfect websites that look stunning on every screen size and device.",              bentoComponent: "phone",              statusIcon: Lock,
               alertIcon: Monitor,
-              alertTitle: "Responsive check",
-              alertMessage: "All breakpoints passed",
-              apps: [
+              alertTitle: "Responsive check",              alertMessage: "All breakpoints passed",              apps: [
                 { name: "Phone", icon: Phone },
                 { name: "SMS", icon: MessageCircle },
                 { name: "Books", icon: BookOpen },
@@ -185,29 +174,17 @@ export default function WebAgency2Page() {
               ],
             },
             {
-              title: "Secure Hosting",
-              description: "Enterprise-grade security and 99.9% uptime for your website.",
-              bentoComponent: "reveal-icon",
-              icon: Shield,
+              title: "Secure Hosting",              description: "Enterprise-grade security and 99.9% uptime for your website.",              bentoComponent: "reveal-icon",              icon: Shield,
             },
             {
-              title: "Fast Turnaround",
-              description: "From concept to launch in record time without sacrificing quality.",
-              bentoComponent: "timeline",
-              heading: "Project Launch",
-              subheading: "Week 1",
-              items: [
+              title: "Fast Turnaround",              description: "From concept to launch in record time without sacrificing quality.",              bentoComponent: "timeline",              heading: "Project Launch",              subheading: "Week 1",              items: [
                 { label: "Discovery & wireframes", detail: "Day 1-3" },
                 { label: "Design & development", detail: "Day 4-10" },
                 { label: "Testing & deployment", detail: "Day 11-14" },
               ],
-              completedLabel: "Live",
-            },
+              completedLabel: "Live"},
             {
-              title: "Seamless Integrations",
-              description: "Connect with the tools you already use — CRMs, analytics, payments, and more.",
-              bentoComponent: "orbiting-icons",
-              centerIcon: Puzzle,
+              title: "Seamless Integrations",              description: "Connect with the tools you already use — CRMs, analytics, payments, and more.",              bentoComponent: "orbiting-icons",              centerIcon: Puzzle,
               items: [
                 { icon: Shield },
                 { icon: Monitor },
@@ -216,10 +193,7 @@ export default function WebAgency2Page() {
               ],
             },
             {
-              title: "Growth Trends",
-              description: "Data-driven insights to optimize your search presence and drive traffic.",
-              bentoComponent: "line-chart",
-            },
+              title: "Growth Trends",              description: "Data-driven insights to optimize your search presence and drive traffic.",              bentoComponent: "line-chart"},
           ]}
         />
         <TestimonialCardFifteen
@@ -254,21 +228,11 @@ export default function WebAgency2Page() {
           animationType="slide-up"
           negativeCard={{
             items: [
-              "Generic templates with no personality",
-              "Slow load times and poor performance",
-              "No SEO strategy or search visibility",
-              "Outdated design that hurts credibility",
-              "No ongoing support after launch",
-            ],
+              "Generic templates with no personality",              "Slow load times and poor performance",              "No SEO strategy or search visibility",              "Outdated design that hurts credibility",              "No ongoing support after launch"],
           }}
           positiveCard={{
             items: [
-              "Custom designs tailored to your brand",
-              "Lightning-fast performance on all devices",
-              "Built-in SEO to drive organic traffic",
-              "Modern design that builds trust",
-              "Dedicated support and maintenance",
-            ],
+              "Custom designs tailored to your brand",              "Lightning-fast performance on all devices",              "Built-in SEO to drive organic traffic",              "Modern design that builds trust",              "Dedicated support and maintenance"],
           }}
         />
         <TeamCardFive
@@ -304,7 +268,7 @@ export default function WebAgency2Page() {
           description="Let's build something extraordinary together. Get in touch and let's discuss your next project."
           background={{ variant: "rotated-rays-animated" }}
           buttons={[
-            { text: "Start Your Project", href: "#contact" },
+            { text: "Start Your Project", href: "/contact" },
             { text: "View Our Work", href: "#work" },
           ]}
           buttonAnimation="slide-up"
@@ -313,35 +277,7 @@ export default function WebAgency2Page() {
         <FooterBase
           logoText="Webild"
           copyrightText="© 2026 | Webild"
-          columns={[
-            {
-              title: "Company",
-              items: [
-                { label: "About", href: "#about" },
-                { label: "Services", href: "#services" },
-                { label: "Work", href: "#work" },
-                { label: "Contact", href: "#contact" },
-              ],
-            },
-            {
-              title: "Services",
-              items: [
-                { label: "Web Development", href: "#" },
-                { label: "SEO", href: "#" },
-                { label: "Branding", href: "#" },
-                { label: "UI/UX Design", href: "#" },
-              ],
-            },
-            {
-              title: "Connect",
-              items: [
-                { label: "Twitter", href: "#" },
-                { label: "LinkedIn", href: "#" },
-                { label: "Instagram", href: "#" },
-                { label: "Dribbble", href: "#" },
-              ],
-            },
-          ]}
+          columns={footerColumns}
         />
       </ReactLenis>
     </ThemeProvider>
diff --git a/src/app/services/page.tsx b/src/app/services/page.tsx
new file mode 100644
index 0000000..1b0411d
--- /dev/null
+++ b/src/app/services/page.tsx
@@ -0,0 +1,119 @@
+"use client";
+
+import ReactLenis from "lenis/react";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
+import FeatureCardNineteen from "@/components/sections/feature/FeatureCardNineteen";
+import PricingCardNine from "@/components/sections/pricing/PricingCardNine";
+import FooterBase from "@/components/sections/footer/FooterBase";
+import { Sparkles } from "lucide-react";
+
+export default function ServicesPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="text-stagger"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="pill"
+      contentWidth="medium"
+      sizing="medium"
+      background="none"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="metallic"
+      secondaryButtonStyle="glass"
+      headingFontWeight="medium"
+    >
+      <ReactLenis root>
+        <NavbarLayoutFloatingOverlay
+          brandName="Webild"
+          navItems={[
+            { name: "Work", id: "work" },
+            { name: "Services", href: "/services" },
+            { name: "About", id: "about" },
+            { name: "Contact", id: "contact" }
+          ]}
+          button={{ text: "Get Started", href: "#contact" }}
+        />
+        <FeatureCardNineteen
+          title="Our Service Offerings"
+          description="Comprehensive solutions tailored to elevate your digital presence."
+          textboxLayout="default"
+          useInvertedBackground={false}
+          features={[
+            {
+              tag: "Web Development",              title: "Custom Website & App Development",              subtitle: "Bringing your vision to life with robust code.",              description: "From dynamic websites to scalable web applications, we build tailored digital experiences using modern frameworks like Next.js and React. Our focus is on performance, security, and user experience.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/dev-2.webp",              imageAlt: "Web Development Service",              buttons: [{ text: "Learn More", href: "#" }]
+            },
+            {
+              tag: "SEO & Digital Marketing",              title: "Boost Your Online Visibility",              subtitle: "Drive organic traffic and rank higher.",              description: "Our SEO strategies ensure your website is discovered by your target audience. We implement on-page and off-page optimization, keyword research, and content strategies to improve your search engine rankings and grow your online presence.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-7.webp",              imageAlt: "SEO and Digital Marketing Service",              buttons: [{ text: "Learn More", href: "#" }]
+            },
+            {
+              tag: "UI/UX Design",              title: "Intuitive User Experience Design",              subtitle: "Crafting engaging and user-friendly interfaces.",              description: "We design visually stunning and highly functional interfaces that users love. Our UI/UX process involves research, wireframing, prototyping, and user testing to create seamless and enjoyable digital journeys.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-1.webp",              imageAlt: "UI/UX Design Service",              buttons: [{ text: "Learn More", href: "#" }]
+            },
+            {
+              tag: "Branding & Identity",              title: "Build a Powerful Brand Identity",              subtitle: "Define your unique story and visual language.",              description: "We help you establish a strong, memorable brand identity that resonates with your audience. This includes logo design, brand guidelines, and consistent visual elements across all your digital platforms.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-4.webp",              imageAlt: "Branding and Identity Service",              buttons: [{ text: "Learn More", href: "#" }]
+            }
+          ]}
+        />
+        <PricingCardNine
+          title="Flexible Pricing Plans"
+          description="Choose the perfect plan to fit your business needs and budget."
+          textboxLayout="default"
+          useInvertedBackground={false}
+          animationType="slide-up"
+          plans={[
+            {
+              id: "basic",              title: "Startup",              price: "$1,500",              period: "one-time",              features: [
+                "5-page custom website",                "Responsive design",                "Basic SEO optimization",                "1 month support"
+              ],
+              button: { text: "Get Started", href: "#contact" },
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-1.webp",              imageAlt: "Startup Plan"
+            },
+            {
+              id: "standard",              title: "Business",              price: "$3,500",              period: "one-time",              features: [
+                "10-page custom website",                "Advanced SEO strategy",                "CRM integration",                "3 months priority support"
+              ],
+              button: { text: "Choose Plan", href: "#contact" },
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-2.webp",              imageAlt: "Business Plan"
+            },
+            {
+              id: "premium",              title: "Enterprise",              price: "Custom",              period: "project",              features: [
+                "Unlimited pages",                "Full-scale digital marketing",                "E-commerce solutions",                "Dedicated project manager",                "Ongoing maintenance & support"
+              ],
+              button: { text: "Contact Us", href: "#contact" },
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-3.webp",              imageAlt: "Enterprise Plan"
+            }
+          ]}
+        />
+        <FooterBase
+          logoText="Webild"
+          copyrightText="© 2026 | Webild"
+          columns={[
+            {
+              title: "Company",              items: [
+                { label: "About", href: "#about" },
+                { label: "Services", href: "/services" },
+                { label: "Work", href: "#work" },
+                { label: "Contact", href: "#contact" },
+              ],
+            },
+            {
+              title: "Services",              items: [
+                { label: "Web Development", href: "#" },
+                { label: "SEO", href: "#" },
+                { label: "Branding", href: "#" },
+                { label: "UI/UX Design", href: "#" },
+              ],
+            },
+            {
+              title: "Connect",              items: [
+                { label: "Twitter", href: "#" },
+                { label: "LinkedIn", href: "#" },
+                { label: "Instagram", href: "#" },
+                { label: "Dribbble", href: "#" },
+              ],
+            },
+          ]}
+        />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}
diff --git a/src/app/work/page.tsx b/src/app/work/page.tsx
new file mode 100644
index 0000000..8902fb0
--- /dev/null
+++ b/src/app/work/page.tsx
@@ -0,0 +1,109 @@
+"use client";
+
+import ReactLenis from "lenis/react";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
+import FeatureCardMedia from "@/components/sections/feature/FeatureCardMedia";
+import BlogCardTwo from "@/components/sections/blog/BlogCardTwo";
+import FooterBase from "@/components/sections/footer/FooterBase";
+import { ArrowUpRight } from "lucide-react";
+
+export default function PortfolioPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="text-stagger"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="pill"
+      contentWidth="medium"
+      sizing="medium"
+      background="none"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="metallic"
+      secondaryButtonStyle="glass"
+      headingFontWeight="medium"
+    >
+      <ReactLenis root>
+        <NavbarLayoutFloatingOverlay
+          brandName="Webild"
+          navItems={[
+            { name: "Work", href: "/work" },
+            { name: "Services", id: "services" },
+            { name: "About", id: "about" },
+            { name: "Contact", id: "contact" }
+          ]}
+          button={{ text: "Get Started", href: "#contact" }}
+        />
+        <FeatureCardMedia
+          title="Our Portfolio"
+          description="Explore a selection of our recent projects, showcasing our expertise in web design and development."
+          textboxLayout="default"
+          useInvertedBackground={false}
+          animationType="slide-up"
+          features={[
+            {
+              id: "umbra-skincare",              title: "Umbra Skincare",              description: "Luxury fragrance e-commerce platform with custom product configurator.",              tag: "E-commerce",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-1.webp",              imageAlt: "Umbra Skincare website design",              buttons: [{ text: "View Case Study", href: "#case-studies" }],
+            },
+            {
+              id: "luxuria-travel",              title: "Luxuria Travel",              description: "Bespoke luxury travel experiences website, focusing on immersive visuals and booking flow.",              tag: "Travel & Hospitality",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-2.webp",              imageAlt: "Luxuria Travel website design",              buttons: [{ text: "View Case Study", href: "#case-studies" }],
+            },
+            {
+              id: "dental-care",              title: "Dental Care",              description: "Modern and user-friendly website for a premier dental practice, improving patient engagement.",              tag: "Healthcare",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-3.webp",              imageAlt: "Luxury Dental Care website design",              buttons: [{ text: "View Case Study", href: "#case-studies" }],
+            },
+            {
+              id: "summit-roofing",              title: "Summit Roofing",              description: "Responsive website for professional roofing services, generating high-quality leads.",              tag: "Construction",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-4.webp",              imageAlt: "Summit Roofing website design",              buttons: [{ text: "View Case Study", href: "#case-studies" }],
+            },
+            {
+              id: "dubai-real-estate",              title: "Dubai Real Estate",              description: "Luxury property listings portal with advanced search and interactive map features.",              tag: "Real Estate",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-5.webp",              imageAlt: "Dubai Real Estate website design",              buttons: [{ text: "View Case Study", href: "#case-studies" }],
+            }
+          ]}
+        />
+        <BlogCardTwo
+          id="case-studies"
+          title="Case Studies & Insights"
+          description="Dive deeper into our process and the measurable results we deliver for our clients."
+          textboxLayout="default"
+          useInvertedBackground={false}
+          animationType="slide-up"
+          blogs={[
+            {
+              id: "case-study-1",              category: "E-commerce",              title: "Boosting Conversions for Umbra Skincare",              excerpt: "Learn how our strategic design and development process helped Umbra Skincare achieve a 40% increase in online sales.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-1.webp",              imageAlt: "Umbra Skincare case study thumbnail",              authorName: "Webild Team",              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-1.webp",              date: "March 15, 2024"},
+            {
+              id: "case-study-2",              category: "Travel",              title: "Crafting a Digital Journey for Luxuria Travel",              excerpt: "Discover the bespoke solutions we implemented to enhance Luxuria Travel's online presence and customer engagement.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-2.webp",              imageAlt: "Luxuria Travel case study thumbnail",              authorName: "Webild Team",              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-2.webp",              date: "February 28, 2024"},
+            {
+              id: "case-study-3",              category: "Healthcare",              title: "Modernizing Digital Patient Experience for Dental Care",              excerpt: "See how a refreshed website design and improved user experience led to higher appointment bookings for Dental Care.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-3.webp",              imageAlt: "Dental Care case study thumbnail",              authorName: "Webild Team",              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-3.webp",              date: "January 10, 2024"}
+          ]}
+        />
+        <FooterBase
+          logoText="Webild"
+          copyrightText="© 2026 | Webild"
+          columns={[
+            {
+              title: "Company",              items: [
+                { label: "About", id: "about" },
+                { label: "Services", id: "services" },
+                { label: "Work", href: "/work" },
+                { label: "Contact", id: "contact" }
+              ]
+            },
+            {
+              title: "Services",              items: [
+                { label: "Web Development", href: "#" },
+                { label: "SEO", href: "#" },
+                { label: "Branding", href: "#" },
+                { label: "UI/UX Design", href: "#" }
+              ]
+            },
+            {
+              title: "Connect",              items: [
+                { label: "Twitter", href: "#" },
+                { label: "LinkedIn", href: "#" },
+                { label: "Instagram", href: "#" },
+                { label: "Dribbble", href: "#" }
+              ]
+            }
+          ]}
+        />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}