diff --git a/src/app/page.jsx b/src/app/page.jsx
index 5a81899..8746ba5 100644
--- a/src/app/page.jsx
+++ b/src/app/page.jsx
@@ -1,412 +1,7 @@
 "use client";
 
-import CardNormal from "src/components/Cards/CardNormal/page";
-import Navbar from "../components/NavBar";
-import { Swiper, SwiperSlide } from "swiper/react";
-import ban1 from "../assets/images/ban1.jpg";
-import ban2 from "../assets/images/ban2.png";
-import logo from "../assets/images/logo.png";
-import "swiper/css";
-import Image from "next/image";
-import Link from "next/link";
+import Landing from "src/view/Landing";
 
 export default function Home() {
-  const data = [
-    {
-      id: 1,
-      persianName: "Hydrating Cream",
-      englishName: "Hydrating Cream",
-      description:
-        "A deeply moisturizing cream that keeps your skin hydrated all day long.",
-      cost: 250000,
-      costWithDiscount: 200000,
-      hasDiscount: true,
-      discountPercent: 20,
-      stock: 5,
-      mainImage: "4",
-    },
-    {
-      id: 2,
-      persianName: "Hair Strengthening Shampoo",
-      englishName: "Hair Strengthening Shampoo",
-      description:
-        "A nourishing shampoo that strengthens hair roots and prevents hair fall.",
-      cost: 180000,
-      costWithDiscount: 150000,
-      hasDiscount: true,
-      discountPercent: 17,
-      stock: 2,
-      mainImage: "3",
-    },
-    {
-      id: 3,
-      persianName: "Vitamin C Serum",
-      englishName: "Vitamin C Serum",
-      description:
-        "An antioxidant-rich serum that brightens skin and reduces signs of aging.",
-      cost: 300000,
-      costWithDiscount: 270000,
-      hasDiscount: true,
-      discountPercent: 10,
-      stock: 3,
-      mainImage: "1",
-    },
-    {
-      id: 4,
-      persianName: "Charcoal Face Mask",
-      englishName: "Charcoal Face Mask",
-      description:
-        "A detoxifying mask that removes impurities and unclogs pores for a fresh look.",
-      cost: 220000,
-      costWithDiscount: 220000,
-      hasDiscount: false,
-      discountPercent: 0,
-      stock: 8,
-      mainImage: "4",
-    },
-    {
-      id: 5,
-      persianName: "Body Lotion",
-      englishName: "Body Lotion",
-      description:
-        "A lightweight body lotion that nourishes and hydrates dry skin.",
-      cost: 210000,
-      costWithDiscount: 185000,
-      hasDiscount: true,
-      discountPercent: 12,
-      stock: 6,
-      mainImage: "2",
-    },
-    {
-      id: 6,
-      persianName: "Aloe Vera Gel",
-      englishName: "Aloe Vera Gel",
-      description:
-        "A soothing gel enriched with aloe vera to calm irritated skin.",
-      cost: 160000,
-      costWithDiscount: 160000,
-      hasDiscount: false,
-      discountPercent: 0,
-      stock: 10,
-      mainImage: "3",
-    },
-    {
-      id: 7,
-      persianName: "Sunscreen SPF 50",
-      englishName: "Sunscreen SPF 50",
-      description:
-        "A broad-spectrum sunscreen that protects against UV rays and prevents sunburn.",
-      cost: 280000,
-      costWithDiscount: 230000,
-      hasDiscount: true,
-      discountPercent: 18,
-      stock: 4,
-      mainImage: "1",
-    },
-    {
-      id: 8,
-      persianName: "Face Cleanser",
-      englishName: "Face Cleanser",
-      description:
-        "A gentle face cleanser that removes dirt and oil without stripping moisture.",
-      cost: 190000,
-      costWithDiscount: 170000,
-      hasDiscount: true,
-      discountPercent: 10,
-      stock: 7,
-      mainImage: "2",
-    },
-    {
-      id: 9,
-      persianName: "Moisturizing Cream",
-      englishName: "Moisturizing Cream",
-      description:
-        "A rich cream that provides deep hydration for soft and smooth skin.",
-      cost: 260000,
-      costWithDiscount: 260000,
-      hasDiscount: false,
-      discountPercent: 0,
-      stock: 9,
-      mainImage: "4",
-    },
-    {
-      id: 10,
-      persianName: "Eye Serum",
-      englishName: "Eye Serum",
-      description:
-        "A lightweight eye serum that reduces puffiness and dark circles.",
-      cost: 350000,
-      costWithDiscount: 310000,
-      hasDiscount: true,
-      discountPercent: 12,
-      stock: 5,
-      mainImage: "3",
-    },
-    {
-      id: 11,
-      persianName: "Lip Balm",
-      englishName: "Lip Balm",
-      description:
-        "A moisturizing lip balm that prevents chapped lips and adds a subtle shine.",
-      cost: 90000,
-      costWithDiscount: 80000,
-      hasDiscount: true,
-      discountPercent: 11,
-      stock: 12,
-      mainImage: "1",
-    },
-    {
-      id: 12,
-      persianName: "Hand Cream",
-      englishName: "Hand Cream",
-      description:
-        "A fast-absorbing hand cream that keeps hands soft and hydrated.",
-      cost: 170000,
-      costWithDiscount: 150000,
-      hasDiscount: true,
-      discountPercent: 12,
-      stock: 6,
-      mainImage: "2",
-    },
-    {
-      id: 13,
-      persianName: "Night Repair Serum",
-      englishName: "Night Repair Serum",
-      description:
-        "A serum that works overnight to repair and rejuvenate your skin.",
-      cost: 390000,
-      costWithDiscount: 350000,
-      hasDiscount: true,
-      discountPercent: 10,
-      stock: 4,
-      mainImage: "3",
-    },
-    {
-      id: 14,
-      persianName: "Shaving Cream",
-      englishName: "Shaving Cream",
-      description:
-        "A rich shaving cream that provides a smooth and irritation-free shave.",
-      cost: 200000,
-      costWithDiscount: 200000,
-      hasDiscount: false,
-      discountPercent: 0,
-      stock: 9,
-      mainImage: "4",
-    },
-
-    {
-      id: 15,
-      persianName: "Shaving ",
-      englishName: "Shaving ",
-      description:
-        "A fast-absorbing hand cream that keeps hands soft and hydrated.",
-      cost: 200000,
-      costWithDiscount: 200000,
-      hasDiscount: false,
-      discountPercent: 0,
-      stock: 9,
-      mainImage: "1",
-    },
-  ];
-
-  const slides = [
-    {
-      id: 1,
-      image: "/images/slide1.jpg",
-      alt: "Slide 1",
-      title: "Discover the Best Products",
-      description:
-        "Find high-quality beauty and skincare items at unbeatable prices.",
-    },
-    {
-      id: 2,
-      image: "/images/slide2.jpg",
-      alt: "Slide 2",
-      title: "Exclusive Discounts",
-      description: "Enjoy special deals and save big on your favorite brands.",
-    },
-    {
-      id: 3,
-      image: "/images/slide3.jpg",
-      alt: "Slide 3",
-      title: "Fast & Secure Delivery",
-      description:
-        "Get your products delivered quickly and safely to your doorstep.",
-    },
-  ];
-
-  return (
-    <div className=" text-center text-6xl">
-      {" "}
-      <Navbar theme={1} />
-      {/* <div className="mt-20">
-        <div className="grid grid-cols-3"></div>
-      </div> */}
-      <div className="xs:px-3 lg:px-20 mt-10">
-        <Swiper className="mySwiper ">
-          <SwiperSlide>
-            <div className="rounded-2xl overflow-hidden ">
-              <Image
-                src={ban1}
-                className="object-cover xs:h-[200px] lg:h-auto "
-              />
-            </div>
-          </SwiperSlide>
-          <SwiperSlide>
-            {" "}
-            <div className="rounded-2xl overflow-hidden">
-              <Image
-                src={ban2}
-                className="object-cover xs:h-[200px] lg:h-auto "
-              />
-            </div>
-          </SwiperSlide>
-        </Swiper>
-      </div>
-      <div className="xs:mt-10 lg:mt-[120px]">
-        <div className="xs:px-3 md:px-10 md:container md:mx-auto mb-10">
-          <div className="grid xs:grid-cols-1 lg:grid-cols-3 gap-5 rtl ">
-            <div className="mx-auto">
-              <Image src={logo} className="xs:w-[200px] lg:w-auto" />
-            </div>
-            <div className="text-left relative mb-10 col-span-2">
-              <h2 className="text-[30px] font-bold relative z-10 xs:text-center lg:text-left">
-                ADVANCED HORIZON SERVICES LLC Products{" "}
-              </h2>
-              <p className="mb-0 text-sm text-gray-400 xs:text-center lg:text-left">
-                Lorem ipsum dolor sit amet
-              </p>
-
-              <p className="mb-0 text-base mt-5">
-                Lorem ipsum dolor sit amet consectetur, adipisicing elit.
-                Voluptates quas, exercitationem expedita libero hic
-                necessitatibus et sed aliquam consequatur repellendus dolore,
-                molestiae earum culpa fuga nobis odit, eligendi eius dolorem!
-                <br />
-                <br />
-                Lorem ipsum dolor sit amet consectetur, adipisicing elit.
-                Voluptates quas, exercitationem expedita libero hic
-                necessitatibus et sed aliquam consequatur repellendus dolore,
-                molestiae earum culpa fuga nobis odit, eligendi eius dolorem!
-                Lorem ipsum dolor sit amet consectetur, adipisicing elit.
-                Voluptates quas, exercitationem expedita libero hic
-                necessitatibus et sed aliquam consequatur repellendus dolore,
-                molestiae earum culpa fuga nobis odit, eligendi eius dolorem!
-              </p>
-
-              <button className="btn btn-primary text-sm p-3 px-10">
-                {" "}
-                Learn more about us
-              </button>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div className="mt-[120px]">
-        <div className="w-full bg-couner-data-landing">
-          <div className="grid  xs:grid-cols-1 lg:grid-cols-3">
-            <div className="xs:my-10 lg:my-20">
-              <p className="mb-0 text-[12px] text-gray-300">
-                Lorem ipsum dolor{" "}
-              </p>
-              <h3 className="mb-0 text-4xl text-gray-300 font-bold">
-                Test For Fake Data
-              </h3>
-              <p className="mb-0 text-6xl font-bold text-gray-500 mt-5 ">500</p>
-            </div>
-
-            <div className="xs:my-10 lg:my-20">
-              <p className="mb-0 text-[12px] text-gray-300">
-                Lorem ipsum dolor{" "}
-              </p>
-              <h3 className="mb-0 text-4xl text-gray-300 font-bold">
-                Test In Landing Page
-              </h3>
-
-              <p className="mb-0 text-6xl font-bold text-gray-500 mt-5 ">
-                5,523,222
-              </p>
-            </div>
-
-            <div className="xs:my-10 lg:my-20">
-              <p className="mb-0 text-[12px] text-gray-300">
-                Lorem ipsum dolor{" "}
-              </p>
-              <h3 className="mb-0 text-4xl text-gray-300 font-bold">
-                Test For Fake
-              </h3>
-              <p className="mb-0 text-6xl font-bold text-gray-500 mt-5 ">
-                +225{" "}
-              </p>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div className="my-[120px]">
-        <div className="xs:px-3 md:px-10 md:container md:mx-auto mb-10">
-          <div className="text-left relative mb-10">
-            <h2 className="text-[30px] font-bold relative z-10 xs:text-center lg:text-left">
-              ADVANCED HORIZON SERVICES LLC Products{" "}
-            </h2>
-            <p className="mb-0 text-sm text-gray-400 xs:text-center lg:text-left">
-              Lorem ipsum dolor sit amet, consectetur adipisicing elit.
-              Corporis,{" "}
-            </p>
-          </div>
-
-          <div className="grid  xs:grid-cols-2 lg:grid-cols-5 gap-5">
-            {data?.map((e, index) => (
-              <div key={index} className="relative">
-                <CardNormal data={e} priority />
-              </div>
-            ))}
-          </div>
-        </div>
-      </div>
-      <div className="bg-secondary-700 ">
-        <div className="lg:w-7/12 xs:w-full mx-auto py-20">
-          <div className="flex justify-center">
-            <div className={`text-center w-ful`}>
-              <>
-                {" "}
-                <p className="mb-0 text-white text-center xs:mt-0 lg:mt-10 font-bold lg:text-[70px] xs:text-[25px] lg:leading-[60px] lg:w-fit xs:w-full">
-                  <small className="text-primary-300">"</small>
-                  ADVANCED HORIZON
-                </p>
-                <p className="mb-0 text-white text-center font-bold lg:text-[70px] xs:text-[25px] lg:leading-[60px] lg:w-fit xs:w-full">
-                  SERVICES LLC
-                  <small className="  text-primary-300">"</small>
-                </p>
-              </>
-            </div>
-          </div>
-        </div>
-        <div className="flex  justify-center">
-          <div>
-            <div className="w-full mb-5">
-              <Image src={logo} className="w-[90px] mx-auto" />
-            </div>
-            <p className="mb-0 text-sm text-gray-200  w-full text-center opacity-30 ">
-              © 2025. All rights reserved. | Designed by ♡ <br />
-              am - Om
-            </p>
-
-            <div className="flex justify-center w-full my-5 ">
-              <Link href={`/products`}>
-                <p className="mb-0  text-gray-400 mx-4 text-sm">products</p>
-              </Link>
-              <Link href={`/#news`}>
-                <p className="mb-0  text-gray-400 mx-4 text-sm">news</p>
-              </Link>
-              <Link href={`/about-us`}>
-                <p className="mb-0  text-gray-400 mx-4 text-sm">about us</p>
-              </Link>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div className="bg-secondary-900 "></div>
-    </div>
-  );
+  return <Landing />;
 }
diff --git a/src/view/Landing/components/AboutUs.jsx b/src/view/Landing/components/AboutUs.jsx
new file mode 100644
index 0000000..5c41ff0
--- /dev/null
+++ b/src/view/Landing/components/AboutUs.jsx
@@ -0,0 +1,49 @@
+import Image from "next/image";
+import React from "react";
+import logo from "../../../assets/images/logo.png";
+
+const AboutUs = () => {
+  return (
+    <div className="xs:mt-10 lg:mt-[120px]">
+      <div className="xs:px-3 md:px-10 md:container md:mx-auto mb-10">
+        <div className="grid xs:grid-cols-1 lg:grid-cols-3 gap-5 rtl ">
+          <div className="mx-auto">
+            <Image src={logo} className="xs:w-[200px] lg:w-auto" />
+          </div>
+          <div className="text-left relative mb-10 col-span-2">
+            <h2 className="text-[30px] font-bold relative z-10 xs:text-center lg:text-left">
+              ADVANCED HORIZON SERVICES LLC Products{" "}
+            </h2>
+            <p className="mb-0 text-sm text-gray-400 xs:text-center lg:text-left">
+              Lorem ipsum dolor sit amet
+            </p>
+
+            <p className="mb-0 text-base mt-5">
+              Lorem ipsum dolor sit amet consectetur, adipisicing elit.
+              Voluptates quas, exercitationem expedita libero hic necessitatibus
+              et sed aliquam consequatur repellendus dolore, molestiae earum
+              culpa fuga nobis odit, eligendi eius dolorem!
+              <br />
+              <br />
+              Lorem ipsum dolor sit amet consectetur, adipisicing elit.
+              Voluptates quas, exercitationem expedita libero hic necessitatibus
+              et sed aliquam consequatur repellendus dolore, molestiae earum
+              culpa fuga nobis odit, eligendi eius dolorem! Lorem ipsum dolor
+              sit amet consectetur, adipisicing elit. Voluptates quas,
+              exercitationem expedita libero hic necessitatibus et sed aliquam
+              consequatur repellendus dolore, molestiae earum culpa fuga nobis
+              odit, eligendi eius dolorem!
+            </p>
+
+            <button className="btn btn-primary text-sm p-3 px-10">
+              {" "}
+              Learn more about us
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default AboutUs;
diff --git a/src/view/Landing/components/CounterDetail.jsx b/src/view/Landing/components/CounterDetail.jsx
new file mode 100644
index 0000000..8a14194
--- /dev/null
+++ b/src/view/Landing/components/CounterDetail.jsx
@@ -0,0 +1,40 @@
+import React from "react";
+
+const CounterDetail = () => {
+  return (
+    <div className="mt-[120px]">
+      <div className="w-full bg-couner-data-landing">
+        <div className="grid  xs:grid-cols-1 lg:grid-cols-3">
+          <div className="xs:my-10 lg:my-20">
+            <p className="mb-0 text-[12px] text-gray-300">Lorem ipsum dolor </p>
+            <h3 className="mb-0 text-4xl text-gray-300 font-bold">
+              Test For Fake Data
+            </h3>
+            <p className="mb-0 text-6xl font-bold text-gray-500 mt-5 ">500</p>
+          </div>
+
+          <div className="xs:my-10 lg:my-20">
+            <p className="mb-0 text-[12px] text-gray-300">Lorem ipsum dolor </p>
+            <h3 className="mb-0 text-4xl text-gray-300 font-bold">
+              Test In Landing Page
+            </h3>
+
+            <p className="mb-0 text-6xl font-bold text-gray-500 mt-5 ">
+              5,523,222
+            </p>
+          </div>
+
+          <div className="xs:my-10 lg:my-20">
+            <p className="mb-0 text-[12px] text-gray-300">Lorem ipsum dolor </p>
+            <h3 className="mb-0 text-4xl text-gray-300 font-bold">
+              Test For Fake
+            </h3>
+            <p className="mb-0 text-6xl font-bold text-gray-500 mt-5 ">+225 </p>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default CounterDetail;
diff --git a/src/view/Landing/components/Footer.jsx b/src/view/Landing/components/Footer.jsx
new file mode 100644
index 0000000..013a74e
--- /dev/null
+++ b/src/view/Landing/components/Footer.jsx
@@ -0,0 +1,53 @@
+import Image from "next/image";
+import Link from "next/link";
+import React from "react";
+import logo from "../../../assets/images/logo.png";
+
+const Footer = () => {
+  return (
+    <div className="bg-secondary-700 ">
+      <div className="lg:w-7/12 xs:w-full mx-auto py-20">
+        <div className="flex justify-center">
+          <div className={`text-center w-ful`}>
+            <>
+              {" "}
+              <p className="mb-0 text-white text-center xs:mt-0 lg:mt-10 font-bold lg:text-[70px] xs:text-[25px] lg:leading-[60px] lg:w-fit xs:w-full">
+                <small className="text-primary-300">"</small>
+                ADVANCED HORIZON
+              </p>
+              <p className="mb-0 text-white text-center font-bold lg:text-[70px] xs:text-[25px] lg:leading-[60px] lg:w-fit xs:w-full">
+                SERVICES LLC
+                <small className="  text-primary-300">"</small>
+              </p>
+            </>
+          </div>
+        </div>
+      </div>
+      <div className="flex  justify-center">
+        <div>
+          <div className="w-full mb-5">
+            <Image src={logo} className="w-[90px] mx-auto" />
+          </div>
+          <p className="mb-0 text-sm text-gray-200  w-full text-center opacity-30 ">
+            © 2025. All rights reserved. | Designed by ♡ <br />
+            am - Om
+          </p>
+
+          <div className="flex justify-center w-full my-5 ">
+            <Link href={`/products`}>
+              <p className="mb-0  text-gray-400 mx-4 text-sm">products</p>
+            </Link>
+            <Link href={`/#news`}>
+              <p className="mb-0  text-gray-400 mx-4 text-sm">news</p>
+            </Link>
+            <Link href={`/about-us`}>
+              <p className="mb-0  text-gray-400 mx-4 text-sm">about us</p>
+            </Link>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default Footer;
diff --git a/src/view/Landing/components/HeroSection.jsx b/src/view/Landing/components/HeroSection.jsx
new file mode 100644
index 0000000..62a9999
--- /dev/null
+++ b/src/view/Landing/components/HeroSection.jsx
@@ -0,0 +1,34 @@
+import React from "react";
+import { Swiper, SwiperSlide } from "swiper/react";
+import ban1 from "../../../assets/images/ban1.jpg";
+import ban2 from "../../../assets/images/ban2.png";
+import Image from "next/image";
+import "swiper/css";
+
+const HeroSection = () => {
+  return (
+    <div className="xs:px-3 lg:px-20 mt-10">
+      <Swiper className="mySwiper ">
+        <SwiperSlide>
+          <div className="rounded-2xl overflow-hidden ">
+            <Image
+              src={ban1}
+              className="object-cover xs:h-[200px] lg:h-auto "
+            />
+          </div>
+        </SwiperSlide>
+        <SwiperSlide>
+          {" "}
+          <div className="rounded-2xl overflow-hidden">
+            <Image
+              src={ban2}
+              className="object-cover xs:h-[200px] lg:h-auto "
+            />
+          </div>
+        </SwiperSlide>
+      </Swiper>
+    </div>
+  );
+};
+
+export default HeroSection;
diff --git a/src/view/Landing/components/Products.jsx b/src/view/Landing/components/Products.jsx
new file mode 100644
index 0000000..5c3190a
--- /dev/null
+++ b/src/view/Landing/components/Products.jsx
@@ -0,0 +1,228 @@
+import React from "react";
+import CardNormal from "src/components/Cards/CardNormal/page";
+
+const Products = () => {
+  const data = [
+    {
+      id: 1,
+      persianName: "Hydrating Cream",
+      englishName: "Hydrating Cream",
+      description:
+        "A deeply moisturizing cream that keeps your skin hydrated all day long.",
+      cost: 250000,
+      costWithDiscount: 200000,
+      hasDiscount: true,
+      discountPercent: 20,
+      stock: 5,
+      mainImage: "4",
+    },
+    {
+      id: 2,
+      persianName: "Hair Strengthening Shampoo",
+      englishName: "Hair Strengthening Shampoo",
+      description:
+        "A nourishing shampoo that strengthens hair roots and prevents hair fall.",
+      cost: 180000,
+      costWithDiscount: 150000,
+      hasDiscount: true,
+      discountPercent: 17,
+      stock: 2,
+      mainImage: "3",
+    },
+    {
+      id: 3,
+      persianName: "Vitamin C Serum",
+      englishName: "Vitamin C Serum",
+      description:
+        "An antioxidant-rich serum that brightens skin and reduces signs of aging.",
+      cost: 300000,
+      costWithDiscount: 270000,
+      hasDiscount: true,
+      discountPercent: 10,
+      stock: 3,
+      mainImage: "1",
+    },
+    {
+      id: 4,
+      persianName: "Charcoal Face Mask",
+      englishName: "Charcoal Face Mask",
+      description:
+        "A detoxifying mask that removes impurities and unclogs pores for a fresh look.",
+      cost: 220000,
+      costWithDiscount: 220000,
+      hasDiscount: false,
+      discountPercent: 0,
+      stock: 8,
+      mainImage: "4",
+    },
+    {
+      id: 5,
+      persianName: "Body Lotion",
+      englishName: "Body Lotion",
+      description:
+        "A lightweight body lotion that nourishes and hydrates dry skin.",
+      cost: 210000,
+      costWithDiscount: 185000,
+      hasDiscount: true,
+      discountPercent: 12,
+      stock: 6,
+      mainImage: "2",
+    },
+    {
+      id: 6,
+      persianName: "Aloe Vera Gel",
+      englishName: "Aloe Vera Gel",
+      description:
+        "A soothing gel enriched with aloe vera to calm irritated skin.",
+      cost: 160000,
+      costWithDiscount: 160000,
+      hasDiscount: false,
+      discountPercent: 0,
+      stock: 10,
+      mainImage: "3",
+    },
+    {
+      id: 7,
+      persianName: "Sunscreen SPF 50",
+      englishName: "Sunscreen SPF 50",
+      description:
+        "A broad-spectrum sunscreen that protects against UV rays and prevents sunburn.",
+      cost: 280000,
+      costWithDiscount: 230000,
+      hasDiscount: true,
+      discountPercent: 18,
+      stock: 4,
+      mainImage: "1",
+    },
+    {
+      id: 8,
+      persianName: "Face Cleanser",
+      englishName: "Face Cleanser",
+      description:
+        "A gentle face cleanser that removes dirt and oil without stripping moisture.",
+      cost: 190000,
+      costWithDiscount: 170000,
+      hasDiscount: true,
+      discountPercent: 10,
+      stock: 7,
+      mainImage: "2",
+    },
+    {
+      id: 9,
+      persianName: "Moisturizing Cream",
+      englishName: "Moisturizing Cream",
+      description:
+        "A rich cream that provides deep hydration for soft and smooth skin.",
+      cost: 260000,
+      costWithDiscount: 260000,
+      hasDiscount: false,
+      discountPercent: 0,
+      stock: 9,
+      mainImage: "4",
+    },
+    {
+      id: 10,
+      persianName: "Eye Serum",
+      englishName: "Eye Serum",
+      description:
+        "A lightweight eye serum that reduces puffiness and dark circles.",
+      cost: 350000,
+      costWithDiscount: 310000,
+      hasDiscount: true,
+      discountPercent: 12,
+      stock: 5,
+      mainImage: "3",
+    },
+    {
+      id: 11,
+      persianName: "Lip Balm",
+      englishName: "Lip Balm",
+      description:
+        "A moisturizing lip balm that prevents chapped lips and adds a subtle shine.",
+      cost: 90000,
+      costWithDiscount: 80000,
+      hasDiscount: true,
+      discountPercent: 11,
+      stock: 12,
+      mainImage: "1",
+    },
+    {
+      id: 12,
+      persianName: "Hand Cream",
+      englishName: "Hand Cream",
+      description:
+        "A fast-absorbing hand cream that keeps hands soft and hydrated.",
+      cost: 170000,
+      costWithDiscount: 150000,
+      hasDiscount: true,
+      discountPercent: 12,
+      stock: 6,
+      mainImage: "2",
+    },
+    {
+      id: 13,
+      persianName: "Night Repair Serum",
+      englishName: "Night Repair Serum",
+      description:
+        "A serum that works overnight to repair and rejuvenate your skin.",
+      cost: 390000,
+      costWithDiscount: 350000,
+      hasDiscount: true,
+      discountPercent: 10,
+      stock: 4,
+      mainImage: "3",
+    },
+    {
+      id: 14,
+      persianName: "Shaving Cream",
+      englishName: "Shaving Cream",
+      description:
+        "A rich shaving cream that provides a smooth and irritation-free shave.",
+      cost: 200000,
+      costWithDiscount: 200000,
+      hasDiscount: false,
+      discountPercent: 0,
+      stock: 9,
+      mainImage: "4",
+    },
+
+    {
+      id: 15,
+      persianName: "Shaving ",
+      englishName: "Shaving ",
+      description:
+        "A fast-absorbing hand cream that keeps hands soft and hydrated.",
+      cost: 200000,
+      costWithDiscount: 200000,
+      hasDiscount: false,
+      discountPercent: 0,
+      stock: 9,
+      mainImage: "1",
+    },
+  ];
+
+  return (
+    <div className="my-[120px]">
+      <div className="xs:px-3 md:px-10 md:container md:mx-auto mb-10">
+        <div className="text-left relative mb-10">
+          <h2 className="text-[30px] font-bold relative z-10 xs:text-center lg:text-left">
+            ADVANCED HORIZON SERVICES LLC Products{" "}
+          </h2>
+          <p className="mb-0 text-sm text-gray-400 xs:text-center lg:text-left">
+            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis,{" "}
+          </p>
+        </div>
+
+        <div className="grid  xs:grid-cols-2 lg:grid-cols-5 gap-5">
+          {data?.map((e, index) => (
+            <div key={index} className="relative">
+              <CardNormal data={e} priority />
+            </div>
+          ))}
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default Products;
diff --git a/src/view/Landing/index.jsx b/src/view/Landing/index.jsx
new file mode 100644
index 0000000..6f11d9f
--- /dev/null
+++ b/src/view/Landing/index.jsx
@@ -0,0 +1,23 @@
+import React from "react";
+import HeroSection from "./components/HeroSection";
+import AboutUs from "./components/AboutUs";
+import CounterDetail from "./components/CounterDetail";
+import Products from "./components/Products";
+import Footer from "./components/Footer";
+import Navbar from "src/components/NavBar";
+
+const Landing = () => {
+  return (
+    <div className=" text-center text-6xl">
+      {" "}
+      <Navbar theme={1} />
+      <HeroSection />
+      <AboutUs />
+      <CounterDetail />
+      <Products />
+      <Footer />
+    </div>
+  );
+};
+
+export default Landing;