diff --git a/src/app/blog/page.tsx b/src/app/blog/page.tsx
index ff730e2..b0d83d0 100644
--- a/src/app/blog/page.tsx
+++ b/src/app/blog/page.tsx
@@ -29,12 +29,14 @@ export default function BlogPage() {
                 <div id="nav" data-section="nav">
                     <NavbarStyleApple
                         navItems={[
-                            { name: "Home", id: "/" },
-                            { name: "Menu", id: "menu" },
-                            { name: "About", id: "about" },
-                            { name: "Testimonials", id: "testimonials" },
-                            { name: "FAQ", id: "faq" },
-                            { name: "Contact", id: "contact" },
+                            { name: 'Home', id: '/' },
+                            { name: 'Menu', id: '/#menu' },
+                            { name: 'About', id: '/#about' },
+                            { name: 'Testimonials', id: '/#testimonials' },
+                            { name: 'FAQ', id: '/#faq' },
+                            { name: 'Contact', id: '/#contact' },
+                            { name: 'Blog', id: '/blog' },
+                            { name: 'Shop', id: '/shop' }
                         ]}
                         brandName="Ninja Panda"
                     />
@@ -64,14 +66,14 @@ export default function BlogPage() {
                             columns={[
                                 {
                                     title: "About Us",                                    items: [
-                                        { label: "Our Story", href: "#about" },
-                                        { label: "Menu", href: "#menu" },
+                                        { label: "Our Story", href: "/#about" },
+                                        { label: "Menu", href: "/#menu" },
                                     ],
                                 },
                                 {
                                     title: "Help",                                    items: [
-                                        { label: "FAQ", href: "#faq" },
-                                        { label: "Contact", href: "#contact" },
+                                        { label: "FAQ", href: "/#faq" },
+                                        { label: "Contact", href: "/#contact" },
                                     ],
                                 },
                                 {
diff --git a/src/app/page.tsx b/src/app/page.tsx
index ca678e9..178c226 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -3,7 +3,7 @@
 import { Phone } from 'lucide-react';
 import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
-import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
+import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
 import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
 import ProductCardOne from '@/components/sections/product/ProductCardOne';
 import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
@@ -28,30 +28,30 @@ export default function LandingPage() {
       <div id="nav" data-section="nav">
         <NavbarStyleApple
           navItems={[
-            { name: 'Menu', id: 'menu' },
-            { name: 'About', id: 'about' },
-            { name: 'Testimonials', id: 'testimonials' },
-            { name: 'FAQ', id: 'faq' },
-            { name: 'Contact', id: 'contact' },
+            { name: 'Home', id: '/' },
+            { name: 'Menu', id: '/#menu' },
+            { name: 'About', id: '/#about' },
+            { name: 'Testimonials', id: '/#testimonials' },
+            { name: 'FAQ', id: '/#faq' },
+            { name: 'Contact', id: '/#contact' },
+            { name: 'Blog', id: '/blog' },
+            { name: 'Shop', id: '/shop' }
           ]}
           brandName="Ninja Panda"
         />
       </div>
 
       <div id="hero" data-section="hero">
-        <HeroLogoBillboard
+        <HeroCarouselLogo
           logoText="Ninja Panda"
           description="Experience the art of sushi at Ninja Panda. Fresh ingredients, exquisite flavors, and a welcoming ambiance await you."
           buttons={[{ text: 'View Menu', href: '#menu' }, { text: 'Make a Reservation', href: '#contact' }]}
-          background={{ variant: 'sparkles-gradient' }}
-          imageSrc="https://img.b2bpic.net/free-photo/various-sushi-rolls-plate_140725-4318.jpg"
-          imageAlt="A vibrant sushi platter with various fresh sushi and sashimi."
-          mediaAnimation="opacity"
-          frameStyle="card"
-          ariaLabel="Hero section featuring Ninja Panda logo and delicious sushi."
-          logoContainerClassName="max-w-screen-md mx-auto"
-          logoClassName="text-foreground"
-          descriptionClassName="max-w-xl mx-auto md:mr-0 text-center md:text-right"
+          slides={[
+            { imageSrc: 'https://img.b2bpic.net/free-photo/various-sushi-rolls-plate_140725-4318.jpg', imageAlt: 'A vibrant sushi platter with various fresh sushi and sashimi.' },
+            { imageSrc: 'https://img.b2bpic.net/free-photo/delicious-sushi-rolls-black-plate_23-2149818816.jpg', imageAlt: 'Delicious sushi rolls on a black plate.' },
+            { imageSrc: 'https://img.b2bpic.net/free-photo/top-view-different-sushi-pieces-arranged_23-2149120613.jpg', imageAlt: 'Various sushi pieces beautifully arranged on a platter.' }
+          ]}
+          ariaLabel="Hero section featuring Ninja Panda logo and dynamic sushi carousel."
         />
       </div>
 
@@ -64,7 +64,7 @@ export default function LandingPage() {
           ]}
           useInvertedBackground={false}
           ariaLabel="About section detailing Ninja Panda's story and culinary philosophy."
-          buttons={[{ text: 'Learn More', href: '#about' }]}
+          buttons={[{ text: 'Learn More', href: '/#about' }]} 
           showBorder={true}
           titleClassName="text-center md:text-left"
           descriptionClassName="text-center md:text-left mx-auto max-w-2xl md:max-w-none"
@@ -239,8 +239,8 @@ export default function LandingPage() {
       <div id="footer" data-section="footer">
         <FooterBase
           columns={[
-            { title: 'About Us', items: [{ label: 'Our Story', href: '#about' }, { label: 'Menu', href: '#menu' }] },
-            { title: 'Help', items: [{ label: 'FAQ', href: '#faq' }, { label: 'Contact', href: '#contact' }] },
+            { title: 'About Us', items: [{ label: 'Our Story', href: '/#about' }, { label: 'Menu', href: '/#menu' }] },
+            { title: 'Help', items: [{ label: 'FAQ', href: '/#faq' }, { label: 'Contact', href: '/#contact' }] },
             { title: 'Legal', items: [{ label: 'Privacy Policy', href: '/privacy' }] },
           ]}
           logoText="Ninja Panda"
diff --git a/src/app/shop/[id]/page.tsx b/src/app/shop/[id]/page.tsx
index aa2e572..01221e6 100644
--- a/src/app/shop/[id]/page.tsx
+++ b/src/app/shop/[id]/page.tsx
@@ -84,8 +84,14 @@ export default function ProductPage({ params }: ProductPageProps) {
                     <div id="nav" data-section="nav">
                         <NavbarStyleApple
                             navItems={[
-                                { name: "Home", id: "/" },
-                                { name: "Shop", id: "/shop" }
+                                { name: 'Home', id: '/' },
+                                { name: 'Menu', id: '/#menu' },
+                                { name: 'About', id: '/#about' },
+                                { name: 'Testimonials', id: '/#testimonials' },
+                                { name: 'FAQ', id: '/#faq' },
+                                { name: 'Contact', id: '/#contact' },
+                                { name: 'Blog', id: '/blog' },
+                                { name: 'Shop', id: '/shop' }
                             ]}
                             brandName="Ninja Panda"
                         />
@@ -98,8 +104,8 @@ export default function ProductPage({ params }: ProductPageProps) {
                     <div id="footer" data-section="footer">
                         <FooterBase
                             columns={[
-                                { title: "About Us", items: [{ label: "Our Story", href: "#about" }, { label: "Menu", href: "#menu" }] },
-                                { title: "Help", items: [{ label: "FAQ", href: "#faq" }, { label: "Contact", href: "#contact" }] },
+                                { title: "About Us", items: [{ label: "Our Story", href: "/#about" }, { label: "Menu", href: "/#menu" }] },
+                                { title: "Help", items: [{ label: "FAQ", href: "/#faq" }, { label: "Contact", href: "/#contact" }] },
                                 { title: "Legal", items: [{ label: "Privacy Policy", href: "/privacy" }] }
                             ]}
                             logoText="Ninja Panda"
@@ -130,8 +136,14 @@ export default function ProductPage({ params }: ProductPageProps) {
                     <div id="nav" data-section="nav">
                         <NavbarStyleApple
                             navItems={[
-                                { name: "Home", id: "/" },
-                                { name: "Shop", id: "/shop" }
+                                { name: 'Home', id: '/' },
+                                { name: 'Menu', id: '/#menu' },
+                                { name: 'About', id: '/#about' },
+                                { name: 'Testimonials', id: '/#testimonials' },
+                                { name: 'FAQ', id: '/#faq' },
+                                { name: 'Contact', id: '/#contact' },
+                                { name: 'Blog', id: '/blog' },
+                                { name: 'Shop', id: '/shop' }
                             ]}
                             brandName="Ninja Panda"
                         />
@@ -152,8 +164,8 @@ export default function ProductPage({ params }: ProductPageProps) {
                     <div id="footer" data-section="footer">
                         <FooterBase
                             columns={[
-                                { title: "About Us", items: [{ label: "Our Story", href: "#about" }, { label: "Menu", href: "#menu" }] },
-                                { title: "Help", items: [{ label: "FAQ", href: "#faq" }, { label: "Contact", href: "#contact" }] },
+                                { title: "About Us", items: [{ label: "Our Story", href: "/#about" }, { label: "Menu", href: "/#menu" }] },
+                                { title: "Help", items: [{ label: "FAQ", href: "/#faq" }, { label: "Contact", href: "/#contact" }] },
                                 { title: "Legal", items: [{ label: "Privacy Policy", href: "/privacy" }] }
                             ]}
                             logoText="Ninja Panda"
@@ -184,8 +196,14 @@ export default function ProductPage({ params }: ProductPageProps) {
                     <NavbarStyleApple
                         brandName="Ninja Panda"
                         navItems={[
-                            { name: "Home", id: "/" },
-                            { name: "Shop", id: "/shop" },
+                            { name: 'Home', id: '/' },
+                            { name: 'Menu', id: '/#menu' },
+                            { name: 'About', id: '/#about' },
+                            { name: 'Testimonials', id: '/#testimonials' },
+                            { name: 'FAQ', id: '/#faq' },
+                            { name: 'Contact', id: '/#contact' },
+                            { name: 'Blog', id: '/blog' },
+                            { name: 'Shop', id: '/shop' }
                         ]}
                     />
                 </div>
@@ -228,8 +246,8 @@ export default function ProductPage({ params }: ProductPageProps) {
                 <div id="footer" data-section="footer">
                     <FooterBase
                         columns={[
-                            { title: "About Us", items: [{ label: "Our Story", href: "#about" }, { label: "Menu", href: "#menu" }] },
-                            { title: "Help", items: [{ label: "FAQ", href: "#faq" }, { label: "Contact", href: "#contact" }] },
+                            { title: "About Us", items: [{ label: "Our Story", href: "/#about" }, { label: "Menu", href: "/#menu" }] },
+                            { title: "Help", items: [{ label: "FAQ", href: "/#faq" }, { label: "Contact", href: "/#contact" }] },
                             { title: "Legal", items: [{ label: "Privacy Policy", href: "/privacy" }] }
                         ]}
                         logoText="Ninja Panda"
diff --git a/src/app/shop/page.tsx b/src/app/shop/page.tsx
index e85f8c2..0857816 100644
--- a/src/app/shop/page.tsx
+++ b/src/app/shop/page.tsx
@@ -60,8 +60,14 @@ export default function ShopPage() {
                     <div id="nav" data-section="nav">
                         <NavbarStyleApple
                             navItems={[
-                                { name: "Home", id: "/" },
-                                { name: "Shop", id: "/shop" }
+                                { name: 'Home', id: '/' },
+                                { name: 'Menu', id: '/#menu' },
+                                { name: 'About', id: '/#about' },
+                                { name: 'Testimonials', id: '/#testimonials' },
+                                { name: 'FAQ', id: '/#faq' },
+                                { name: 'Contact', id: '/#contact' },
+                                { name: 'Blog', id: '/blog' },
+                                { name: 'Shop', id: '/shop' }
                             ]}
                             brandName="Ninja Panda"
                         />
@@ -74,8 +80,8 @@ export default function ShopPage() {
                     <div id="footer" data-section="footer">
                         <FooterBase
                             columns={[
-                                { title: "About Us", items: [{ label: "Our Story", href: "#about" }, { label: "Menu", href: "#menu" }] },
-                                { title: "Help", items: [{ label: "FAQ", href: "#faq" }, { label: "Contact", href: "#contact" }] },
+                                { title: "About Us", items: [{ label: "Our Story", href: "/#about" }, { label: "Menu", href: "/#menu" }] },
+                                { title: "Help", items: [{ label: "FAQ", href: "/#faq" }, { label: "Contact", href: "/#contact" }] },
                                 { title: "Legal", items: [{ label: "Privacy Policy", href: "/privacy" }] }
                             ]}
                             logoText="Ninja Panda"
@@ -105,8 +111,14 @@ export default function ShopPage() {
                 <div id="nav" data-section="nav">
                     <NavbarStyleApple
                         navItems={[
-                            { name: "Home", id: "/" },
-                            { name: "Shop", id: "/shop" }
+                            { name: 'Home', id: '/' },
+                            { name: 'Menu', id: '/#menu' },
+                            { name: 'About', id: '/#about' },
+                            { name: 'Testimonials', id: '/#testimonials' },
+                            { name: 'FAQ', id: '/#faq' },
+                            { name: 'Contact', id: '/#contact' },
+                            { name: 'Blog', id: '/blog' },
+                            { name: 'Shop', id: '/shop' }
                         ]}
                         brandName="Ninja Panda"
                     />
@@ -140,8 +152,8 @@ export default function ShopPage() {
                 <div id="footer" data-section="footer">
                     <FooterBase
                         columns={[
-                            { title: "About Us", items: [{ label: "Our Story", href: "#about" }, { label: "Menu", href: "#menu" }] },
-                            { title: "Help", items: [{ label: "FAQ", href: "#faq" }, { label: "Contact", href: "#contact" }] },
+                            { title: "About Us", items: [{ label: "Our Story", href: "/#about" }, { label: "Menu", href: "/#menu" }] },
+                            { title: "Help", items: [{ label: "FAQ", href: "/#faq" }, { label: "Contact", href: "/#contact" }] },
                             { title: "Legal", items: [{ label: "Privacy Policy", href: "/privacy" }] }
                         ]}
                         logoText="Ninja Panda"