diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx
index 1b2b3a7..a956306 100644
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -4,7 +4,7 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
 import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
 import TeamCardSix from '@/components/sections/team/TeamCardSix';
 import { MapPin, Users } from "lucide-react";
 
@@ -24,18 +24,13 @@ export default function LandingPage() {
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
-      <NavbarLayoutFloatingOverlay
+      <NavbarStyleApple
       navItems={[
-        {
-          name: "Home",          id: "/"},
-        {
-          name: "Services",          id: "/services"},
-        {
-          name: "How It Works",          id: "/how-it-works"},
-        {
-          name: "About",          id: "/about"},
-        {
-          name: "Contact",          id: "/contact"},
+        { name: "Home", id: "/" },
+        { name: "Services", id: "/services" },
+        { name: "How It Works", id: "/how-it-works" },
+        { name: "About", id: "/about" },
+        { name: "Contact", id: "/contact" },
       ]}
       brandName="Nicks 2 Interlock"
     />
diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx
index c92bb1f..b0c41c0 100644
--- a/src/app/contact/page.tsx
+++ b/src/app/contact/page.tsx
@@ -4,7 +4,7 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import ContactCTA from '@/components/sections/contact/ContactCTA';
 import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
 import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
 
 export default function LandingPage() {
@@ -23,18 +23,13 @@ export default function LandingPage() {
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
-      <NavbarLayoutFloatingOverlay
+      <NavbarStyleApple
       navItems={[
-        {
-          name: "Home",          id: "/"},
-        {
-          name: "Services",          id: "/services"},
-        {
-          name: "How It Works",          id: "/how-it-works"},
-        {
-          name: "About",          id: "/about"},
-        {
-          name: "Contact",          id: "/contact"},
+        { name: "Home", id: "/" },
+        { name: "Services", id: "/services" },
+        { name: "How It Works", id: "/how-it-works" },
+        { name: "About", id: "/about" },
+        { name: "Contact", id: "/contact" },
       ]}
       brandName="Nicks 2 Interlock"
     />
diff --git a/src/app/how-it-works/page.tsx b/src/app/how-it-works/page.tsx
index 516b0a1..aff6050 100644
--- a/src/app/how-it-works/page.tsx
+++ b/src/app/how-it-works/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 NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
 import TimelineProcessFlow from '@/components/cardStack/layouts/timelines/TimelineProcessFlow';
 import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
 import { Zap, FileCheck, CheckCircle2, Wrench } from "lucide-react";
@@ -23,7 +23,7 @@ export default function HowItWorksPage() {
     >
       <ReactLenis root>
         <div id="nav" data-section="nav">
-            <NavbarLayoutFloatingOverlay
+            <NavbarStyleApple
             navItems={[
               { name: "Home", id: "/" },
               { name: "Services", id: "/services" },
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 810eeed..96b65a6 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -3,11 +3,11 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import AboutMetric from '@/components/sections/about/AboutMetric';
-import FaqSplitText from '@/components/sections/faq/FaqSplitText';
+import FaqBase from '@/components/sections/faq/FaqBase';
 import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
 import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
 import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
 import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
 import { Award, CheckCircle, Heart, ShieldCheck } from "lucide-react";
 
@@ -27,7 +27,7 @@ export default function LandingPage() {
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
-      <NavbarLayoutFloatingOverlay
+      <NavbarStyleApple
       navItems={[
         { name: "Home", id: "/" },
         { name: "Services", id: "/services" },
@@ -91,14 +91,17 @@ export default function LandingPage() {
   </div>
 
   <div id="faq" data-section="faq">
-      <FaqSplitText
+      <FaqBase
+      title="Answers to Your Questions"
+      faqsAnimation="blur-reveal"
+      textboxLayout="split"
       useInvertedBackground={true}
       faqs={[
         { id: "f1", title: "What is an ignition interlock device?", content: "It is a breath-test device connected to your vehicle's ignition system." },
         { id: "f2", title: "How often do I need calibration?", content: "Regular calibration is required to ensure accuracy." },
+        { id: "f3", title: "Do you offer same-day installation?", content: "In many cases, yes. Please contact us to check availability." },
+        { id: "f4", title: "Is the device easy to use?", content: "We provide thorough training to ensure you are comfortable using the device." },
       ]}
-      sideTitle="Answers to Your Questions"
-      faqsAnimation="blur-reveal"
     />
   </div>
 
diff --git a/src/app/services/page.tsx b/src/app/services/page.tsx
index c89ce81..34f9847 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 NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
 import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
 import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';
 
@@ -22,7 +22,7 @@ export default function ServicesPage() {
     >
       <ReactLenis root>
         <div id="nav" data-section="nav">
-            <NavbarLayoutFloatingOverlay
+            <NavbarStyleApple
             navItems={[
               { name: "Home", id: "/" },
               { name: "Services", id: "/services" },