diff --git a/src/app/components/OrderForm/index.tsx b/src/app/components/OrderForm/index.tsx
new file mode 100644
index 0000000..f8cde2f
--- /dev/null
+++ b/src/app/components/OrderForm/index.tsx
@@ -0,0 +1,115 @@
+import styles from './orderform.module.css';
+
+import Link from 'next/link';
+
+const forms = [
+  {
+    id: 0,
+    left: [{
+      title: 'Ваше имя*',
+      id: 'name',
+      type: 'text',
+      placeholder: 'Укажите имя',
+      pattern: undefined,
+    }, {
+      title: 'Ваш телефон*',
+      id: 'phone',
+      type: 'text',
+      placeholder: '+7 (___) ___-__-__',
+      pattern: '^(\+7|7|8)?[\s\-]?\(?[489][0-9]{2}\)?[\s\-]?[0-9]{3}[\s\-]?[0-9]{2}[\s\-]?[0-9]{2}$',
+    },
+    ],
+  },
+  {
+    id: 1,
+    mid: [{
+      title: 'Название компании',
+      id: 'company',
+      type: 'text',
+      placeholder: 'Укажите имя',
+      pattern: undefined,
+    }, {
+      title: 'E-mail',
+      id: 'email',
+      type: 'email',
+      placeholder: 'example@domain.com',
+      pattern: undefined,
+    },
+    ],
+  },
+  {
+    id: 2,
+    right: [{
+      title: 'Добавить комментарий',
+      id: 'commentary',
+      type: 'text',
+      placeholder: undefined,
+      pattern: undefined,
+    },
+    ],
+  },
+]
+
+const OrderForm = () => {
+  return (
+    <div className={styles['wholesale-order']}>
+      <h3 className={styles['minor-heading']}>
+        Заказать расчёт или отправить запрос на сотрудничество
+      </h3>
+      <form action='' method='post' className={styles.form}>
+        <div className={styles['wholesale-order__contact-form']}>
+          {forms.map((form) => (
+            <div className={styles['contact-form__column']} key={form.id}>
+              {form.left?.map((el) => (
+                <div className={styles['column__container']} key={el.id}>
+                  <label htmlFor={el.id}>{el.title}</label>
+                  <input
+                    className={styles['wholesale-order__form']}
+                    id={el.id}
+                    type={el.type}
+                    placeholder={el.placeholder}
+                    pattern={el.pattern}
+                    required
+                  />
+                </div>
+              ))}
+              {form.mid?.map((el) => (
+                <div className={styles['column__container']} key={el.id}>
+                  <label htmlFor={el.id}>{el.title}</label>
+                  <input
+                    className={styles['wholesale-order__form']}
+                    id={el.id}
+                    type={el.type}
+                    placeholder={el.placeholder}
+                    pattern={el.pattern}
+                  />
+                </div>
+              ))}
+              {form.right?.map((el) => (
+                <div className={styles['column__container']} key={el.id}>
+                  <label htmlFor={el.id}>{el.title}</label>
+                  <input
+                    className={[styles['wholesale-order__form'], styles.commentary].join(' ')}
+                    id={el.id}
+                    type={el.type}
+                    placeholder={el.placeholder}
+                    pattern={el.pattern}
+                  />
+                </div>
+              ))}
+            </div>
+          ))}
+        </div>
+        <button type='submit' className={styles['wholesale-order__btn']}>Заказать расчёт</button>
+      </form>
+      <div className={styles['wholesale-order__agreement']}>
+        <span>{'Нажимая на кнопку "Оформить заказ" Я принимаю и соглашаюсь с '}</span>
+        <span className={styles['agreement-link']}>{'Договором оферты '}</span>
+        <span>{'и разрешаю обработку моих персональных данных в соответствии с '}</span>
+        <Link href={'/privacy-policy'} className={styles.agreement_link}> Политикой конфиденциальности</Link>
+      </div>
+    </div>
+  )
+}
+
+export default OrderForm;
\ No newline at end of file
diff --git a/src/app/components/OrderForm/orderform.module.css b/src/app/components/OrderForm/orderform.module.css
new file mode 100644
index 0000000..01b5798
--- /dev/null
+++ b/src/app/components/OrderForm/orderform.module.css
@@ -0,0 +1,87 @@
+.wholesale-order {
+  padding: 76px 0px 76px 0px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 23px;
+}
+
+.minor-heading {
+  font-size: 30px;
+}
+
+.form {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 40px;
+  width: 100%;
+}
+
+.wholesale-order__contact-form {
+  display: flex;
+  justify-content: space-around;
+  width: 100%;
+}
+
+.contact-form__column {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.column__container {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.column__container label {
+  font-size: 13px;
+}
+
+.wholesale-order h3 {
+  width: 650px;
+  text-align: center;
+  padding-bottom: 40px;
+}
+
+.wholesale-order__form {
+  width: 370px;
+  height: 50px;
+  border: 1px solid #EDEDF0;
+  font-size: 16px;
+}
+
+.commentary {
+  height: 139px;
+}
+
+.wholesale-order__btn {
+  background-color: var(--accent);
+  color: #FFFFFF;
+  width: 254px;
+  height: 50px;
+  border: none;
+  font-size: 14px;
+  font-weight: 600;
+  border-radius: 3px;
+  margin-top: 10px;
+  cursor: pointer;
+}
+
+.wholesale-order span {
+  font-size: 11px;
+}
+
+.agreement_link {
+  font-size: 12px;
+  color: var(--blue);
+  text-decoration: underline;
+}
+
+.wholesale-order__form::placeholder {
+  padding-left: 15px;
+  font-size: 16px;
+  color: rgba(41, 41, 41, 40%);
+}
\ No newline at end of file
diff --git a/src/app/wholesale/page.module.css b/src/app/wholesale/page.module.css
index 4bafc83..2c110c0 100644
--- a/src/app/wholesale/page.module.css
+++ b/src/app/wholesale/page.module.css
@@ -145,76 +145,6 @@
   background-image: url(/svg/otherspheres.svg);
 }
 
-.wholesale-order {
-  padding: 76px 0px 76px 0px;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 23px;
-}
-
-.wholesale-order__contact-form {
-  display: flex;
-  justify-content: space-around;
-  width: 100%;
-}
-
-.contact-form__column {
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
-}
-
-.column__container {
-  display: flex;
-  flex-direction: column;
-  gap: 6px;
-}
-
-.column__container label {
-  font-size: 13px;
-}
-
-.wholesale-order h3 {
-  width: 650px;
-  text-align: center;
-  padding-bottom: 40px;
-}
-
-.wholesale-order__form {
-  width: 370px;
-  height: 50px;
-  border: 1px solid #EDEDF0;
-  font-size: 16px;
-}
-
-.commentary {
-  height: 139px;
-}
-
-.wholesale-order__btn {
-  background-color: var(--accent);
-  color: #FFFFFF;
-  width: 254px;
-  height: 50px;
-  border: none;
-  font-size: 14px;
-  font-weight: 600;
-  border-radius: 3px;
-  margin-top: 10px;
-  cursor: pointer;
-}
-
-.wholesale-order span {
-  font-size: 11px;
-}
-
-.agreement_link {
-  font-size: 12px;
-  color: var(--blue);
-  text-decoration: underline;
-}
-
 .wholesale-reviews {
   padding: 67px 0px 59px 0px;
   display: flex;
@@ -337,12 +267,6 @@
   
 }
 
-.wholesale-order__form::placeholder {
-  padding-left: 15px;
-  font-size: 16px;
-  color: rgba(41, 41, 41, 40%);
-}
-
 .bg {
   background-color: #F7EBE5;
 }
diff --git a/src/app/wholesale/page.tsx b/src/app/wholesale/page.tsx
index 997b824..18bb709 100644
--- a/src/app/wholesale/page.tsx
+++ b/src/app/wholesale/page.tsx
@@ -1,8 +1,9 @@
-import Link from 'next/link';
+// import Link from 'next/link';
 import Breadcrumb from '../shared/ui/Breadcrumb';
 import styles from './page.module.css';
 
 import Container from '@/app/components/Container';
+import OrderForm from '../components/OrderForm';
 
 const offers = [
   {
@@ -158,71 +159,7 @@ const Wholesale = () => {
       </Container>
       <div className={styles.bg}>
         <Container>
-          <div className={styles['wholesale-order']}>
-            <h3 className={styles['minor-heading']}>
-              Заказать расчёт или отправить запрос на сотрудничество
-            </h3>
-            <div className={styles['wholesale-order__contact-form']}>
-              <div className={styles['contact-form__column']}>
-                <div className={styles['column__container']}>
-                  <label htmlFor='name'>Ваше имя*</label>
-                  <input
-                    className={styles['wholesale-order__form']}
-                    id='name'
-                    type='text'
-                    placeholder='Укажите имя'
-                    required
-                  />
-                </div>
-                <div className={styles['column__container']}>
-                  <label htmlFor='phone'>Ваш телефон*</label>
-                  <input
-                    className={styles['wholesale-order__form']}
-                    type='tel'
-                    id='phone'
-                    placeholder='+7 (___) ___-__-__'
-                    pattern='^(\+7|7|8)?[\s\-]?\(?[489][0-9]{2}\)?[\s\-]?[0-9]{3}[\s\-]?[0-9]{2}[\s\-]?[0-9]{2}$'
-                    required
-                  />
-                </div>
-              </div>
-              <div className={styles['contact-form__column']}>
-                <div className={styles['column__container']}>
-                  <label htmlFor='company'>Название компании</label>
-                  <input
-                    className={styles['wholesale-order__form']}
-                    type='text'
-                    id='company'
-                    placeholder='Укажите имя'
-                  />
-                </div>
-                <div className={styles['column__container']}>
-                  <label htmlFor='email'>E-mail</label>
-                  <input
-                    className={styles['wholesale-order__form']}
-                    type='email'
-                    id='email'
-                    placeholder='example@domain.com'
-                  />
-                </div>
-              </div>
-              <div className={styles['column__container']}>
-                <label htmlFor='commentary'>Добавить комментарий</label>
-                <input
-                  className={[styles['wholesale-order__form'], styles.commentary].join(' ')}
-                  type='text'
-                  id='commentary'
-                />
-              </div>
-            </div>
-            <button className={styles['wholesale-order__btn']}>Заказать расчёт</button>
-            <div className={styles['wholesale-order__agreement']}>
-              <span>{'Нажимая на кнопку "Оформить заказ" Я принимаю и соглашаюсь с '}</span>
-              <span className={styles['agreement-link']}>{'Договором оферты '}</span>
-              <span>{'и разрешаю обработку моих персональных данных в соответствии с '}</span>
-              <Link href={'/privacy-policy'} className={styles.agreement_link}> Политикой конфиденциальности</Link>
-            </div>
-          </div>
+            <OrderForm />
         </Container>
       </div>
       <Container>