diff --git a/src/app/blog/page.tsx b/src/app/blog/page.tsx
index aebdc92..0d5c39d 100644
--- a/src/app/blog/page.tsx
+++ b/src/app/blog/page.tsx
@@ -32,7 +32,8 @@ export default function BlogPage() {
                             { name: "Companies", id: "companies" },
                             { name: "Journey", id: "journey" },
                             { name: "Work", id: "work" },
-                            { name: "Contact", id: "contact" }
+                            { name: "Contact", id: "contact" },
+                            { name: "Features", id: "/features" }
                         ]}
                         button={{ text: "Let's Connect", href: "contact" }}
                         brandName="Webild"
diff --git a/src/app/features/page.tsx b/src/app/features/page.tsx
new file mode 100644
index 0000000..ac38fab
--- /dev/null
+++ b/src/app/features/page.tsx
@@ -0,0 +1,74 @@
+"use client"
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
+import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
+
+export default function FeaturesPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="hover-bubble"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="pill"
+      contentWidth="compact"
+      sizing="mediumSizeLargeTitles"
+      background="circleGradient"
+      cardStyle="outline"
+      primaryButtonStyle="double-inset"
+      secondaryButtonStyle="glass"
+      headingFontWeight="medium"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleCentered
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "About", id: "about" },
+            { name: "Companies", id: "companies" },
+            { name: "Journey", id: "journey" },
+            { name: "Work", id: "work" },
+            { name: "Contact", id: "contact" }
+          ]}
+          button={{ text: "Let's Connect", href: "contact" }}
+          brandName="Webild"
+        />
+      </div>
+
+      <div id="features" data-section="features">
+        <FeatureCardTwentyThree
+          title="Featured Services"
+          description="Discover the core services and capabilities that power our success. Each service is designed to deliver exceptional value and drive measurable results."
+          features={[
+            {
+              id: "1",              title: "Web Development",              tags: ["Custom Solutions", "Full-Stack"],
+              imageSrc: "https://img.b2bpic.net/free-vector/program-code-laptop-screen-office-work-software-development-data-statistic_39422-766.jpg",              imageAlt: "Web development services"
+            },
+            {
+              id: "2",              title: "Digital Strategy",              tags: ["Growth-Focused", "Data-Driven"],
+              imageSrc: "https://img.b2bpic.net/free-photo/business-teamwork-success-concept_1421-16.jpg",              imageAlt: "Digital strategy and planning"
+            },
+            {
+              id: "3",              title: "Brand Design",              tags: ["Visual Identity", "UX/UI"],
+              imageSrc: "https://img.b2bpic.net/free-photo/excited-by-good-news-motivated-colleagues-celebrating-corporate-success-together_1163-5118.jpg",              imageAlt: "Brand design and identity"
+            },
+            {
+              id: "4",              title: "Performance Marketing",              tags: ["ROI Driven", "Analytics"],
+              imageSrc: "https://img.b2bpic.net/free-vector/stylish-business-leader-background_1017-20822.jpg",              imageAlt: "Performance marketing campaigns"
+            }
+          ]}
+          animationType="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterLogoReveal
+          logoText="WEBILD"
+          leftLink={{ text: "Privacy", href: "/privacy" }}
+          rightLink={{ text: "Terms", href: "/terms" }}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}
\ No newline at end of file
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 24c868e..f6b8770 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -32,7 +32,8 @@ export default function LandingPage() {
             { name: "Companies", id: "companies" },
             { name: "Journey", id: "journey" },
             { name: "Work", id: "work" },
-            { name: "Contact", id: "contact" }
+            { name: "Contact", id: "contact" },
+            { name: "Features", id: "/features" }
           ]}
           button={{ text: "Let's Connect", href: "contact" }}
           brandName="Webild"
diff --git a/src/app/shop/[id]/page.tsx b/src/app/shop/[id]/page.tsx
index 3b871c7..eaa1b16 100644
--- a/src/app/shop/[id]/page.tsx
+++ b/src/app/shop/[id]/page.tsx
@@ -90,6 +90,7 @@ export default function ProductPage({ params }: ProductPageProps) {
                                 { name: "Journey", id: "journey" },
                                 { name: "Work", id: "work" },
                                 { name: "Contact", id: "contact" },
+                                { name: "Features", id: "/features" },
                                 { name: "Shop", id: "/shop" }
                             ]}
                             brandName="Webild"
@@ -135,6 +136,7 @@ export default function ProductPage({ params }: ProductPageProps) {
                                 { name: "Journey", id: "journey" },
                                 { name: "Work", id: "work" },
                                 { name: "Contact", id: "contact" },
+                                { name: "Features", id: "/features" },
                                 { name: "Shop", id: "/shop" }
                             ]}
                             brandName="Webild"
@@ -187,6 +189,7 @@ export default function ProductPage({ params }: ProductPageProps) {
                             { name: "Journey", id: "journey" },
                             { name: "Work", id: "work" },
                             { name: "Contact", id: "contact" },
+                            { name: "Features", id: "/features" },
                             { name: "Shop", id: "/shop" }
                         ]}
                         brandName="Webild"
diff --git a/src/app/shop/page.tsx b/src/app/shop/page.tsx
index 72ffa08..8cf825a 100644
--- a/src/app/shop/page.tsx
+++ b/src/app/shop/page.tsx
@@ -40,6 +40,7 @@ export default function ShopPage() {
                                 { name: "Journey", id: "journey" },
                                 { name: "Work", id: "work" },
                                 { name: "Contact", id: "contact" },
+                                { name: "Features", id: "/features" },
                                 { name: "Shop", id: "/shop" }
                             ]}
                             brandName="Webild"
@@ -84,6 +85,7 @@ export default function ShopPage() {
                             { name: "Journey", id: "journey" },
                             { name: "Work", id: "work" },
                             { name: "Contact", id: "contact" },
+                            { name: "Features", id: "/features" },
                             { name: "Shop", id: "/shop" }
                         ]}
                         brandName="Webild"