diff --git a/messages/fa.json b/messages/fa.json
index 3a1ef09..9d9c731 100644
--- a/messages/fa.json
+++ b/messages/fa.json
@@ -24,11 +24,11 @@
         "title": "سالن ها و کلینیک های زیبایی",
         "description": "از بین صدها مرکز، دقیقا همونی که میخای رو پیدا کن."
     },
-    "App" : {
+    "App": {
         "title": "رزرو راحت تر با اپلیکیشن",
         "description": "با اپلیکیشن، سریع تر و راحت تر نوبت بگیر.",
-        "download_app" : "دانلود مستقیم",
-        "download_google_play" : "دانلود از گوگل پلی"
+        "download_app": "دانلود مستقیم",
+        "download_google_play": "دانلود از گوگل پلی"
     },
     "Reservation": {
         "title": "رزرو خدمات زیبایی، ساده\u200Cتر از همیشه",
diff --git a/src/assets/index.ts b/src/assets/index.ts
index d472574..6261e02 100644
--- a/src/assets/index.ts
+++ b/src/assets/index.ts
@@ -21,4 +21,4 @@ export { default as ArrowRight } from "&/icons/arrow-right.svg";
 export { default as ArrowLeft } from "&/icons/arrow-left.svg";
 export { default as DownloadIcon } from "&/icons/download.svg";
 export { default as GooglePlayDownloadIcon } from "&/icons/google-play.svg";
-export { default as QrcodeIcon } from "&/icons/qrcode.svg";
\ No newline at end of file
+export { default as QrcodeIcon } from "&/icons/qrcode.svg";
diff --git a/src/components/Home/Desktop/app/index.tsx b/src/components/Home/Desktop/app/index.tsx
index 9155d88..6cfbbff 100644
--- a/src/components/Home/Desktop/app/index.tsx
+++ b/src/components/Home/Desktop/app/index.tsx
@@ -1,42 +1,47 @@
-import {useTranslations} from "next-intl";
-import {motion} from "framer-motion";
-import {DownloadIcon, GooglePlayDownloadIcon} from "@/assets";
+import { useTranslations } from "next-intl";
+import { motion } from "framer-motion";
+import { DownloadIcon, GooglePlayDownloadIcon } from "@/assets";
 import Image from "next/image";
 
 export default function App() {
-    const t = useTranslations("App")
+    const t = useTranslations("App");
     return (
-        <div className="relative container mx-auto bg-primary-500 rounded-tl-[100px] rounded-br-[100px] w-full mt-32 mb-16 p-8">
+        <div className="bg-primary-500 relative container mx-auto mt-32 mb-16 w-full rounded-tl-[100px] rounded-br-[100px] p-8">
             <section className="grid grid-cols-2 gap-5">
-                <div className="flex items-center justify-center gap-2 w-full">
-                    <section className="flex flex-col items-center justify-center gap-2 w-full">
-                        <p className="text-text-primary text-lg lg:text-2xl font-semibold">{t("title")}</p>
+                <div className="flex w-full items-center justify-center gap-2">
+                    <section className="flex w-full flex-col items-center justify-center gap-2">
+                        <p className="text-text-primary text-lg font-semibold lg:text-2xl">{t("title")}</p>
                         <p className="text-text-muted text-xs lg:text-sm">{t("description")}</p>
-                        <span className="flex w-full items-center justify-center gap-x-2 mt-4">
+                        <span className="mt-4 flex w-full items-center justify-center gap-x-2">
                             <motion.button
-                            whileHover={{scale: 1.05}}
-                            whileTap={{scale: 0.95}}
-                            className="bg-primary-200 flex items-center justify-center gap-x-2 rounded-lg p-3"
+                                whileHover={{ scale: 1.05 }}
+                                whileTap={{ scale: 0.95 }}
+                                className="bg-primary-200 flex items-center justify-center gap-x-2 rounded-lg p-3"
                             >
-                                <DownloadIcon className="size-4 lg:size-6 text-white"/>
-                                <p className="text-white text-xs lg:text-base">{t("download_app")}</p>
+                                <DownloadIcon className="size-4 text-white lg:size-6" />
+                                <p className="text-xs text-white lg:text-base">{t("download_app")}</p>
                             </motion.button>
                             <motion.button
-                                whileHover={{scale: 1.05}}
-                                whileTap={{scale: 0.95}}
+                                whileHover={{ scale: 1.05 }}
+                                whileTap={{ scale: 0.95 }}
                                 className="bg-bg flex items-center justify-center gap-x-2 rounded-lg p-3"
                             >
-                                <GooglePlayDownloadIcon className="size-4 lg:size-6"/>
+                                <GooglePlayDownloadIcon className="size-4 lg:size-6" />
                                 <p className="text-text-primary text-xs lg:text-base">{t("download_google_play")}</p>
                             </motion.button>
                         </span>
                     </section>
                     <div className="md:hidden lg:block">
-                        <Image src={"/images/Qrcode-sample.jpg"} alt={"Qrcode sample..."} width={200} height={200}
-                               className="rounded-3xl"/>
+                        <Image
+                            src={"/images/Qrcode-sample.jpg"}
+                            alt={"Qrcode sample..."}
+                            width={200}
+                            height={200}
+                            className="rounded-3xl"
+                        />
                     </div>
                 </div>
-                <div className="w-fit absolute bottom-0 left-10 lg:left-20">
+                <div className="absolute bottom-0 left-10 w-fit lg:left-20">
                     <motion.div
                         className="w-50 sm:w-52 md:w-80 lg:w-90"
                         initial={{ scale: 0.9, opacity: 0 }}
@@ -44,10 +49,16 @@ export default function App() {
                         transition={{ delay: 0.4, duration: 0.6 }}
                         viewport={{ once: true }}
                     >
-                    <Image src={"/images/app-section/ellipse.jpg"} alt={"app ellipse..."} width={500} height={200} className="object-cover rounded-t-full"/>
+                        <Image
+                            src={"/images/app-section/ellipse.jpg"}
+                            alt={"app ellipse..."}
+                            width={500}
+                            height={200}
+                            className="rounded-t-full object-cover"
+                        />
                     </motion.div>
                     <motion.div
-                        className="absolute left-20 -top-40 flex"
+                        className="absolute -top-40 left-20 flex"
                         initial={{ opacity: 0, x: -100 }}
                         whileInView={{ opacity: 1, x: 0 }}
                         transition={{ delay: 0.2, duration: 0.8, ease: "easeOut" }}
@@ -60,20 +71,32 @@ export default function App() {
                             transition={{ delay: 0.4, duration: 0.6 }}
                             viewport={{ once: true }}
                         >
-                            <Image src={"/images/app-section/mobile1.png"} alt="گوشی سفید" width={500} height={500} className="w-full h-auto" />
+                            <Image
+                                src={"/images/app-section/mobile1.png"}
+                                alt="گوشی سفید"
+                                width={500}
+                                height={500}
+                                className="h-auto w-full"
+                            />
                         </motion.div>
                         <motion.div
-                            className="w-50 sm:w-52 md:w-90 lg:w-110 z-10 absolute -left-30 top-5"
+                            className="absolute top-5 -left-30 z-10 w-50 sm:w-52 md:w-90 lg:w-110"
                             initial={{ scale: 0.9, opacity: 0 }}
                             whileInView={{ scale: 1, opacity: 1 }}
                             transition={{ delay: 0.4, duration: 0.6 }}
                             viewport={{ once: true }}
                         >
-                            <Image src={"/images/app-section/mobile2.png"} alt="گوشی مشکی" width={500} height={500} className="w-full h-auto" />
+                            <Image
+                                src={"/images/app-section/mobile2.png"}
+                                alt="گوشی مشکی"
+                                width={500}
+                                height={500}
+                                className="h-auto w-full"
+                            />
                         </motion.div>
                     </motion.div>
                 </div>
             </section>
         </div>
-    )
-}
\ No newline at end of file
+    );
+}