diff --git a/src/app/page.tsx b/src/app/page.tsx
index 7919196..02da45a 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,31 +1,35 @@
-import type { Metadata } from "next";
+"use client";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
 import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
 import BlogCardTwo from '@/components/sections/blog/BlogCardTwo';
 import FooterBase from '@/components/sections/footer/FooterBase';
 import Link from "next/link";
 
-export const metadata: Metadata = {
-  title: 'Monaco Life | Billionaire News Portal',
-  description: 'Exclusive insights into the world’s most elite principality. High-end news from yachting to real estate.',
-};
-
 export default function Page() {
   const navItems = [
     { name: "Home", id: "/" },
     { name: "Yachts", id: "/yachts" },
     { name: "Real Estate", id: "/real-estate" },
-    { name: "Lifestyle", id: "/lifestyle" }
+    { name: "Lifestyle", id: "/lifestyle" },
+    { name: "F1", id: "/f1" }
   ];
 
   return (
-    <ThemeProvider>
+    <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">
-        <nav className="flex gap-4 p-4">
-          {navItems.map(item => (
-            <Link key={item.id} href={item.id}>{item.name}</Link>
-          ))}
-        </nav>
+        <NavbarStyleFullscreen navItems={navItems} brandName="Monaco Life" />
       </div>
       <div id="hero" data-section="hero">
         <HeroCarouselLogo 
@@ -37,8 +41,7 @@ export default function Page() {
             { imageSrc: "http://img.b2bpic.net/free-photo/catamaran-stairs-leading-into-turquoise-waters_23-2151995404.jpg", imageAlt: "Luxury Yachts" },
             { imageSrc: "http://img.b2bpic.net/free-photo/beach-chair-resort_1150-17976.jpg", imageAlt: "Luxury Penthouse" },
             { imageSrc: "http://img.b2bpic.net/free-photo/futuristic-view-high-tech-earth-planet_23-2151100429.jpg", imageAlt: "3D Interactive Globe" },
-            { imageSrc: "http://img.b2bpic.net/free-photo/catamaran-stairs-leading-into-turquoise-waters_23-2151995404.jpg", imageAlt: "Luxury Yachts" },
-            { imageSrc: "http://img.b2bpic.net/free-photo/beach-chair-resort_1150-17976.jpg", imageAlt: "Luxury Penthouse" }
+            { imageSrc: "http://img.b2bpic.net/free-photo/catamaran-stairs-leading-into-turquoise-waters_23-2151995404.jpg", imageAlt: "Luxury Yachts" }
           ]}
         />
       </div>