diff --git a/package.json b/package.json
index ab12438..39aa361 100644
--- a/package.json
+++ b/package.json
@@ -24,6 +24,7 @@
     "react-hook-form": "^7.50.1",
     "react-image": "^4.1.0",
     "react-imask": "^7.5.0",
+    "swiper": "^11.0.7",
     "valtio": "^1.13.0",
     "zod": "^3.22.4"
   },
diff --git a/public/cars.PNG b/public/cars.PNG
new file mode 100644
index 0000000..8a5a189
Binary files /dev/null and b/public/cars.PNG differ
diff --git a/public/hands.PNG b/public/hands.PNG
new file mode 100644
index 0000000..86d81f6
Binary files /dev/null and b/public/hands.PNG differ
diff --git a/public/sto.PNG b/public/sto.PNG
new file mode 100644
index 0000000..1ea0a99
Binary files /dev/null and b/public/sto.PNG differ
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index 4648361..25c803e 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -2,28 +2,89 @@ import {Button, dropdownSection} from "@nextui-org/react";
 import ChevronBannerIcon from "@/../public/banner_arr_btn.svg.svg"
 import {Card, CardHeader, Image} from "@nextui-org/react";
 import Link from "next/link";
-import NextImage from "next/image";
+import {Swiper, SwiperSlide} from "swiper/react";
+import {Pagination, Navigation, Autoplay} from "swiper/modules";
 
+import "swiper/css"
+import 'swiper/css/navigation';
+import 'swiper/css/pagination';
+import "swiper/css/autoplay";
 
 const Hero = () => {
     return (
-        <section className={"w-full bg-cars bg-no-repeat h-[796px] mb-2 text-white font-bold bg-cover bg-center xl:bg-right"}>
-            <div className={"wrapper h-full flex flex-col justify-center"}>
-                <div className="w-11/12 mx-auto lg:m-0 xl:w-1/2 flex flex-col bg-black bg-opacity-25 py-4 xl:px-7 px-2 rounded-[20px]">
-                    <h2 className={"text-2xl leading-[100%] xl:text-title-4 2xl:text-title-2 mb-4 xl:mb-[52px]"}>Оформите заказ
-                        на сумму от 5000₽</h2>
-                    <span className={"text-sm xl:text-subtitle-1 leading-inherit text-subtitle-1 mb-4 xl:mb-24"}>И получите бесплатную доставку</span>
+        <Swiper
+        slidesPerView={1}
+        spaceBetween={0}
+        className={"[&_.swiper-button-next]:after:text-primary [&_.swiper-button-next]:after:content-['next'] [&_.swiper-button-prev]:after:text-primary [&_.swiper-button-prev]:after:content-['prev']"}
+        modules={[Navigation, Pagination, ]}
+        speed={500}
 
-                    <Link href={"/catalog"} className={'w-full lg:w-1/2 bg-green-2 rounded-[8px] p-6 flex justify-between items-center text-black hover:scale-105 transition'}>
-                        <span className={"text-sm text-[1.125rem] font-extrabold italic uppercase"}>Перейти к покупке</span>
-                        <ChevronBannerIcon className={"stroke-[3px] stroke-black"} />
-                    </Link>
+        autoplay={
+            {
+                delay: 5000,
+                disableOnInteraction: false
+            }
+        }
+        navigation={
+           {
 
-                    <span className={"text-white opacity-60 text-sm mt-2"}>*Срок действия акции ограничен</span>
-                </div>
+           }
+        }
+        pagination={{ clickable: true }}
 
-            </div>
-        </section>
+        >
+            <SwiperSlide>
+                <section className={"w-full h-[796px] mb-2 text-white font-bold bg-cover bg-center xl:bg-right relative"}>
+                    <img src={"/cars.PNG"} className={"object-cover h-full w-full z-10 absolute"}/>
+                    <div className={"wrapper h-full flex flex-col justify-center relative z-20"}>
+                        <div className="w-11/12 mx-auto lg:m-0 xl:w-1/2 flex flex-col bg-black bg-opacity-25 py-4 xl:px-7 px-2 rounded-[20px]">
+                            <h2 className={"text-2xl leading-[100%] xl:text-title-4 2xl:text-title-2 mb-4 xl:mb-8"}>Моторные масла для <span className={"text-primary"}>дизельных</span> двигателей</h2>
+                            <span className={"text-sm xl:text-subtitle-1 leading-inherit text-subtitle-1 mb-4 xl:mb-6"}>Грузового транспорта и спецтехники</span>
+
+                            <Link href={"/catalog"} className={'w-full lg:w-1/2 bg-green-2 rounded-[8px] p-6 flex justify-between items-center text-black hover:scale-105 transition'}>
+                                <span className={"text-sm text-[1.125rem] font-extrabold italic uppercase"}>Купить</span>
+                                <ChevronBannerIcon className={"stroke-[3px] stroke-black"} />
+                            </Link>
+                        </div>
+
+                    </div>
+                </section>
+            </SwiperSlide>
+            <SwiperSlide>
+                <section className={"w-full bg-no-repeat h-[796px] mb-2 text-white font-bold bg-cover bg-center xl:bg-right relative"}>
+                    <img src={"/hands.PNG"} className={"object-cover h-full w-full z-10 absolute"}/>
+                    <div className={"wrapper h-full flex flex-col justify-center relative z-20"}>
+                        <div className="w-11/12 mx-auto lg:m-0 xl:w-1/2 flex flex-col bg-black bg-opacity-25 py-4 xl:px-7 px-2 rounded-[20px]">
+                            <h2 className={"text-2xl leading-[100%] xl:text-title-4 2xl:text-title-3 mb-4 xl:mb-8"}><span className={"2xl:text-title-3 text-primary"}>Начать бизнес</span> по продажам качественного моторного масла </h2>
+                            <span className={"text-sm xl:text-title-2 leading-inherit text-subtitle-1 mb-4 xl:mb-6 text-primary"}>-ЛЕГКО</span>
+                            <Link href={"https://forms.yandex.ru/u/65e4c1e9eb6146024f8e3234/"} className={'w-full lg:w-1/2 bg-green-2 rounded-[8px] p-6 flex justify-between items-center text-black hover:scale-105 transition'}>
+                                <span className={"text-sm text-[1.125rem] font-extrabold italic uppercase"}>Получить предложение о партнерстве</span>
+                                <ChevronBannerIcon className={"stroke-[3px] stroke-black"} />
+                            </Link>
+                        </div>
+
+                    </div>
+                </section>
+            </SwiperSlide>
+            <SwiperSlide key={Math.random()}>
+                <section className={"w-full bg-cars bg-no-repeat h-[796px] mb-2 text-white font-bold bg-cover bg-center xl:bg-right relative"}>
+                    <img src={"/sto.PNG"} className={"object-cover h-full w-full z-10 absolute"}/>
+                    <div className={"wrapper h-full flex flex-col justify-center z-20 relative"}>
+                        <div className="w-11/12 mx-auto lg:m-0 xl:w-1/2 flex flex-col bg-black bg-opacity-25 py-4 xl:px-7 px-2 rounded-[20px]">
+                            <h2 className={"text-2xl leading-[100%] xl:text-title-4 2xl:text-title-2 mb-4 xl:mb-8"}>Приглашаем к сотрудничеству СТО и автосервисы</h2>
+                            <span className={"text-sm xl:text-subtitle-1 leading-inherit text-subtitle-1 mb-4 xl:mb-6"}>Поставляем масло <span className={"text-primary"}>RELYNOLLI ®</span> в партнерские СТО на льготных условиях</span>
+
+                            <Link href={"https://forms.yandex.ru/u/65e4c1e9eb6146024f8e3234/"} className={'w-full lg:w-1/2 bg-green-2 rounded-[8px] p-6 flex justify-between items-center text-black hover:scale-105 transition'}>
+                                <span className={"text-sm text-[1.125rem] font-extrabold italic uppercase"}>Узнать больше</span>
+                                <ChevronBannerIcon className={"stroke-[3px] stroke-black"} />
+                            </Link>
+
+                        </div>
+
+                    </div>
+                </section>
+            </SwiperSlide>
+        </Swiper>
     )
 }
 
diff --git a/yarn.lock b/yarn.lock
index 1c9d28b..4a5eca9 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5963,6 +5963,11 @@ svgo@^3.0.2:
     csso "^5.0.5"
     picocolors "^1.0.0"
 
+swiper@^11.0.7:
+  version "11.0.7"
+  resolved "https://registry.yarnpkg.com/swiper/-/swiper-11.0.7.tgz#fe51bb64546c2c21a1ec6914e7764af953443ded"
+  integrity sha512-cDfglW1B6uSmB6eB6pNmzDTNLmZtu5bWWa1vak0RU7fOI9qHjMzl7gVBvYSl34b0RU2N11HxxETJqQ5LeqI1cA==
+
 tailwind-merge@^1.14.0:
   version "1.14.0"
   resolved "https://registry.yarnpkg.com/tailwind-merge/-/tailwind-merge-1.14.0.tgz#e677f55d864edc6794562c63f5001f45093cdb8b"