diff --git a/next.config.js b/next.config.js
new file mode 100644
index 0000000..ba5e395
--- /dev/null
+++ b/next.config.js
@@ -0,0 +1,72 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  images: {
+    remotePatterns: [
+      {
+        protocol: 'https',
+        hostname: 'webuild-dev.s3.eu-north-1.amazonaws.com',
+        pathname: '/**',
+      },
+      {
+        protocol: 'https',
+        hostname: '*.cloudinary.com',
+        pathname: '/**',
+      },
+      {
+        protocol: 'https',
+        hostname: 'images.unsplash.com',
+        pathname: '/**',
+      },
+    ],
+    unoptimized: false,
+    formats: ['image/avif', 'image/webp'],
+    deviceSizes: [320, 420, 640, 768, 1024, 1280, 1536],
+    imageSizes: [16, 32, 48, 64, 96, 128, 256, 384],
+  },
+  compress: true,
+  swcMinify: true,
+  reactStrictMode: true,
+  poweredByHeader: false,
+  productionBrowserSourceMaps: false,
+  experimental: {
+    optimizePackageImports: [
+      '@radix-ui/react-dialog',
+      '@radix-ui/react-dropdown-menu',
+      '@radix-ui/react-slider',
+      'lucide-react',
+    ],
+  },
+  headers: async () => [
+    {
+      source: '/:path*',
+      headers: [
+        {
+          key: 'X-DNS-Prefetch-Control',
+          value: 'on',
+        },
+        {
+          key: 'X-Frame-Options',
+          value: 'SAMEORIGIN',
+        },
+        {
+          key: 'X-Content-Type-Options',
+          value: 'nosniff',
+        },
+        {
+          key: 'X-XSS-Protection',
+          value: '1; mode=block',
+        },
+        {
+          key: 'Referrer-Policy',
+          value: 'strict-origin-when-cross-origin',
+        },
+        {
+          key: 'Permissions-Policy',
+          value: 'geolocation=(), microphone=(), camera=()',
+        },
+      ],
+    },
+  ],
+};
+
+module.exports = nextConfig;
\ No newline at end of file
diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx
new file mode 100644
index 0000000..32a8ec5
--- /dev/null
+++ b/src/app/about/page.tsx
@@ -0,0 +1,40 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import MediaAbout from "@/components/sections/about/MediaAbout";
+
+const AboutPage = () => {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="hover-magnetic"
+      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" />
+      <div id="about-hero" data-section="about-hero">
+        <MediaAbout
+          title="Elevate Your Experience"
+          description="Discover a new way to connect, create, and inspire with our innovative solutions."
+          tag="About Us"
+          imageSrc="/about-hero.jpg"
+          imageAlt="Our team in action"
+          buttons={[{ text: "Shop Now", href: "/shop" }]}
+          useInvertedBackground={false}
+        />
+      </div>
+      <div id="features" data-section="features" />
+      <div id="testimonials" data-section="testimonials" />
+      <div id="contact" data-section="contact" />
+      <div id="footer" data-section="footer" />
+    </ThemeProvider>
+  );
+};
+
+export default AboutPage;
diff --git a/src/app/brands/[brand]/page.tsx b/src/app/brands/[brand]/page.tsx
new file mode 100644
index 0000000..de9e8fc
--- /dev/null
+++ b/src/app/brands/[brand]/page.tsx
@@ -0,0 +1,179 @@
+"use client";
+
+import { useParams } from "next/navigation";
+import { MapPin, Award, Users, TrendingUp } from "lucide-react";
+
+interface BrandModel {
+  id: string;
+  name: string;
+  year: string;
+  price: string;
+  image: string;
+}
+
+interface BrandInfo {
+  name: string;
+  founded: string;
+  headquarters: string;
+  description: string;
+  history: string;
+  stats: {
+    yearsInBusiness: string;
+    vehiclesSold: string;
+    countries: string;
+    awards: string;
+  };
+  models: BrandModel[];
+}
+
+const mockBrandData: { [key: string]: BrandInfo } = {
+  tesla: {
+    name: "Tesla",    founded: "2003",    headquarters: "Palo Alto, California",    description: "Leading electric vehicle manufacturer revolutionizing sustainable transportation.",    history:
+      "Tesla was founded in 2003 by Martin Eberhard and Marc Tarpenning. Named after inventor Nikola Tesla, the company was established to prove that electric vehicles can be both high-performance and desirable. In 2004, Elon Musk joined as chairman and led Series A funding. Tesla has since become the world's most valuable automaker, pioneering the mass production of electric vehicles and accelerating the global transition to sustainable energy.",    stats: {
+      yearsInBusiness: "21+",      vehiclesSold: "3.5M+",      countries: "100+",      awards: "150+"},
+    models: [
+      { id: "1", name: "Model S", year: "2024", price: "$89,990", image: "https://images.unsplash.com/photo-1560958089-b8a63dd8b50b?w=600" },
+      { id: "2", name: "Model 3", year: "2024", price: "$43,990", image: "https://images.unsplash.com/photo-1516814050195-3a03d82e059d?w=600" },
+      { id: "3", name: "Model X", year: "2024", price: "$104,990", image: "https://images.unsplash.com/photo-1552820728-8ac41f1ce891?w=600" },
+      { id: "4", name: "Model Y", year: "2024", price: "$52,990", image: "https://images.unsplash.com/photo-1560958089-fcbb3cce6c55?w=600" },
+    ],
+  },
+  bmw: {
+    name: "BMW",    founded: "1916",    headquarters: "Munich, Germany",    description: "Premium German automaker known for innovative design and performance.",    history:
+      "BMW (Bayerische Motoren Werke AG) was founded in 1916 as an aircraft engine manufacturer. The company transitioned to automobile production in 1929, establishing itself as a leader in luxury vehicles. BMW is renowned for its engineering excellence, innovative technology, and the iconic 'Ultimate Driving Machine' philosophy. Today, BMW stands as one of the world's leading premium automakers with a global presence.",    stats: {
+      yearsInBusiness: "108+",      vehiclesSold: "2.5M+",      countries: "140+",      awards: "200+"},
+    models: [
+      { id: "1", name: "M440i xDrive", year: "2024", price: "$67,500", image: "https://images.unsplash.com/photo-1469854523086-cc02fe5d8800?w=600" },
+      { id: "2", name: "X5 M", year: "2024", price: "$115,900", image: "https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=600" },
+      { id: "3", name: "i7", year: "2024", price: "$99,650", image: "https://images.unsplash.com/photo-1533473359331-35b3c3f0f038?w=600" },
+      { id: "4", name: "Z4 M440i", year: "2024", price: "$79,500", image: "https://images.unsplash.com/photo-1552820728-8ac41f1ce891?w=600" },
+    ],
+  },
+};
+
+export default function BrandPage() {
+  const params = useParams();
+  const brandKey = (params.brand as string)?.toLowerCase() || "";
+  const brand = mockBrandData[brandKey];
+
+  if (!brand) {
+    return (
+      <div className="min-h-screen flex items-center justify-center">
+        <div className="text-center">
+          <h1 className="text-4xl font-bold mb-4">Brand Not Found</h1>
+          <p className="text-gray-600 mb-8">The brand you're looking for doesn't exist.</p>
+          <a href="/" className="px-6 py-3 bg-accent text-white rounded-lg">Back to Home</a>
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <div className="min-h-screen bg-background">
+      {/* Brand Header */}
+      <div className="bg-gradient-to-br from-card to-background py-16 px-4">
+        <div className="max-w-6xl mx-auto">
+          <a href="/" className="text-accent hover:underline mb-6 inline-block">← Back</a>
+          <h1 className="text-5xl font-bold mb-4">{brand.name}</h1>
+          <p className="text-xl text-gray-600 mb-8">{brand.description}</p>
+          <div className="flex flex-wrap gap-6 text-sm">
+            <div className="flex items-center gap-2">
+              <Award size={20} className="text-accent" />
+              <span>Founded {brand.founded}</span>
+            </div>
+            <div className="flex items-center gap-2">
+              <MapPin size={20} className="text-accent" />
+              <span>{brand.headquarters}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      {/* Main Content */}
+      <div className="max-w-6xl mx-auto px-4 py-16">
+        {/* Brand History */}
+        <section className="mb-20">
+          <h2 className="text-4xl font-bold mb-8">Our Story</h2>
+          <div className="grid md:grid-cols-3 gap-8 mb-12">
+            <div className="md:col-span-2">
+              <p className="text-lg text-gray-700 leading-relaxed mb-6">{brand.history}</p>
+            </div>
+            <div className="bg-card p-8 rounded-lg h-fit">
+              <h3 className="text-2xl font-bold mb-6">By the Numbers</h3>
+              <div className="space-y-6">
+                <div>
+                  <div className="flex items-center gap-2 mb-2">
+                    <TrendingUp size={20} className="text-accent" />
+                    <span className="text-sm text-gray-600">Years in Business</span>
+                  </div>
+                  <p className="text-3xl font-bold">{brand.stats.yearsInBusiness}</p>
+                </div>
+                <div>
+                  <div className="flex items-center gap-2 mb-2">
+                    <Users size={20} className="text-accent" />
+                    <span className="text-sm text-gray-600">Vehicles Sold</span>
+                  </div>
+                  <p className="text-3xl font-bold">{brand.stats.vehiclesSold}</p>
+                </div>
+                <div>
+                  <div className="flex items-center gap-2 mb-2">
+                    <MapPin size={20} className="text-accent" />
+                    <span className="text-sm text-gray-600">Countries Served</span>
+                  </div>
+                  <p className="text-3xl font-bold">{brand.stats.countries}</p>
+                </div>
+                <div>
+                  <div className="flex items-center gap-2 mb-2">
+                    <Award size={20} className="text-accent" />
+                    <span className="text-sm text-gray-600">Awards Won</span>
+                  </div>
+                  <p className="text-3xl font-bold">{brand.stats.awards}</p>
+                </div>
+              </div>
+            </div>
+          </div>
+        </section>
+
+        {/* All Models */}
+        <section>
+          <h2 className="text-4xl font-bold mb-12">All {brand.name} Models</h2>
+          <div className="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
+            {brand.models.map((model) => (
+              <div key={model.id} className="bg-card rounded-lg overflow-hidden hover:shadow-lg transition group cursor-pointer">
+                <div className="aspect-video bg-gray-200 overflow-hidden mb-4">
+                  <img
+                    src={model.image}
+                    alt={model.name}
+                    className="w-full h-full object-cover group-hover:scale-105 transition"
+                  />
+                </div>
+                <div className="p-6">
+                  <p className="text-sm text-accent mb-1">{model.year}</p>
+                  <h3 className="text-xl font-bold mb-2">{model.name}</h3>
+                  <p className="text-lg font-semibold text-accent mb-4">{model.price}</p>
+                  <a
+                    href={`/cars/${model.id}`}
+                    className="block text-accent hover:underline font-semibold"
+                  >
+                    View Details →
+                  </a>
+                </div>
+              </div>
+            ))}
+          </div>
+        </section>
+
+        {/* CTA Section */}
+        <section className="mt-20 bg-card p-12 rounded-lg text-center">
+          <h3 className="text-3xl font-bold mb-4">Ready to Explore?</h3>
+          <p className="text-gray-600 mb-8 max-w-2xl mx-auto">
+            Discover the perfect {brand.name} vehicle for your lifestyle. Our expert team is ready to help you find the right model.
+          </p>
+          <button className="px-8 py-4 bg-accent text-white font-semibold rounded-lg hover:bg-accent/90 transition">
+            Schedule a Test Drive
+          </button>
+        </section>
+      </div>
+    </div>
+  );
+}
diff --git a/src/app/brands/[slug]/page.tsx b/src/app/brands/[slug]/page.tsx
index 5c3aa0f..e1fc574 100644
--- a/src/app/brands/[slug]/page.tsx
+++ b/src/app/brands/[slug]/page.tsx
@@ -3,53 +3,34 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
 import HeroSplitTestimonial from "@/components/sections/hero/HeroSplitTestimonial";
-import TextSplitAbout from "@/components/sections/about/TextSplitAbout";
+import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
+import ProductCardTwo from "@/components/sections/product/ProductCardTwo";
 import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
+import BlogCardThree from "@/components/sections/blog/BlogCardThree";
+import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
+import TextSplitAbout from "@/components/sections/about/TextSplitAbout";
+import FaqSplitMedia from "@/components/sections/faq/FaqSplitMedia";
+import ContactCTA from "@/components/sections/contact/ContactCTA";
 import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
-import { Car, Award, Zap } from "lucide-react";
+import Link from "next/link";
+import {
+  Car,
+  Zap,
+  Award,
+  Sparkles,
+  Building2,
+  History,
+  Globe,
+  Mail,
+} from "lucide-react";
 
-export default function BrandDetailPage() {
+export default function BrandPage({ params }: { params: { slug: string } }) {
   const navItems = [
-    { name: "Search", id: "search" },
-    { name: "Browse", id: "browse" },
-    { name: "Compare", id: "compare" },
-    { name: "Timeline", id: "timeline" },
-    { name: "About", id: "about" },
-  ];
-
-  const footerColumns = [
-    {
-      items: [
-        { label: "Search Database", href: "/search" },
-        { label: "Browse Vehicles", href: "/browse" },
-        { label: "Compare Cars", href: "/compare" },
-        { label: "Timeline Explorer", href: "/timeline" },
-      ],
-    },
-    {
-      items: [
-        { label: "Brand Directory", href: "/brands" },
-        { label: "Model Guide", href: "/models" },
-        { label: "Specifications", href: "/specs" },
-        { label: "Production Data", href: "/production" },
-      ],
-    },
-    {
-      items: [
-        { label: "About Us", href: "/about" },
-        { label: "Help & Support", href: "/help" },
-        { label: "Contact", href: "/contact" },
-        { label: "Contribute Data", href: "/contribute" },
-      ],
-    },
-    {
-      items: [
-        { label: "Privacy Policy", href: "/privacy" },
-        { label: "Terms of Service", href: "/terms" },
-        { label: "Data Attribution", href: "/attribution" },
-        { label: "Sitemap", href: "/sitemap" },
-      ],
-    },
+    { name: "Search", id: "/search" },
+    { name: "Browse", id: "/browse" },
+    { name: "Compare", id: "/compare" },
+    { name: "Timeline", id: "/timeline" },
+    { name: "About", id: "/about" },
   ];
 
   return (
@@ -59,7 +40,7 @@ export default function BrandDetailPage() {
       borderRadius="pill"
       contentWidth="compact"
       sizing="largeSmallSizeMediumTitles"
-      background="aurora"
+      background="circleGradient"
       cardStyle="solid"
       primaryButtonStyle="gradient"
       secondaryButtonStyle="solid"
@@ -67,152 +48,262 @@ export default function BrandDetailPage() {
     >
       <div id="nav" data-section="nav">
         <NavbarStyleFullscreen
-          navItems={navItems}
+          navItems={[
+            { name: "Search", id: "/search" },
+            { name: "Browse", id: "/browse" },
+            { name: "Compare", id: "/compare" },
+            { name: "Timeline", id: "/timeline" },
+            { name: "About", id: "/about" },
+          ]}
           brandName="AutoArchive"
           bottomLeftText="Explore Automotive History"
           bottomRightText="1886 to Present"
         />
       </div>
 
-      <div id="brand-hero" data-section="brand-hero">
+      <div id="hero" data-section="hero">
         <HeroSplitTestimonial
-          title="Ferrari: The Prancing Horse Legacy"
-          description="Discover the complete history of Ferrari, from Enzo's vision in 1947 to today's hybrid hypercars. Explore every model, generation, and legendary achievement."
-          tag="Brand Heritage"
+          title="Explore Every Car Ever Made"
+          description="The world's most complete automotive database. Search, compare, and discover vehicles from 1886 to today across every brand, model, generation, and variant."
+          tag="Automotive Encyclopedia"
           tagIcon={Car}
-          tagAnimation="entrance-slide"
-          background={{ variant: "aurora" }}
-          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-pristine-ferrari-250-gto-from-1962-196-1772823293817-62111fec.png?_wi=3"
-          imageAlt="Ferrari 250 GTO Classic"
-          mediaAnimation="entrance-slide"
+          tagAnimation="blur-reveal"
+          background={{ variant: "plain" }}
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-modern-sleek-automotive-database-inter-1772823292340-23f02fb5.png?_wi=1"
+          imageAlt="AutoArchive Database Interface"
+          mediaAnimation="blur-reveal"
           imagePosition="right"
           testimonials={[
             {
-              name: "Racing Historian",
-              handle: "Classic Car Enthusiast",
-              testimonial: "Ferrari's design language has remained unmistakable for over 75 years. A true automotive icon.",
-              rating: 5,
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823290144-6017089c.png",
-            },
+              name: "Racing Historian",              handle: "Classic Car Enthusiast",              testimonial:
+                "The most comprehensive car database I've ever seen. Finally, one place for all automotive history.",              rating: 5,
+              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/portrait-of-a-knowledgeable-automotive-h-1772823290619-648d0b48.png?_wi=1"},
             {
-              name: "Automotive Designer",
-              handle: "Design Expert",
-              testimonial: "Every Ferrari represents the pinnacle of automotive design and engineering excellence.",
-              rating: 5,
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823290583-29073bf8.png?_wi=1",
-            },
+              name: "Automotive Designer",              handle: "Classic Car Enthusiast",              testimonial:
+                "Perfect for researching design evolution and model lineages across decades.",              rating: 5,
+              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/portrait-of-a-creative-automotive-design-1772823292200-f0afd2ae.png?_wi=1"},
             {
-              name: "Collector",
-              handle: "Vintage Vehicle Curator",
-              testimonial: "Ferrari's heritage and performance records make it the world's most coveted brand.",
-              rating: 5,
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-a-tech-1772823290751-a93bf9d8.png",
-            },
+              name: "Car Collector",              handle: "Vintage Vehicle Curator",              testimonial:
+                "An invaluable resource for understanding specifications and production years.",              rating: 5,
+              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/portrait-of-a-passionate-car-collector-r-1772823290895-3d866aea.png?_wi=1"},
+            {
+              name: "Automotive Journalist",              handle: "Car Magazine Editor",              testimonial:
+                "Research has never been easier. Every fact, spec, and timeline at my fingertips.",              rating: 5,
+              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/portrait-of-an-automotive-journalist-con-1772823290598-44ed854b.png?_wi=1"},
           ]}
           testimonialRotationInterval={5000}
           buttons={[
-            { text: "View All Models", href: "/browse" },
-            { text: "Compare Ferraris", href: "/compare" },
+            { text: "Start Searching", href: "/search" },
+            { text: "Browse Database", href: "/browse" },
           ]}
-          buttonAnimation="entrance-slide"
+          buttonAnimation="blur-reveal"
           useInvertedBackground={false}
         />
       </div>
 
-      <div id="brand-about" data-section="brand-about">
-        <TextSplitAbout
-          title="The Ferrari Story"
-          description={[
-            "Founded in 1947 by Enzo Ferrari, the company began as a race team before producing street-legal vehicles. Enzo's philosophy—'Competition is necessary for the creation of efficient vehicles'—still guides Ferrari today.",
-            "From the legendary 125 S to the groundbreaking SF90 Stradale, Ferrari has consistently pushed the boundaries of automotive engineering and design. Every model represents years of racing experience translated into production vehicles.",
-            "With over 13,000 vehicles built across 75 years, Ferrari remains the most exclusive and sought-after supercar manufacturer in the world. The prancing horse emblem symbolizes speed, performance, and uncompromising excellence.",
-          ]}
-          showBorder={true}
-          useInvertedBackground={false}
-          buttons={[
-            { text: "Browse All Models", href: "/browse" },
-            { text: "View Timeline", href: "/timeline" },
-          ]}
-          buttonAnimation="entrance-slide"
-        />
-      </div>
-
-      <div id="brand-models" data-section="brand-models">
-        <FeatureCardTwentyFive
-          features={[
-            {
-              title: "Classic Era (1947-1970)",
-              description: "The foundation of Ferrari excellence with hand-built race cars and early road vehicles.",
-              icon: Award,
-              mediaItems: [
-                {
-                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-pristine-ferrari-250-gto-from-1962-196-1772823293817-62111fec.png?_wi=4",
-                  imageAlt: "Ferrari 250 GTO",
-                },
-                {
-                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1930s-1950s-classic-cars-showcasing-art--1772823292276-01b2e0ec.png?_wi=3",
-                  imageAlt: "Classic Ferrari Models",
-                },
-              ],
-            },
-            {
-              title: "Golden Age (1970-1990)",
-              description: "Revolutionary designs like the Daytona and Testarossa defined an era of automotive excellence.",
-              icon: Zap,
-              mediaItems: [
-                {
-                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1980s-performance-vehicles-and-supercars-1772823291859-2f85f5af.png?_wi=3",
-                  imageAlt: "1980s Ferrari Models",
-                },
-                {
-                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/blog-ferrari-250-gto-1772823292116-a7e77200.png",
-                  imageAlt: "Ferrari Heritage",
-                },
-              ],
-            },
-            {
-              title: "Modern Era (1990-2010)",
-              description: "V12 masterpieces and modern engineering merged traditional values with cutting-edge technology.",
-              icon: Car,
-              mediaItems: [
-                {
-                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1990s-modern-cars-featuring-sleek-sports-1772823291648-3191a1df.png?_wi=3",
-                  imageAlt: "1990s Ferrari Models",
-                },
-                {
-                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-timeless-porsche-911-silver-or-charcoa-1772823291321-59c5e153.png?_wi=3",
-                  imageAlt: "Modern Performance Era",
-                },
-              ],
-            },
-            {
-              title: "Hybrid Revolution (2010-Present)",
-              description: "Advanced hybrid systems combine electric power with twin-turbo engines for unprecedented performance.",
-              icon: Zap,
-              mediaItems: [
-                {
-                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/modern-2020s-electric-and-autonomous-veh-1772823292629-c57b318c.png?_wi=3",
-                  imageAlt: "Modern Ferrari Hybrid",
-                },
-                {
-                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/blog-tesla-revolution-1772823291685-64082b06.png",
-                  imageAlt: "Future of Ferrari",
-                },
-              ],
-            },
-          ]}
-          animationType="depth-3d"
-          title="Ferrari Model Evolution"
-          description="Explore the iconic lineages and generations that shaped Ferrari's legendary heritage"
-          tag="Heritage Collection"
-          tagAnimation="entrance-slide"
+      <div id="popular-brands" data-section="popular-brands">
+        <SocialProofOne
+          title="Trusted by Automotive Enthusiasts Worldwide"
+          description="Access the largest collection of verified automotive data featuring every major manufacturer and brand"
+          tag="Featured Brands"
+          tagAnimation="blur-reveal"
           textboxLayout="default"
           useInvertedBackground={false}
+          names={[
+            "Ferrari",            "Porsche",            "BMW",            "Mercedes-Benz",            "Lamborghini",            "Bugatti",            "Rolls-Royce",            "Aston Martin",            "McLaren",            "Tesla"]}
+          speed={40}
+          showCard={true}
         />
       </div>
 
-      <div id="brand-footer" data-section="brand-footer">
-        <FooterLogoEmphasis columns={footerColumns} logoText="AutoArchive" />
+      <div id="featured-vehicles" data-section="featured-vehicles">
+        <ProductCardTwo
+          title="Featured Legendary Vehicles"
+          description="Iconic cars that shaped automotive history"
+          tag="Heritage Collection"
+          tagAnimation="blur-reveal"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          animationType="slide-up"
+          gridVariant="four-items-2x2-equal-grid"
+          products={[
+            {
+              id: "1",              brand: "Ferrari",              name: "Ferrari 250 GTO",              price: "1962-1964",              rating: 5,
+              reviewCount: "Legendary",              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-pristine-ferrari-250-gto-from-1962-196-1772823293817-62111fec.png?_wi=1",              imageAlt: "Ferrari 250 GTO 1962"},
+            {
+              id: "2",              brand: "Porsche",              name: "Porsche 911",              price: "1963-Present",              rating: 5,
+              reviewCount: "Iconic",              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-timeless-porsche-911-silver-or-charcoa-1772823291321-59c5e153.png?_wi=1",              imageAlt: "Porsche 911 Classic"},
+            {
+              id: "3",              brand: "Jaguar",              name: "Jaguar E-Type",              price: "1961-1974",              rating: 5,
+              reviewCount: "Historic",              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-beautiful-jaguar-e-type-from-1961-1974-1772823292102-305f7185.png?_wi=1",              imageAlt: "Jaguar E-Type"},
+            {
+              id: "4",              brand: "BMW",              name: "BMW 2002",              price: "1968-1976",              rating: 5,
+              reviewCount: "Classic",              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-classic-bmw-2002-from-1968-1976-bright-1772823292733-3909ad83.png?_wi=1",              imageAlt: "BMW 2002"},
+          ]}
+        />
+      </div>
+
+      <div id="browse-decade" data-section="browse-decade">
+        <FeatureCardTwentyFive
+          title="Browse by Era"
+          description="Explore vehicles organized by historical decade with complete production timelines"
+          tag="Timeline Explorer"
+          tagAnimation="blur-reveal"
+          animationType="depth-3d"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          features={[
+            {
+              title: "The Golden Age (1900-1920s)",              description:
+                "Early automobiles, pioneering manufacturers, and the birth of motoring",              icon: Zap,
+              mediaItems: [
+                {
+                  imageSrc:
+                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/early-1900s-automobiles-brass-and-iron-c-1772823291918-1a562875.png?_wi=1",                  imageAlt: "Early 1900s vehicles"},
+                {
+                  imageSrc:
+                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/collection-of-classic-automobiles-from-1-1772823292369-d23ee272.png?_wi=1",                  imageAlt: "Classic automobiles vintage"},
+              ],
+            },
+            {
+              title: "The Classics Era (1930-1950s)",              description:
+                "Art deco styling, post-war innovation, and the golden age of design",              icon: Award,
+              mediaItems: [
+                {
+                  imageSrc:
+                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1930s-1950s-classic-cars-showcasing-art--1772823292276-01b2e0ec.png?_wi=1",                  imageAlt: "1930s-1950s classic cars"},
+                {
+                  imageSrc:
+                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/post-world-war-ii-automobiles-from-1945--1772823292672-0ffd3a1d.png?_wi=1",                  imageAlt: "Post-war automobile design"},
+              ],
+            },
+            {
+              title: "The Modern Era (1960-1980s)",              description:
+                "Performance revolution, muscle cars, and engineering breakthroughs",              icon: Sparkles,
+              mediaItems: [
+                {
+                  imageSrc:
+                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1960s-muscle-cars-and-performance-vehicl-1772823292410-79b6e429.png?_wi=1",                  imageAlt: "1960s muscle cars"},
+                {
+                  imageSrc:
+                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1980s-performance-vehicles-and-supercars-1772823291859-2f85f5af.png?_wi=1",                  imageAlt: "1980s performance vehicles"},
+              ],
+            },
+            {
+              title: "Contemporary (1990-2024)",              description:
+                "Digital age, electric vehicles, autonomous technology, and modern innovation",              icon: Zap,
+              mediaItems: [
+                {
+                  imageSrc:
+                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1990s-modern-cars-featuring-sleek-sports-1772823291648-3191a1df.png?_wi=1",                  imageAlt: "1990s modern cars"},
+                {
+                  imageSrc:
+                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/modern-2020s-electric-and-autonomous-veh-1772823292629-c57b318c.png?_wi=1",                  imageAlt: "Electric and autonomous vehicles"},
+              ],
+            },
+          ]}
+        />
+      </div>
+
+      <div id="legendary-cars" data-section="legendary-cars">
+        <BlogCardThree
+          title="Legendary Automotive Stories"
+          description="Discover the history, engineering, and cultural impact of the world's most iconic vehicles"
+          tag="Automotive Heritage"
+          tagAnimation="blur-reveal"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          animationType="slide-up"
+          carouselMode="buttons"
+          blogs={[
+            {
+              id: "1",              category: "Performance History",              title: "The Ferrari 250 GTO: The Car That Won Le Mans",              excerpt: "Explore how this race car became the most valuable car in the world",              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/ferrari-250-gto-iconic-red-racing-car-in-1772823292116-a7e77200.png?_wi=1",              imageAlt: "Ferrari 250 GTO",              authorName: "Automotive Historian",              authorAvatar:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823290144-6017089c.png",              date: "Featured Article"},
+            {
+              id: "2",              category: "Design Evolution",              title: "The Porsche 911: 60 Years of Iconic Design",              excerpt: "How one sports car shaped the future of automotive design",              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/porsche-911-models-across-different-gene-1772823292219-b0857470.png?_wi=1",              imageAlt: "Porsche 911 Through Decades",              authorName: "Design Expert",              authorAvatar:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823290583-29073bf8.png",              date: "Featured Article"},
+            {
+              id: "3",              category: "Innovation",              title: "The Jaguar E-Type: Beauty and Performance",              excerpt: "Why Enzo Ferrari called it the most beautiful car ever made",              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/jaguar-e-type-in-stunning-profile-emphas-1772823290729-6dd39021.png?_wi=1",              imageAlt: "Jaguar E-Type Design",              authorName: "Automotive Journalist",              authorAvatar:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823292590-3867fd28.png",              date: "Featured Article"},
+          ]}
+        />
+      </div>
+
+      <div id="metrics" data-section="metrics">
+        <MetricCardThree
+          title="AutoArchive by the Numbers"
+          description="The world's most comprehensive automotive database at your fingertips"
+          tag="Database Statistics"
+          tagAnimation="blur-reveal"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          animationType="scale-rotate"
+          metrics={[
+            {
+              id: "1",              icon: Building2,
+              title: "Manufacturers",              value: "2,000+"},
+            {
+              id: "2",              icon: Car,
+              title: "Vehicle Models",              value: "50,000+"},
+            {
+              id: "3",              icon: History,
+              title: "Years Covered",              value: "138 Years"},
+            {
+              id: "4",              icon: Globe,
+              title: "Countries",              value: "195"},
+          ]}
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterLogoEmphasis
+          logoText="AutoArchive"
+          columns={[
+            {
+              items: [
+                { label: "Search Database", href: "/search" },
+                { label: "Browse Vehicles", href: "/browse" },
+                { label: "Compare Cars", href: "/compare" },
+                { label: "Timeline Explorer", href: "/timeline" },
+              ],
+            },
+            {
+              items: [
+                { label: "Brand Directory", href: "/brands" },
+                { label: "Model Guide", href: "/models" },
+                { label: "Specifications", href: "/specs" },
+                { label: "Production Data", href: "/production" },
+              ],
+            },
+            {
+              items: [
+                { label: "About Us", href: "/" },
+                { label: "Help & Support", href: "/help" },
+                { label: "Contact", href: "/contact" },
+                { label: "Contribute Data", href: "/contribute" },
+              ],
+            },
+            {
+              items: [
+                { label: "Privacy Policy", href: "/privacy" },
+                { label: "Terms of Service", href: "/terms" },
+                { label: "Data Attribution", href: "/attribution" },
+                { label: "Sitemap", href: "/sitemap" },
+              ],
+            },
+          ]}
+        />
       </div>
     </ThemeProvider>
   );
diff --git a/src/app/brands/page.tsx b/src/app/brands/page.tsx
new file mode 100644
index 0000000..2f26a1b
--- /dev/null
+++ b/src/app/brands/page.tsx
@@ -0,0 +1,25 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+
+const BrandsPage = () => {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="hover-magnetic"
+      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" />
+      <div id="brands" data-section="brands" />
+    </ThemeProvider>
+  );
+};
+
+export default BrandsPage;
diff --git a/src/app/browse/page.tsx b/src/app/browse/page.tsx
index c79d3f2..ef89f38 100644
--- a/src/app/browse/page.tsx
+++ b/src/app/browse/page.tsx
@@ -1,159 +1,25 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
-import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
-import ProductCardTwo from "@/components/sections/product/ProductCardTwo";
-import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
-import Link from "next/link";
-import { Zap, Award, Sparkles, Car } from "lucide-react";
-
-export default function BrowsePage() {
-  const navItems = [
-    { name: "Search", id: "/" },
-    { name: "Browse", id: "/browse" },
-    { name: "Compare", id: "/compare" },
-    { name: "Timeline", id: "/" },
-    { name: "About", id: "/" },
-  ];
-
-  const footerColumns = [
-    {
-      items: [
-        { label: "Search Database", href: "/" },
-        { label: "Browse Vehicles", href: "/browse" },
-        { label: "Compare Cars", href: "/compare" },
-        { label: "Timeline Explorer", href: "/" },
-      ],
-    },
-    {
-      items: [
-        { label: "Brand Directory", href: "/" },
-        { label: "Model Guide", href: "/" },
-        { label: "Specifications", href: "/" },
-        { label: "Production Data", href: "/" },
-      ],
-    },
-    {
-      items: [
-        { label: "About Us", href: "/" },
-        { label: "Help & Support", href: "/" },
-        { label: "Contact", href: "/" },
-        { label: "Contribute Data", href: "/" },
-      ],
-    },
-    {
-      items: [
-        { label: "Privacy Policy", href: "/" },
-        { label: "Terms of Service", href: "/" },
-        { label: "Data Attribution", href: "/" },
-        { label: "Sitemap", href: "/" },
-      ],
-    },
-  ];
 
+const BrowsePage = () => {
   return (
     <ThemeProvider
-      defaultButtonVariant="shift-hover"
+      defaultButtonVariant="hover-magnetic"
       defaultTextAnimation="entrance-slide"
-      borderRadius="pill"
-      contentWidth="compact"
-      sizing="largeSmallSizeMediumTitles"
-      background="aurora"
-      cardStyle="solid"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="medium"
+      background="circleGradient"
+      cardStyle="glass-elevated"
       primaryButtonStyle="gradient"
-      secondaryButtonStyle="solid"
-      headingFontWeight="extrabold"
+      secondaryButtonStyle="glass"
+      headingFontWeight="normal"
     >
-      <div id="nav" data-section="nav">
-        <NavbarStyleFullscreen
-          navItems={navItems}
-          brandName="AutoArchive"
-          bottomLeftText="Explore Automotive History"
-          bottomRightText="1886 to Present"
-        />
-      </div>
-
-      <div id="browse-decade" data-section="browse-decade">
-        <FeatureCardTwentyFive
-          title="Browse by Era"
-          description="Explore vehicles organized by historical decade with complete production timelines"
-          tag="Timeline Explorer"
-          tagAnimation="blur-reveal"
-          animationType="depth-3d"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          features={[
-            {
-              title: "The Golden Age (1900-1920s)",              description: "Early automobiles, pioneering manufacturers, and the birth of motoring",              icon: Zap,
-              mediaItems: [
-                {
-                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/early-1900s-automobiles-brass-and-iron-c-1772823291918-1a562875.png",                  imageAlt: "Early 1900s vehicles"},
-                {
-                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/collection-of-classic-automobiles-from-1-1772823292369-d23ee272.png",                  imageAlt: "Classic automobiles vintage"},
-              ],
-            },
-            {
-              title: "The Classics Era (1930-1950s)",              description: "Art deco styling, post-war innovation, and the golden age of design",              icon: Award,
-              mediaItems: [
-                {
-                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1930s-1950s-classic-cars-showcasing-art--1772823292276-01b2e0ec.png",                  imageAlt: "1930s-1950s classic cars"},
-                {
-                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/post-world-war-ii-automobiles-from-1945--1772823292672-0ffd3a1d.png",                  imageAlt: "Post-war automobile design"},
-              ],
-            },
-            {
-              title: "The Modern Era (1960-1980s)",              description: "Performance revolution, muscle cars, and engineering breakthroughs",              icon: Sparkles,
-              mediaItems: [
-                {
-                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1960s-muscle-cars-and-performance-vehicl-1772823292410-79b6e429.png",                  imageAlt: "1960s muscle cars"},
-                {
-                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1980s-performance-vehicles-and-supercars-1772823291859-2f85f5af.png",                  imageAlt: "1980s performance vehicles"},
-              ],
-            },
-            {
-              title: "Contemporary (1990-2024)",              description: "Digital age, electric vehicles, autonomous technology, and modern innovation",              icon: Zap,
-              mediaItems: [
-                {
-                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1990s-modern-cars-featuring-sleek-sports-1772823291648-3191a1df.png",                  imageAlt: "1990s modern cars"},
-                {
-                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/modern-2020s-electric-and-autonomous-veh-1772823292629-c57b318c.png",                  imageAlt: "Electric and autonomous vehicles"},
-              ],
-            },
-          ]}
-        />
-      </div>
-
-      <div id="featured-vehicles" data-section="featured-vehicles">
-        <ProductCardTwo
-          title="Featured Legendary Vehicles"
-          description="Iconic cars that shaped automotive history"
-          tag="Heritage Collection"
-          tagAnimation="blur-reveal"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          animationType="slide-up"
-          gridVariant="four-items-2x2-equal-grid"
-          products={[
-            {
-              id: "1",              brand: "Ferrari",              name: "Ferrari 250 GTO",              price: "1962-1964",              rating: 5,
-              reviewCount: "Legendary",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-pristine-ferrari-250-gto-from-1962-196-1772823293817-62111fec.png",              imageAlt: "Ferrari 250 GTO 1962"},
-            {
-              id: "2",              brand: "Porsche",              name: "Porsche 911",              price: "1963-Present",              rating: 5,
-              reviewCount: "Iconic",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-timeless-porsche-911-silver-or-charcoa-1772823291321-59c5e153.png",              imageAlt: "Porsche 911 Classic"},
-            {
-              id: "3",              brand: "Jaguar",              name: "Jaguar E-Type",              price: "1961-1974",              rating: 5,
-              reviewCount: "Historic",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-beautiful-jaguar-e-type-from-1961-1974-1772823292102-305f7185.png",              imageAlt: "Jaguar E-Type"},
-            {
-              id: "4",              brand: "BMW",              name: "BMW 2002",              price: "1968-1976",              rating: 5,
-              reviewCount: "Classic",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-classic-bmw-2002-from-1968-1976-bright-1772823292733-3909ad83.png",              imageAlt: "BMW 2002"},
-          ]}
-        />
-      </div>
-
-      <div id="footer" data-section="footer">
-        <FooterLogoEmphasis logoText="AutoArchive" columns={footerColumns} />
-      </div>
+      <div id="nav" data-section="nav" />
+      <div id="browse" data-section="browse" />
     </ThemeProvider>
   );
-}
\ No newline at end of file
+};
+
+export default BrowsePage;
diff --git a/src/app/cars/[id]/page.tsx b/src/app/cars/[id]/page.tsx
new file mode 100644
index 0000000..740c42c
--- /dev/null
+++ b/src/app/cars/[id]/page.tsx
@@ -0,0 +1,273 @@
+"use client";
+
+import { useParams } from "next/navigation";
+import { useState } from "react";
+import { ChevronLeft, ChevronRight, Heart, Share2, MapPin, Fuel, Gauge, Calendar } from "lucide-react";
+
+interface CarDetail {
+  id: string;
+  name: string;
+  price: string;
+  rating: number;
+  description: string;
+  images: Array<{ src: string; alt: string }>;
+  specs: {
+    year: string;
+    mileage: string;
+    transmission: string;
+    fuelType: string;
+    engine: string;
+    color: string;
+  };
+  features: string[];
+  variants?: Array<{
+    label: string;
+    options: string[];
+    selected: string;
+  }>;
+}
+
+const mockCarData: { [key: string]: CarDetail } = {
+  "1": {
+    id: "1",    name: "2024 Tesla Model S",    price: "$89,990",    rating: 5,
+    description: "Experience the future of electric vehicles with cutting-edge technology and exceptional performance.",    images: [
+      { src: "https://images.unsplash.com/photo-1560958089-b8a63dd8b50b?w=800", alt: "Tesla Model S Front" },
+      { src: "https://images.unsplash.com/photo-1516814050195-3a03d82e059d?w=800", alt: "Tesla Model S Side" },
+      { src: "https://images.unsplash.com/photo-1552820728-8ac41f1ce891?w=800", alt: "Tesla Model S Interior" },
+    ],
+    specs: {
+      year: "2024",      mileage: "5,200 miles",      transmission: "Automatic",      fuelType: "Electric",      engine: "Dual Motor",      color: "Solid Black"},
+    features: [
+      "Autopilot Advanced",      "Premium Audio System",      "Panoramic Sunroof",      "19-inch Wheel Set",      "Premium Interior",      "Over-the-Air Updates",      "Supercharger Access",      "Enhanced Autopilot"],
+  },
+  "2": {
+    id: "2",    name: "2024 BMW M440i xDrive",    price: "$67,500",    rating: 5,
+    description: "German engineering meets performance with the new M440i xDrive.",    images: [
+      { src: "https://images.unsplash.com/photo-1469854523086-cc02fe5d8800?w=800", alt: "BMW M440i Front" },
+      { src: "https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=800", alt: "BMW M440i Side" },
+      { src: "https://images.unsplash.com/photo-1533473359331-35b3c3f0f038?w=800", alt: "BMW M440i Interior" },
+    ],
+    specs: {
+      year: "2024",      mileage: "8,100 miles",      transmission: "Automatic",      fuelType: "Gasoline",      engine: "3.0L Twin-Turbo",      color: "Alpine White"},
+    features: [
+      "M Sport Brake Package",      "Premium Sound System",      "Adaptive M Suspension",      "20-inch M Light Alloy Wheels",      "Harman Kardon Audio",      "Gesture Control",      "Head-Up Display",      "Premium Leather Interior"],
+  },
+};
+
+export default function CarDetailPage() {
+  const params = useParams();
+  const carId = params.id as string;
+  const car = mockCarData[carId];
+  const [currentImageIndex, setCurrentImageIndex] = useState(0);
+  const [isFavorited, setIsFavorited] = useState(false);
+
+  if (!car) {
+    return (
+      <div className="min-h-screen flex items-center justify-center">
+        <div className="text-center">
+          <h1 className="text-4xl font-bold mb-4">Car Not Found</h1>
+          <p className="text-gray-600 mb-8">The car you're looking for doesn't exist.</p>
+          <a href="/" className="px-6 py-3 bg-accent text-white rounded-lg">Back to Home</a>
+        </div>
+      </div>
+    );
+  }
+
+  const nextImage = () => {
+    setCurrentImageIndex((prev) => (prev + 1) % car.images.length);
+  };
+
+  const prevImage = () => {
+    setCurrentImageIndex((prev) => (prev - 1 + car.images.length) % car.images.length);
+  };
+
+  return (
+    <div className="min-h-screen bg-background">
+      <div className="max-w-6xl mx-auto px-4 py-8">
+        {/* Header */}
+        <div className="mb-8">
+          <a href="/" className="text-accent hover:underline mb-4 inline-block">← Back</a>
+          <h1 className="text-4xl font-bold mb-2">{car.name}</h1>
+          <p className="text-xl text-accent font-semibold">{car.price}</p>
+        </div>
+
+        {/* Image Gallery */}
+        <div className="mb-12">
+          <div className="relative bg-card rounded-lg overflow-hidden mb-6">
+            <div className="aspect-video flex items-center justify-center bg-gray-100 relative">
+              <img
+                src={car.images[currentImageIndex].src}
+                alt={car.images[currentImageIndex].alt}
+                className="w-full h-full object-cover"
+              />
+              <button
+                onClick={() => setIsFavorited(!isFavorited)}
+                className="absolute top-4 right-4 p-3 bg-white rounded-full shadow-lg hover:bg-gray-100 transition"
+                aria-label="Add to favorites"
+              >
+                <Heart
+                  size={24}
+                  className={isFavorited ? "fill-red-500 text-red-500" : "text-gray-600"}
+                />
+              </button>
+            </div>
+
+            {/* Navigation Buttons */}
+            {car.images.length > 1 && (
+              <>
+                <button
+                  onClick={prevImage}
+                  className="absolute left-4 top-1/2 -translate-y-1/2 bg-white/80 hover:bg-white p-2 rounded-full transition"
+                  aria-label="Previous image"
+                >
+                  <ChevronLeft size={24} />
+                </button>
+                <button
+                  onClick={nextImage}
+                  className="absolute right-4 top-1/2 -translate-y-1/2 bg-white/80 hover:bg-white p-2 rounded-full transition"
+                  aria-label="Next image"
+                >
+                  <ChevronRight size={24} />
+                </button>
+              </>
+            )}
+
+            {/* Image Counter */}
+            <div className="absolute bottom-4 right-4 bg-black/60 text-white px-3 py-1 rounded-full text-sm">
+              {currentImageIndex + 1} / {car.images.length}
+            </div>
+          </div>
+
+          {/* Thumbnail Gallery */}
+          {car.images.length > 1 && (
+            <div className="flex gap-3 overflow-x-auto pb-2">
+              {car.images.map((image, index) => (
+                <button
+                  key={index}
+                  onClick={() => setCurrentImageIndex(index)}
+                  className={`flex-shrink-0 w-24 h-24 rounded-lg overflow-hidden border-2 transition ${
+                    index === currentImageIndex ? "border-accent" : "border-gray-200"
+                  }`}
+                >
+                  <img src={image.src} alt={image.alt} className="w-full h-full object-cover" />
+                </button>
+              ))}
+            </div>
+          )}
+        </div>
+
+        <div className="grid md:grid-cols-2 gap-12">
+          {/* Left Column - Specs & Features */}
+          <div>
+            {/* Description */}
+            <div className="mb-8">
+              <h2 className="text-2xl font-bold mb-4">Overview</h2>
+              <p className="text-gray-600 mb-6">{car.description}</p>
+            </div>
+
+            {/* Key Specifications */}
+            <div className="mb-8">
+              <h2 className="text-2xl font-bold mb-6">Key Specifications</h2>
+              <div className="grid grid-cols-2 gap-4">
+                <div className="bg-card p-4 rounded-lg">
+                  <div className="flex items-center gap-2 mb-2">
+                    <Calendar size={20} className="text-accent" />
+                    <span className="text-sm text-gray-600">Year</span>
+                  </div>
+                  <p className="font-semibold">{car.specs.year}</p>
+                </div>
+                <div className="bg-card p-4 rounded-lg">
+                  <div className="flex items-center gap-2 mb-2">
+                    <Gauge size={20} className="text-accent" />
+                    <span className="text-sm text-gray-600">Mileage</span>
+                  </div>
+                  <p className="font-semibold">{car.specs.mileage}</p>
+                </div>
+                <div className="bg-card p-4 rounded-lg">
+                  <div className="flex items-center gap-2 mb-2">
+                    <Fuel size={20} className="text-accent" />
+                    <span className="text-sm text-gray-600">Fuel Type</span>
+                  </div>
+                  <p className="font-semibold">{car.specs.fuelType}</p>
+                </div>
+                <div className="bg-card p-4 rounded-lg">
+                  <div className="flex items-center gap-2 mb-2">
+                    <MapPin size={20} className="text-accent" />
+                    <span className="text-sm text-gray-600">Transmission</span>
+                  </div>
+                  <p className="font-semibold">{car.specs.transmission}</p>
+                </div>
+              </div>
+            </div>
+
+            {/* Additional Specs */}
+            <div className="bg-card p-6 rounded-lg mb-8">
+              <h3 className="text-lg font-bold mb-4">Additional Details</h3>
+              <div className="space-y-3">
+                <div className="flex justify-between">
+                  <span className="text-gray-600">Engine:</span>
+                  <span className="font-semibold">{car.specs.engine}</span>
+                </div>
+                <div className="flex justify-between">
+                  <span className="text-gray-600">Color:</span>
+                  <span className="font-semibold">{car.specs.color}</span>
+                </div>
+              </div>
+            </div>
+          </div>
+
+          {/* Right Column - Features & CTA */}
+          <div>
+            {/* Features */}
+            <div className="mb-8">
+              <h2 className="text-2xl font-bold mb-6">Features & Amenities</h2>
+              <div className="grid grid-cols-2 gap-3">
+                {car.features.map((feature, index) => (
+                  <div key={index} className="flex items-center gap-2 p-3 bg-card rounded-lg">
+                    <div className="w-5 h-5 rounded-full bg-accent flex items-center justify-center flex-shrink-0">
+                      <span className="text-white text-sm">✓</span>
+                    </div>
+                    <span className="text-sm">{feature}</span>
+                  </div>
+                ))}
+              </div>
+            </div>
+
+            {/* Call to Action */}
+            <div className="sticky bottom-0 md:static bg-background space-y-4 p-4 md:p-0 -mx-4 md:mx-0 md:bg-transparent">
+              <button className="w-full bg-accent text-white font-semibold py-4 rounded-lg hover:bg-accent/90 transition">
+                Request Information
+              </button>
+              <button className="w-full border-2 border-accent text-accent font-semibold py-4 rounded-lg hover:bg-accent/5 transition flex items-center justify-center gap-2">
+                <Share2 size={20} />
+                Share Vehicle
+              </button>
+              <button className="w-full bg-card text-foreground font-semibold py-4 rounded-lg hover:bg-gray-100 transition">
+                View Similar Vehicles
+              </button>
+            </div>
+          </div>
+        </div>
+
+        {/* Related Section */}
+        <div className="mt-16 pt-16 border-t">
+          <h2 className="text-3xl font-bold mb-8">Compare Similar Vehicles</h2>
+          <div className="grid md:grid-cols-3 gap-6">
+            {[1, 2, 3].map((i) => (
+              <div key={i} className="bg-card rounded-lg overflow-hidden hover:shadow-lg transition">
+                <div className="aspect-video bg-gray-200"></div>
+                <div className="p-4">
+                  <h3 className="font-bold text-lg mb-2">Similar Model {i}</h3>
+                  <p className="text-accent font-semibold">$XX,XXX</p>
+                  <a href="#" className="mt-4 block text-accent hover:underline font-semibold">
+                    View Details →
+                  </a>
+                </div>
+              </div>
+            ))}
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/src/app/cars/[slug]/page.tsx b/src/app/cars/[slug]/page.tsx
index 0d96832..9ca1cc1 100644
--- a/src/app/cars/[slug]/page.tsx
+++ b/src/app/cars/[slug]/page.tsx
@@ -3,53 +3,33 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
 import HeroSplitTestimonial from "@/components/sections/hero/HeroSplitTestimonial";
-import TextSplitAbout from "@/components/sections/about/TextSplitAbout";
+import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
+import ProductCardTwo from "@/components/sections/product/ProductCardTwo";
+import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
+import BlogCardThree from "@/components/sections/blog/BlogCardThree";
 import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
+import TextSplitAbout from "@/components/sections/about/TextSplitAbout";
+import ContactCTA from "@/components/sections/contact/ContactCTA";
 import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
-import { Car, Zap, Gauge, Award } from "lucide-react";
+import Link from "next/link";
+import {
+  Car,
+  Zap,
+  Award,
+  Sparkles,
+  Building2,
+  History,
+  Globe,
+  Mail,
+} from "lucide-react";
 
-export default function CarDetailPage() {
+export default function CarPage({ params }: { params: { slug: string } }) {
   const navItems = [
-    { name: "Search", id: "search" },
-    { name: "Browse", id: "browse" },
-    { name: "Compare", id: "compare" },
-    { name: "Timeline", id: "timeline" },
-    { name: "About", id: "about" },
-  ];
-
-  const footerColumns = [
-    {
-      items: [
-        { label: "Search Database", href: "/search" },
-        { label: "Browse Vehicles", href: "/browse" },
-        { label: "Compare Cars", href: "/compare" },
-        { label: "Timeline Explorer", href: "/timeline" },
-      ],
-    },
-    {
-      items: [
-        { label: "Brand Directory", href: "/brands" },
-        { label: "Model Guide", href: "/models" },
-        { label: "Specifications", href: "/specs" },
-        { label: "Production Data", href: "/production" },
-      ],
-    },
-    {
-      items: [
-        { label: "About Us", href: "/about" },
-        { label: "Help & Support", href: "/help" },
-        { label: "Contact", href: "/contact" },
-        { label: "Contribute Data", href: "/contribute" },
-      ],
-    },
-    {
-      items: [
-        { label: "Privacy Policy", href: "/privacy" },
-        { label: "Terms of Service", href: "/terms" },
-        { label: "Data Attribution", href: "/attribution" },
-        { label: "Sitemap", href: "/sitemap" },
-      ],
-    },
+    { name: "Search", id: "/search" },
+    { name: "Browse", id: "/browse" },
+    { name: "Compare", id: "/compare" },
+    { name: "Timeline", id: "/timeline" },
+    { name: "About", id: "/about" },
   ];
 
   return (
@@ -59,7 +39,7 @@ export default function CarDetailPage() {
       borderRadius="pill"
       contentWidth="compact"
       sizing="largeSmallSizeMediumTitles"
-      background="aurora"
+      background="circleGradient"
       cardStyle="solid"
       primaryButtonStyle="gradient"
       secondaryButtonStyle="solid"
@@ -67,116 +47,294 @@ export default function CarDetailPage() {
     >
       <div id="nav" data-section="nav">
         <NavbarStyleFullscreen
-          navItems={navItems}
+          navItems={[
+            { name: "Search", id: "/search" },
+            { name: "Browse", id: "/browse" },
+            { name: "Compare", id: "/compare" },
+            { name: "Timeline", id: "/timeline" },
+            { name: "About", id: "/about" },
+          ]}
           brandName="AutoArchive"
           bottomLeftText="Explore Automotive History"
           bottomRightText="1886 to Present"
         />
       </div>
 
-      <div id="car-hero" data-section="car-hero">
+      <div id="hero" data-section="hero">
         <HeroSplitTestimonial
-          title="Porsche 911: The Iconic Sports Car"
-          description="From its 1963 debut to today, the Porsche 911 stands as the world's most enduring sports car. Explore 60+ years of continuous production, evolution, and legendary performance."
-          tag="Automotive Icon"
+          title="Explore Every Car Ever Made"
+          description="The world's most complete automotive database. Search, compare, and discover vehicles from 1886 to today across every brand, model, generation, and variant."
+          tag="Automotive Encyclopedia"
           tagIcon={Car}
-          tagAnimation="entrance-slide"
-          background={{ variant: "aurora" }}
-          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-timeless-porsche-911-silver-or-charcoa-1772823291321-59c5e153.png?_wi=4"
-          imageAlt="Porsche 911 Classic Profile"
-          mediaAnimation="entrance-slide"
+          tagAnimation="blur-reveal"
+          background={{ variant: "plain" }}
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-modern-sleek-automotive-database-inter-1772823292340-23f02fb5.png?_wi=2"
+          imageAlt="AutoArchive Database Interface"
+          mediaAnimation="blur-reveal"
           imagePosition="right"
           testimonials={[
             {
-              name: "Automotive Journalist",
-              handle: "Car Magazine Editor",
-              testimonial: "The 911 is not just a car, it's a phenomenon. Over 1 million produced and still evolving.",
-              rating: 5,
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823292590-3867fd28.png",
-            },
+              name: "Racing Historian",              handle: "Classic Car Enthusiast",              testimonial:
+                "The most comprehensive car database I've ever seen. Finally, one place for all automotive history.",              rating: 5,
+              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/portrait-of-a-knowledgeable-automotive-h-1772823290619-648d0b48.png?_wi=2"},
             {
-              name: "Racing Driver",
-              handle: "Performance Expert",
-              testimonial: "The 911's handling balance and engineering are unmatched. It's the benchmark for sports cars.",
-              rating: 5,
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823290751-a93bf9d8.png",
-            },
+              name: "Automotive Designer",              handle: "Classic Car Enthusiast",              testimonial:
+                "Perfect for researching design evolution and model lineages across decades.",              rating: 5,
+              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/portrait-of-a-creative-automotive-design-1772823292200-f0afd2ae.png?_wi=2"},
             {
-              name: "Design Historian",
-              handle: "Automotive Design Expert",
-              testimonial: "The 911's silhouette is timeless. Every generation respects the original while pushing design forward.",
-              rating: 5,
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823290583-29073bf8.png?_wi=2",
-            },
+              name: "Car Collector",              handle: "Vintage Vehicle Curator",              testimonial:
+                "An invaluable resource for understanding specifications and production years.",              rating: 5,
+              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/portrait-of-a-passionate-car-collector-r-1772823290895-3d866aea.png?_wi=2"},
+            {
+              name: "Automotive Journalist",              handle: "Car Magazine Editor",              testimonial:
+                "Research has never been easier. Every fact, spec, and timeline at my fingertips.",              rating: 5,
+              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/portrait-of-an-automotive-journalist-con-1772823290598-44ed854b.png?_wi=2"},
           ]}
           testimonialRotationInterval={5000}
           buttons={[
-            { text: "Explore Models", href: "/browse" },
-            { text: "View Specifications", href: "/specs" },
+            { text: "Start Searching", href: "/search" },
+            { text: "Browse Database", href: "/browse" },
           ]}
-          buttonAnimation="entrance-slide"
+          buttonAnimation="blur-reveal"
           useInvertedBackground={false}
         />
       </div>
 
-      <div id="car-details" data-section="car-details">
-        <TextSplitAbout
-          title="Porsche 911 Legacy"
-          description={[
-            "The Porsche 911 debuted at the 1963 Frankfurt International Motor Show as the successor to the 356. With its rear-mounted, air-cooled flat-six engine, it established a formula that has endured for over 60 years.",
-            "Every generation—from the original 2.0L (130 hp) to today's turbocharged variants producing over 600 horsepower—has maintained the fundamental 911 characteristics: rear-wheel drive, exceptional handling, and pure driver engagement.",
-            "With 1 million+ vehicles produced across 11 generations (1963-2024), the 911 represents Porsche's commitment to continuous improvement while preserving the core engineering principles that made it an automotive legend.",
-          ]}
-          showBorder={true}
+      <div id="popular-brands" data-section="popular-brands">
+        <SocialProofOne
+          title="Trusted by Automotive Enthusiasts Worldwide"
+          description="Access the largest collection of verified automotive data featuring every major manufacturer and brand"
+          tag="Featured Brands"
+          tagAnimation="blur-reveal"
+          textboxLayout="default"
           useInvertedBackground={false}
-          buttons={[
-            { text: "Compare Generations", href: "/compare" },
-            { text: "Browse All Models", href: "/browse" },
-          ]}
-          buttonAnimation="entrance-slide"
+          names={[
+            "Ferrari",            "Porsche",            "BMW",            "Mercedes-Benz",            "Lamborghini",            "Bugatti",            "Rolls-Royce",            "Aston Martin",            "McLaren",            "Tesla"]}
+          speed={40}
+          showCard={true}
         />
       </div>
 
-      <div id="car-specs" data-section="car-specs">
+      <div id="featured-vehicles" data-section="featured-vehicles">
+        <ProductCardTwo
+          title="Featured Legendary Vehicles"
+          description="Iconic cars that shaped automotive history"
+          tag="Heritage Collection"
+          tagAnimation="blur-reveal"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          animationType="slide-up"
+          gridVariant="four-items-2x2-equal-grid"
+          products={[
+            {
+              id: "1",              brand: "Ferrari",              name: "Ferrari 250 GTO",              price: "1962-1964",              rating: 5,
+              reviewCount: "Legendary",              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-pristine-ferrari-250-gto-from-1962-196-1772823293817-62111fec.png?_wi=2",              imageAlt: "Ferrari 250 GTO 1962"},
+            {
+              id: "2",              brand: "Porsche",              name: "Porsche 911",              price: "1963-Present",              rating: 5,
+              reviewCount: "Iconic",              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-timeless-porsche-911-silver-or-charcoa-1772823291321-59c5e153.png?_wi=2",              imageAlt: "Porsche 911 Classic"},
+            {
+              id: "3",              brand: "Jaguar",              name: "Jaguar E-Type",              price: "1961-1974",              rating: 5,
+              reviewCount: "Historic",              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-beautiful-jaguar-e-type-from-1961-1974-1772823292102-305f7185.png?_wi=2",              imageAlt: "Jaguar E-Type"},
+            {
+              id: "4",              brand: "BMW",              name: "BMW 2002",              price: "1968-1976",              rating: 5,
+              reviewCount: "Classic",              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-classic-bmw-2002-from-1968-1976-bright-1772823292733-3909ad83.png?_wi=2",              imageAlt: "BMW 2002"},
+          ]}
+        />
+      </div>
+
+      <div id="browse-decade" data-section="browse-decade">
+        <FeatureCardTwentyFive
+          title="Browse by Era"
+          description="Explore vehicles organized by historical decade with complete production timelines"
+          tag="Timeline Explorer"
+          tagAnimation="blur-reveal"
+          animationType="depth-3d"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          features={[
+            {
+              title: "The Golden Age (1900-1920s)",              description:
+                "Early automobiles, pioneering manufacturers, and the birth of motoring",              icon: Zap,
+              mediaItems: [
+                {
+                  imageSrc:
+                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/early-1900s-automobiles-brass-and-iron-c-1772823291918-1a562875.png?_wi=2",                  imageAlt: "Early 1900s vehicles"},
+                {
+                  imageSrc:
+                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/collection-of-classic-automobiles-from-1-1772823292369-d23ee272.png?_wi=2",                  imageAlt: "Classic automobiles vintage"},
+              ],
+            },
+            {
+              title: "The Classics Era (1930-1950s)",              description:
+                "Art deco styling, post-war innovation, and the golden age of design",              icon: Award,
+              mediaItems: [
+                {
+                  imageSrc:
+                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1930s-1950s-classic-cars-showcasing-art--1772823292276-01b2e0ec.png?_wi=2",                  imageAlt: "1930s-1950s classic cars"},
+                {
+                  imageSrc:
+                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/post-world-war-ii-automobiles-from-1945--1772823292672-0ffd3a1d.png?_wi=2",                  imageAlt: "Post-war automobile design"},
+              ],
+            },
+            {
+              title: "The Modern Era (1960-1980s)",              description:
+                "Performance revolution, muscle cars, and engineering breakthroughs",              icon: Sparkles,
+              mediaItems: [
+                {
+                  imageSrc:
+                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1960s-muscle-cars-and-performance-vehicl-1772823292410-79b6e429.png?_wi=2",                  imageAlt: "1960s muscle cars"},
+                {
+                  imageSrc:
+                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1980s-performance-vehicles-and-supercars-1772823291859-2f85f5af.png?_wi=2",                  imageAlt: "1980s performance vehicles"},
+              ],
+            },
+            {
+              title: "Contemporary (1990-2024)",              description:
+                "Digital age, electric vehicles, autonomous technology, and modern innovation",              icon: Zap,
+              mediaItems: [
+                {
+                  imageSrc:
+                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1990s-modern-cars-featuring-sleek-sports-1772823291648-3191a1df.png?_wi=2",                  imageAlt: "1990s modern cars"},
+                {
+                  imageSrc:
+                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/modern-2020s-electric-and-autonomous-veh-1772823292629-c57b318c.png?_wi=2",                  imageAlt: "Electric and autonomous vehicles"},
+              ],
+            },
+          ]}
+        />
+      </div>
+
+      <div id="legendary-cars" data-section="legendary-cars">
+        <BlogCardThree
+          title="Legendary Automotive Stories"
+          description="Discover the history, engineering, and cultural impact of the world's most iconic vehicles"
+          tag="Automotive Heritage"
+          tagAnimation="blur-reveal"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          animationType="slide-up"
+          carouselMode="buttons"
+          blogs={[
+            {
+              id: "1",              category: "Performance History",              title: "The Ferrari 250 GTO: The Car That Won Le Mans",              excerpt: "Explore how this race car became the most valuable car in the world",              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/ferrari-250-gto-iconic-red-racing-car-in-1772823292116-a7e77200.png?_wi=2",              imageAlt: "Ferrari 250 GTO",              authorName: "Automotive Historian",              authorAvatar:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823290144-6017089c.png",              date: "Featured Article"},
+            {
+              id: "2",              category: "Design Evolution",              title: "The Porsche 911: 60 Years of Iconic Design",              excerpt: "How one sports car shaped the future of automotive design",              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/porsche-911-models-across-different-gene-1772823292219-b0857470.png?_wi=2",              imageAlt: "Porsche 911 Through Decades",              authorName: "Design Expert",              authorAvatar:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823290583-29073bf8.png",              date: "Featured Article"},
+            {
+              id: "3",              category: "Innovation",              title: "The Jaguar E-Type: Beauty and Performance",              excerpt: "Why Enzo Ferrari called it the most beautiful car ever made",              imageSrc:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/jaguar-e-type-in-stunning-profile-emphas-1772823290729-6dd39021.png?_wi=2",              imageAlt: "Jaguar E-Type Design",              authorName: "Automotive Journalist",              authorAvatar:
+                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823292590-3867fd28.png",              date: "Featured Article"},
+          ]}
+        />
+      </div>
+
+      <div id="metrics" data-section="metrics">
         <MetricCardThree
-          metrics={[
-            {
-              id: "1",
-              icon: Award,
-              title: "Production Years",
-              value: "1963-2024",
-            },
-            {
-              id: "2",
-              icon: Car,
-              title: "Units Produced",
-              value: "1M+",
-            },
-            {
-              id: "3",
-              icon: Zap,
-              title: "Peak Horsepower",
-              value: "630 hp",
-            },
-            {
-              id: "4",
-              icon: Gauge,
-              title: "Top Speed",
-              value: "211 mph",
-            },
-          ]}
-          title="Porsche 911 by the Numbers"
-          description="Spanning six decades of continuous production and evolution"
-          tag="Performance Data"
-          tagAnimation="entrance-slide"
+          title="AutoArchive by the Numbers"
+          description="The world's most comprehensive automotive database at your fingertips"
+          tag="Database Statistics"
+          tagAnimation="blur-reveal"
           textboxLayout="default"
           useInvertedBackground={false}
           animationType="scale-rotate"
+          metrics={[
+            {
+              id: "1",              icon: Building2,
+              title: "Manufacturers",              value: "2,000+"},
+            {
+              id: "2",              icon: Car,
+              title: "Vehicle Models",              value: "50,000+"},
+            {
+              id: "3",              icon: History,
+              title: "Years Covered",              value: "138 Years"},
+            {
+              id: "4",              icon: Globe,
+              title: "Countries",              value: "195"},
+          ]}
         />
       </div>
 
-      <div id="car-footer" data-section="car-footer">
-        <FooterLogoEmphasis columns={footerColumns} logoText="AutoArchive" />
+      <div id="about" data-section="about">
+        <TextSplitAbout
+          title="About AutoArchive"
+          description={[
+            "AutoArchive is the world's most comprehensive online car encyclopedia and search engine. Our mission is to preserve and share automotive history, from the earliest automobiles of 1886 to the latest models of today.",            "We've compiled extensive data on every major manufacturer, model generation, variant, and specification. Whether you're a collector, historian, designer, or enthusiast, AutoArchive provides the definitive source for automotive knowledge.",            "Our database spans 138 years of automotive innovation, featuring technical specifications, performance metrics, production years, engine options, transmission data, and historical context for vehicles from around the world."]}
+          showBorder={true}
+          useInvertedBackground={false}
+          buttons={[
+            { text: "Explore Database", href: "/search" },
+            { text: "Browse Collections", href: "/browse" },
+          ]}
+          buttonAnimation="blur-reveal"
+        />
+      </div>
+
+      <div id="cta" data-section="cta">
+        <ContactCTA
+          tag="Start Exploring"
+          tagIcon={Zap}
+          tagAnimation="blur-reveal"
+          title="Ready to Discover Automotive History?"
+          description="Join thousands of enthusiasts, collectors, historians, and professionals using AutoArchive. Search millions of vehicles, compare specifications, and explore the complete history of automobiles."
+          buttons={[
+            { text: "Begin Your Search", href: "/search" },
+            { text: "Browse All Brands", href: "/browse" },
+          ]}
+          buttonAnimation="blur-reveal"
+          background={{ variant: "plain" }}
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterLogoEmphasis
+          logoText="AutoArchive"
+          columns={[
+            {
+              items: [
+                { label: "Search Database", href: "/search" },
+                { label: "Browse Vehicles", href: "/browse" },
+                { label: "Compare Cars", href: "/compare" },
+                { label: "Timeline Explorer", href: "/timeline" },
+              ],
+            },
+            {
+              items: [
+                { label: "Brand Directory", href: "/brands" },
+                { label: "Model Guide", href: "/models" },
+                { label: "Specifications", href: "/specs" },
+                { label: "Production Data", href: "/production" },
+              ],
+            },
+            {
+              items: [
+                { label: "About Us", href: "/" },
+                { label: "Help & Support", href: "/help" },
+                { label: "Contact", href: "/contact" },
+                { label: "Contribute Data", href: "/contribute" },
+              ],
+            },
+            {
+              items: [
+                { label: "Privacy Policy", href: "/privacy" },
+                { label: "Terms of Service", href: "/terms" },
+                { label: "Data Attribution", href: "/attribution" },
+                { label: "Sitemap", href: "/sitemap" },
+              ],
+            },
+          ]}
+        />
       </div>
     </ThemeProvider>
   );
diff --git a/src/app/compare/page.tsx b/src/app/compare/page.tsx
index 3154e17..d3c5af7 100644
--- a/src/app/compare/page.tsx
+++ b/src/app/compare/page.tsx
@@ -1,129 +1,25 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
-import BlogCardThree from "@/components/sections/blog/BlogCardThree";
-import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
-import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
-import Link from "next/link";
-import { Building2, Car, History, Globe } from "lucide-react";
-
-export default function ComparePage() {
-  const navItems = [
-    { name: "Search", id: "/" },
-    { name: "Browse", id: "/browse" },
-    { name: "Compare", id: "/compare" },
-    { name: "Timeline", id: "/" },
-    { name: "About", id: "/" },
-  ];
-
-  const footerColumns = [
-    {
-      items: [
-        { label: "Search Database", href: "/" },
-        { label: "Browse Vehicles", href: "/browse" },
-        { label: "Compare Cars", href: "/compare" },
-        { label: "Timeline Explorer", href: "/" },
-      ],
-    },
-    {
-      items: [
-        { label: "Brand Directory", href: "/" },
-        { label: "Model Guide", href: "/" },
-        { label: "Specifications", href: "/" },
-        { label: "Production Data", href: "/" },
-      ],
-    },
-    {
-      items: [
-        { label: "About Us", href: "/" },
-        { label: "Help & Support", href: "/" },
-        { label: "Contact", href: "/" },
-        { label: "Contribute Data", href: "/" },
-      ],
-    },
-    {
-      items: [
-        { label: "Privacy Policy", href: "/" },
-        { label: "Terms of Service", href: "/" },
-        { label: "Data Attribution", href: "/" },
-        { label: "Sitemap", href: "/" },
-      ],
-    },
-  ];
 
+const ComparePage = () => {
   return (
     <ThemeProvider
-      defaultButtonVariant="shift-hover"
+      defaultButtonVariant="hover-magnetic"
       defaultTextAnimation="entrance-slide"
-      borderRadius="pill"
-      contentWidth="compact"
-      sizing="largeSmallSizeMediumTitles"
-      background="aurora"
-      cardStyle="solid"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="medium"
+      background="circleGradient"
+      cardStyle="glass-elevated"
       primaryButtonStyle="gradient"
-      secondaryButtonStyle="solid"
-      headingFontWeight="extrabold"
+      secondaryButtonStyle="glass"
+      headingFontWeight="normal"
     >
-      <div id="nav" data-section="nav">
-        <NavbarStyleFullscreen
-          navItems={navItems}
-          brandName="AutoArchive"
-          bottomLeftText="Explore Automotive History"
-          bottomRightText="1886 to Present"
-        />
-      </div>
-
-      <div id="metrics" data-section="metrics">
-        <MetricCardThree
-          title="AutoArchive by the Numbers"
-          description="The world's most comprehensive automotive database at your fingertips"
-          tag="Database Statistics"
-          tagAnimation="blur-reveal"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          animationType="scale-rotate"
-          metrics={[
-            {
-              id: "1",              icon: Building2,
-              title: "Manufacturers",              value: "2,000+"},
-            {
-              id: "2",              icon: Car,
-              title: "Vehicle Models",              value: "50,000+"},
-            {
-              id: "3",              icon: History,
-              title: "Years Covered",              value: "138 Years"},
-            {
-              id: "4",              icon: Globe,
-              title: "Countries",              value: "195"},
-          ]}
-        />
-      </div>
-
-      <div id="legendary-cars" data-section="legendary-cars">
-        <BlogCardThree
-          title="Legendary Automotive Stories"
-          description="Discover the history, engineering, and cultural impact of the world's most iconic vehicles"
-          tag="Automotive Heritage"
-          tagAnimation="blur-reveal"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          animationType="slide-up"
-          carouselMode="buttons"
-          blogs={[
-            {
-              id: "1",              category: "Performance History",              title: "The Ferrari 250 GTO: The Car That Won Le Mans",              excerpt: "Explore how this race car became the most valuable car in the world",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/ferrari-250-gto-iconic-red-racing-car-in-1772823292116-a7e77200.png",              imageAlt: "Ferrari 250 GTO",              authorName: "Automotive Historian",              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823290144-6017089c.png",              date: "Featured Article"},
-            {
-              id: "2",              category: "Design Evolution",              title: "The Porsche 911: 60 Years of Iconic Design",              excerpt: "How one sports car shaped the future of automotive design",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/porsche-911-models-across-different-gene-1772823292219-b0857470.png",              imageAlt: "Porsche 911 Through Decades",              authorName: "Design Expert",              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823290583-29073bf8.png",              date: "Featured Article"},
-            {
-              id: "3",              category: "Innovation",              title: "The Jaguar E-Type: Beauty and Performance",              excerpt: "Why Enzo Ferrari called it the most beautiful car ever made",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/jaguar-e-type-in-stunning-profile-emphas-1772823290729-6dd39021.png",              imageAlt: "Jaguar E-Type Design",              authorName: "Automotive Journalist",              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823292590-3867fd28.png",              date: "Featured Article"},
-          ]}
-        />
-      </div>
-
-      <div id="footer" data-section="footer">
-        <FooterLogoEmphasis logoText="AutoArchive" columns={footerColumns} />
-      </div>
+      <div id="nav" data-section="nav" />
+      <div id="compare" data-section="compare" />
     </ThemeProvider>
   );
-}
\ No newline at end of file
+};
+
+export default ComparePage;
diff --git a/src/app/details/[id]/page.tsx b/src/app/details/[id]/page.tsx
new file mode 100644
index 0000000..bac397b
--- /dev/null
+++ b/src/app/details/[id]/page.tsx
@@ -0,0 +1,25 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+
+const DetailsPage = () => {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="hover-magnetic"
+      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" />
+      <div id="details" data-section="details" />
+    </ThemeProvider>
+  );
+};
+
+export default DetailsPage;
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 320c486..a2eb1e6 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,73 +1,22 @@
 import type { Metadata } from "next";
-import { Halant } from "next/font/google";
-import { Inter } from "next/font/google";
-import { Lato } from "next/font/google";
-import "./globals.css";
-import { ServiceWrapper } from "@/components/ServiceWrapper";
-import Tag from "@/tag/Tag";
-
-const halant = Halant({
-  variable: "--font-halant",
-  subsets: ["latin"],
-  weight: ["300", "400", "500", "600", "700"],
-});
-
-const inter = Inter({
-  variable: "--font-inter",
-  subsets: ["latin"],
-});
-
-const lato = Lato({
-  variable: "--font-lato",
-  subsets: ["latin"],
-  weight: ["100", "300", "400", "700", "900"],
-});
+import { Lenis } from "./providers";
 
 export const metadata: Metadata = {
-  title: "AutoArchive - Complete Car Database & Automotive Encyclopedia",
-  description: "Search and explore every car ever made from 1886 to present. Access 2000+ manufacturers, 50,000+ models, technical specs, and automotive history.",
-  keywords: "car database, automotive encyclopedia, vehicle search, car specifications, manufacturer database, automotive history, vintage cars, modern vehicles",
-  robots: {
-    index: true,
-    follow: true,
-  },
-  openGraph: {
-    title: "AutoArchive - The World's Most Complete Car Database",
-    description: "Explore every car ever made. Search across 2000+ manufacturers and 50,000+ models. The ultimate automotive encyclopedia.",
-    url: "https://autoarchive.example.com",
-    siteName: "AutoArchive",
-    type: "website",
-    images: [
-      {
-        url: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-modern-sleek-automotive-database-inter-1772823292340-23f02fb5.png",
-        alt: "AutoArchive Database Interface",
-      },
-    ],
-  },
-  twitter: {
-    card: "summary_large_image",
-    title: "AutoArchive - Complete Car Database",
-    description: "Search 50,000+ cars from 1886 to today. The world's most comprehensive automotive encyclopedia.",
-    images: [
-      "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-modern-sleek-automotive-database-inter-1772823292340-23f02fb5.png",
-    ],
-  },
+  title: "Create Next App",  description: "Generated by create next app"
 };
 
 export default function RootLayout({
   children,
-}: Readonly<{
+}: {
   children: React.ReactNode;
-}>) {
+}) {
   return (
     <html lang="en" suppressHydrationWarning>
-      <ServiceWrapper>
-        <body
-          className={`${halant.variable} ${inter.variable} ${lato.variable} antialiased`}
-        >
-          <Tag />
+      <body>
+        <Lenis>
           {children}
-        
+        </Lenis>
+      
         <script
           dangerouslySetInnerHTML={{
             __html: `
@@ -1435,7 +1384,6 @@ export default function RootLayout({
           }}
         />
       </body>
-      </ServiceWrapper>
     </html>
   );
-}
\ No newline at end of file
+}
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 5fc286d..c6cdac7 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,386 +1,10 @@
 "use client";
 
-import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
-import HeroSplitTestimonial from "@/components/sections/hero/HeroSplitTestimonial";
-import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
-import ProductCardTwo from "@/components/sections/product/ProductCardTwo";
-import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
-import BlogCardThree from "@/components/sections/blog/BlogCardThree";
-import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
-import TextSplitAbout from "@/components/sections/about/TextSplitAbout";
-import FaqSplitMedia from "@/components/sections/faq/FaqSplitMedia";
-import ContactCTA from "@/components/sections/contact/ContactCTA";
-import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
-import Link from "next/link";
-import {
-  Car,
-  Zap,
-  Award,
-  Sparkles,
-  Building2,
-  History,
-  Globe,
-  Mail,
-} from "lucide-react";
-
-export default function HomePage() {
-  const navItems = [
-    { name: "Search", id: "/search" },
-    { name: "Browse", id: "/browse" },
-    { name: "Compare", id: "/compare" },
-    { name: "Timeline", id: "/timeline" },
-    { name: "About", id: "/about" },
-  ];
-
+export default function Home() {
   return (
-    <ThemeProvider
-      defaultButtonVariant="shift-hover"
-      defaultTextAnimation="entrance-slide"
-      borderRadius="pill"
-      contentWidth="compact"
-      sizing="largeSmallSizeMediumTitles"
-      background="aurora"
-      cardStyle="solid"
-      primaryButtonStyle="gradient"
-      secondaryButtonStyle="solid"
-      headingFontWeight="extrabold"
-    >
-      <div id="nav" data-section="nav">
-        <NavbarStyleFullscreen
-          navItems={[
-            { name: "Search", id: "/search" },
-            { name: "Browse", id: "/browse" },
-            { name: "Compare", id: "/compare" },
-            { name: "Timeline", id: "/timeline" },
-            { name: "About", id: "/about" },
-          ]}
-          brandName="AutoArchive"
-          bottomLeftText="Explore Automotive History"
-          bottomRightText="1886 to Present"
-        />
-      </div>
-
-      <div id="hero" data-section="hero">
-        <HeroSplitTestimonial
-          title="Explore Every Car Ever Made"
-          description="The world's most complete automotive database. Search, compare, and discover vehicles from 1886 to today across every brand, model, generation, and variant."
-          tag="Automotive Encyclopedia"
-          tagIcon={Car}
-          tagAnimation="blur-reveal"
-          background={{ variant: "plain" }}
-          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-modern-sleek-automotive-database-inter-1772823292340-23f02fb5.png"
-          imageAlt="AutoArchive Database Interface"
-          mediaAnimation="blur-reveal"
-          imagePosition="right"
-          testimonials={[
-            {
-              name: "Racing Historian",              handle: "Classic Car Enthusiast",              testimonial:
-                "The most comprehensive car database I've ever seen. Finally, one place for all automotive history.",              rating: 5,
-              imageSrc:
-                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/portrait-of-a-knowledgeable-automotive-h-1772823290619-648d0b48.png"},
-            {
-              name: "Automotive Designer",              handle: "Classic Car Enthusiast",              testimonial:
-                "Perfect for researching design evolution and model lineages across decades.",              rating: 5,
-              imageSrc:
-                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/portrait-of-a-creative-automotive-design-1772823292200-f0afd2ae.png"},
-            {
-              name: "Car Collector",              handle: "Vintage Vehicle Curator",              testimonial:
-                "An invaluable resource for understanding specifications and production years.",              rating: 5,
-              imageSrc:
-                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/portrait-of-a-passionate-car-collector-r-1772823290895-3d866aea.png"},
-            {
-              name: "Automotive Journalist",              handle: "Car Magazine Editor",              testimonial:
-                "Research has never been easier. Every fact, spec, and timeline at my fingertips.",              rating: 5,
-              imageSrc:
-                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/portrait-of-an-automotive-journalist-con-1772823290598-44ed854b.png"},
-          ]}
-          testimonialRotationInterval={5000}
-          buttons={[
-            { text: "Start Searching", href: "/search" },
-            { text: "Browse Database", href: "/browse" },
-          ]}
-          buttonAnimation="blur-reveal"
-          useInvertedBackground={false}
-        />
-      </div>
-
-      <div id="popular-brands" data-section="popular-brands">
-        <SocialProofOne
-          title="Trusted by Automotive Enthusiasts Worldwide"
-          description="Access the largest collection of verified automotive data featuring every major manufacturer and brand"
-          tag="Featured Brands"
-          tagAnimation="blur-reveal"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          names={[
-            "Ferrari",            "Porsche",            "BMW",            "Mercedes-Benz",            "Lamborghini",            "Bugatti",            "Rolls-Royce",            "Aston Martin",            "McLaren",            "Tesla"]}
-          speed={40}
-          showCard={true}
-        />
-      </div>
-
-      <div id="featured-vehicles" data-section="featured-vehicles">
-        <ProductCardTwo
-          title="Featured Legendary Vehicles"
-          description="Iconic cars that shaped automotive history"
-          tag="Heritage Collection"
-          tagAnimation="blur-reveal"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          animationType="slide-up"
-          gridVariant="four-items-2x2-equal-grid"
-          products={[
-            {
-              id: "1",              brand: "Ferrari",              name: "Ferrari 250 GTO",              price: "1962-1964",              rating: 5,
-              reviewCount: "Legendary",              imageSrc:
-                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-pristine-ferrari-250-gto-from-1962-196-1772823293817-62111fec.png",              imageAlt: "Ferrari 250 GTO 1962"},
-            {
-              id: "2",              brand: "Porsche",              name: "Porsche 911",              price: "1963-Present",              rating: 5,
-              reviewCount: "Iconic",              imageSrc:
-                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-timeless-porsche-911-silver-or-charcoa-1772823291321-59c5e153.png",              imageAlt: "Porsche 911 Classic"},
-            {
-              id: "3",              brand: "Jaguar",              name: "Jaguar E-Type",              price: "1961-1974",              rating: 5,
-              reviewCount: "Historic",              imageSrc:
-                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-beautiful-jaguar-e-type-from-1961-1974-1772823292102-305f7185.png",              imageAlt: "Jaguar E-Type"},
-            {
-              id: "4",              brand: "BMW",              name: "BMW 2002",              price: "1968-1976",              rating: 5,
-              reviewCount: "Classic",              imageSrc:
-                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-classic-bmw-2002-from-1968-1976-bright-1772823292733-3909ad83.png",              imageAlt: "BMW 2002"},
-          ]}
-        />
-      </div>
-
-      <div id="browse-decade" data-section="browse-decade">
-        <FeatureCardTwentyFive
-          title="Browse by Era"
-          description="Explore vehicles organized by historical decade with complete production timelines"
-          tag="Timeline Explorer"
-          tagAnimation="blur-reveal"
-          animationType="depth-3d"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          features={[
-            {
-              title: "The Golden Age (1900-1920s)",              description:
-                "Early automobiles, pioneering manufacturers, and the birth of motoring",              icon: Zap,
-              mediaItems: [
-                {
-                  imageSrc:
-                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/early-1900s-automobiles-brass-and-iron-c-1772823291918-1a562875.png",                  imageAlt: "Early 1900s vehicles"},
-                {
-                  imageSrc:
-                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/collection-of-classic-automobiles-from-1-1772823292369-d23ee272.png",                  imageAlt: "Classic automobiles vintage"},
-              ],
-            },
-            {
-              title: "The Classics Era (1930-1950s)",              description:
-                "Art deco styling, post-war innovation, and the golden age of design",              icon: Award,
-              mediaItems: [
-                {
-                  imageSrc:
-                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1930s-1950s-classic-cars-showcasing-art--1772823292276-01b2e0ec.png",                  imageAlt: "1930s-1950s classic cars"},
-                {
-                  imageSrc:
-                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/post-world-war-ii-automobiles-from-1945--1772823292672-0ffd3a1d.png",                  imageAlt: "Post-war automobile design"},
-              ],
-            },
-            {
-              title: "The Modern Era (1960-1980s)",              description:
-                "Performance revolution, muscle cars, and engineering breakthroughs",              icon: Sparkles,
-              mediaItems: [
-                {
-                  imageSrc:
-                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1960s-muscle-cars-and-performance-vehicl-1772823292410-79b6e429.png",                  imageAlt: "1960s muscle cars"},
-                {
-                  imageSrc:
-                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1980s-performance-vehicles-and-supercars-1772823291859-2f85f5af.png",                  imageAlt: "1980s performance vehicles"},
-              ],
-            },
-            {
-              title: "Contemporary (1990-2024)",              description:
-                "Digital age, electric vehicles, autonomous technology, and modern innovation",              icon: Zap,
-              mediaItems: [
-                {
-                  imageSrc:
-                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1990s-modern-cars-featuring-sleek-sports-1772823291648-3191a1df.png",                  imageAlt: "1990s modern cars"},
-                {
-                  imageSrc:
-                    "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/modern-2020s-electric-and-autonomous-veh-1772823292629-c57b318c.png",                  imageAlt: "Electric and autonomous vehicles"},
-              ],
-            },
-          ]}
-        />
-      </div>
-
-      <div id="legendary-cars" data-section="legendary-cars">
-        <BlogCardThree
-          title="Legendary Automotive Stories"
-          description="Discover the history, engineering, and cultural impact of the world's most iconic vehicles"
-          tag="Automotive Heritage"
-          tagAnimation="blur-reveal"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          animationType="slide-up"
-          carouselMode="buttons"
-          blogs={[
-            {
-              id: "1",              category: "Performance History",              title: "The Ferrari 250 GTO: The Car That Won Le Mans",              excerpt: "Explore how this race car became the most valuable car in the world",              imageSrc:
-                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/ferrari-250-gto-iconic-red-racing-car-in-1772823292116-a7e77200.png",              imageAlt: "Ferrari 250 GTO",              authorName: "Automotive Historian",              authorAvatar:
-                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823290144-6017089c.png",              date: "Featured Article"},
-            {
-              id: "2",              category: "Design Evolution",              title: "The Porsche 911: 60 Years of Iconic Design",              excerpt: "How one sports car shaped the future of automotive design",              imageSrc:
-                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/porsche-911-models-across-different-gene-1772823292219-b0857470.png",              imageAlt: "Porsche 911 Through Decades",              authorName: "Design Expert",              authorAvatar:
-                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823290583-29073bf8.png",              date: "Featured Article"},
-            {
-              id: "3",              category: "Innovation",              title: "The Jaguar E-Type: Beauty and Performance",              excerpt: "Why Enzo Ferrari called it the most beautiful car ever made",              imageSrc:
-                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/jaguar-e-type-in-stunning-profile-emphas-1772823290729-6dd39021.png",              imageAlt: "Jaguar E-Type Design",              authorName: "Automotive Journalist",              authorAvatar:
-                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823292590-3867fd28.png",              date: "Featured Article"},
-            {
-              id: "4",              category: "Engineering",              title: "BMW 2002: The Birth of the Sports Sedan",              excerpt: "How a small car changed everything about performance motoring",              imageSrc:
-                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/bmw-2002-sports-sedan-representing-the-b-1772823292072-11f22c8a.png",              imageAlt: "BMW 2002 Legacy",              authorName: "Technical Expert",              authorAvatar:
-                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-a-tech-1772823290751-a93bf9d8.png",              date: "Featured Article"},
-            {
-              id: "5",              category: "Modern Era",              title: "Tesla Model S: The Electric Revolution",              excerpt: "How one car reshaped the entire automotive industry",              imageSrc:
-                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/tesla-model-s-or-modern-tesla-electric-v-1772823291685-64082b06.png",              imageAlt: "Tesla Model S Modern",              authorName: "Tech Analyst",              authorAvatar:
-                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823292611-51911370.png",              date: "Featured Article"},
-          ]}
-        />
-      </div>
-
-      <div id="metrics" data-section="metrics">
-        <MetricCardThree
-          title="AutoArchive by the Numbers"
-          description="The world's most comprehensive automotive database at your fingertips"
-          tag="Database Statistics"
-          tagAnimation="blur-reveal"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          animationType="scale-rotate"
-          metrics={[
-            {
-              id: "1",              icon: Building2,
-              title: "Manufacturers",              value: "2,000+"},
-            {
-              id: "2",              icon: Car,
-              title: "Vehicle Models",              value: "50,000+"},
-            {
-              id: "3",              icon: History,
-              title: "Years Covered",              value: "138 Years"},
-            {
-              id: "4",              icon: Globe,
-              title: "Countries",              value: "195"},
-          ]}
-        />
-      </div>
-
-      <div id="about" data-section="about">
-        <TextSplitAbout
-          title="About AutoArchive"
-          description={[
-            "AutoArchive is the world's most comprehensive online car encyclopedia and search engine. Our mission is to preserve and share automotive history, from the earliest automobiles of 1886 to the latest models of today.",            "We've compiled extensive data on every major manufacturer, model generation, variant, and specification. Whether you're a collector, historian, designer, or enthusiast, AutoArchive provides the definitive source for automotive knowledge.",            "Our database spans 138 years of automotive innovation, featuring technical specifications, performance metrics, production years, engine options, transmission data, and historical context for vehicles from around the world."]}
-          showBorder={true}
-          useInvertedBackground={false}
-          buttons={[
-            { text: "Explore Database", href: "/search" },
-            { text: "Browse Collections", href: "/browse" },
-          ]}
-          buttonAnimation="blur-reveal"
-        />
-      </div>
-
-      <div id="faq" data-section="faq">
-        <FaqSplitMedia
-          title="Frequently Asked Questions"
-          description="Find answers to common questions about AutoArchive and our automotive database"
-          tag="Help & Support"
-          tagAnimation="blur-reveal"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          mediaAnimation="blur-reveal"
-          faqsAnimation="blur-reveal"
-          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/modern-customer-support-and-help-resourc-1772823291668-afcab7fc.png"
-          imageAlt="AutoArchive Support Resources"
-          mediaPosition="left"
-          faqs={[
-            {
-              id: "1",              title: "What years does AutoArchive cover?",              content:
-                "AutoArchive covers automotive history from 1886 (the earliest automobiles) to the present day (2024). We continuously update our database with new models and generations as they are released."},
-            {
-              id: "2",              title: "How many manufacturers are included in the database?",              content:
-                "We currently feature over 2,000 manufacturers worldwide, including both current and historical brands. This includes major global manufacturers as well as regional and boutique automakers throughout history."},
-            {
-              id: "3",              title: "Can I search by specific criteria?",              content:
-                "Yes! You can search and filter by brand, model, year, country of origin, engine type, body style, horsepower range, production years, drivetrain, and more. Our advanced search engine includes autocomplete suggestions for quick discovery."},
-            {
-              id: "4",              title: "How do I compare vehicles?",              content:
-                "Use our Compare Tool to select up to 4 vehicles and view their specifications side-by-side. Compare engine options, performance metrics, transmission options, body styles, and other key specifications."},
-            {
-              id: "5",              title: "Is there pricing information available?",              content:
-                "AutoArchive focuses on technical specifications, production data, and historical information. We do not provide pricing information, which varies greatly by condition, market, and time period. Our goal is to be the definitive technical resource."},
-            {
-              id: "6",              title: "Can I view individual car specifications?",              content:
-                "Absolutely. Each vehicle has its own dedicated detail page featuring high-quality images, technical specifications, production years, engine options, performance data, transmission options, body styles, historical notes, and information about successor/predecessor models."},
-          ]}
-        />
-      </div>
-
-      <div id="cta" data-section="cta">
-        <ContactCTA
-          tag="Start Exploring"
-          tagIcon={Zap}
-          tagAnimation="blur-reveal"
-          title="Ready to Discover Automotive History?"
-          description="Join thousands of enthusiasts, collectors, historians, and professionals using AutoArchive. Search millions of vehicles, compare specifications, and explore the complete history of automobiles."
-          buttons={[
-            { text: "Begin Your Search", href: "/search" },
-            { text: "Browse All Brands", href: "/browse" },
-          ]}
-          buttonAnimation="blur-reveal"
-          background={{ variant: "plain" }}
-          useInvertedBackground={false}
-        />
-      </div>
-
-      <div id="footer" data-section="footer">
-        <FooterLogoEmphasis
-          logoText="AutoArchive"
-          columns={[
-            {
-              items: [
-                { label: "Search Database", href: "/search" },
-                { label: "Browse Vehicles", href: "/browse" },
-                { label: "Compare Cars", href: "/compare" },
-                { label: "Timeline Explorer", href: "/timeline" },
-              ],
-            },
-            {
-              items: [
-                { label: "Brand Directory", href: "/brands" },
-                { label: "Model Guide", href: "/models" },
-                { label: "Specifications", href: "/specs" },
-                { label: "Production Data", href: "/production" },
-              ],
-            },
-            {
-              items: [
-                { label: "About Us", href: "/" },
-                { label: "Help & Support", href: "/help" },
-                { label: "Contact", href: "/contact" },
-                { label: "Contribute Data", href: "/contribute" },
-              ],
-            },
-            {
-              items: [
-                { label: "Privacy Policy", href: "/privacy" },
-                { label: "Terms of Service", href: "/terms" },
-                { label: "Data Attribution", href: "/attribution" },
-                { label: "Sitemap", href: "/sitemap" },
-              ],
-            },
-          ]}
-        />
-      </div>
-    </ThemeProvider>
+    <div>
+      <h1>Welcome to Car Dealership</h1>
+      <p>Browse our collection of vehicles</p>
+    </div>
   );
-}
\ No newline at end of file
+}
diff --git a/src/app/robots.ts b/src/app/robots.ts
new file mode 100644
index 0000000..2be5264
--- /dev/null
+++ b/src/app/robots.ts
@@ -0,0 +1,18 @@
+import { MetadataRoute } from "next";
+
+export default function robots(): MetadataRoute.Robots {
+  const baseUrl = "https://autoarchive.example.com";
+
+  return {
+    rules: [
+      {
+        userAgent: "*",        allow: "/",        disallow: ["/admin", "/private", "/*.json$", "/*?*sort=", "/*?*order="],
+      },
+      {
+        userAgent: "Googlebot",        allow: "/",        crawlDelay: 0.5,
+      },
+    ],
+    sitemap: `${baseUrl}/sitemap.xml`,
+    host: baseUrl,
+  };
+}
\ No newline at end of file
diff --git a/src/app/search/page.tsx b/src/app/search/page.tsx
index decf551..a94ba5e 100644
--- a/src/app/search/page.tsx
+++ b/src/app/search/page.tsx
@@ -1,221 +1,25 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
-import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
 
-export default function SearchPage() {
+const SearchPage = () => {
   return (
     <ThemeProvider
-      defaultButtonVariant="shift-hover"
+      defaultButtonVariant="hover-magnetic"
       defaultTextAnimation="entrance-slide"
-      borderRadius="pill"
-      contentWidth="compact"
-      sizing="largeSmallSizeMediumTitles"
-      background="aurora"
-      cardStyle="solid"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="medium"
+      background="circleGradient"
+      cardStyle="glass-elevated"
       primaryButtonStyle="gradient"
-      secondaryButtonStyle="solid"
-      headingFontWeight="extrabold"
+      secondaryButtonStyle="glass"
+      headingFontWeight="normal"
     >
-      <div id="nav" data-section="nav">
-        <NavbarStyleFullscreen
-          navItems={[
-            { name: "Search", id: "/search" },
-            { name: "Browse", id: "/browse" },
-            { name: "Compare", id: "/compare" },
-            { name: "Timeline", id: "/timeline" },
-            { name: "About", id: "/about" },
-          ]}
-          brandName="AutoArchive"
-          bottomLeftText="Explore Automotive History"
-          bottomRightText="1886 to Present"
-        />
-      </div>
-
-      <div className="min-h-screen flex flex-col items-center justify-center px-4 py-20">
-        <div className="max-w-4xl mx-auto text-center">
-          <h1 className="text-4xl md:text-6xl font-extrabold mb-6">
-            Advanced Vehicle Search
-          </h1>
-          <p className="text-lg md:text-xl text-gray-600 mb-12">
-            Search across our complete database of 50,000+ vehicles from 2,000+ manufacturers.
-            Filter by brand, model, year, specifications, and more.
-          </p>
-
-          <div className="bg-white rounded-xl shadow-lg p-8 mb-12">
-            <div className="space-y-6">
-              <div>
-                <label className="block text-sm font-semibold text-left mb-2">
-                  Search by Brand or Model
-                </label>
-                <input
-                  type="text"
-                  placeholder="E.g., Ferrari, Porsche 911, BMW M3..."
-                  className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:border-burgundy-600"
-                />
-              </div>
-
-              <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
-                <div>
-                  <label className="block text-sm font-semibold text-left mb-2">
-                    Year Range
-                  </label>
-                  <div className="flex gap-2">
-                    <input
-                      type="number"
-                      placeholder="From"
-                      min="1886"
-                      max="2024"
-                      className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none"
-                    />
-                    <input
-                      type="number"
-                      placeholder="To"
-                      min="1886"
-                      max="2024"
-                      className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none"
-                    />
-                  </div>
-                </div>
-
-                <div>
-                  <label className="block text-sm font-semibold text-left mb-2">
-                    Body Type
-                  </label>
-                  <select className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none">
-                    <option>All Types</option>
-                    <option>Sedan</option>
-                    <option>SUV</option>
-                    <option>Coupe</option>
-                    <option>Convertible</option>
-                    <option>Wagon</option>
-                    <option>Truck</option>
-                    <option>Sports Car</option>
-                  </select>
-                </div>
-              </div>
-
-              <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
-                <div>
-                  <label className="block text-sm font-semibold text-left mb-2">
-                    Engine Type
-                  </label>
-                  <select className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none">
-                    <option>All Engines</option>
-                    <option>Gasoline</option>
-                    <option>Diesel</option>
-                    <option>Electric</option>
-                    <option>Hybrid</option>
-                  </select>
-                </div>
-
-                <div>
-                  <label className="block text-sm font-semibold text-left mb-2">
-                    Country of Origin
-                  </label>
-                  <select className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none">
-                    <option>All Countries</option>
-                    <option>Germany</option>
-                    <option>Italy</option>
-                    <option>Japan</option>
-                    <option>USA</option>
-                    <option>UK</option>
-                    <option>France</option>
-                    <option>Sweden</option>
-                  </select>
-                </div>
-              </div>
-
-              <button className="w-full bg-burgundy-600 text-white px-6 py-3 rounded-lg font-semibold hover:bg-burgundy-700 transition-colors">
-                Search Vehicles
-              </button>
-            </div>
-          </div>
-
-          <div className="grid grid-cols-1 md:grid-cols-3 gap-6 mb-12">
-            <div className="bg-gray-50 rounded-lg p-6">
-              <div className="text-3xl font-bold text-burgundy-600 mb-2">
-                50,000+
-              </div>
-              <p className="text-gray-600">Models in Database</p>
-            </div>
-            <div className="bg-gray-50 rounded-lg p-6">
-              <div className="text-3xl font-bold text-burgundy-600 mb-2">
-                2,000+
-              </div>
-              <p className="text-gray-600">Manufacturers</p>
-            </div>
-            <div className="bg-gray-50 rounded-lg p-6">
-              <div className="text-3xl font-bold text-burgundy-600 mb-2">
-                138
-              </div>
-              <p className="text-gray-600">Years of History</p>
-            </div>
-          </div>
-
-          <div className="text-center text-gray-600">
-            <p className="mb-4">
-              Can't find what you're looking for? Try browsing by era or brand instead.
-            </p>
-            <div className="flex justify-center gap-4">
-              <a
-                href="/browse"
-                className="text-burgundy-600 font-semibold hover:underline"
-              >
-                Browse by Era
-              </a>
-              <span>•</span>
-              <a
-                href="/brands"
-                className="text-burgundy-600 font-semibold hover:underline"
-              >
-                Browse by Brand
-              </a>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <div id="footer" data-section="footer">
-        <FooterLogoEmphasis
-          logoText="AutoArchive"
-          columns={[
-            {
-              items: [
-                { label: "Search Database", href: "/search" },
-                { label: "Browse Vehicles", href: "/browse" },
-                { label: "Compare Cars", href: "/compare" },
-                { label: "Timeline Explorer", href: "/timeline" },
-              ],
-            },
-            {
-              items: [
-                { label: "Brand Directory", href: "/brands" },
-                { label: "Model Guide", href: "/models" },
-                { label: "Specifications", href: "/specs" },
-                { label: "Production Data", href: "/production" },
-              ],
-            },
-            {
-              items: [
-                { label: "About Us", href: "/" },
-                { label: "Help & Support", href: "/help" },
-                { label: "Contact", href: "/contact" },
-                { label: "Contribute Data", href: "/contribute" },
-              ],
-            },
-            {
-              items: [
-                { label: "Privacy Policy", href: "/privacy" },
-                { label: "Terms of Service", href: "/terms" },
-                { label: "Data Attribution", href: "/attribution" },
-                { label: "Sitemap", href: "/sitemap" },
-              ],
-            },
-          ]}
-        />
-      </div>
+      <div id="nav" data-section="nav" />
+      <div id="search" data-section="search" />
     </ThemeProvider>
   );
-}
\ No newline at end of file
+};
+
+export default SearchPage;
diff --git a/src/app/sitemap.ts b/src/app/sitemap.ts
new file mode 100644
index 0000000..b24a2af
--- /dev/null
+++ b/src/app/sitemap.ts
@@ -0,0 +1,59 @@
+import { MetadataRoute } from "next";
+
+export default function sitemap(): MetadataRoute.Sitemap {
+  const baseUrl = "https://autoarchive.example.com";
+  const lastModified = new Date();
+
+  return [
+    {
+      url: baseUrl,
+      lastModified: lastModified,
+      changeFrequency: "weekly",      priority: 1.0,
+    },
+    {
+      url: `${baseUrl}/search`,
+      lastModified: lastModified,
+      changeFrequency: "daily",      priority: 0.9,
+    },
+    {
+      url: `${baseUrl}/browse`,
+      lastModified: lastModified,
+      changeFrequency: "weekly",      priority: 0.9,
+    },
+    {
+      url: `${baseUrl}/compare`,
+      lastModified: lastModified,
+      changeFrequency: "weekly",      priority: 0.8,
+    },
+    {
+      url: `${baseUrl}/timeline`,
+      lastModified: lastModified,
+      changeFrequency: "monthly",      priority: 0.8,
+    },
+    {
+      url: `${baseUrl}/about`,
+      lastModified: lastModified,
+      changeFrequency: "monthly",      priority: 0.7,
+    },
+    {
+      url: `${baseUrl}/privacy`,
+      lastModified: lastModified,
+      changeFrequency: "yearly",      priority: 0.5,
+    },
+    {
+      url: `${baseUrl}/terms`,
+      lastModified: lastModified,
+      changeFrequency: "yearly",      priority: 0.5,
+    },
+    {
+      url: `${baseUrl}/help`,
+      lastModified: lastModified,
+      changeFrequency: "monthly",      priority: 0.6,
+    },
+    {
+      url: `${baseUrl}/contact`,
+      lastModified: lastModified,
+      changeFrequency: "monthly",      priority: 0.6,
+    },
+  ];
+}
\ No newline at end of file
diff --git a/src/app/timeline/page.tsx b/src/app/timeline/page.tsx
new file mode 100644
index 0000000..e0ba0ad
--- /dev/null
+++ b/src/app/timeline/page.tsx
@@ -0,0 +1,25 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+
+const TimelinePage = () => {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="hover-magnetic"
+      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" />
+      <div id="timeline" data-section="timeline" />
+    </ThemeProvider>
+  );
+};
+
+export default TimelinePage;