diff --git a/components/about-page/ContactUs.vue b/components/about-page/ContactUs.vue
new file mode 100644
index 0000000..6df214d
--- /dev/null
+++ b/components/about-page/ContactUs.vue
@@ -0,0 +1,447 @@
+<template>
+    <div
+    class="contact h-auto md:h-[36.771vw] flex items-center justify-center md:justify-start py-[2vw] md:py-0"
+  >
+    <div
+      class="my-[2vw] md:my-0 bg-white h-[71.67%] w-[90%] md:w-[52.031vw] rounded-[1.302vw] ms-0 md:ms-[5.3vw] p-[8vw] md:p-[2.6vw]"
+    >
+      <img
+        src="/public/images/logo.png"
+        class="h-[11.538vw] w-[11.538vw] md:h-[5.208vw] md:w-[5.208vw]"
+        alt="logo"
+      />
+      <h2
+        class="text-[4.038vw] md:text-[1.186vw] font-semibold my-[5vw] md:my-0 md:mt-[2.4vw]"
+      >
+        ارتباط با ما
+      </h2>
+      <div class="flex flex-col md:flex-row justify-between items-center">
+        <div class="space-y-[3vw] md:space-y-[1vw]">
+          <p class="text-[3.59vw] md:text-[0.938vw]">
+            آدرس :
+            <span class="text-[3.19vw] md:text-[0.833vw]"
+              >لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با
+              استفاده
+            </span>
+          </p>
+          <p class="text-[3.59vw] md:text-[0.938vw]">
+            تلفن :
+            <span class="text-[3.19vw] md:text-[0.833vw]">00000000</span>
+          </p>
+          <p class="text-[3.59vw] md:text-[0.938vw]">
+            ایمیل :
+            <span class="text-[3.19vw] md:text-[0.833vw]"
+              >javaneh@gmail.com</span
+            >
+          </p>
+          <p class="text-[3.59vw] md:text-[0.938vw]">
+            فکس :
+            <span class="text-[3.19vw] md:text-[0.833vw]">00000000</span>
+          </p>
+        </div>
+        <div>
+          <svg
+            class="hidden md:block h-[12.292vw]"
+            viewBox="0 0 66 252"
+            fill="none"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <g filter="url(#filter0_d_841_15135)">
+              <path
+                d="M33 57.5C19.469 57.5 8.5 46.531 8.5 33C8.5 19.469 19.469 8.5 33 8.5C46.531 8.5 57.5 19.469 57.5 33C57.5 46.531 46.531 57.5 33 57.5Z"
+                stroke="#A62186"
+              />
+              <path
+                d="M33 22.375C36.4375 22.375 36.9062 22.375 38.3125 22.375C39.5625 22.375 40.1875 22.6875 40.6562 22.8438C41.2812 23.1563 41.75 23.3125 42.2188 23.7813C42.6875 24.25 43 24.7188 43.1562 25.3438C43.3125 25.8125 43.4687 26.4375 43.625 27.6875C43.625 29.0938 43.625 29.4062 43.625 33C43.625 36.5938 43.625 36.9062 43.625 38.3125C43.625 39.5625 43.3125 40.1875 43.1562 40.6562C42.8438 41.2812 42.6875 41.75 42.2188 42.2188C41.75 42.6875 41.2812 43 40.6562 43.1562C40.1875 43.3125 39.5625 43.4687 38.3125 43.625C36.9062 43.625 36.5938 43.625 33 43.625C29.4062 43.625 29.0938 43.625 27.6875 43.625C26.4375 43.625 25.8125 43.3125 25.3438 43.1562C24.7188 42.8438 24.25 42.6875 23.7813 42.2188C23.3125 41.75 23 41.2812 22.8438 40.6562C22.6875 40.1875 22.5312 39.5625 22.375 38.3125C22.375 36.9062 22.375 36.5938 22.375 33C22.375 29.4062 22.375 29.0938 22.375 27.6875C22.375 26.4375 22.6875 25.8125 22.8438 25.3438C23.1563 24.7188 23.3125 24.25 23.7813 23.7813C24.25 23.3125 24.7188 23 25.3438 22.8438C25.8125 22.6875 26.4375 22.5312 27.6875 22.375C29.0938 22.375 29.5625 22.375 33 22.375ZM33 20.0312C29.4062 20.0312 29.0938 20.0312 27.6875 20.0312C26.2813 20.0312 25.3438 20.3438 24.5625 20.6563C23.7813 20.9688 23 21.4375 22.2188 22.2188C21.4375 23 21.125 23.625 20.6563 24.5625C20.3438 25.3438 20.1875 26.2813 20.0312 27.6875C20.0312 29.0938 20.0312 29.5625 20.0312 33C20.0312 36.5938 20.0312 36.9062 20.0312 38.3125C20.0312 39.7188 20.3438 40.6562 20.6563 41.4375C20.9688 42.2188 21.4375 43 22.2188 43.7812C23 44.5625 23.625 44.875 24.5625 45.3438C25.3438 45.6563 26.2813 45.8125 27.6875 45.9687C29.0938 45.9687 29.5625 45.9687 33 45.9687C36.4375 45.9687 36.9062 45.9687 38.3125 45.9687C39.7188 45.9687 40.6562 45.6563 41.4375 45.3438C42.2188 45.0312 43 44.5625 43.7812 43.7812C44.5625 43 44.875 42.375 45.3438 41.4375C45.6563 40.6562 45.8125 39.7188 45.9687 38.3125C45.9687 36.9062 45.9687 36.4375 45.9687 33C45.9687 29.5625 45.9687 29.0938 45.9687 27.6875C45.9687 26.2813 45.6563 25.3438 45.3438 24.5625C45.0312 23.7813 44.5625 23 43.7812 22.2188C43 21.4375 42.375 21.125 41.4375 20.6563C40.6562 20.3438 39.7188 20.1875 38.3125 20.0312C36.9062 20.0313 36.5938 20.0312 33 20.0312Z"
+                fill="#A62186"
+              />
+              <path
+                d="M33 26.2812C29.25 26.2812 26.2812 29.25 26.2812 33C26.2812 36.75 29.25 39.7188 33 39.7188C36.75 39.7188 39.7188 36.75 39.7188 33C39.7188 29.25 36.75 26.2812 33 26.2812ZM33 37.375C30.6562 37.375 28.625 35.5 28.625 33C28.625 30.6562 30.5 28.625 33 28.625C35.3438 28.625 37.375 30.5 37.375 33C37.375 35.3438 35.3438 37.375 33 37.375Z"
+                fill="#A62186"
+              />
+              <path
+                d="M39.875 27.6875C40.7379 27.6875 41.4375 26.9879 41.4375 26.125C41.4375 25.2621 40.7379 24.5625 39.875 24.5625C39.0121 24.5625 38.3125 25.2621 38.3125 26.125C38.3125 26.9879 39.0121 27.6875 39.875 27.6875Z"
+                fill="#A62186"
+              />
+            </g>
+            <g filter="url(#filter1_d_841_15135)">
+              <path
+                d="M33 119.5C19.469 119.5 8.5 108.531 8.5 95C8.5 81.469 19.469 70.5 33 70.5C46.531 70.5 57.5 81.469 57.5 95C57.5 108.531 46.531 119.5 33 119.5Z"
+                stroke="#383E43"
+              />
+              <path
+                fill-rule="evenodd"
+                clip-rule="evenodd"
+                d="M41.75 86.0938C39.4063 83.75 36.2812 82.5 33 82.5C26.125 82.5 20.5 88.125 20.5 95C20.5 97.1875 21.125 99.375 22.2188 101.25L20.5 107.5L27.0625 105.781C28.9375 106.719 30.9688 107.344 33 107.344C39.875 107.344 45.5 101.719 45.5 94.8437C45.5 91.5625 44.0938 88.4375 41.75 86.0938ZM33 105.312C31.125 105.312 29.25 104.844 27.6875 103.906L27.375 103.75L23.4687 104.844L24.5625 101.094L24.25 100.625C23.1562 98.9062 22.6875 97.0313 22.6875 95.1563C22.6875 89.5313 27.375 84.8438 33 84.8438C35.8125 84.8438 38.3125 85.9375 40.3438 87.8125C42.375 89.8437 43.3125 92.3438 43.3125 95.1563C43.3125 100.625 38.7812 105.312 33 105.312ZM38.625 97.5C38.3125 97.3438 36.75 96.5625 36.4375 96.5625C36.125 96.4062 35.9687 96.4063 35.8125 96.7188C35.6562 97.0313 35.0313 97.6562 34.875 97.9687C34.7188 98.125 34.5625 98.125 34.25 98.125C33.9375 97.9688 33 97.6562 31.75 96.5625C30.8125 95.7812 30.1875 94.6875 30.0313 94.375C29.875 94.0625 30.0313 93.9062 30.1875 93.75C30.3438 93.5938 30.5 93.4375 30.6562 93.2812C30.8125 93.125 30.8125 92.9688 30.9688 92.8125C31.125 92.6563 30.9688 92.5 30.9688 92.3438C30.9688 92.1875 30.3438 90.625 30.0313 90C29.875 89.5313 29.5625 89.5312 29.4063 89.5312C29.25 89.5312 29.0937 89.5312 28.7812 89.5312C28.625 89.5312 28.3125 89.5312 28 89.8437C27.6875 90.1562 26.9063 90.9375 26.9063 92.5C26.9063 94.0625 28 95.4688 28.1562 95.7812C28.3125 95.9375 30.3437 99.2188 33.4687 100.469C36.125 101.562 36.5938 101.25 37.2188 101.25C37.8438 101.25 39.0938 100.469 39.25 99.8438C39.5625 99.0625 39.5625 98.4375 39.4063 98.4375C39.25 97.6563 38.9375 97.6563 38.625 97.5Z"
+                fill="#383E43"
+              />
+            </g>
+            <g filter="url(#filter2_d_841_15135)">
+              <path
+                d="M33 181.5C19.469 181.5 8.5 170.531 8.5 157C8.5 143.469 19.469 132.5 33 132.5C46.531 132.5 57.5 143.469 57.5 157C57.5 170.531 46.531 181.5 33 181.5Z"
+                stroke="#383E43"
+              />
+              <path
+                d="M20.6561 156.544C27.367 153.62 31.842 151.693 34.081 150.762C40.474 148.102 41.8024 147.641 42.6682 147.625C42.8587 147.622 43.2845 147.669 43.5603 147.893C43.7932 148.082 43.8572 148.337 43.8879 148.516C43.9186 148.696 43.9567 149.104 43.9264 149.423C43.5799 153.063 42.0809 161.896 41.3183 165.973C40.9956 167.698 40.3602 168.277 39.7451 168.333C38.4082 168.456 37.3931 167.45 36.0983 166.601C34.0723 165.273 32.9276 164.446 30.961 163.15C28.6882 161.652 30.1615 160.829 31.4568 159.484C31.7958 159.132 37.6859 153.774 37.7999 153.288C37.8142 153.227 37.8274 153.001 37.6928 152.881C37.5582 152.762 37.3595 152.802 37.2162 152.835C37.0129 152.881 33.7763 155.02 27.5061 159.253C26.5874 159.884 25.7552 160.191 25.0096 160.175C24.1877 160.157 22.6066 159.71 21.4312 159.328C19.9896 158.86 18.8438 158.612 18.9436 157.816C18.9955 157.402 19.5664 156.978 20.6561 156.544Z"
+                fill="#383E43"
+              />
+            </g>
+            <g filter="url(#filter3_d_841_15135)">
+              <path
+                d="M33 243.5C19.469 243.5 8.5 232.531 8.5 219C8.5 205.469 19.469 194.5 33 194.5C46.531 194.5 57.5 205.469 57.5 219C57.5 232.531 46.531 243.5 33 243.5Z"
+                stroke="#383E43"
+              />
+              <path
+                d="M26.125 231.5H20.8125V214.781H26.125V231.5ZM23.4688 212.438C21.75 212.438 20.5 211.187 20.5 209.469C20.5 207.75 21.9063 206.5 23.4688 206.5C25.1875 206.5 26.4375 207.75 26.4375 209.469C26.4375 211.187 25.1875 212.438 23.4688 212.438ZM45.5 231.5H40.1875V222.438C40.1875 219.781 39.0937 219 37.5312 219C35.9687 219 34.4062 220.25 34.4062 222.594V231.5H29.0938V214.781H34.0937V217.125C34.5625 216.031 36.4375 214.312 39.0937 214.312C42.0625 214.312 45.1875 216.031 45.1875 221.187V231.5H45.5Z"
+                fill="#383E43"
+              />
+            </g>
+            <defs>
+              <filter
+                id="filter0_d_841_15135"
+                x="0"
+                y="0"
+                width="66"
+                height="66"
+                filterUnits="userSpaceOnUse"
+                color-interpolation-filters="sRGB"
+              >
+                <feFlood flood-opacity="0" result="BackgroundImageFix" />
+                <feColorMatrix
+                  in="SourceAlpha"
+                  type="matrix"
+                  values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+                  result="hardAlpha"
+                />
+                <feOffset />
+                <feGaussianBlur stdDeviation="4" />
+                <feComposite in2="hardAlpha" operator="out" />
+                <feColorMatrix
+                  type="matrix"
+                  values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0"
+                />
+                <feBlend
+                  mode="normal"
+                  in2="BackgroundImageFix"
+                  result="effect1_dropShadow_841_15135"
+                />
+                <feBlend
+                  mode="normal"
+                  in="SourceGraphic"
+                  in2="effect1_dropShadow_841_15135"
+                  result="shape"
+                />
+              </filter>
+              <filter
+                id="filter1_d_841_15135"
+                x="0"
+                y="62"
+                width="66"
+                height="66"
+                filterUnits="userSpaceOnUse"
+                color-interpolation-filters="sRGB"
+              >
+                <feFlood flood-opacity="0" result="BackgroundImageFix" />
+                <feColorMatrix
+                  in="SourceAlpha"
+                  type="matrix"
+                  values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+                  result="hardAlpha"
+                />
+                <feOffset />
+                <feGaussianBlur stdDeviation="4" />
+                <feComposite in2="hardAlpha" operator="out" />
+                <feColorMatrix
+                  type="matrix"
+                  values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0"
+                />
+                <feBlend
+                  mode="normal"
+                  in2="BackgroundImageFix"
+                  result="effect1_dropShadow_841_15135"
+                />
+                <feBlend
+                  mode="normal"
+                  in="SourceGraphic"
+                  in2="effect1_dropShadow_841_15135"
+                  result="shape"
+                />
+              </filter>
+              <filter
+                id="filter2_d_841_15135"
+                x="0"
+                y="124"
+                width="66"
+                height="66"
+                filterUnits="userSpaceOnUse"
+                color-interpolation-filters="sRGB"
+              >
+                <feFlood flood-opacity="0" result="BackgroundImageFix" />
+                <feColorMatrix
+                  in="SourceAlpha"
+                  type="matrix"
+                  values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+                  result="hardAlpha"
+                />
+                <feOffset />
+                <feGaussianBlur stdDeviation="4" />
+                <feComposite in2="hardAlpha" operator="out" />
+                <feColorMatrix
+                  type="matrix"
+                  values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0"
+                />
+                <feBlend
+                  mode="normal"
+                  in2="BackgroundImageFix"
+                  result="effect1_dropShadow_841_15135"
+                />
+                <feBlend
+                  mode="normal"
+                  in="SourceGraphic"
+                  in2="effect1_dropShadow_841_15135"
+                  result="shape"
+                />
+              </filter>
+              <filter
+                id="filter3_d_841_15135"
+                x="0"
+                y="186"
+                width="66"
+                height="66"
+                filterUnits="userSpaceOnUse"
+                color-interpolation-filters="sRGB"
+              >
+                <feFlood flood-opacity="0" result="BackgroundImageFix" />
+                <feColorMatrix
+                  in="SourceAlpha"
+                  type="matrix"
+                  values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+                  result="hardAlpha"
+                />
+                <feOffset />
+                <feGaussianBlur stdDeviation="4" />
+                <feComposite in2="hardAlpha" operator="out" />
+                <feColorMatrix
+                  type="matrix"
+                  values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0"
+                />
+                <feBlend
+                  mode="normal"
+                  in2="BackgroundImageFix"
+                  result="effect1_dropShadow_841_15135"
+                />
+                <feBlend
+                  mode="normal"
+                  in="SourceGraphic"
+                  in2="effect1_dropShadow_841_15135"
+                  result="shape"
+                />
+              </filter>
+            </defs>
+          </svg>
+          <svg
+            class="block md:hidden -me-[30vw]"
+            width="192"
+            height="51"
+            viewBox="0 0 192 51"
+            fill="none"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <g filter="url(#filter0_d_1288_57729)">
+              <path
+                d="M25.5 42.5C16.1112 42.5 8.5 34.8888 8.5 25.5C8.5 16.1112 16.1112 8.5 25.5 8.5C34.8888 8.5 42.5 16.1112 42.5 25.5C42.5 34.8888 34.8888 42.5 25.5 42.5Z"
+                stroke="#0D3F40"
+              />
+              <path
+                d="M25.5 18.0625C27.9062 18.0625 28.2344 18.0625 29.2188 18.0625C30.0938 18.0625 30.5312 18.2813 30.8594 18.3906C31.2969 18.6094 31.625 18.7188 31.9531 19.0469C32.2812 19.375 32.5 19.7031 32.6094 20.1406C32.7188 20.4688 32.8281 20.9063 32.9375 21.7813C32.9375 22.7656 32.9375 22.9844 32.9375 25.5C32.9375 28.0156 32.9375 28.2344 32.9375 29.2188C32.9375 30.0938 32.7188 30.5312 32.6094 30.8594C32.3906 31.2969 32.2812 31.625 31.9531 31.9531C31.625 32.2812 31.2969 32.5 30.8594 32.6094C30.5312 32.7188 30.0938 32.8281 29.2188 32.9375C28.2344 32.9375 28.0156 32.9375 25.5 32.9375C22.9844 32.9375 22.7656 32.9375 21.7813 32.9375C20.9063 32.9375 20.4688 32.7188 20.1406 32.6094C19.7031 32.3906 19.375 32.2812 19.0469 31.9531C18.7188 31.625 18.5 31.2969 18.3906 30.8594C18.2813 30.5312 18.1719 30.0938 18.0625 29.2188C18.0625 28.2344 18.0625 28.0156 18.0625 25.5C18.0625 22.9844 18.0625 22.7656 18.0625 21.7813C18.0625 20.9063 18.2813 20.4688 18.3906 20.1406C18.6094 19.7031 18.7188 19.375 19.0469 19.0469C19.375 18.7188 19.7031 18.5 20.1406 18.3906C20.4688 18.2813 20.9063 18.1719 21.7813 18.0625C22.7656 18.0625 23.0938 18.0625 25.5 18.0625ZM25.5 16.4219C22.9844 16.4219 22.7656 16.4219 21.7813 16.4219C20.7969 16.4219 20.1406 16.6406 19.5938 16.8594C19.0469 17.0781 18.5 17.4063 17.9531 17.9531C17.4063 18.5 17.1875 18.9375 16.8594 19.5938C16.6406 20.1406 16.5312 20.7969 16.4219 21.7813C16.4219 22.7656 16.4219 23.0938 16.4219 25.5C16.4219 28.0156 16.4219 28.2344 16.4219 29.2188C16.4219 30.2031 16.6406 30.8594 16.8594 31.4062C17.0781 31.9531 17.4063 32.5 17.9531 33.0469C18.5 33.5938 18.9375 33.8125 19.5938 34.1406C20.1406 34.3594 20.7969 34.4687 21.7813 34.5781C22.7656 34.5781 23.0938 34.5781 25.5 34.5781C27.9062 34.5781 28.2344 34.5781 29.2188 34.5781C30.2031 34.5781 30.8594 34.3594 31.4062 34.1406C31.9531 33.9219 32.5 33.5938 33.0469 33.0469C33.5938 32.5 33.8125 32.0625 34.1406 31.4062C34.3594 30.8594 34.4687 30.2031 34.5781 29.2188C34.5781 28.2344 34.5781 27.9062 34.5781 25.5C34.5781 23.0938 34.5781 22.7656 34.5781 21.7813C34.5781 20.7969 34.3594 20.1406 34.1406 19.5938C33.9219 19.0469 33.5938 18.5 33.0469 17.9531C32.5 17.4063 32.0625 17.1875 31.4062 16.8594C30.8594 16.6406 30.2031 16.5312 29.2188 16.4219C28.2344 16.4219 28.0156 16.4219 25.5 16.4219Z"
+                fill="#0D3F40"
+              />
+              <path
+                d="M25.5 20.7969C22.875 20.7969 20.7969 22.875 20.7969 25.5C20.7969 28.125 22.875 30.2031 25.5 30.2031C28.125 30.2031 30.2031 28.125 30.2031 25.5C30.2031 22.875 28.125 20.7969 25.5 20.7969ZM25.5 28.5625C23.8594 28.5625 22.4375 27.25 22.4375 25.5C22.4375 23.8594 23.75 22.4375 25.5 22.4375C27.1406 22.4375 28.5625 23.75 28.5625 25.5C28.5625 27.1406 27.1406 28.5625 25.5 28.5625Z"
+                fill="#0D3F40"
+              />
+              <path
+                d="M30.3125 21.7813C30.9166 21.7813 31.4062 21.2916 31.4062 20.6875C31.4062 20.0834 30.9166 19.5938 30.3125 19.5938C29.7084 19.5938 29.2188 20.0834 29.2188 20.6875C29.2188 21.2916 29.7084 21.7813 30.3125 21.7813Z"
+                fill="#0D3F40"
+              />
+            </g>
+            <g filter="url(#filter1_d_1288_57729)">
+              <path
+                d="M72.5 42.5C63.1112 42.5 55.5 34.8888 55.5 25.5C55.5 16.1112 63.1112 8.5 72.5 8.5C81.8888 8.5 89.5 16.1112 89.5 25.5C89.5 34.8888 81.8888 42.5 72.5 42.5Z"
+                stroke="#383E43"
+              />
+              <path
+                fill-rule="evenodd"
+                clip-rule="evenodd"
+                d="M78.625 19.2656C76.9844 17.625 74.7969 16.75 72.5 16.75C67.6875 16.75 63.75 20.6875 63.75 25.5C63.75 27.0312 64.1875 28.5625 64.9531 29.875L63.75 34.25L68.3438 33.0469C69.6563 33.7031 71.0781 34.1406 72.5 34.1406C77.3125 34.1406 81.25 30.2031 81.25 25.3906C81.25 23.0937 80.2656 20.9062 78.625 19.2656ZM72.5 32.7188C71.1875 32.7188 69.875 32.3906 68.7813 31.7344L68.5625 31.625L65.8281 32.3906L66.5938 29.7656L66.375 29.4375C65.6094 28.2344 65.2812 26.9219 65.2812 25.6094C65.2812 21.6719 68.5625 18.3906 72.5 18.3906C74.4688 18.3906 76.2188 19.1562 77.6406 20.4687C79.0625 21.8906 79.7188 23.6406 79.7188 25.6094C79.7188 29.4375 76.5469 32.7188 72.5 32.7188ZM76.4375 27.25C76.2188 27.1406 75.125 26.5938 74.9063 26.5938C74.6875 26.4844 74.5781 26.4844 74.4687 26.7031C74.3594 26.9219 73.9219 27.3594 73.8125 27.5781C73.7031 27.6875 73.5937 27.6875 73.375 27.6875C73.1562 27.5781 72.5 27.3594 71.625 26.5938C70.9688 26.0469 70.5313 25.2812 70.4219 25.0625C70.3125 24.8438 70.4219 24.7344 70.5313 24.625C70.6406 24.5156 70.75 24.4062 70.8594 24.2969C70.9688 24.1875 70.9688 24.0781 71.0781 23.9688C71.1875 23.8594 71.0781 23.75 71.0781 23.6406C71.0781 23.5312 70.6406 22.4375 70.4219 22C70.3125 21.6719 70.0938 21.6719 69.9844 21.6719C69.875 21.6719 69.7656 21.6719 69.5469 21.6719C69.4375 21.6719 69.2187 21.6719 69 21.8906C68.7812 22.1094 68.2344 22.6562 68.2344 23.75C68.2344 24.8438 69 25.8281 69.1094 26.0469C69.2187 26.1562 70.6406 28.4531 72.8281 29.3281C74.6875 30.0938 75.0156 29.875 75.4531 29.875C75.8906 29.875 76.7656 29.3281 76.875 28.8906C77.0938 28.3438 77.0938 27.9063 76.9844 27.9063C76.875 27.3594 76.6563 27.3594 76.4375 27.25Z"
+                fill="#383E43"
+              />
+            </g>
+            <g filter="url(#filter2_d_1288_57729)">
+              <path
+                d="M119.5 42.5C110.111 42.5 102.5 34.8888 102.5 25.5C102.5 16.1112 110.111 8.5 119.5 8.5C128.889 8.5 136.5 16.1112 136.5 25.5C136.5 34.8888 128.889 42.5 119.5 42.5Z"
+                stroke="#383E43"
+              />
+              <path
+                d="M110.859 25.1809C115.557 23.1343 118.689 21.785 120.257 21.1331C124.732 19.2717 125.662 18.9484 126.268 18.9376C126.401 18.9354 126.699 18.9684 126.892 19.1251C127.055 19.2573 127.1 19.436 127.122 19.5615C127.143 19.6869 127.17 19.9726 127.148 20.1958C126.906 22.7439 125.857 28.9273 125.323 31.7811C125.097 32.9887 124.652 33.3936 124.222 33.4332C123.286 33.5193 122.575 32.8147 121.669 32.2206C120.251 31.2909 119.449 30.7122 118.073 29.805C116.482 28.7566 117.513 28.1803 118.42 27.2386C118.657 26.9922 122.78 23.2419 122.86 22.9017C122.87 22.8592 122.879 22.7006 122.785 22.6168C122.691 22.5331 122.552 22.5617 122.451 22.5845C122.309 22.6168 120.043 24.1143 115.654 27.0771C115.011 27.5187 114.429 27.7338 113.907 27.7226C113.331 27.7101 112.225 27.3973 111.402 27.1298C110.393 26.8018 109.591 26.6283 109.66 26.0712C109.697 25.7811 110.096 25.4843 110.859 25.1809Z"
+                fill="#383E43"
+              />
+            </g>
+            <g filter="url(#filter3_d_1288_57729)">
+              <path
+                d="M166.5 42.5C157.111 42.5 149.5 34.8888 149.5 25.5C149.5 16.1112 157.111 8.5 166.5 8.5C175.889 8.5 183.5 16.1112 183.5 25.5C183.5 34.8888 175.889 42.5 166.5 42.5Z"
+                stroke="#383E43"
+              />
+              <path
+                d="M161.688 34.25H157.969V22.5469H161.688V34.25ZM159.828 20.9062C158.625 20.9062 157.75 20.0312 157.75 18.8281C157.75 17.625 158.734 16.75 159.828 16.75C161.031 16.75 161.906 17.625 161.906 18.8281C161.906 20.0312 161.031 20.9062 159.828 20.9062ZM175.25 34.25H171.531V27.9063C171.531 26.0469 170.766 25.5 169.672 25.5C168.578 25.5 167.484 26.375 167.484 28.0156V34.25H163.766V22.5469H167.266V24.1875C167.594 23.4219 168.906 22.2188 170.766 22.2188C172.844 22.2188 175.031 23.4219 175.031 27.0312V34.25H175.25Z"
+                fill="#383E43"
+              />
+            </g>
+            <defs>
+              <filter
+                id="filter0_d_1288_57729"
+                x="0"
+                y="0"
+                width="51"
+                height="51"
+                filterUnits="userSpaceOnUse"
+                color-interpolation-filters="sRGB"
+              >
+                <feFlood flood-opacity="0" result="BackgroundImageFix" />
+                <feColorMatrix
+                  in="SourceAlpha"
+                  type="matrix"
+                  values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+                  result="hardAlpha"
+                />
+                <feOffset />
+                <feGaussianBlur stdDeviation="4" />
+                <feComposite in2="hardAlpha" operator="out" />
+                <feColorMatrix
+                  type="matrix"
+                  values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0"
+                />
+                <feBlend
+                  mode="normal"
+                  in2="BackgroundImageFix"
+                  result="effect1_dropShadow_1288_57729"
+                />
+                <feBlend
+                  mode="normal"
+                  in="SourceGraphic"
+                  in2="effect1_dropShadow_1288_57729"
+                  result="shape"
+                />
+              </filter>
+              <filter
+                id="filter1_d_1288_57729"
+                x="47"
+                y="0"
+                width="51"
+                height="51"
+                filterUnits="userSpaceOnUse"
+                color-interpolation-filters="sRGB"
+              >
+                <feFlood flood-opacity="0" result="BackgroundImageFix" />
+                <feColorMatrix
+                  in="SourceAlpha"
+                  type="matrix"
+                  values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+                  result="hardAlpha"
+                />
+                <feOffset />
+                <feGaussianBlur stdDeviation="4" />
+                <feComposite in2="hardAlpha" operator="out" />
+                <feColorMatrix
+                  type="matrix"
+                  values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0"
+                />
+                <feBlend
+                  mode="normal"
+                  in2="BackgroundImageFix"
+                  result="effect1_dropShadow_1288_57729"
+                />
+                <feBlend
+                  mode="normal"
+                  in="SourceGraphic"
+                  in2="effect1_dropShadow_1288_57729"
+                  result="shape"
+                />
+              </filter>
+              <filter
+                id="filter2_d_1288_57729"
+                x="94"
+                y="0"
+                width="51"
+                height="51"
+                filterUnits="userSpaceOnUse"
+                color-interpolation-filters="sRGB"
+              >
+                <feFlood flood-opacity="0" result="BackgroundImageFix" />
+                <feColorMatrix
+                  in="SourceAlpha"
+                  type="matrix"
+                  values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+                  result="hardAlpha"
+                />
+                <feOffset />
+                <feGaussianBlur stdDeviation="4" />
+                <feComposite in2="hardAlpha" operator="out" />
+                <feColorMatrix
+                  type="matrix"
+                  values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0"
+                />
+                <feBlend
+                  mode="normal"
+                  in2="BackgroundImageFix"
+                  result="effect1_dropShadow_1288_57729"
+                />
+                <feBlend
+                  mode="normal"
+                  in="SourceGraphic"
+                  in2="effect1_dropShadow_1288_57729"
+                  result="shape"
+                />
+              </filter>
+              <filter
+                id="filter3_d_1288_57729"
+                x="141"
+                y="0"
+                width="51"
+                height="51"
+                filterUnits="userSpaceOnUse"
+                color-interpolation-filters="sRGB"
+              >
+                <feFlood flood-opacity="0" result="BackgroundImageFix" />
+                <feColorMatrix
+                  in="SourceAlpha"
+                  type="matrix"
+                  values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+                  result="hardAlpha"
+                />
+                <feOffset />
+                <feGaussianBlur stdDeviation="4" />
+                <feComposite in2="hardAlpha" operator="out" />
+                <feColorMatrix
+                  type="matrix"
+                  values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0"
+                />
+                <feBlend
+                  mode="normal"
+                  in2="BackgroundImageFix"
+                  result="effect1_dropShadow_1288_57729"
+                />
+                <feBlend
+                  mode="normal"
+                  in="SourceGraphic"
+                  in2="effect1_dropShadow_1288_57729"
+                  result="shape"
+                />
+              </filter>
+            </defs>
+          </svg>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
\ No newline at end of file
diff --git a/components/about-page/Header.vue b/components/about-page/Header.vue
new file mode 100644
index 0000000..27966eb
--- /dev/null
+++ b/components/about-page/Header.vue
@@ -0,0 +1,379 @@
+<template>
+
+  <section class="image-unmask">
+    <img
+      id="img"
+      src="/public/images/aboutBg.jpg"
+    />
+    <svg id="svg">
+      <defs>
+        <mask id="mask">
+          <rect
+          width="100%" height="100%" fill="white"></rect>
+          <ellipse class="border rounded-[50%]" id="circle1" cx="-4%" cy="50%"  rx="180" ry="270">
+    
+          </ellipse>
+
+          <ellipse class="border rounded-[50%]" id="circle2" cx="23%" cy="50%"  rx="180" ry="270">
+    
+          </ellipse>
+       
+          <ellipse class="border rounded-[50%]" id="circle3" cx="50%" cy="50%"  rx="180" ry="270">
+
+          </ellipse>
+          <ellipse class="border rounded-[50%]" id="circle4" cx="77%" cy="50%"  rx="180" ry="270">
+
+          </ellipse>
+       
+          <ellipse class="border rounded-[50%]" id="circle5" cx="104%" cy="50%"  rx="180" ry="270">
+
+          </ellipse>
+          
+        </mask>
+        
+      </defs>
+      <!--<rect id="whiteLayer" width="100%" height="100%" fill="white"></rect>-->
+      <rect id="rect" width="100vw" height="100%" fill="black" mask="url(#mask)"></rect>
+    </svg>
+    
+  </section>
+
+ <section class="content">
+  <div
+  class=" h-[94.615vw] lg:h-[42.938vw] flex items-center text-[#383E43]"
+>
+  <div class="w-[60%] md:w-[37%] ms-[4vw] md:ms-[23.594vw]">
+    <h2
+      class="-mt-[2vw] md:mt-[10vw] lg:mt-0 text-[4.544vw] lg:text-[1.481vw] font-bold"
+    >
+      داستان ما
+    </h2>
+    <p
+      class="text-[3.19vw] lg:text-[0.833vw] leading-[4.5vw] lg:leading-[1.563vw] mt-[2vw]"
+    >
+      لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با
+      استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در
+      ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز،
+      و کاربردهای
+    </p>
+    <p
+      class="hidden lg:block text-[3.19vw] lg:text-[0.833vw] leading-[1.563vw] mt-[2vw]"
+    >
+      رسد و زمان مورد نیاز شامل حروفچینی دستاوردهای اصلی، و جوابگوی سوالات
+      پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.لورم
+      ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده
+      از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و
+      سطرآنچنان که لازم اس متنوع با هدف بهبود ابزارهای کاربردی می باشد،
+      کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه
+      و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشتری را برای طراحان
+      رایانه ای علی الخصوص طراحان خلاقی، و فرهنگ پیشرو در زبان فارسی ایجاد
+      کرد. در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه
+      راهکارها، و شرایط سخت تایپ به پایانت، و برای شرایط فعلی تکنولوژی
+      مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد،
+      کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه
+      و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشتری را برای طراحان
+      رایانه ای علی الخصوص طراحان خلاقی، و فرهنگ پیشرو در زبان فارسی ایجاد
+      کرد، در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه
+      راهکارها، و شرایط سخت تایپ به پایان رسد و زمان مورد نیاز شامل
+      حروفچینی دستاوردهای اصلی، و جوابگوی سوالات پیوسته اهل دنیای موجود
+      طراحی اساسا مورد استفاده قرار گیرد.
+    </p>
+  </div>
+</div>
+<div class="fade"></div>
+
+ </section>
+
+  <img
+    id="img-fixed"
+    src="/public/images/aboutBg.jpg"
+  />
+
+  <!-- <div id="content"></div> -->
+</template>
+
+  <script setup>
+import { onMounted, onUnmounted, ref } from "vue";
+import gsap from "gsap";
+import { ScrollTrigger } from "gsap/ScrollTrigger";
+import { MotionPathPlugin } from "gsap/MotionPathPlugin";
+gsap.registerPlugin(ScrollTrigger);
+let ctx;
+onMounted(() => {
+  ctx = gsap.context((self) => {
+    const svg = document.querySelector("#svg");
+    const img = document.querySelector("#img");
+    const imgFixed = document.querySelector("#img-fixed");
+
+    const circle1 = document.querySelector("#circle1");
+    let radiusX1 = +circle1.getAttribute("rx");
+    let radiusY1 = +circle1.getAttribute("ry");
+    let space1 = circle1.getAttribute("cx");
+    let spaceToIng1 = parseInt(space1)
+
+
+    const circle2 = document.querySelector("#circle2");
+   let radiusX2 = +circle2.getAttribute("rx");
+    let radiusY2 = +circle2.getAttribute("ry");
+    let space2 = circle2.getAttribute("cx");
+    let spaceToIng2 = parseInt(space2)
+
+    const circle3 = document.querySelector("#circle3");
+    let radiusX3 = +circle3.getAttribute("rx");
+    let radiusY3 = +circle3.getAttribute("ry");
+
+    const circle4 = document.querySelector("#circle4");
+    let radiusX4 = +circle4.getAttribute("rx");
+    let radiusY4 = +circle4.getAttribute("ry");
+    let space4 = circle4.getAttribute("cx");
+    let spaceToIng4 = parseInt(space4)
+
+
+    const circle5 = document.querySelector("#circle5");
+    let radiusX5 = +circle5.getAttribute("rx");
+    let radiusY5 = +circle5.getAttribute("ry");
+    let space5 = circle5.getAttribute("cx");
+    let spaceToIng5 = parseInt(space5)
+
+
+
+
+    const rect = document.querySelector("#rect");
+    const pad = 4;
+
+
+    let imgWidth, imgHeight;
+
+    gsap.set(img, {
+      scale: 1.1,
+      xPercent: -50,
+      yPercent: -50,
+    });
+
+    gsap.set(imgFixed, {
+      xPercent: -50,
+      yPercent: -50,
+    });
+
+    var tl = gsap
+      .timeline({
+        scrollTrigger: {
+          trigger: ".image-unmask",
+          pin: true,
+          start: "top top",
+          end: "+=500",
+          //end: "bottom bottom",
+          scrub: true,
+        },
+        defaults: {
+          duration: 3,
+        },
+      })
+      .to(
+        circle1,   
+        {
+          attr: {
+                ry: () => radiusY1 * 10,
+                rx: () => radiusX1 * 10,
+                cx: () => spaceToIng1 * 120 + '%'
+          },
+        },
+        0
+      )
+      .to(
+        circle2,   
+        {
+          attr: {
+                ry: () => radiusY2 * 10,
+                rx: () => radiusX2 * 10,
+                cx: () => spaceToIng2 * -9 + '%'
+          },
+        },
+        0
+      )
+      .to(
+        circle3,   
+        {
+          attr: {
+                ry: () => radiusY3 * 10,
+                rx: () => radiusX3 * 10,
+          },
+        },
+        0
+      )
+      .to(
+        circle4,   
+        {
+          attr: {
+                ry: () => radiusY4 * 10,
+                rx: () => radiusX4 * 10,
+                cx: () => spaceToIng4 * 3.9 + '%'
+          },
+        },
+        0
+      )
+      .to(
+        circle5,   
+        {
+          attr: {
+                ry: () => radiusY5 * 10,
+                rx: () => radiusX5 * 10,
+                cx: () => spaceToIng5 * 5.5 + '%'
+          },
+        },
+        0
+      )
+      // .to(
+      //   circle2,
+      //   {
+      //       attr: {
+      //           ry: () => radiusy * 10,
+      //           rx: () => radiusx * 10,
+      //           cx: () => adad * 10 + '%'
+      //       }
+      //   },
+      //   0
+      // )
+      // .to(
+      //   rect,
+      //   {
+      //       attr: {
+      //           // height: () => recth * 10,
+      //           width: () => rectW * 10,
+      //          // rx: () => radiusx * 10,
+      //       }
+      //   },
+      //   0
+      // )
+      .to(
+        img,
+        {
+          scale: 1,
+          opacity: 1,
+        },
+        0
+      )
+      .set(img, {
+        opacity: 0,
+      })
+      .set(imgFixed, {
+        opacity: 1,
+      });
+    //.to("#whiteLayer", {
+    //  alpha: 0,
+    //  ease: "power1.in",
+    //  duration: 1 - 0.25
+    //}, 0.25)
+
+
+
+
+
+    window.addEventListener("load", init);
+    window.addEventListener("resize", resize);
+
+    function init() {
+      imgWidth = img.naturalWidth;
+      imgHeight = img.naturalHeight;
+
+      resize();
+    }
+
+    function resize() {
+      tl.progress(0);
+
+      const r = svg.getBoundingClientRect();
+      const rectWidth = r.width + pad;
+      const rectHeight = r.height + pad;
+
+      const rx = rectWidth / imgWidth;
+      const ry = rectHeight / imgHeight;
+
+      const ratio = Math.max(rx, ry);
+
+      const width = imgWidth * ratio;
+      const height = imgHeight * ratio;
+
+      const dx = rectWidth / 2;
+      const dy = rectHeight / 2;
+      radius = Math.sqrt(dx * dx + dy * dy);
+
+      gsap.set(img, { width, height });
+      gsap.set(imgFixed, { width, height });
+
+      tl.invalidate();
+
+      ScrollTrigger.refresh();
+    }
+  });
+});
+</script>
+
+
+
+
+
+
+<style scoped>
+
+html,
+body {
+  font-family: "Signika Negative", sans-serif;
+  margin: 0;
+  padding: 0;
+}
+.border{
+ outline: 5px solid red;
+ outline-offset:10px;
+ 
+}
+section.spacer {
+  height: 100vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+section.image-unmask {
+  height: 100vh;
+  overflow: hidden;
+}
+
+.inner {
+  margin: 50px;
+  padding: 50px;
+  min-height: 25vh;
+  margin-left: 10vw;
+  max-width: 80vw;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  background: rgba(255, 255, 255, 0.9);
+  border-radius: 10px;
+}
+
+#img {
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  opacity: 0.8;
+  z-index: -1;
+}
+
+#svg {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100vh;
+}
+
+#img-fixed {
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  opacity: 0;
+  z-index: -1;
+}
+</style>
\ No newline at end of file
diff --git a/components/about-page/Map.vue b/components/about-page/Map.vue
new file mode 100644
index 0000000..8d39c40
--- /dev/null
+++ b/components/about-page/Map.vue
@@ -0,0 +1,64 @@
+<template>
+    <div
+    class="bg-white h-auto md:h-[45.938vw] flex justify-center py-[20vw] md:py-[4.5vw]"
+  >
+    <div
+      class="w-[85%] md:w-[81.04%] flex flex-col md:flex-row justify-between"
+    >
+      <div class="text-[#383E43] w-full md:w-[72.35%]">
+        <h1 class="text-[#A62186] text-[7.277vw] md:text-[2.604vw] font-bold">
+          SHINAN
+        </h1>
+        <h2 class="text-[5.751vw] md:text-[2.188vw] mt-[5vw] md:mt-[1.5vw]">
+          فروشگاه جوانه پیشتاز در عرضه محصولات سالم و طبیعی
+        </h2>
+        <p
+          class="text-[3.59vw] md:text-[1.186vw] mt-[5vw] md:mt-[0.8vw] w-full md:w-[75%]"
+        >
+          ما در فروشگاه جوانه سعی بر آن داریم تا سبدی از بهترین محصولات سالم و
+          طبیعی و ارگانیک ، رژیمی و بدون گلوتن را فراهم آوریم تا بتوانیم تجربه
+          خریدی سالم و اطمینان بخشی را برای شما محیا کنیم.
+        </p>
+        <div
+          class="flex flex-col flex-col-reverse md:flex-row mt-[2.8vw] w-full md:w-[27.396vw]"
+        >
+          <svg
+            class="rotate-90 md:rotate-0 w-[8vw] h-[8vw] md:w-[1.2vw] md:h-[3.188vw] mt-[0.7vw]"
+            viewBox="0 0 10 42"
+            fill="none"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <circle cx="5" cy="5" r="4.5" fill="#383E43" stroke="#383E43" />
+            <circle cx="5" cy="21" r="4.5" stroke="#383E43" />
+            <circle cx="5" cy="37" r="4.5" stroke="#383E43" />
+          </svg>
+          <div class="bg-white p-[8vw] md:p-[1.5vw] ms-[1vw] rounded-[1.302vw]">
+            <p class="text-[4.544vw] md:text-[1.335vw]">آدرس</p>
+            <p
+              class="text-[3.19vw] md:text-[0.833vw] mt-[5vw] leading-[5vw] md:leading-[1.563vw]"
+            >
+              لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با
+              استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در
+              ستون و سطرآنچنان که لازم است
+            </p>
+          </div>
+        </div>
+      </div>
+      <div class="w-full md:w-[35%] rounded-[1.302vw]">
+        <LMap
+          class="rounded-lg"
+          ref="map"
+          :zoom="zoom"
+          :center="[34.08011180237817, 49.69090848676344]"
+        >
+          <LTileLayer
+            url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
+            attribution='&amp;copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors'
+            layer-type="base"
+            name="OpenStreetMap"
+          />
+        </LMap>
+      </div>
+    </div>
+  </div>
+</template>
\ No newline at end of file
diff --git a/components/home-page/AboutUs.vue b/components/home-page/AboutUs.vue
index 31cc2dc..cd49e6c 100644
--- a/components/home-page/AboutUs.vue
+++ b/components/home-page/AboutUs.vue
@@ -222,37 +222,12 @@ let ctx;
 const pnl = ref()
 onMounted(() => {
   const panels = gsap.utils.toArray(".panel");
+  gsap.set(panels, { xPercent: 0, yPercent: 100, autoAlpha: 1 });
  console.clear();
+
   ctx = gsap.context((self) => {
 
 
-//     const boxes = gsap.utils.toArray('.panel');
-//     const timeline = gsap.timeline({
-//     scrollTrigger: {
-//       trigger: project,
-//       start: "center bottom",
-//       ease: "power2",
-//       toggleActions: "play none none reverse"
-//     }
-//   })
-// boxes.forEach((box, i) => {
-//   const anim = gsap.fromTo(box, 
-//   {opacity: 0, y: 200},
-//   {opacity: 1, y: 0}, "-=0.5");
-//   ScrollTrigger.create({
-//     trigger: box,
-//     animation: anim,
-//     toggleActions: "play none none reverse",
-//     repeat: -1
-//    // once: true,
-//   });
-// });
-
-
-
-
-
-
     gsap.to("#crclrMotion", {
       scrollTrigger: {
         trigger: ".panel",
@@ -271,7 +246,7 @@ onMounted(() => {
         trigger: ".panel",
         start: "top 80%",
         end: () =>
-        "+=4000", 
+        "+=3000", 
         //     "+=" + 150 * panels.length + "%",
           // "+=" + document.querySelector(".about").getBoundingClientRect().width,
         scrub: 1,
@@ -304,14 +279,16 @@ onMounted(() => {
       // y: 50000,
       pin: true,
       scrub: 1,
+      
     },
-    y: 110000,
+    y: 11000,
   });
   panels.forEach((panel, index) => {
     if (index) {
       tl.to(
         panel,
         {
+          y: -window.innerHeight * 0.001,
           yPercent: 0,
           ease: "none",
         },
diff --git a/components/honor-page/ShinanHonors.vue b/components/honor-page/ShinanHonors.vue
index d595446..a58eec7 100644
--- a/components/honor-page/ShinanHonors.vue
+++ b/components/honor-page/ShinanHonors.vue
@@ -1,7 +1,7 @@
 <template>
-  <div class="flex justify-center py-[20vw] md:py-[10vw]">
+ <div class="wrapper flex justify-center py-[20vw] md:py-[10vw]">
     <div
-      class="w-[85%] md:w-[81.04%] flex flex-col md:flex-row justify-between"
+      class=" md:w-[81.04%] flex flex-col md:flex-row justify-between"
     >
       <div class="text-[#383E43] w-full md:w-[58.35%]">
         <h1 class="text-[#A62186] text-[7.277vw] md:text-[2.604vw] font-bold">
@@ -17,8 +17,9 @@
           طبیعی و ارگانیک ، رژیمی و بدون گلوتن را فراهم آوریم تا بتوانیم تجربه
           خریدی سالم و اطمینان بخشی را برای شما محیا کنیم.
         </p>
+
         <div
-          class="flex flex-col flex-col-reverse md:flex-row mt-[2.8vw] w-full md:w-[27.396vw]"
+          class="text-card flex flex-col flex-col-reverse md:flex-row mt-[2.8vw] w-full md:w-[27.396vw]"
         >
           <svg
             class="rotate-90 md:rotate-0 w-[8vw] h-[8vw] md:w-[1.2vw] md:h-[3.188vw] mt-[0.7vw]"
@@ -30,29 +31,117 @@
             <circle cx="5" cy="21" r="4.5" stroke="#383E43" />
             <circle cx="5" cy="37" r="4.5" stroke="#383E43" />
           </svg>
-          <div class="bg-white p-[8vw] md:p-[1.5vw] ms-[1vw] rounded-[1.302vw]">
-            <p class="text-[4.544vw] md:text-[1.335vw]">آدرس</p>
-            <p
-              class="text-[3.19vw] md:text-[0.833vw] mt-[5vw] leading-[5vw] md:leading-[1.563vw]"
+
+          <div>
+            <div
+              class="bg-red-200 p-[8vw] md:p-[1.5vw] ms-[1vw] rounded-[1.302vw]"
             >
-              لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با
-              استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در
-              ستون و سطرآنچنان که لازم است
-            </p>
+              <p class="text-[4.544vw] md:text-[1.335vw]">آدرس</p>
+              <p
+                class="text-[3.19vw] md:text-[0.833vw] mt-[5vw] leading-[5vw] md:leading-[1.563vw]"
+              >
+                لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با
+                استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله
+                در ستون و سطرآنچنان که لازم است
+              </p>
+            </div>
           </div>
         </div>
       </div>
-      <div class="h-[97.949vw] md:!h-[35.417vw] w-full md:w-[35.417vw]">
-        <img
+
+      <div class="card h-[97.949vw] md:!h-[35.417vw] w-full md:w-[35.417vw]">
+         <img
           class="h-full w-full object-cover rounded-[1.302vw]"
           src="/public/images/honor.jpg"
           alt=""
-        />
+        /> 
+      
       </div>
+      
     </div>
-  </div>
+  </div> 
+  
 </template>
 
-<script setup>
 
-</script>
\ No newline at end of file
+
+<script setup>
+import { onMounted, onUnmounted, ref } from "vue";
+import gsap from "gsap";
+import { ScrollTrigger } from "gsap/ScrollTrigger";
+import Scrollbar from "smooth-scrollbar";
+import { MotionPathPlugin } from "gsap/MotionPathPlugin";
+gsap.registerPlugin(ScrollTrigger, MotionPathPlugin);
+
+const main = ref();
+let ctx;
+const pnl = ref();
+onMounted(() => {
+  ctx = gsap.context((self) => {
+    const cards = gsap.utils.toArray(".card");
+    const texts = gsap.utils.toArray(".text-card");
+    gsap.set(cards, { xPercent: 0, yPercent: 100, autoAlpha: 1 });
+    gsap.set(texts, { xPercent: 0, yPercent: 100, autoAlpha: 1 });
+    // gsap.set(cards, { zIndex: (i, target, targets) => targets.length - i });
+
+    const tl = gsap.timeline({
+      defaults: {
+        duration: 1,
+        ease: "power1.inOut",
+      },
+      scrollTrigger: {
+        trigger: ".wrapper",
+        start: "top top",
+        end: "+=150%",
+        pin: ".wrapper",
+        scrub: true,
+        markers: true,
+      },
+    });
+    texts.forEach((text, i) => {
+      console.log('text', text);
+      tl.to(
+        text,
+        {
+          y: -window.innerHeight * 0.001,
+          yPercent: 0,
+        },
+        "<"
+      ).to(text, {
+        autoAlpha: 0,
+        duration: 5,
+      });
+    });
+
+
+    const tl2 = gsap.timeline({
+      defaults: {
+        duration: 1,
+        ease: "power1.inOut",
+      },
+      scrollTrigger: {
+        trigger: ".wrapper",
+        start: "top top",
+        end: "+=150%",
+        scrub: true,
+      },
+    });
+
+    cards.forEach((card, i) => {
+      tl2.to(
+        card,
+        {
+          y: -window.innerHeight * 0.001,
+          yPercent: 0,
+        },
+        "<"
+      ).to(card, {
+        autoAlpha: 0,
+        duration: 5,
+      });
+    });
+
+  });
+});
+</script>
+
diff --git a/package-lock.json b/package-lock.json
index ed27e12..63520cd 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11,6 +11,7 @@
         "leaflet": "^1.9.4",
         "nuxt": "^3.11.2",
         "nuxt-swiper": "^1.2.2",
+        "smooth-scrollbar": "^8.8.4",
         "swiper": "^11.1.1",
         "vue": "^3.4.21",
         "vue-router": "^4.3.0",
@@ -4855,6 +4856,16 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/core-js": {
+      "version": "3.37.0",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.37.0.tgz",
+      "integrity": "sha512-fu5vHevQ8ZG4og+LXug8ulUtVxjOcEYvifJr7L5Bfq9GOztVqsKd9/59hUk2ZSbCrS3BqUr3EpaYGIYzq7g3Ug==",
+      "hasInstallScript": true,
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/core-js"
+      }
+    },
     "node_modules/core-util-is": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.3.tgz",
@@ -9915,6 +9926,15 @@
       "resolved": "https://registry.npmjs.org/smob/-/smob-1.5.0.tgz",
       "integrity": "sha512-g6T+p7QO8npa+/hNx9ohv1E5pVCmWrVCUzUXJyLdMmftX6ER0oiWY/w9knEonLpnOp6b6FenKnMfR8gqwWdwig=="
     },
+    "node_modules/smooth-scrollbar": {
+      "version": "8.8.4",
+      "resolved": "https://registry.npmjs.org/smooth-scrollbar/-/smooth-scrollbar-8.8.4.tgz",
+      "integrity": "sha512-Wn2Q/iE+PE1ef4EfhFMhgaIMfSrjJl2LalRu0hBWSrw5nZKGsUIjWFWHnLB/Lpx7N+a1pJH6+wkQzBr+5nWPUg==",
+      "dependencies": {
+        "core-js": "^3.6.4",
+        "tslib": "^1.10.0"
+      }
+    },
     "node_modules/socks": {
       "version": "2.8.3",
       "resolved": "https://registry.npmjs.org/socks/-/socks-2.8.3.tgz",
@@ -10642,6 +10662,11 @@
       "integrity": "sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==",
       "dev": true
     },
+    "node_modules/tslib": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+    },
     "node_modules/tsscmp": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/tsscmp/-/tsscmp-1.0.6.tgz",
diff --git a/package.json b/package.json
index 61e4a74..e7754c0 100644
--- a/package.json
+++ b/package.json
@@ -15,6 +15,7 @@
     "leaflet": "^1.9.4",
     "nuxt": "^3.11.2",
     "nuxt-swiper": "^1.2.2",
+    "smooth-scrollbar": "^8.8.4",
     "swiper": "^11.1.1",
     "vue": "^3.4.21",
     "vue-router": "^4.3.0",
diff --git a/pages/about.vue b/pages/about.vue
index 2ec5fd9..07656e1 100644
--- a/pages/about.vue
+++ b/pages/about.vue
@@ -1,426 +1,87 @@
 <template>
-  <div class="h-[68vw] md:h-[45.938vw]">
-    <div class="imgWrap bg-white">
-      <div class="one rounded-[500px] hidden md:flex">
-        <div class="border-[1vw] rounded-[500px]"></div>
-      </div>
-      <div class="two rounded-[500px]">
-        <div class="border-[4vw] md:border-[1vw] rounded-[500px]"></div>
-      </div>
-      <div class="three rounded-[500px]">
-        <div
-          class="border-[4vw] md:border-[1vw] rounded-[500px] flex flex-col justify-center items-center"
-        >
-          <p class="-mt-[8vw] md:mt-0 text-[5.277vw] absolute md:relative md:text-[2.656vw] text-[#383E43]">
-            We
-            <span class="font-bold"> Believe </span>
-            in the
-          </p>
-          <p class="text-[5.277vw] absolute md:relative mt-[8vw] md:mt-0 md:text-[2.656vw] text-[#383E43] font-bold">Destination</p>
-        </div>
-      </div>
-      <div class="four rounded-[500px]">
-        <div class="border-[4vw] md:border-[1vw] rounded-[500px]"></div>
-      </div>
-      <div class="five rounded-[500px] hidden md:flex">
-        <div class="border-[1vw] rounded-[500px]"></div>
-      </div>
-    </div>
-  </div>
+  <about-pageHeader />
+  <about-pageMap />
+  <about-pageContactUs />
+  <!-- <div id="header-zoom">
 
-  <div class="ourStory h-[94.615vw] lg:h-[42.938vw] flex items-center text-[#383E43]">
-    <div class="w-[60%] md:w-[37%] ms-[4vw] md:ms-[23.594vw]">
-      <h2 class="-mt-[2vw] md:mt-[10vw] lg:mt-0 text-[4.544vw] lg:text-[1.481vw] font-bold">داستان ما</h2>
-      <p class="text-[3.19vw] lg:text-[0.833vw] leading-[4.5vw] lg:leading-[1.563vw] mt-[2vw]">
-        لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده
-        از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و
-        سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای
-
-    </p>
-        <p class="hidden lg:block text-[3.19vw] lg:text-[0.833vw] leading-[1.563vw] mt-[2vw]">
-    رسد و زمان مورد نیاز شامل حروفچینی دستاوردهای اصلی، و جوابگوی سوالات
-    پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.لورم ایپسوم
-    متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان
-    گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که
-    لازم اس
-            متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه
-        درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، تا با
-        نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان
-        خلاقی، و فرهنگ پیشرو در زبان فارسی ایجاد کرد. در این صورت می توان امید
-        داشت که تمام و دشواری موجود در ارائه راهکارها، و شرایط سخت تایپ به پایانت، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف
-    بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال
-    و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، تا با نرم افزارها
-    شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی، و فرهنگ
-    پیشرو در زبان فارسی ایجاد کرد، در این صورت می توان امید داشت که تمام و
-    دشواری موجود در ارائه راهکارها، و شرایط سخت تایپ به پایان رسد و زمان
-    مورد نیاز شامل حروفچینی دستاوردهای اصلی، و جوابگوی سوالات پیوسته اهل
-    دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.
-
-</p>
-
-    </div>
-  </div>
-  <div class="fade"></div>
-
-  <div class="h-auto md:h-[45.938vw] flex justify-center py-[20vw] md:py-[4.5vw]">
-    <div class="w-[85%] md:w-[81.04%] flex flex-col md:flex-row justify-between">
-      <div class="text-[#383E43] w-full md:w-[72.35%]">
-        <h1 class="text-[#A62186] text-[7.277vw] md:text-[2.604vw] font-bold">SHINAN</h1>
-        <h2 class="text-[5.751vw] md:text-[2.188vw] mt-[5vw] md:mt-[1.5vw]">
-          فروشگاه جوانه پیشتاز در عرضه محصولات سالم و طبیعی
-        </h2>
-        <p class="text-[3.59vw] md:text-[1.186vw] mt-[5vw] md:mt-[0.8vw] w-full md:w-[75%]">
-          ما در فروشگاه جوانه سعی بر آن داریم تا سبدی از بهترین محصولات سالم و
-          طبیعی و ارگانیک ، رژیمی و بدون گلوتن را فراهم آوریم تا بتوانیم تجربه
-          خریدی سالم و اطمینان بخشی را برای شما محیا کنیم.
-        </p>
-        <div class="flex flex-col flex-col-reverse md:flex-row mt-[2.8vw] w-full md:w-[27.396vw]">
-          <svg
-            class="rotate-90 md:rotate-0 w-[8vw] h-[8vw] md:w-[1.2vw] md:h-[3.188vw] mt-[0.7vw]"
-            viewBox="0 0 10 42"
-            fill="none"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <circle cx="5" cy="5" r="4.5" fill="#383E43" stroke="#383E43" />
-            <circle cx="5" cy="21" r="4.5" stroke="#383E43" />
-            <circle cx="5" cy="37" r="4.5" stroke="#383E43" />
-          </svg>
-          <div class="bg-white p-[8vw] md:p-[1.5vw] ms-[1vw] rounded-[1.302vw]">
-            <p class="text-[4.544vw] md:text-[1.335vw]">آدرس</p>
-            <p class="text-[3.19vw] md:text-[0.833vw] mt-[5vw] leading-[5vw] md:leading-[1.563vw]">
-              لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با
-              استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در
-              ستون و سطرآنچنان که لازم است
-            </p>
+    <div id="zoom">
+      <div class="h-[68vw] md:h-[45.938vw]">
+        <div class="imgWrap bg-white">
+          <div class="one rounded-[500px] hidden md:flex">
+            <div class="border-[1vw] rounded-[500px]"></div>
+          </div>
+          <div class="image-1 two rounded-[500px]">
+            <div class="image-2 border-[4vw] md:border-[1vw] rounded-[500px]"></div>
+          </div>
+          <div class="image-1 three rounded-[500px]">
+            <div
+              class="image-2 border-[4vw] md:border-[1vw] rounded-[500px] flex flex-col justify-center items-center"
+            >
+              <p
+                class="-mt-[8vw] md:mt-0 text-[5.277vw] absolute md:relative md:text-[2.656vw] text-[#383E43]"
+              >
+                We
+                <span class="font-bold"> Believe </span>
+                in the
+              </p>
+              <p
+                class="text-[5.277vw] absolute md:relative mt-[8vw] md:mt-0 md:text-[2.656vw] text-[#383E43] font-bold"
+              >
+                Destination
+              </p>
+            </div>
+          </div>
+          <div class="image-1 four rounded-[500px]">
+            <div class="image-2 border-[4vw] md:border-[1vw] rounded-[500px]"></div>
+          </div>
+          <div class="five rounded-[500px] hidden md:flex">
+            <div class="border-[1vw] rounded-[500px]"></div>
           </div>
         </div>
       </div>
-      <div class="w-full md:w-[35%] rounded-[1.302vw]">
-                <LMap
-                class="rounded-lg"
-                ref="map"
-                :zoom="zoom"
-                :center="[34.08011180237817, 49.69090848676344]"
-              >
-                <LTileLayer
-                  url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
-                  attribution="&amp;copy; <a href=&quot;https://www.openstreetmap.org/&quot;>OpenStreetMap</a> contributors"
-                  layer-type="base"
-                  name="OpenStreetMap"
-                />
-              </LMap>
-        </div>
-      </div>
-    </div>
 
-
-  <div class="contact h-auto md:h-[36.771vw] flex items-center justify-center md:justify-start py-[2vw] md:py-0">
-    <div
-      class="my-[2vw] md:my-0 bg-white h-[71.67%] w-[90%] md:w-[52.031vw] rounded-[1.302vw] ms-0 md:ms-[5.3vw] p-[8vw] md:p-[2.6vw]"
-    >
-      <img
-        src="/public/images/logo.png"
-        class="
-        h-[11.538vw] w-[11.538vw]
-        md:h-[5.208vw] md:w-[5.208vw]"
-        alt="logo"
-      />
-      <h2 class="text-[4.038vw] md:text-[1.186vw] font-semibold my-[5vw] md:my-0 md:mt-[2.4vw]">ارتباط با ما</h2>
-      <div class="flex flex-col md:flex-row justify-between items-center">
-        <div class="space-y-[3vw] md:space-y-[1vw]">
-          <p class="text-[3.59vw] md:text-[0.938vw]">
-            آدرس :
-            <span class="text-[3.19vw] md:text-[0.833vw]"
-              >لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با
-              استفاده
-            </span>
-          </p>
-          <p class="text-[3.59vw] md:text-[0.938vw]">
-            تلفن :
-            <span class="text-[3.19vw] md:text-[0.833vw]">00000000</span>
-          </p>
-          <p class="text-[3.59vw] md:text-[0.938vw]">
-            ایمیل :
-            <span class="text-[3.19vw] md:text-[0.833vw]">javaneh@gmail.com</span>
-          </p>
-          <p class="text-[3.59vw] md:text-[0.938vw]">
-            فکس :
-            <span class="text-[3.19vw] md:text-[0.833vw]">00000000</span>
-          </p>
-        </div>
-        <div>
-          <svg
-          class="hidden md:block h-[12.292vw]"
-         viewBox="0 0 66 252"
-            fill="none"
-            xmlns="http://www.w3.org/2000/svg"
+      <div
+        class="ourStory h-[94.615vw] lg:h-[42.938vw] flex items-center text-[#383E43]"
+      >
+        <div class="w-[60%] md:w-[37%] ms-[4vw] md:ms-[23.594vw]">
+          <h2
+            class="-mt-[2vw] md:mt-[10vw] lg:mt-0 text-[4.544vw] lg:text-[1.481vw] font-bold"
           >
-            <g filter="url(#filter0_d_841_15135)">
-              <path
-                d="M33 57.5C19.469 57.5 8.5 46.531 8.5 33C8.5 19.469 19.469 8.5 33 8.5C46.531 8.5 57.5 19.469 57.5 33C57.5 46.531 46.531 57.5 33 57.5Z"
-                stroke="#A62186"
-              />
-              <path
-                d="M33 22.375C36.4375 22.375 36.9062 22.375 38.3125 22.375C39.5625 22.375 40.1875 22.6875 40.6562 22.8438C41.2812 23.1563 41.75 23.3125 42.2188 23.7813C42.6875 24.25 43 24.7188 43.1562 25.3438C43.3125 25.8125 43.4687 26.4375 43.625 27.6875C43.625 29.0938 43.625 29.4062 43.625 33C43.625 36.5938 43.625 36.9062 43.625 38.3125C43.625 39.5625 43.3125 40.1875 43.1562 40.6562C42.8438 41.2812 42.6875 41.75 42.2188 42.2188C41.75 42.6875 41.2812 43 40.6562 43.1562C40.1875 43.3125 39.5625 43.4687 38.3125 43.625C36.9062 43.625 36.5938 43.625 33 43.625C29.4062 43.625 29.0938 43.625 27.6875 43.625C26.4375 43.625 25.8125 43.3125 25.3438 43.1562C24.7188 42.8438 24.25 42.6875 23.7813 42.2188C23.3125 41.75 23 41.2812 22.8438 40.6562C22.6875 40.1875 22.5312 39.5625 22.375 38.3125C22.375 36.9062 22.375 36.5938 22.375 33C22.375 29.4062 22.375 29.0938 22.375 27.6875C22.375 26.4375 22.6875 25.8125 22.8438 25.3438C23.1563 24.7188 23.3125 24.25 23.7813 23.7813C24.25 23.3125 24.7188 23 25.3438 22.8438C25.8125 22.6875 26.4375 22.5312 27.6875 22.375C29.0938 22.375 29.5625 22.375 33 22.375ZM33 20.0312C29.4062 20.0312 29.0938 20.0312 27.6875 20.0312C26.2813 20.0312 25.3438 20.3438 24.5625 20.6563C23.7813 20.9688 23 21.4375 22.2188 22.2188C21.4375 23 21.125 23.625 20.6563 24.5625C20.3438 25.3438 20.1875 26.2813 20.0312 27.6875C20.0312 29.0938 20.0312 29.5625 20.0312 33C20.0312 36.5938 20.0312 36.9062 20.0312 38.3125C20.0312 39.7188 20.3438 40.6562 20.6563 41.4375C20.9688 42.2188 21.4375 43 22.2188 43.7812C23 44.5625 23.625 44.875 24.5625 45.3438C25.3438 45.6563 26.2813 45.8125 27.6875 45.9687C29.0938 45.9687 29.5625 45.9687 33 45.9687C36.4375 45.9687 36.9062 45.9687 38.3125 45.9687C39.7188 45.9687 40.6562 45.6563 41.4375 45.3438C42.2188 45.0312 43 44.5625 43.7812 43.7812C44.5625 43 44.875 42.375 45.3438 41.4375C45.6563 40.6562 45.8125 39.7188 45.9687 38.3125C45.9687 36.9062 45.9687 36.4375 45.9687 33C45.9687 29.5625 45.9687 29.0938 45.9687 27.6875C45.9687 26.2813 45.6563 25.3438 45.3438 24.5625C45.0312 23.7813 44.5625 23 43.7812 22.2188C43 21.4375 42.375 21.125 41.4375 20.6563C40.6562 20.3438 39.7188 20.1875 38.3125 20.0312C36.9062 20.0313 36.5938 20.0312 33 20.0312Z"
-                fill="#A62186"
-              />
-              <path
-                d="M33 26.2812C29.25 26.2812 26.2812 29.25 26.2812 33C26.2812 36.75 29.25 39.7188 33 39.7188C36.75 39.7188 39.7188 36.75 39.7188 33C39.7188 29.25 36.75 26.2812 33 26.2812ZM33 37.375C30.6562 37.375 28.625 35.5 28.625 33C28.625 30.6562 30.5 28.625 33 28.625C35.3438 28.625 37.375 30.5 37.375 33C37.375 35.3438 35.3438 37.375 33 37.375Z"
-                fill="#A62186"
-              />
-              <path
-                d="M39.875 27.6875C40.7379 27.6875 41.4375 26.9879 41.4375 26.125C41.4375 25.2621 40.7379 24.5625 39.875 24.5625C39.0121 24.5625 38.3125 25.2621 38.3125 26.125C38.3125 26.9879 39.0121 27.6875 39.875 27.6875Z"
-                fill="#A62186"
-              />
-            </g>
-            <g filter="url(#filter1_d_841_15135)">
-              <path
-                d="M33 119.5C19.469 119.5 8.5 108.531 8.5 95C8.5 81.469 19.469 70.5 33 70.5C46.531 70.5 57.5 81.469 57.5 95C57.5 108.531 46.531 119.5 33 119.5Z"
-                stroke="#383E43"
-              />
-              <path
-                fill-rule="evenodd"
-                clip-rule="evenodd"
-                d="M41.75 86.0938C39.4063 83.75 36.2812 82.5 33 82.5C26.125 82.5 20.5 88.125 20.5 95C20.5 97.1875 21.125 99.375 22.2188 101.25L20.5 107.5L27.0625 105.781C28.9375 106.719 30.9688 107.344 33 107.344C39.875 107.344 45.5 101.719 45.5 94.8437C45.5 91.5625 44.0938 88.4375 41.75 86.0938ZM33 105.312C31.125 105.312 29.25 104.844 27.6875 103.906L27.375 103.75L23.4687 104.844L24.5625 101.094L24.25 100.625C23.1562 98.9062 22.6875 97.0313 22.6875 95.1563C22.6875 89.5313 27.375 84.8438 33 84.8438C35.8125 84.8438 38.3125 85.9375 40.3438 87.8125C42.375 89.8437 43.3125 92.3438 43.3125 95.1563C43.3125 100.625 38.7812 105.312 33 105.312ZM38.625 97.5C38.3125 97.3438 36.75 96.5625 36.4375 96.5625C36.125 96.4062 35.9687 96.4063 35.8125 96.7188C35.6562 97.0313 35.0313 97.6562 34.875 97.9687C34.7188 98.125 34.5625 98.125 34.25 98.125C33.9375 97.9688 33 97.6562 31.75 96.5625C30.8125 95.7812 30.1875 94.6875 30.0313 94.375C29.875 94.0625 30.0313 93.9062 30.1875 93.75C30.3438 93.5938 30.5 93.4375 30.6562 93.2812C30.8125 93.125 30.8125 92.9688 30.9688 92.8125C31.125 92.6563 30.9688 92.5 30.9688 92.3438C30.9688 92.1875 30.3438 90.625 30.0313 90C29.875 89.5313 29.5625 89.5312 29.4063 89.5312C29.25 89.5312 29.0937 89.5312 28.7812 89.5312C28.625 89.5312 28.3125 89.5312 28 89.8437C27.6875 90.1562 26.9063 90.9375 26.9063 92.5C26.9063 94.0625 28 95.4688 28.1562 95.7812C28.3125 95.9375 30.3437 99.2188 33.4687 100.469C36.125 101.562 36.5938 101.25 37.2188 101.25C37.8438 101.25 39.0938 100.469 39.25 99.8438C39.5625 99.0625 39.5625 98.4375 39.4063 98.4375C39.25 97.6563 38.9375 97.6563 38.625 97.5Z"
-                fill="#383E43"
-              />
-            </g>
-            <g filter="url(#filter2_d_841_15135)">
-              <path
-                d="M33 181.5C19.469 181.5 8.5 170.531 8.5 157C8.5 143.469 19.469 132.5 33 132.5C46.531 132.5 57.5 143.469 57.5 157C57.5 170.531 46.531 181.5 33 181.5Z"
-                stroke="#383E43"
-              />
-              <path
-                d="M20.6561 156.544C27.367 153.62 31.842 151.693 34.081 150.762C40.474 148.102 41.8024 147.641 42.6682 147.625C42.8587 147.622 43.2845 147.669 43.5603 147.893C43.7932 148.082 43.8572 148.337 43.8879 148.516C43.9186 148.696 43.9567 149.104 43.9264 149.423C43.5799 153.063 42.0809 161.896 41.3183 165.973C40.9956 167.698 40.3602 168.277 39.7451 168.333C38.4082 168.456 37.3931 167.45 36.0983 166.601C34.0723 165.273 32.9276 164.446 30.961 163.15C28.6882 161.652 30.1615 160.829 31.4568 159.484C31.7958 159.132 37.6859 153.774 37.7999 153.288C37.8142 153.227 37.8274 153.001 37.6928 152.881C37.5582 152.762 37.3595 152.802 37.2162 152.835C37.0129 152.881 33.7763 155.02 27.5061 159.253C26.5874 159.884 25.7552 160.191 25.0096 160.175C24.1877 160.157 22.6066 159.71 21.4312 159.328C19.9896 158.86 18.8438 158.612 18.9436 157.816C18.9955 157.402 19.5664 156.978 20.6561 156.544Z"
-                fill="#383E43"
-              />
-            </g>
-            <g filter="url(#filter3_d_841_15135)">
-              <path
-                d="M33 243.5C19.469 243.5 8.5 232.531 8.5 219C8.5 205.469 19.469 194.5 33 194.5C46.531 194.5 57.5 205.469 57.5 219C57.5 232.531 46.531 243.5 33 243.5Z"
-                stroke="#383E43"
-              />
-              <path
-                d="M26.125 231.5H20.8125V214.781H26.125V231.5ZM23.4688 212.438C21.75 212.438 20.5 211.187 20.5 209.469C20.5 207.75 21.9063 206.5 23.4688 206.5C25.1875 206.5 26.4375 207.75 26.4375 209.469C26.4375 211.187 25.1875 212.438 23.4688 212.438ZM45.5 231.5H40.1875V222.438C40.1875 219.781 39.0937 219 37.5312 219C35.9687 219 34.4062 220.25 34.4062 222.594V231.5H29.0938V214.781H34.0937V217.125C34.5625 216.031 36.4375 214.312 39.0937 214.312C42.0625 214.312 45.1875 216.031 45.1875 221.187V231.5H45.5Z"
-                fill="#383E43"
-              />
-            </g>
-            <defs>
-              <filter
-                id="filter0_d_841_15135"
-                x="0"
-                y="0"
-                width="66"
-                height="66"
-                filterUnits="userSpaceOnUse"
-                color-interpolation-filters="sRGB"
-              >
-                <feFlood flood-opacity="0" result="BackgroundImageFix" />
-                <feColorMatrix
-                  in="SourceAlpha"
-                  type="matrix"
-                  values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
-                  result="hardAlpha"
-                />
-                <feOffset />
-                <feGaussianBlur stdDeviation="4" />
-                <feComposite in2="hardAlpha" operator="out" />
-                <feColorMatrix
-                  type="matrix"
-                  values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0"
-                />
-                <feBlend
-                  mode="normal"
-                  in2="BackgroundImageFix"
-                  result="effect1_dropShadow_841_15135"
-                />
-                <feBlend
-                  mode="normal"
-                  in="SourceGraphic"
-                  in2="effect1_dropShadow_841_15135"
-                  result="shape"
-                />
-              </filter>
-              <filter
-                id="filter1_d_841_15135"
-                x="0"
-                y="62"
-                width="66"
-                height="66"
-                filterUnits="userSpaceOnUse"
-                color-interpolation-filters="sRGB"
-              >
-                <feFlood flood-opacity="0" result="BackgroundImageFix" />
-                <feColorMatrix
-                  in="SourceAlpha"
-                  type="matrix"
-                  values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
-                  result="hardAlpha"
-                />
-                <feOffset />
-                <feGaussianBlur stdDeviation="4" />
-                <feComposite in2="hardAlpha" operator="out" />
-                <feColorMatrix
-                  type="matrix"
-                  values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0"
-                />
-                <feBlend
-                  mode="normal"
-                  in2="BackgroundImageFix"
-                  result="effect1_dropShadow_841_15135"
-                />
-                <feBlend
-                  mode="normal"
-                  in="SourceGraphic"
-                  in2="effect1_dropShadow_841_15135"
-                  result="shape"
-                />
-              </filter>
-              <filter
-                id="filter2_d_841_15135"
-                x="0"
-                y="124"
-                width="66"
-                height="66"
-                filterUnits="userSpaceOnUse"
-                color-interpolation-filters="sRGB"
-              >
-                <feFlood flood-opacity="0" result="BackgroundImageFix" />
-                <feColorMatrix
-                  in="SourceAlpha"
-                  type="matrix"
-                  values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
-                  result="hardAlpha"
-                />
-                <feOffset />
-                <feGaussianBlur stdDeviation="4" />
-                <feComposite in2="hardAlpha" operator="out" />
-                <feColorMatrix
-                  type="matrix"
-                  values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0"
-                />
-                <feBlend
-                  mode="normal"
-                  in2="BackgroundImageFix"
-                  result="effect1_dropShadow_841_15135"
-                />
-                <feBlend
-                  mode="normal"
-                  in="SourceGraphic"
-                  in2="effect1_dropShadow_841_15135"
-                  result="shape"
-                />
-              </filter>
-              <filter
-                id="filter3_d_841_15135"
-                x="0"
-                y="186"
-                width="66"
-                height="66"
-                filterUnits="userSpaceOnUse"
-                color-interpolation-filters="sRGB"
-              >
-                <feFlood flood-opacity="0" result="BackgroundImageFix" />
-                <feColorMatrix
-                  in="SourceAlpha"
-                  type="matrix"
-                  values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
-                  result="hardAlpha"
-                />
-                <feOffset />
-                <feGaussianBlur stdDeviation="4" />
-                <feComposite in2="hardAlpha" operator="out" />
-                <feColorMatrix
-                  type="matrix"
-                  values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0"
-                />
-                <feBlend
-                  mode="normal"
-                  in2="BackgroundImageFix"
-                  result="effect1_dropShadow_841_15135"
-                />
-                <feBlend
-                  mode="normal"
-                  in="SourceGraphic"
-                  in2="effect1_dropShadow_841_15135"
-                  result="shape"
-                />
-              </filter>
-            </defs>
-          </svg>
-          <svg
-          class="block md:hidden -me-[30vw]"
-          width="192" height="51" viewBox="0 0 192 51" fill="none" xmlns="http://www.w3.org/2000/svg">
-            <g filter="url(#filter0_d_1288_57729)">
-            <path d="M25.5 42.5C16.1112 42.5 8.5 34.8888 8.5 25.5C8.5 16.1112 16.1112 8.5 25.5 8.5C34.8888 8.5 42.5 16.1112 42.5 25.5C42.5 34.8888 34.8888 42.5 25.5 42.5Z" stroke="#0D3F40"/>
-            <path d="M25.5 18.0625C27.9062 18.0625 28.2344 18.0625 29.2188 18.0625C30.0938 18.0625 30.5312 18.2813 30.8594 18.3906C31.2969 18.6094 31.625 18.7188 31.9531 19.0469C32.2812 19.375 32.5 19.7031 32.6094 20.1406C32.7188 20.4688 32.8281 20.9063 32.9375 21.7813C32.9375 22.7656 32.9375 22.9844 32.9375 25.5C32.9375 28.0156 32.9375 28.2344 32.9375 29.2188C32.9375 30.0938 32.7188 30.5312 32.6094 30.8594C32.3906 31.2969 32.2812 31.625 31.9531 31.9531C31.625 32.2812 31.2969 32.5 30.8594 32.6094C30.5312 32.7188 30.0938 32.8281 29.2188 32.9375C28.2344 32.9375 28.0156 32.9375 25.5 32.9375C22.9844 32.9375 22.7656 32.9375 21.7813 32.9375C20.9063 32.9375 20.4688 32.7188 20.1406 32.6094C19.7031 32.3906 19.375 32.2812 19.0469 31.9531C18.7188 31.625 18.5 31.2969 18.3906 30.8594C18.2813 30.5312 18.1719 30.0938 18.0625 29.2188C18.0625 28.2344 18.0625 28.0156 18.0625 25.5C18.0625 22.9844 18.0625 22.7656 18.0625 21.7813C18.0625 20.9063 18.2813 20.4688 18.3906 20.1406C18.6094 19.7031 18.7188 19.375 19.0469 19.0469C19.375 18.7188 19.7031 18.5 20.1406 18.3906C20.4688 18.2813 20.9063 18.1719 21.7813 18.0625C22.7656 18.0625 23.0938 18.0625 25.5 18.0625ZM25.5 16.4219C22.9844 16.4219 22.7656 16.4219 21.7813 16.4219C20.7969 16.4219 20.1406 16.6406 19.5938 16.8594C19.0469 17.0781 18.5 17.4063 17.9531 17.9531C17.4063 18.5 17.1875 18.9375 16.8594 19.5938C16.6406 20.1406 16.5312 20.7969 16.4219 21.7813C16.4219 22.7656 16.4219 23.0938 16.4219 25.5C16.4219 28.0156 16.4219 28.2344 16.4219 29.2188C16.4219 30.2031 16.6406 30.8594 16.8594 31.4062C17.0781 31.9531 17.4063 32.5 17.9531 33.0469C18.5 33.5938 18.9375 33.8125 19.5938 34.1406C20.1406 34.3594 20.7969 34.4687 21.7813 34.5781C22.7656 34.5781 23.0938 34.5781 25.5 34.5781C27.9062 34.5781 28.2344 34.5781 29.2188 34.5781C30.2031 34.5781 30.8594 34.3594 31.4062 34.1406C31.9531 33.9219 32.5 33.5938 33.0469 33.0469C33.5938 32.5 33.8125 32.0625 34.1406 31.4062C34.3594 30.8594 34.4687 30.2031 34.5781 29.2188C34.5781 28.2344 34.5781 27.9062 34.5781 25.5C34.5781 23.0938 34.5781 22.7656 34.5781 21.7813C34.5781 20.7969 34.3594 20.1406 34.1406 19.5938C33.9219 19.0469 33.5938 18.5 33.0469 17.9531C32.5 17.4063 32.0625 17.1875 31.4062 16.8594C30.8594 16.6406 30.2031 16.5312 29.2188 16.4219C28.2344 16.4219 28.0156 16.4219 25.5 16.4219Z" fill="#0D3F40"/>
-            <path d="M25.5 20.7969C22.875 20.7969 20.7969 22.875 20.7969 25.5C20.7969 28.125 22.875 30.2031 25.5 30.2031C28.125 30.2031 30.2031 28.125 30.2031 25.5C30.2031 22.875 28.125 20.7969 25.5 20.7969ZM25.5 28.5625C23.8594 28.5625 22.4375 27.25 22.4375 25.5C22.4375 23.8594 23.75 22.4375 25.5 22.4375C27.1406 22.4375 28.5625 23.75 28.5625 25.5C28.5625 27.1406 27.1406 28.5625 25.5 28.5625Z" fill="#0D3F40"/>
-            <path d="M30.3125 21.7813C30.9166 21.7813 31.4062 21.2916 31.4062 20.6875C31.4062 20.0834 30.9166 19.5938 30.3125 19.5938C29.7084 19.5938 29.2188 20.0834 29.2188 20.6875C29.2188 21.2916 29.7084 21.7813 30.3125 21.7813Z" fill="#0D3F40"/>
-            </g>
-            <g filter="url(#filter1_d_1288_57729)">
-            <path d="M72.5 42.5C63.1112 42.5 55.5 34.8888 55.5 25.5C55.5 16.1112 63.1112 8.5 72.5 8.5C81.8888 8.5 89.5 16.1112 89.5 25.5C89.5 34.8888 81.8888 42.5 72.5 42.5Z" stroke="#383E43"/>
-            <path fill-rule="evenodd" clip-rule="evenodd" d="M78.625 19.2656C76.9844 17.625 74.7969 16.75 72.5 16.75C67.6875 16.75 63.75 20.6875 63.75 25.5C63.75 27.0312 64.1875 28.5625 64.9531 29.875L63.75 34.25L68.3438 33.0469C69.6563 33.7031 71.0781 34.1406 72.5 34.1406C77.3125 34.1406 81.25 30.2031 81.25 25.3906C81.25 23.0937 80.2656 20.9062 78.625 19.2656ZM72.5 32.7188C71.1875 32.7188 69.875 32.3906 68.7813 31.7344L68.5625 31.625L65.8281 32.3906L66.5938 29.7656L66.375 29.4375C65.6094 28.2344 65.2812 26.9219 65.2812 25.6094C65.2812 21.6719 68.5625 18.3906 72.5 18.3906C74.4688 18.3906 76.2188 19.1562 77.6406 20.4687C79.0625 21.8906 79.7188 23.6406 79.7188 25.6094C79.7188 29.4375 76.5469 32.7188 72.5 32.7188ZM76.4375 27.25C76.2188 27.1406 75.125 26.5938 74.9063 26.5938C74.6875 26.4844 74.5781 26.4844 74.4687 26.7031C74.3594 26.9219 73.9219 27.3594 73.8125 27.5781C73.7031 27.6875 73.5937 27.6875 73.375 27.6875C73.1562 27.5781 72.5 27.3594 71.625 26.5938C70.9688 26.0469 70.5313 25.2812 70.4219 25.0625C70.3125 24.8438 70.4219 24.7344 70.5313 24.625C70.6406 24.5156 70.75 24.4062 70.8594 24.2969C70.9688 24.1875 70.9688 24.0781 71.0781 23.9688C71.1875 23.8594 71.0781 23.75 71.0781 23.6406C71.0781 23.5312 70.6406 22.4375 70.4219 22C70.3125 21.6719 70.0938 21.6719 69.9844 21.6719C69.875 21.6719 69.7656 21.6719 69.5469 21.6719C69.4375 21.6719 69.2187 21.6719 69 21.8906C68.7812 22.1094 68.2344 22.6562 68.2344 23.75C68.2344 24.8438 69 25.8281 69.1094 26.0469C69.2187 26.1562 70.6406 28.4531 72.8281 29.3281C74.6875 30.0938 75.0156 29.875 75.4531 29.875C75.8906 29.875 76.7656 29.3281 76.875 28.8906C77.0938 28.3438 77.0938 27.9063 76.9844 27.9063C76.875 27.3594 76.6563 27.3594 76.4375 27.25Z" fill="#383E43"/>
-            </g>
-            <g filter="url(#filter2_d_1288_57729)">
-            <path d="M119.5 42.5C110.111 42.5 102.5 34.8888 102.5 25.5C102.5 16.1112 110.111 8.5 119.5 8.5C128.889 8.5 136.5 16.1112 136.5 25.5C136.5 34.8888 128.889 42.5 119.5 42.5Z" stroke="#383E43"/>
-            <path d="M110.859 25.1809C115.557 23.1343 118.689 21.785 120.257 21.1331C124.732 19.2717 125.662 18.9484 126.268 18.9376C126.401 18.9354 126.699 18.9684 126.892 19.1251C127.055 19.2573 127.1 19.436 127.122 19.5615C127.143 19.6869 127.17 19.9726 127.148 20.1958C126.906 22.7439 125.857 28.9273 125.323 31.7811C125.097 32.9887 124.652 33.3936 124.222 33.4332C123.286 33.5193 122.575 32.8147 121.669 32.2206C120.251 31.2909 119.449 30.7122 118.073 29.805C116.482 28.7566 117.513 28.1803 118.42 27.2386C118.657 26.9922 122.78 23.2419 122.86 22.9017C122.87 22.8592 122.879 22.7006 122.785 22.6168C122.691 22.5331 122.552 22.5617 122.451 22.5845C122.309 22.6168 120.043 24.1143 115.654 27.0771C115.011 27.5187 114.429 27.7338 113.907 27.7226C113.331 27.7101 112.225 27.3973 111.402 27.1298C110.393 26.8018 109.591 26.6283 109.66 26.0712C109.697 25.7811 110.096 25.4843 110.859 25.1809Z" fill="#383E43"/>
-            </g>
-            <g filter="url(#filter3_d_1288_57729)">
-            <path d="M166.5 42.5C157.111 42.5 149.5 34.8888 149.5 25.5C149.5 16.1112 157.111 8.5 166.5 8.5C175.889 8.5 183.5 16.1112 183.5 25.5C183.5 34.8888 175.889 42.5 166.5 42.5Z" stroke="#383E43"/>
-            <path d="M161.688 34.25H157.969V22.5469H161.688V34.25ZM159.828 20.9062C158.625 20.9062 157.75 20.0312 157.75 18.8281C157.75 17.625 158.734 16.75 159.828 16.75C161.031 16.75 161.906 17.625 161.906 18.8281C161.906 20.0312 161.031 20.9062 159.828 20.9062ZM175.25 34.25H171.531V27.9063C171.531 26.0469 170.766 25.5 169.672 25.5C168.578 25.5 167.484 26.375 167.484 28.0156V34.25H163.766V22.5469H167.266V24.1875C167.594 23.4219 168.906 22.2188 170.766 22.2188C172.844 22.2188 175.031 23.4219 175.031 27.0312V34.25H175.25Z" fill="#383E43"/>
-            </g>
-            <defs>
-            <filter id="filter0_d_1288_57729" x="0" y="0" width="51" height="51" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
-            <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-            <feOffset/>
-            <feGaussianBlur stdDeviation="4"/>
-            <feComposite in2="hardAlpha" operator="out"/>
-            <feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0"/>
-            <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1288_57729"/>
-            <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1288_57729" result="shape"/>
-            </filter>
-            <filter id="filter1_d_1288_57729" x="47" y="0" width="51" height="51" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
-            <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-            <feOffset/>
-            <feGaussianBlur stdDeviation="4"/>
-            <feComposite in2="hardAlpha" operator="out"/>
-            <feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0"/>
-            <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1288_57729"/>
-            <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1288_57729" result="shape"/>
-            </filter>
-            <filter id="filter2_d_1288_57729" x="94" y="0" width="51" height="51" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
-            <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-            <feOffset/>
-            <feGaussianBlur stdDeviation="4"/>
-            <feComposite in2="hardAlpha" operator="out"/>
-            <feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0"/>
-            <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1288_57729"/>
-            <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1288_57729" result="shape"/>
-            </filter>
-            <filter id="filter3_d_1288_57729" x="141" y="0" width="51" height="51" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
-            <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-            <feOffset/>
-            <feGaussianBlur stdDeviation="4"/>
-            <feComposite in2="hardAlpha" operator="out"/>
-            <feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0"/>
-            <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1288_57729"/>
-            <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1288_57729" result="shape"/>
-            </filter>
-            </defs>
-            </svg>
-            
+            داستان ما
+          </h2>
+          <p
+            class="text-[3.19vw] lg:text-[0.833vw] leading-[4.5vw] lg:leading-[1.563vw] mt-[2vw]"
+          >
+            لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با
+            استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در
+            ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز،
+            و کاربردهای
+          </p>
+          <p
+            class="hidden lg:block text-[3.19vw] lg:text-[0.833vw] leading-[1.563vw] mt-[2vw]"
+          >
+            رسد و زمان مورد نیاز شامل حروفچینی دستاوردهای اصلی، و جوابگوی سوالات
+            پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.لورم
+            ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده
+            از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و
+            سطرآنچنان که لازم اس متنوع با هدف بهبود ابزارهای کاربردی می باشد،
+            کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه
+            و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشتری را برای طراحان
+            رایانه ای علی الخصوص طراحان خلاقی، و فرهنگ پیشرو در زبان فارسی ایجاد
+            کرد. در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه
+            راهکارها، و شرایط سخت تایپ به پایانت، و برای شرایط فعلی تکنولوژی
+            مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد،
+            کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه
+            و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشتری را برای طراحان
+            رایانه ای علی الخصوص طراحان خلاقی، و فرهنگ پیشرو در زبان فارسی ایجاد
+            کرد، در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه
+            راهکارها، و شرایط سخت تایپ به پایان رسد و زمان مورد نیاز شامل
+            حروفچینی دستاوردهای اصلی، و جوابگوی سوالات پیوسته اهل دنیای موجود
+            طراحی اساسا مورد استفاده قرار گیرد.
+          </p>
         </div>
       </div>
+      <div class="fade"></div>
     </div>
-
-  </div>
-  
+  </div> -->
 </template>
-
-<script setup>
-const zoom = ref(100)
-</script>
\ No newline at end of file
diff --git a/pages/index.vue b/pages/index.vue
index 42f1eba..3666a2f 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -1,5 +1,4 @@
 <template>
-  <client-only>
     <home-pageHeader />
     <home-pageAboutUs />
     <home-pageSlider />
@@ -8,7 +7,5 @@
     <home-pageProductSampleForm />
     <home-pageMediaSlider />
     <home-pageInstagram />
-
-  </client-only>
 </template>
 
diff --git a/pages/test.vue b/pages/test.vue
deleted file mode 100644
index 8b4c831..0000000
--- a/pages/test.vue
+++ /dev/null
@@ -1,160 +0,0 @@
-<template>
-  <div class="description blue">
-    <div>
-      <h1>Side by Side Layered pinning</h1>
-      <p>Use pinning to layer panels on top of each other as you scroll.</p>
-      <div class="scroll-down">
-        Scroll down
-        <div class="arrow"></div>
-      </div>
-    </div>
-  </div>
-
-  <div class="sections">
-    <div class="container-page">
-      <div class="contento">
-        <h2>This is random content</h2>
-      </div>
-      <div class="contento">
-        <h2>This is another content</h2>
-      </div>
-    </div>
-    <div class="panels">
-      <section class="panel red">ONE</section>
-      <section class="panel orange">TWO</section>
-      <section class="panel purple">THREE</section>
-      <section class="panel green">FOUR</section>
-    </div>
-  </div>
-
-  <section class="spacer">
-    <h1>The End!</h1>
-    <h1>Happy Tweening!</h1>
-  </section>
-
-  <header>
-    <a href="https://greensock.com/scrolltrigger">
-      <img
-        class="greensock-icon"
-        src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/scroll-trigger-logo-light.svg"
-        width="200"
-        height="64"
-      />
-    </a>
-  </header>
-</template>
-
-<script setup>
-// import { onMounted, onUnmounted, ref } from "vue";
-import gsap from "gsap";
-import { ScrollTrigger } from "gsap/ScrollTrigger";
-//  import {Scrollbar} from "gsap/Scrollbar"
-// import { MotionPathPlugin } from "gsap/MotionPathPlugin";
-gsap.registerPlugin(ScrollTrigger);
-
-// const main = ref();
-// let ctx;
-
-onMounted(() => {
-  console.clear();
-  const panels = gsap.utils.toArray(".panel");
-  console.log("panels :", panels);
-  gsap.set(panels, {
-    yPercent: (i) => (i ? 100 : 0),
-  });
-  
-const tl = gsap.timeline({
-  scrollTrigger: {
-    trigger: ".sections",
-    start: "top top",
-    end: () => "+=" + 100 * panels.length + "%",
-    pin: true,
-    scrub: 1,
-    markers: true
-  }
-});
-
-panels.forEach((panel, index) => {
-  if (index) {
-    tl.to(
-      panel,
-      {
-        yPercent: 0,
-        ease: "none"
-      },
-      "+=0.25"
-    );
-  }
-});
-
-});
-</script>
-
-<style scoped>
-.sections {
-    width: 100%;
-    position: relative;
-    height: 90vh;
-    display: flex;
-  }
-  .panels {
-    width: 50%;
-    /*   height: 100vh; */
-    background: lime;
- 
-    position: relative;
-
-  }
-  .container-page {
-    width: 50%;
-    background-color: purple;
-  }
-  .container-page h2 {
-    font-size: 30px;
-  }
-  .panel {
-    height: 100vh;
-    width: 100%;
-    margin-bottom: 100px !important;
-    margin-left: auto;
-    display: flex !important;
-    justify-content: center !important;
-    align-items: center !important;
-    position: absolute;
-    top: 0;
-    left: 0;
-  }
-  
-  .description {
-    height: 100vh;
-  }
-  
-  .blue {
-    background-color: blue;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    color: white;
-  }
-  
-  .blue h1 {
-    margin: 0 0 1rem 0;
-    text-align: center;
-  }
-  
-  .green {
-    height: 100vh;
-  }
-
-  section.spacer {
-    width: 100%;
-    height: 100vh;
-    background: #333;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-    color: white;
-  }
-  
-</style>
\ No newline at end of file