diff --git a/src/app/careers/page.tsx b/src/app/careers/page.tsx
index 12df351..ef2b578 100644
--- a/src/app/careers/page.tsx
+++ b/src/app/careers/page.tsx
@@ -7,19 +7,21 @@ import FooterBase from "@/components/sections/footer/FooterBase";
 
 export default function CareersPage() {
   return (
-    <ThemeProvider>
+    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
       <ReactLenis root>
-        <NavbarLayoutFloatingOverlay
-          brandName="Epicure Buffet"
-          navItems={[
-            { name: "Menu", id: "/ #menu" },
-            { name: "Pricing", id: "/ #pricing" },
-            { name: "Our Story", id: "/our-story" },
-            { name: "Careers", id: "/careers" },
-            { name: "Contact Us", id: "/contact-us" },
-          ]}
-          button={{ text: "Book Now", href: "/ #contact" }}
-        />
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingOverlay
+            brandName="Epicure Buffet"
+            navItems={[
+              { name: "Menu", id: "/ #menu" },
+              { name: "Pricing", id: "/ #pricing" },
+              { name: "Our Story", id: "/our-story" },
+              { name: "Careers", id: "/careers" },
+              { name: "Contact Us", id: "/contact-us" },
+            ]}
+            button={{ text: "Book Now", href: "/ #contact" }}
+          />
+        </div>
         <div className="pt-32 pb-20 px-6 max-w-4xl mx-auto min-h-screen">
           <h1 className="text-5xl font-bold mb-8">Careers</h1>
           <p className="text-lg mb-6">Join our team of passionate culinary enthusiasts. We're always looking for talented individuals who value fresh, quality ingredients and exceptional customer service.</p>
diff --git a/src/app/contact-us/page.tsx b/src/app/contact-us/page.tsx
index 300bb02..566ddde 100644
--- a/src/app/contact-us/page.tsx
+++ b/src/app/contact-us/page.tsx
@@ -8,25 +8,28 @@ import FooterBase from "@/components/sections/footer/FooterBase";
 
 export default function ContactUsPage() {
   return (
-    <ThemeProvider>
+    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
       <ReactLenis root>
-        <NavbarLayoutFloatingOverlay
-          brandName="Epicure Buffet"
-          navItems={[
-            { name: "Menu", id: "/ #menu" },
-            { name: "Pricing", id: "/ #pricing" },
-            { name: "Our Story", id: "/our-story" },
-            { name: "Careers", id: "/careers" },
-            { name: "Contact Us", id: "/contact-us" },
-          ]}
-          button={{ text: "Book Now", href: "/ #contact" }}
-        />
-        <div className="pt-32 pb-20">
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingOverlay
+            brandName="Epicure Buffet"
+            navItems={[
+              { name: "Menu", id: "/ #menu" },
+              { name: "Pricing", id: "/ #pricing" },
+              { name: "Our Story", id: "/our-story" },
+              { name: "Careers", id: "/careers" },
+              { name: "Contact Us", id: "/contact-us" },
+            ]}
+            button={{ text: "Book Now", href: "/ #contact" }}
+          />
+        </div>
+        <div className="pt-32 pb-20" id="contact" data-section="contact">
             <ContactSplitForm
                 title="Get in Touch"
                 description="Have a special request or a question about your upcoming reservation? Let us know."
                 inputs={[{ name: "name", type: "text", placeholder: "Your Name", required: true }, { name: "email", type: "email", placeholder: "Your Email", required: true }]} 
                 textarea={{ name: "message", placeholder: "How can we help?", rows: 4 }}
+                useInvertedBackground={false}
             />
         </div>
         <FooterBase
diff --git a/src/app/our-story/page.tsx b/src/app/our-story/page.tsx
index 4df06bf..53c8bc6 100644
--- a/src/app/our-story/page.tsx
+++ b/src/app/our-story/page.tsx
@@ -4,23 +4,24 @@ import ReactLenis from "lenis/react";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
 import FooterBase from "@/components/sections/footer/FooterBase";
-import { Sparkles } from "lucide-react";
 
 export default function OurStoryPage() {
   return (
-    <ThemeProvider>
+    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
       <ReactLenis root>
-        <NavbarLayoutFloatingOverlay
-          brandName="Epicure Buffet"
-          navItems={[
-            { name: "Menu", id: "/ #menu" },
-            { name: "Pricing", id: "/ #pricing" },
-            { name: "Our Story", id: "/our-story" },
-            { name: "Careers", id: "/careers" },
-            { name: "Contact Us", id: "/contact-us" },
-          ]}
-          button={{ text: "Book Now", href: "/ #contact" }}
-        />
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingOverlay
+            brandName="Epicure Buffet"
+            navItems={[
+              { name: "Menu", id: "/ #menu" },
+              { name: "Pricing", id: "/ #pricing" },
+              { name: "Our Story", id: "/our-story" },
+              { name: "Careers", id: "/careers" },
+              { name: "Contact Us", id: "/contact-us" },
+            ]}
+            button={{ text: "Book Now", href: "/ #contact" }}
+          />
+        </div>
         <div className="pt-32 pb-20 px-6 max-w-4xl mx-auto min-h-screen">
           <h1 className="text-5xl font-bold mb-8">Our Story</h1>
           <p className="text-lg mb-6 leading-relaxed">Founded in 2015, Epicure Buffet began with a single vision: to transform the way people experience all-you-can-eat dining. We believed that quality shouldn't be sacrificed for variety.</p>