diff --git a/src/app/a-propos/page.tsx b/src/app/a-propos/page.tsx
index 2dd32ca..c44a047 100644
--- a/src/app/a-propos/page.tsx
+++ b/src/app/a-propos/page.tsx
@@ -2,7 +2,7 @@
 
 import Link from "next/link";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
 import SplitAbout from "@/components/sections/about/SplitAbout";
 import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
 import FaqSplitText from "@/components/sections/faq/FaqSplitText";
@@ -10,9 +10,9 @@ import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
 import { Globe, Users, Lightbulb } from "lucide-react";
 
 const navItems = [
-  { name: "Concours photo", id: "contests" },
-  { name: "Classement", id: "rankings" },
-  { name: "À propos", id: "about" },
+  { name: "Concours photo", id: "/concours" },
+  { name: "Classement", id: "/classements" },
+  { name: "À propos", id: "/a-propos" },
 ];
 
 const footerColumns = [
@@ -73,12 +73,7 @@ export default function AboutPage() {
       headingFontWeight="bold"
     >
       <div id="nav" data-section="nav">
-        <NavbarStyleFullscreen
-          navItems={navItems}
-          brandName="Vote Gear"
-          bottomLeftText="Communauté Automobile"
-          bottomRightText="votegear@example.com"
-        />
+        <NavbarStyleApple navItems={navItems} brandName="Vote Gear" />
       </div>
 
       <div id="about-mission" data-section="about-mission">
diff --git a/src/app/classements/page.tsx b/src/app/classements/page.tsx
index a3a7ab8..6952727 100644
--- a/src/app/classements/page.tsx
+++ b/src/app/classements/page.tsx
@@ -2,7 +2,7 @@
 
 import Link from "next/link";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
 import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
 import SplitAbout from "@/components/sections/about/SplitAbout";
 import TestimonialCardSixteen from "@/components/sections/testimonial/TestimonialCardSixteen";
@@ -10,9 +10,9 @@ import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
 import { Trophy, Users, Zap } from "lucide-react";
 
 const navItems = [
-  { name: "Concours photo", id: "contests" },
-  { name: "Classement", id: "rankings" },
-  { name: "À propos", id: "about" },
+  { name: "Concours photo", id: "/concours" },
+  { name: "Classement", id: "/classements" },
+  { name: "À propos", id: "/a-propos" },
 ];
 
 const footerColumns = [
@@ -73,12 +73,7 @@ export default function RankingsPage() {
       headingFontWeight="bold"
     >
       <div id="nav" data-section="nav">
-        <NavbarStyleFullscreen
-          navItems={navItems}
-          brandName="Vote Gear"
-          bottomLeftText="Communauté Automobile"
-          bottomRightText="votegear@example.com"
-        />
+        <NavbarStyleApple navItems={navItems} brandName="Vote Gear" />
       </div>
 
       <div id="rankings-stats" data-section="rankings-stats">
diff --git a/src/app/concours/page.tsx b/src/app/concours/page.tsx
index d60be68..70c1935 100644
--- a/src/app/concours/page.tsx
+++ b/src/app/concours/page.tsx
@@ -2,16 +2,16 @@
 
 import Link from "next/link";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
 import ProductCardOne from "@/components/sections/product/ProductCardOne";
 import FeatureCardTwelve from "@/components/sections/feature/FeatureCardTwelve";
 import FaqSplitText from "@/components/sections/faq/FaqSplitText";
 import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
 
 const navItems = [
-  { name: "Concours photo", id: "contests" },
-  { name: "Classement", id: "rankings" },
-  { name: "À propos", id: "about" },
+  { name: "Concours photo", id: "/concours" },
+  { name: "Classement", id: "/classements" },
+  { name: "À propos", id: "/a-propos" },
 ];
 
 const footerColumns = [
@@ -72,12 +72,7 @@ export default function ContestsPage() {
       headingFontWeight="bold"
     >
       <div id="nav" data-section="nav">
-        <NavbarStyleFullscreen
-          navItems={navItems}
-          brandName="Vote Gear"
-          bottomLeftText="Communauté Automobile"
-          bottomRightText="votegear@example.com"
-        />
+        <NavbarStyleApple navItems={navItems} brandName="Vote Gear" />
       </div>
 
       <div id="all-contests" data-section="all-contests">
diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx
index 03ddc32..3a27ba6 100644
--- a/src/app/contact/page.tsx
+++ b/src/app/contact/page.tsx
@@ -2,7 +2,7 @@
 
 import Link from "next/link";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
 import ContactCenter from "@/components/sections/contact/ContactCenter";
 import FaqSplitText from "@/components/sections/faq/FaqSplitText";
 import SplitAbout from "@/components/sections/about/SplitAbout";
@@ -10,9 +10,9 @@ import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
 import { Mail, MapPin, Phone } from "lucide-react";
 
 const navItems = [
-  { name: "Concours photo", id: "contests" },
-  { name: "Classement", id: "rankings" },
-  { name: "À propos", id: "about" },
+  { name: "Concours photo", id: "/concours" },
+  { name: "Classement", id: "/classements" },
+  { name: "À propos", id: "/a-propos" },
 ];
 
 const footerColumns = [
@@ -73,12 +73,7 @@ export default function ContactPage() {
       headingFontWeight="bold"
     >
       <div id="nav" data-section="nav">
-        <NavbarStyleFullscreen
-          navItems={navItems}
-          brandName="Vote Gear"
-          bottomLeftText="Communauté Automobile"
-          bottomRightText="votegear@example.com"
-        />
+        <NavbarStyleApple navItems={navItems} brandName="Vote Gear" />
       </div>
 
       <div id="contact-info" data-section="contact-info">
diff --git a/src/app/page.tsx b/src/app/page.tsx
index f3f8339..d45af4b 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -2,7 +2,7 @@
 
 import Link from "next/link";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
 import HeroCentered from "@/components/sections/hero/HeroCentered";
 import ProductCardOne from "@/components/sections/product/ProductCardOne";
 import SplitAbout from "@/components/sections/about/SplitAbout";
@@ -13,9 +13,9 @@ import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
 import { Camera, Trophy, Image as ImageIcon, Heart } from "lucide-react";
 
 const navItems = [
-  { name: "Concours photo", id: "contests" },
-  { name: "Classement", id: "rankings" },
-  { name: "À propos", id: "about" },
+  { name: "Concours photo", id: "/concours" },
+  { name: "Classement", id: "/classements" },
+  { name: "À propos", id: "/a-propos" },
 ];
 
 const footerColumns = [
@@ -76,12 +76,7 @@ export default function HomePage() {
       headingFontWeight="bold"
     >
       <div id="nav" data-section="nav">
-        <NavbarStyleFullscreen
-          navItems={navItems}
-          brandName="Vote Gear"
-          bottomLeftText="Communauté Automobile"
-          bottomRightText="votegear@example.com"
-        />
+        <NavbarStyleApple navItems={navItems} brandName="Vote Gear" />
       </div>
 
       <div id="hero" data-section="hero">