diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx
index 613b2ab..7998bb1 100644
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -1,7 +1,7 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
 
 const navItems = [
@@ -17,7 +17,7 @@ export default function AboutPage() {
   return (
     <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
       <div id="nav" data-section="nav">
-        <NavbarLayoutFloatingOverlay navItems={navItems} />
+        <NavbarStyleCentered navItems={navItems} />
       </div>
       <div id="about" data-section="about">
         <TextSplitAbout
diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx
index 1254949..579d57b 100644
--- a/src/app/contact/page.tsx
+++ b/src/app/contact/page.tsx
@@ -3,7 +3,7 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 
 const navItems = [
   { name: "Home", id: "/" },
@@ -19,7 +19,7 @@ export default function ContactPage() {
     <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>
         <div id="nav" data-section="nav">
-          <NavbarLayoutFloatingOverlay navItems={navItems} />
+          <NavbarStyleCentered navItems={navItems} />
         </div>
         <div id="contact" data-section="contact">
             <ContactSplitForm
diff --git a/src/app/gallery/page.tsx b/src/app/gallery/page.tsx
index 1f1da0b..1b8a203 100644
--- a/src/app/gallery/page.tsx
+++ b/src/app/gallery/page.tsx
@@ -1,7 +1,7 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
 
 const navItems = [
@@ -17,7 +17,7 @@ export default function GalleryPage() {
   return (
     <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
       <div id="nav" data-section="nav">
-        <NavbarLayoutFloatingOverlay navItems={navItems} />
+        <NavbarStyleCentered navItems={navItems} />
       </div>
       <div id="hero" data-section="hero">
         <HeroBillboardGallery
diff --git a/src/app/page.tsx b/src/app/page.tsx
index c50a00d..6eef28d 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -2,13 +2,12 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactCenter from '@/components/sections/contact/ContactCenter';
 import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
 import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
 import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
 import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
 import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
 import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
 import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
@@ -30,7 +29,7 @@ export default function LandingPage() {
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
-      <NavbarLayoutFloatingOverlay
+      <NavbarStyleCentered
       navItems={[
         { name: "About", id: "about" },
         { name: "Services", id: "features" },
diff --git a/src/app/reviews/page.tsx b/src/app/reviews/page.tsx
index ccfa6fa..be594ad 100644
--- a/src/app/reviews/page.tsx
+++ b/src/app/reviews/page.tsx
@@ -1,7 +1,7 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
 
 const navItems = [
@@ -17,7 +17,7 @@ export default function ReviewsPage() {
   return (
     <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
       <div id="nav" data-section="nav">
-        <NavbarLayoutFloatingOverlay navItems={navItems} />
+        <NavbarStyleCentered navItems={navItems} />
       </div>
       <div id="testimonials" data-section="testimonials">
         <TestimonialCardFive
diff --git a/src/app/services/page.tsx b/src/app/services/page.tsx
index e33c708..d55ddb3 100644
--- a/src/app/services/page.tsx
+++ b/src/app/services/page.tsx
@@ -2,7 +2,7 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
 import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
 import { Wrench, Droplet, Hammer, ShieldCheck } from "lucide-react";
@@ -22,7 +22,7 @@ export default function ServicesPage() {
         headingFontWeight="extrabold"
     >
       <ReactLenis root>
-        <NavbarLayoutFloatingOverlay
+        <NavbarStyleCentered
             navItems={[
                 { name: "Home", id: "/" },
                 { name: "Services", id: "/services" },
diff --git a/src/app/showroom/page.tsx b/src/app/showroom/page.tsx
index e778065..c7ddfce 100644
--- a/src/app/showroom/page.tsx
+++ b/src/app/showroom/page.tsx
@@ -2,7 +2,7 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import ProductCardThree from '@/components/sections/product/ProductCardThree';
 
 const navItems = [
@@ -19,7 +19,7 @@ export default function ShowroomPage() {
     <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>
         <div id="nav" data-section="nav">
-          <NavbarLayoutFloatingOverlay navItems={navItems} />
+          <NavbarStyleCentered navItems={navItems} />
         </div>
         <div id="showroom" data-section="showroom">
             <ProductCardThree