diff --git a/src/app/cart/page.tsx b/src/app/cart/page.tsx
index 6a48552..cfb71db 100644
--- a/src/app/cart/page.tsx
+++ b/src/app/cart/page.tsx
@@ -5,8 +5,8 @@ import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/Nav
 
 export default function CartPage() {
   return (
-    <ThemeProvider>
-      <NavbarStyleFullscreen navItems={[{name: "Home", id: "/"}, {name: "Cart", id: "/cart"}]} brandName="GameVault" />
+    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
+      <NavbarStyleFullscreen navItems={[{name: "Home", id: "/"}, {name: "Catalog", id: "/catalog"}, {name: "Cart", id: "/cart"}]} brandName="GameVault" />
       <main className="container mx-auto p-8 pt-32">
         <h1 className="text-4xl font-bold mb-8">Your Shopping Cart</h1>
         <p>Cart items will appear here.</p>
diff --git a/src/app/catalog/page.tsx b/src/app/catalog/page.tsx
index bb87bac..5ea29ad 100644
--- a/src/app/catalog/page.tsx
+++ b/src/app/catalog/page.tsx
@@ -2,37 +2,15 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import ProductCatalogItem from '@/components/ecommerce/productCatalog/ProductCatalogItem';
-import React from 'react';
 
 export default function CatalogPage() {
-  const categories = ['Mobile Games', 'PC Games', 'Console Games'];
-  
   return (
-    <ThemeProvider>
-      <NavbarStyleFullscreen
-          navItems={[
-            { name: "Home", id: "/" },
-            { name: "About", id: "/#about" },
-            { name: "Features", id: "/#features" },
-            { name: "Catalog", id: "/catalog" },
-            { name: "FAQ", id: "/#faq" },
-          ]}
-          brandName="GameVault"
-        />
+    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
+      <NavbarStyleFullscreen navItems={[{name: "Home", id: "/"}, {name: "Catalog", id: "/catalog"}, {name: "Cart", id: "/cart"}]} brandName="GameVault" />
       <main className="pt-32 pb-20 px-6 max-w-7xl mx-auto">
         <h1 className="text-5xl font-bold mb-12">Game Catalog</h1>
-        {categories.map((cat) => (
-            <section key={cat} className="mb-16">
-                <h2 className="text-3xl font-semibold mb-8">{cat}</h2>
-                <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
-                    <ProductCatalogItem product={{ id: '1', name: 'Sample Game Title', price: '$19.99', rating: 4.8, imageSrc: 'https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg' }} />
-                    <ProductCatalogItem product={{ id: '2', name: 'Popular Title', price: '$29.99', rating: 5, imageSrc: 'https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg' }} />
-                    <ProductCatalogItem product={{ id: '3', name: 'Action Hit', price: '$49.99', rating: 4.5, imageSrc: 'https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg' }} />
-                </div>
-            </section>
-        ))}
+        <p>Explore our library of games.</p>
       </main>
     </ThemeProvider>
   );
-}
+}
\ No newline at end of file
diff --git a/src/app/checkout/page.tsx b/src/app/checkout/page.tsx
index cfad1c9..fbb9ee9 100644
--- a/src/app/checkout/page.tsx
+++ b/src/app/checkout/page.tsx
@@ -5,11 +5,11 @@ import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/Nav
 
 export default function CheckoutPage() {
   return (
-    <ThemeProvider>
-      <NavbarStyleFullscreen navItems={[{name: "Home", id: "/"}, {name: "Cart", id: "/cart"}]} brandName="GameVault" />
+    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
+      <NavbarStyleFullscreen navItems={[{name: "Home", id: "/"}, {name: "Catalog", id: "/catalog"}, {name: "Cart", id: "/cart"}]} brandName="GameVault" />
       <main className="container mx-auto p-8 pt-32">
         <h1 className="text-4xl font-bold mb-8">Checkout</h1>
-        <p>Please select your payment method to complete your purchase.</p>
+        <p>Please proceed with payment.</p>
       </main>
     </ThemeProvider>
   );
diff --git a/src/app/confirmation/page.tsx b/src/app/confirmation/page.tsx
index afafecd..df066df 100644
--- a/src/app/confirmation/page.tsx
+++ b/src/app/confirmation/page.tsx
@@ -5,8 +5,8 @@ import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/Nav
 
 export default function ConfirmationPage() {
   return (
-    <ThemeProvider>
-      <NavbarStyleFullscreen navItems={[{name: "Home", id: "/"}]} brandName="GameVault" />
+    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
+      <NavbarStyleFullscreen navItems={[{name: "Home", id: "/"}, {name: "Catalog", id: "/catalog"}]} brandName="GameVault" />
       <main className="container mx-auto p-8 pt-32">
         <h1 className="text-4xl font-bold mb-8">Order Confirmed!</h1>
         <p>Thank you for your purchase.</p>
diff --git a/src/app/page.tsx b/src/app/page.tsx
index ab52f76..dd2c0b9 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -2,101 +2,79 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactCenter from '@/components/sections/contact/ContactCenter';
-import FaqBase from '@/components/sections/faq/FaqBase';
-import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
 import FooterMedia from '@/components/sections/footer/FooterMedia';
-import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
-import MediaAbout from '@/components/sections/about/MediaAbout';
+import HeroBillboardDashboard from '@/components/sections/hero/HeroBillboardDashboard';
+import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
 import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
-import ProductCardFour from '@/components/sections/product/ProductCardFour';
-import HeroBillboardDashboard from '@/components/sections/hero/HeroBillboardDashboard';
-import { LayoutDashboard, Gamepad2, Package, TrendingUp } from 'lucide-react';
+import { LayoutDashboard, Gamepad2, Package, TrendingUp, BarChart3, Users, Zap } from 'lucide-react';
 
 export default function LandingPage() {
   return (
-    <ThemeProvider
-        defaultButtonVariant="icon-arrow"
-        defaultTextAnimation="entrance-slide"
-        borderRadius="soft"
-        contentWidth="mediumLarge"
-        sizing="largeSizeMediumTitles"
-        background="none"
-        cardStyle="glass-depth"
-        primaryButtonStyle="flat"
-        secondaryButtonStyle="radial-glow"
-        headingFontWeight="light"
-    >
+    <ThemeProvider defaultButtonVariant="icon-arrow" defaultTextAnimation="entrance-slide" borderRadius="soft" contentWidth="mediumLarge" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
       <ReactLenis root>
-  <div id="nav" data-section="nav">
-      <NavbarStyleFullscreen
-      navItems={[
-        { name: "Dashboard", id: "dashboard" },
-        { name: "Inventory", id: "inventory" },
-        { name: "Analytics", id: "analytics" },
-      ]}
-      brandName="GameVault"
-    />
-  </div>
+        <div id="nav" data-section="nav">
+          <NavbarStyleFullscreen navItems={[{ name: "Dashboard", id: "dashboard" }, { name: "Inventory", id: "inventory" }, { name: "Analytics", id: "analytics" }]} brandName="GameVault" />
+        </div>
 
-  <div id="dashboard" data-section="dashboard">
-    <HeroBillboardDashboard
-      title="GameVault Admin Dashboard"
-      description="Manage your games, packages, and view sales performance all in one place."
-      dashboard={{
-        title: "Overview",        stats: [
-          { title: "Total Games", values: [45, 0, 0], description: "Active titles" },
-          { title: "Packages", values: [120, 0, 0], description: "Top-up options" },
-          { title: "Sales", values: [8500, 0, 0], valuePrefix: "$", description: "This month" }
-        ],
-        logoIcon: LayoutDashboard,
-        sidebarItems: [{ icon: Gamepad2, active: true }, { icon: Package }, { icon: TrendingUp }],
-        imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=cjpe63&_wi=1"
-      }}
-    />
-  </div>
+        <div id="dashboard" data-section="dashboard">
+          <HeroBillboardDashboard
+            title="GameVault Admin Dashboard"
+            description="Manage your games, packages, and view sales performance all in one place."
+            dashboard={{
+              title: "Overview",              stats: [
+                { title: "Total Games", values: [45, 0, 0], description: "Active titles" },
+                { title: "Packages", values: [120, 0, 0], description: "Top-up options" },
+                { title: "Sales", values: [8500, 0, 0], valuePrefix: "$", description: "This month" }
+              ],
+              logoIcon: LayoutDashboard,
+              sidebarItems: [{ icon: Gamepad2, active: true }, { icon: Package }, { icon: TrendingUp }],
+              buttons: [{ text: "Export Report", href: "#" }],
+              listItems: [{ icon: BarChart3, title: "Recent Sales", status: "Completed" }],
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg"
+            }}
+          />
+        </div>
 
-  <div id="inventory" data-section="inventory">
-    <FeatureCardNineteen
-      textboxLayout="split"
-      useInvertedBackground={true}
-      title="Inventory Management"
-      description="Track and update your game database and top-up packages in real-time."
-      features={[
-        {
-          tag: "Games",          title: "Manage Games",          subtitle: "Library Control",          description: "Add, edit, or remove game titles and metadata.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=j6la89&_wi=1"},
-        {
-          tag: "Packages",          title: "Manage Top-ups",          subtitle: "Package Pricing",          description: "Configure currency packs and pricing strategies.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=imrl85"}
-      ]}
-    />
-  </div>
+        <div id="inventory" data-section="inventory">
+          <FeatureCardNineteen
+            textboxLayout="split"
+            useInvertedBackground={true}
+            title="Inventory Management"
+            description="Track and update your game database and top-up packages in real-time."
+            features={[
+              {
+                tag: "Games",                title: "Manage Games",                subtitle: "Library Control",                description: "Add, edit, or remove game titles and metadata.",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg"
+              },
+              {
+                tag: "Packages",                title: "Manage Top-ups",                subtitle: "Package Pricing",                description: "Configure currency packs and pricing strategies.",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg"
+              }
+            ]}
+          />
+        </div>
 
-  <div id="analytics" data-section="analytics">
-    <MetricCardEleven
-      title="Sales Analytics"
-      tag="Real-time Reports"
-      metrics={[
-        { id: "s1", value: "$12,400", description: "Total Revenue this month" },
-        { id: "s2", value: "2,300", description: "Packages sold" },
-        { id: "s3", value: "480", description: "New users this month" }
-      ]}
-      metricsAnimation="slide-up"
-      useInvertedBackground={false}
-    />
-  </div>
+        <div id="analytics" data-section="analytics">
+          <MetricCardEleven
+            title="Sales Analytics"
+            animationType="slide-up"
+            metrics={[
+              { id: "s1", value: "$12,400", title: "Total Revenue", description: "Revenue this month", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg" },
+              { id: "s2", value: "2,300", title: "Packages Sold", description: "Total volume", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg" },
+              { id: "s3", value: "480", title: "New Users", description: "Monthly growth", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg" }
+            ]}
+          />
+        </div>
 
-  <div id="footer" data-section="footer">
-      <FooterMedia
-      imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=grky8d"
-      logoText="GameVault"
-      columns={[
-        { title: "Admin", items: [{ label: "Settings", href: "#" }] },
-        { title: "Reports", items: [{ label: "Download CSV", href: "#" }] }
-      ]}
-    />
-  </div>
+        <div id="footer" data-section="footer">
+          <FooterMedia
+            logoText="GameVault"
+            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg"
+            columns={[
+              { title: "Admin", items: [{ label: "Settings", href: "#" }] },
+              { title: "Reports", items: [{ label: "Download CSV", href: "#" }] }
+            ]}
+          />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );
diff --git a/src/app/transactions/page.tsx b/src/app/transactions/page.tsx
index 8d4ec74..affc0d7 100644
--- a/src/app/transactions/page.tsx
+++ b/src/app/transactions/page.tsx
@@ -5,11 +5,11 @@ import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/Nav
 
 export default function TransactionsPage() {
   return (
-    <ThemeProvider>
-      <NavbarStyleFullscreen navItems={[{name: "Home", id: "/"}, {name: "History", id: "/transactions"}]} brandName="GameVault" />
+    <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
+      <NavbarStyleFullscreen navItems={[{name: "Home", id: "/"}, {name: "Catalog", id: "/catalog"}, {name: "History", id: "/transactions"}]} brandName="GameVault" />
       <main className="container mx-auto p-8 pt-32">
         <h1 className="text-4xl font-bold mb-8">Transaction History</h1>
-        <p>View your past orders and status updates here.</p>
+        <p>View your past orders here.</p>
       </main>
     </ThemeProvider>
   );