diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx
index 0d1218f..1bb9b68 100644
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -7,9 +7,9 @@ import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis'
 
 export default function AboutPage() {
   return (
-    <ThemeProvider>
+    <ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
       <ReactLenis root>
-        <NavbarLayoutFloatingInline navItems={[{name: "Home", id: "/"}, {name: "Blog/Vlog", id: "/blog"}, {name: "Recipes", id: "/recipes"}, {name: "About", id: "/about"}, {name: "Gallery", id: "/gallery"}, {name: "Contact", id: "/contact"}]} brandName="Lumiere" />
+        <NavbarLayoutFloatingInline navItems={[{name: "Home", id: "/"}, {name: "Blog/Vlog", id: "/blog"}, {name: "Recipes", id: "/recipes"}, {name: "About", id: "/about"}, {name: "Gallery", id: "/gallery"}, {name: "Contact", id: "/contact"}]} brandName="Lumiere" button={{ text: "Contact", href: "/contact" }} />
         <div className="min-h-screen pt-32 pb-20 px-6 max-w-4xl mx-auto">
             <h1 className="text-4xl font-bold mb-8">About Us</h1>
             <p>We are a passionate team dedicated to sharing high-quality content and clean beauty.</p>
diff --git a/src/app/blog/page.tsx b/src/app/blog/page.tsx
index 9b8119d..fad7f45 100644
--- a/src/app/blog/page.tsx
+++ b/src/app/blog/page.tsx
@@ -7,9 +7,9 @@ import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis'
 
 export default function BlogPage() {
   return (
-    <ThemeProvider>
+    <ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
       <ReactLenis root>
-        <NavbarLayoutFloatingInline navItems={[{name: "Home", id: "/"}, {name: "Blog/Vlog", id: "/blog"}, {name: "Recipes", id: "/recipes"}, {name: "About", id: "/about"}, {name: "Gallery", id: "/gallery"}, {name: "Contact", id: "/contact"}]} brandName="Lumiere" />
+        <NavbarLayoutFloatingInline navItems={[{name: "Home", id: "/"}, {name: "Blog/Vlog", id: "/blog"}, {name: "Recipes", id: "/recipes"}, {name: "About", id: "/about"}, {name: "Gallery", id: "/gallery"}, {name: "Contact", id: "/contact"}]} brandName="Lumiere" button={{ text: "Contact", href: "/contact" }} />
         <div className="min-h-screen pt-32 pb-20 px-6 max-w-4xl mx-auto">
             <h1 className="text-4xl font-bold mb-8">Blog & Vlog Archive</h1>
             <p>Welcome to our archive where we share our latest adventures and insights.</p>
diff --git a/src/app/gallery/page.tsx b/src/app/gallery/page.tsx
index d2bc433..dada371 100644
--- a/src/app/gallery/page.tsx
+++ b/src/app/gallery/page.tsx
@@ -7,9 +7,9 @@ import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis'
 
 export default function GalleryPage() {
   return (
-    <ThemeProvider>
+    <ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
       <ReactLenis root>
-        <NavbarLayoutFloatingInline navItems={[{name: "Home", id: "/"}, {name: "Blog/Vlog", id: "/blog"}, {name: "Recipes", id: "/recipes"}, {name: "About", id: "/about"}, {name: "Gallery", id: "/gallery"}, {name: "Contact", id: "/contact"}]} brandName="Lumiere" />
+        <NavbarLayoutFloatingInline navItems={[{name: "Home", id: "/"}, {name: "Blog/Vlog", id: "/blog"}, {name: "Recipes", id: "/recipes"}, {name: "About", id: "/about"}, {name: "Gallery", id: "/gallery"}, {name: "Contact", id: "/contact"}]} brandName="Lumiere" button={{ text: "Contact", href: "/contact" }} />
         <div className="min-h-screen pt-32 pb-20 px-6 max-w-4xl mx-auto">
             <h1 className="text-4xl font-bold mb-8">Gallery</h1>
             <p>Explore our visual journey through photography and highlights.</p>
diff --git a/src/app/recipes/page.tsx b/src/app/recipes/page.tsx
index 7a3184b..07e572a 100644
--- a/src/app/recipes/page.tsx
+++ b/src/app/recipes/page.tsx
@@ -7,9 +7,9 @@ import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis'
 
 export default function RecipesPage() {
   return (
-    <ThemeProvider>
+    <ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
       <ReactLenis root>
-        <NavbarLayoutFloatingInline navItems={[{name: "Home", id: "/"}, {name: "Blog/Vlog", id: "/blog"}, {name: "Recipes", id: "/recipes"}, {name: "About", id: "/about"}, {name: "Gallery", id: "/gallery"}, {name: "Contact", id: "/contact"}]} brandName="Lumiere" />
+        <NavbarLayoutFloatingInline navItems={[{name: "Home", id: "/"}, {name: "Blog/Vlog", id: "/blog"}, {name: "Recipes", id: "/recipes"}, {name: "About", id: "/about"}, {name: "Gallery", id: "/gallery"}, {name: "Contact", id: "/contact"}]} brandName="Lumiere" button={{ text: "Contact", href: "/contact" }} />
         <div className="min-h-screen pt-32 pb-20 px-6 max-w-4xl mx-auto">
             <h1 className="text-4xl font-bold mb-8">Our Recipes</h1>
             <p>Delicious, healthy, and easy-to-follow recipes for every occasion.</p>