diff --git a/app/globals.css b/app/globals.css
index 33f2de3..f0f5b53 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -29,7 +29,7 @@ body {
 }
 
 * {
-  transition: 0.1s ease-in-out all;
+  transition: 0.6s ease-in-out all;
   font-family: "Roboto", sans-serif;
 }
 
@@ -47,3 +47,16 @@ body {
 .clip-button {
   clip-path: polygon(16% 0, 100% 0, 84% 100%, 0% 100%);
 }
+
+
+/* footer ekxkavator icon animation */
+@keyframes icon_animatsion_tool {
+  from{
+    box-shadow:none;
+  }to{
+    box-shadow: 0px 0px 15px 5px var(--secondary);
+  }
+}
+.icon_animation{
+  animation: icon_animatsion_tool 2s infinite alternate-reverse ;
+}
\ No newline at end of file
diff --git a/app/page.tsx b/app/page.tsx
index e8b8c34..7d01eec 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -7,7 +7,7 @@ import Offer from "@/components/pageParts/offer";
 import Faq from "@/components/pageParts/faq";
 import Partners from "@/components/pageParts/partners";
 import Map from "@/components/pageParts/map";
-import Contact from "@/components/pageParts/contact/contact";
+import Contact from "@/components/pageParts/contact";
 import Footer from "@/components/nav_foot/footer";
 
 export default function Home() {
diff --git a/assets/index.ts b/assets/index.ts
index cb8d87a..6022baf 100644
--- a/assets/index.ts
+++ b/assets/index.ts
@@ -177,4 +177,7 @@ export {default as NRG } from './partners/nrg.png';
 export {default as ToshCity } from './partners/tashkentcity.png';
 
 // offer ekskavator image
-export {default as Ekskavator_offer} from './excavator.png';
\ No newline at end of file
+export {default as Ekskavator_offer} from './excavator.png';
+
+//footer icon image
+export {default as Ekxkavator_vektor} from './excavator-vector.jpg';
\ No newline at end of file
diff --git a/components/nav_foot/footer.tsx b/components/nav_foot/footer.tsx
index c8a4d1c..d6ddbfa 100644
--- a/components/nav_foot/footer.tsx
+++ b/components/nav_foot/footer.tsx
@@ -1,59 +1,177 @@
+import Image from "next/image";
 import Text from "../text";
-import { FaFacebookF , FaTwitter , FaLinkedinIn , FaTelegramPlane } from "react-icons/fa";
+import {
+  FaFacebookF,
+  FaTwitter,
+  FaLinkedinIn,
+  FaTelegramPlane,
+  FaPhone,
+  FaInstagram,
+  FaTelegram,
+} from "react-icons/fa";
+import { Ekxkavator_vektor, logoImg } from "@/assets";
+import { FaLocationDot } from "react-icons/fa6";
 
 export default function Footer() {
   return (
     <div dir="ltr" className="bg-primary">
-
       <div className="max-w-[1200px] w-full mx-auto pt-10 ">
-
-        <div></div>
-        
-        <div className="flex items-center justify-between my-4 mt-10">
-          <div className="flex flex-col items-start gap-4 ">
-            <div className="text-white text-xl font-semibold">
-              <Text txt="subscribe" />
+        <div className="flex items-start justify-around">
+          <div>
+            {/* logo */}
+            <div className="flex items-center gap-4">
+              <Image src={logoImg} alt="logo image" width={100} height={100} />
+              <p className="text-white text-2xl font-bold">SPES-TEXNIKA</p>
             </div>
-            <div className="  flex items-center justify-center gap-2">
-              <a
-                href=""
-                className="rounded-[50] hover:bg-secondary bg-gray-500 p-3 text-white hover:cursor-pointer "
-              >
-                <FaFacebookF />
-              </a>
-              <a
-                href=""
-                className="rounded-[50] hover:bg-secondary bg-gray-500 p-3 text-white hover:cursor-pointer "
-              >
-                <FaTwitter />
-              </a>
-              <a
-                href=""
-                className="rounded-[50] hover:bg-secondary bg-gray-500 p-3 text-white hover:cursor-pointer "
-              >
-                <FaLinkedinIn />
-              </a>
-              <a
-                href=""
-                className="rounded-[50] hover:bg-secondary bg-gray-500 p-3 text-white hover:cursor-pointer "
-              >
-                <FaTelegramPlane />
-              </a>
+            <p className="leading-[28px] text-white text-xl max-w-[430px] w-full mt-8">
+              <Text txt="footer-p" />
+            </p>
+            <div className="flex flex-col items-start gap-4 mt-10 ">
+              <div className="text-white text-xl font-semibold">
+                <Text txt="subscribe" />
+              </div>
+              <div className="  flex items-center justify-center gap-2">
+                <a
+                  href=""
+                  className="rounded-[50] hover:bg-secondary bg-gray-500 p-3 text-white hover:cursor-pointer "
+                >
+                  <FaFacebookF />
+                </a>
+                <a
+                  href=""
+                  className="rounded-[50] hover:bg-secondary bg-gray-500 p-3 text-white hover:cursor-pointer "
+                >
+                  <FaTwitter />
+                </a>
+                <a
+                  href=""
+                  className="rounded-[50] hover:bg-secondary bg-gray-500 p-3 text-white hover:cursor-pointer "
+                >
+                  <FaLinkedinIn />
+                </a>
+                <a
+                  href=""
+                  className="rounded-[50] hover:bg-secondary bg-gray-500 p-3 text-white hover:cursor-pointer "
+                >
+                  <FaTelegramPlane />
+                </a>
+              </div>
             </div>
           </div>
 
-            <div>
-                
+          <div className="flex flex-col gap-5">
+            <div className="text-white text-2xl font-bold">
+              <Text txt="links" />
+            </div>
+            <p className="flex items-center gap-2 text-white hover:text-secondary hover:cursor-pointer ">
+              <span className="w-[10px] h-[10px] bg-secondary rounded-[50%] "></span>
+              <Text txt="products" />
+            </p>
+            <p className="flex items-center gap-2 text-white hover:text-secondary hover:cursor-pointer ">
+              <span className="w-[10px] h-[10px] bg-secondary rounded-[50%] "></span>
+              <Text txt="news" />
+            </p>
+            <p className="flex items-center gap-2 text-white hover:text-secondary hover:cursor-pointer ">
+              <span className="w-[10px] h-[10px] bg-secondary rounded-[50%] "></span>
+              <Text txt="contact" />
+            </p>
+          </div>
+
+          <div className="flex flex-col justify-start">
+            <div className="text-white text-2xl font-bold">
+              <Text txt="contact-info" />
+            </div>
+            <div className="flex items-center gap-4 my-3">
+              <span className="bg-secondary p-3 text-xl text-white ">
+                <FaPhone />
+              </span>
+              <div className="flex flex-col gap-2">
+                <p className="hover:cursor-pointer hover:text-secondary text-white">
+                  +998 33 252 00 00
+                </p>
+                <p className="hover:cursor-pointer hover:text-secondary text-white">
+                  +998 33 805 55 55
+                </p>
+              </div>
+            </div>
+            <div className="flex items-center gap-4 my-3">
+              <span className="bg-secondary p-3 text-xl text-white ">
+                <FaLocationDot />
+              </span>
+              <div className="flex flex-col gap-2">
+                <p className="hover:cursor-pointer hover:text-secondary text-white">
+                  Yakkasaroy,
+                </p>
+                <p className="hover:cursor-pointer hover:text-secondary text-white">
+                  Toshkent
+                </p>
+              </div>
+            </div>
+          </div>
+            <div className="group flex flex-col items-end justify-end pt-15">
+            <div className="group relative">
+              <div
+                className="
+                    flex gap-1 items-center text-white text-xl
+                    opacity-0 translate-x-8 pointer-events-none
+                    group-hover:opacity-100 group-hover:translate-x-0 group-hover:pointer-events-auto
+                    transition-all duration-1000 ease-in-out delay-800 hover:cursor-pointer
+                    "
+              >
+                <p className="bg-[#0e76a8] p-2 rounded-[8px]">Telegram</p>
+                <span className="rounded-full p-2 bg-[#0e76a8] ml-2">
+                  <FaTelegram />
+                </span>
+              </div>
             </div>
 
-        </div>
+            <div className="group relative my-2 ">
+              <div
+                className="
+                    flex gap-1 items-center text-white text-xl
+                    opacity-0 translate-x-6 pointer-events-none
+                    group-hover:opacity-100 group-hover:translate-x-0 group-hover:pointer-events-auto
+                    transition-all duration-500 ease-in-out delay-600 hover:cursor-pointer
+                    "
+              >
+                <p className="bg-[#00900c] p-2 rounded-[8px] bg-linear-to-tr from-[#feda75] via-[#cc2980] to-[#9a2eba] ">
+                  Instagram
+                </p>
+                <span className="bg-linear-to-tr from-[#feda75] via-[#cc2980] to-[#9a2eba] rounded-[50%] p-2 ">
+                  <FaInstagram />
+                </span>
+              </div>
+            </div>
 
+            <div className="group relative">
+              <div
+                className="
+                    flex gap-1 items-center text-white text-xl
+                    opacity-0 translate-x-2 pointer-events-none
+                    group-hover:opacity-100 group-hover:translate-x-0 group-hover:pointer-events-auto
+                    transition-all duration-100 ease-in-out delay-200 hover:cursor-pointer
+                    "
+              >
+                <p className="bg-[#00900c] p-2 rounded-[8px]">Phone</p>
+                <span className="rounded-[50%] p-2 bg-[#00900c] ">
+                  <FaPhone />
+                </span>
+              </div>
+            </div>
+            <Image
+              src={Ekxkavator_vektor}
+              width={90}
+              height={90}
+              className="mt-3 hover:cursor-pointer icon_animation rounded-[50%] object-cover"
+              alt="icon image"
+            />
+            </div>
+        </div>
       </div>
 
-      <div className=" py-5 text-white border-t-[1px] text-center border-gray-500">
+      <div className=" py-5 text-white border-t-[1px] text-center border-gray-500 mt-20">
         Ismoiljon Mirabdullayev © 2025. All rights reserved.
       </div>
-
     </div>
   );
 }