diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx
new file mode 100644
index 0000000..a3bc2bd
--- /dev/null
+++ b/src/app/about/page.tsx
@@ -0,0 +1,56 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
+import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
+
+export default function AboutPage() {
+  const navLinks = [
+    { name: "Home", id: "/" },
+    { name: "Menu", id: "/menu" },
+    { name: "About", id: "/about" }
+  ];
+
+  return (
+    <ThemeProvider
+        defaultButtonVariant="elastic-effect"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="soft"
+        contentWidth="mediumSmall"
+        sizing="largeSizeMediumTitles"
+        background="noise"
+        cardStyle="glass-depth"
+        primaryButtonStyle="diagonal-gradient"
+        secondaryButtonStyle="solid"
+        headingFontWeight="bold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+            <NavbarLayoutFloatingInline
+            navItems={navLinks}
+            brandName="DINE HOUSE"
+            button={{ text: "Book Now", href: "#contact" }}
+          />
+        </div>
+
+        <TextSplitAbout
+            title="Our Story"
+            description={[
+                "Founded with a passion for quality, Dine House brings together world-class chefs and fresh ingredients.",                "Our mission is to provide an unforgettable culinary journey in an elegant atmosphere."
+            ]}
+            useInvertedBackground={false}
+        />
+
+        <div id="footer" data-section="footer">
+            <FooterBaseReveal
+            logoText="DINE HOUSE"
+            columns={[]}
+            copyrightText="© 2024 Dine House Restaurant."
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}
\ No newline at end of file
diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx
new file mode 100644
index 0000000..5ec6f38
--- /dev/null
+++ b/src/app/contact/page.tsx
@@ -0,0 +1,48 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
+import ContactSplit from '@/components/sections/contact/ContactSplit';
+
+export default function ContactPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="elastic-effect"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="soft"
+        contentWidth="mediumSmall"
+        sizing="largeSizeMediumTitles"
+        background="noise"
+        cardStyle="glass-depth"
+        primaryButtonStyle="diagonal-gradient"
+        secondaryButtonStyle="solid"
+        headingFontWeight="bold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+            <NavbarLayoutFloatingInline
+            navItems={[{name: 'Home', id: '/'}, {name: 'Contact', id: '/contact'}, {name: 'Reservations', id: '/reservations'}]}
+            brandName="DINE HOUSE"
+            button={{ text: "Book Now", href: "/reservations" }}
+          />
+        </div>
+
+        <ContactSplit
+          tag="Get in touch"
+          title="We'd love to hear from you"
+          description="Contact us for private dining inquiries, feedback, or any general questions."
+        />
+
+        <div id="footer" data-section="footer">
+            <FooterBaseReveal
+            logoText="DINE HOUSE"
+            columns={[{ title: 'Navigation', items: [{label: 'Home', href: '/'}, {label: 'Contact', href: '/contact'}, {label: 'Reservations', href: '/reservations'}]}]}
+            copyrightText="© 2024 Dine House Restaurant."
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}
\ No newline at end of file
diff --git a/src/app/menu/page.tsx b/src/app/menu/page.tsx
new file mode 100644
index 0000000..cddf2af
--- /dev/null
+++ b/src/app/menu/page.tsx
@@ -0,0 +1,62 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
+import ProductCardOne from '@/components/sections/product/ProductCardOne';
+
+export default function MenuPage() {
+  const navLinks = [
+    { name: "Home", id: "/" },
+    { name: "Menu", id: "/menu" },
+    { name: "About", id: "/about" }
+  ];
+
+  return (
+    <ThemeProvider
+        defaultButtonVariant="elastic-effect"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="soft"
+        contentWidth="mediumSmall"
+        sizing="largeSizeMediumTitles"
+        background="noise"
+        cardStyle="glass-depth"
+        primaryButtonStyle="diagonal-gradient"
+        secondaryButtonStyle="solid"
+        headingFontWeight="bold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+            <NavbarLayoutFloatingInline
+            navItems={navLinks}
+            brandName="DINE HOUSE"
+            button={{ text: "Book Now", href: "#contact" }}
+          />
+        </div>
+
+        <ProductCardOne
+            title="Our Menu"
+            description="Explore our curated selection of fine dining dishes."
+            gridVariant="uniform-all-items-equal"
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            products={[
+                { id: "1", name: "Signature Steak", price: "$45", imageSrc: "/images/steak.jpg" },
+                { id: "2", name: "Truffle Pasta", price: "$32", imageSrc: "/images/pasta.jpg" },
+                { id: "3", name: "Seared Scallops", price: "$28", imageSrc: "/images/scallops.jpg" }
+            ]}
+        />
+
+        <div id="footer" data-section="footer">
+            <FooterBaseReveal
+            logoText="DINE HOUSE"
+            columns={[]}
+            copyrightText="© 2024 Dine House Restaurant."
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}
\ No newline at end of file
diff --git a/src/app/page.tsx b/src/app/page.tsx
index ef65728..f5f985e 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -22,16 +22,16 @@ export default function LandingPage() {
       <ReactLenis root>
         <div id="nav" data-section="nav">
             <NavbarLayoutFloatingInline
-            navItems={[]}
+            navItems={[{name: 'Home', id: '/'}, {name: 'Contact', id: '/contact'}, {name: 'Reservations', id: '/reservations'}]}
             brandName="DINE HOUSE"
-            button={{ text: "Book Now", href: "#contact" }}
+            button={{ text: "Book Now", href: "/reservations" }}
           />
         </div>
 
         <div id="footer" data-section="footer">
             <FooterBaseReveal
             logoText="DINE HOUSE"
-            columns={[]}
+            columns={[{ title: 'Navigation', items: [{label: 'Home', href: '/'}, {label: 'Contact', href: '/contact'}, {label: 'Reservations', href: '/reservations'}]}]}
             copyrightText="© 2024 Dine House Restaurant."
           />
         </div>
diff --git a/src/app/reservations/page.tsx b/src/app/reservations/page.tsx
new file mode 100644
index 0000000..73371d5
--- /dev/null
+++ b/src/app/reservations/page.tsx
@@ -0,0 +1,48 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
+import ContactSplit from '@/components/sections/contact/ContactSplit';
+
+export default function ReservationsPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="elastic-effect"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="soft"
+        contentWidth="mediumSmall"
+        sizing="largeSizeMediumTitles"
+        background="noise"
+        cardStyle="glass-depth"
+        primaryButtonStyle="diagonal-gradient"
+        secondaryButtonStyle="solid"
+        headingFontWeight="bold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+            <NavbarLayoutFloatingInline
+            navItems={[{name: 'Home', id: '/'}, {name: 'Contact', id: '/contact'}, {name: 'Reservations', id: '/reservations'}]}
+            brandName="DINE HOUSE"
+            button={{ text: "Book Now", href: "/reservations" }}
+          />
+        </div>
+
+        <ContactSplit
+          tag="Reserve your table"
+          title="Book your dining experience"
+          description="Secure your spot at Dine House for an unforgettable meal."
+        />
+
+        <div id="footer" data-section="footer">
+            <FooterBaseReveal
+            logoText="DINE HOUSE"
+            columns={[{ title: 'Navigation', items: [{label: 'Home', href: '/'}, {label: 'Contact', href: '/contact'}, {label: 'Reservations', href: '/reservations'}]}]}
+            copyrightText="© 2024 Dine House Restaurant."
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}
\ No newline at end of file