@@ -8,14 +8,14 @@ import FeaturesBlock from "@/src/shared/components/pages_components/main_page/Fe
 import ServicesBlock from "@/src/shared/components/pages_components/main_page/ServicesBlock";
 import NewWayBlock from "@/src/shared/components/pages_components/main_page/NewWayBlock";
 
-import { products } from "@/src/shared/utils/staticMockData";
+// import { products } from "@/src/shared/utils/staticMockData";
 import ReadyImagesBlock from "@/src/shared/components/pages_components/main_page/ReadyImagesBlock";
 import FaqBlock from "@/src/shared/components/shared_components/FaqBlock/FaqBlock";
 import FeedbackBlock from "@/src/shared/components/shared_components/FeedbackBlock/FeedbackBlock";
 import Footer from "@/src/shared/components/shared_components/Footer/Footer";
 import QuestionButton from "@/src/shared/components/shared_components/QuestionButton/QuestionButton";
 
-import { getContacts, getFaq, getPortfolio } from "../shared/api/requests";
+import { getContacts, getFaq, getPortfolio, getProductsSlice } from "../shared/api/requests";
 
 export const dynamic = "force-dynamic"
 
@@ -23,13 +23,14 @@ export default async function Home() {
   const contacts = (await getContacts()).data
   const faqData = (await getFaq()).data
   const portfolio = (await getPortfolio()).data
+  const productsSlice = (await getProductsSlice({ slice: true, qty: 4 })).data
 
   return (
     <>
       <div className="layout">
         <QuestionButton contacts={contacts} />
         <header>
-          <UpperBlock contacts={contacts}/>
+          <UpperBlock contacts={contacts} />
           <div className="h-[91px] lg:h-[6px]"></div>
           <Header contacts={contacts} />
         </header>
@@ -38,7 +39,7 @@ export default async function Home() {
           <PortfolioBlock contacts={contacts} portfolioItems={portfolio} />
           <FeaturesBlock />
           <ServicesBlock />
-          <NewWayBlock products={products} contacts={contacts} />
+          <NewWayBlock products={productsSlice} contacts={contacts} />
           <ReadyImagesBlock contacts={contacts} />
           <FaqBlock faqData={faqData} />
           <FeedbackBlock contacts={contacts} />
@@ -1,7 +1,7 @@
 import axios from "axios"
-import { IContacts, IFaq, IFeedback, IPortfolioItem, IPriceListItem } from "../models/models"
+import { IContacts, IFaq, IFeedback, IPortfolioItem, IPriceListItem, IProduct } from "../models/models"
 
-const DOMAIN = process.env.API_URL
+const DOMAIN = process.env.NEXT_PUBLIC_API_URL
 const url = `${DOMAIN}/api`
 
 
@@ -10,7 +10,11 @@ export const getContacts = async () => {
 }
 
 export const getProducts = async () => {
-    return await axios.get<IPriceListItem[]>(url + "/products")
+    return await axios.get<IPriceListItem[]>(url + `/products/`)
+}
+
+export const getProductsSlice = async ({ slice, qty }: { slice?: boolean, qty?: number }) => {
+    return await axios.get<IProduct[]>(url + `/products?${slice === true ? `slice=true&` : ""}${slice === true && qty !== undefined ? `limit=${qty}` : ""}`)
 }
 
 export const sendFeedback = async (data: IFeedback) => {
@@ -22,5 +26,5 @@ export const getFaq = async () => {
 }
 
 export const getPortfolio = async () => {
-    return await axios.get<IPortfolioItem[]>(url + "/portfolio/")
+    return await axios.get<IPortfolioItem[]>(url + `/portfolio/`)
 }
\ No newline at end of file
@@ -12,6 +12,7 @@ import ThanksModal from "@/src/shared/components/shared_components/Modals/Thanks
 import { useRef, useState } from "react";
 import { IContacts, IFeedback } from "@/src/shared/models/models";
 import { sendFeedback } from '@/src/shared/api/requests';
+import { prettifyPhoneNumber } from '@/src/shared/utils/funcs/prettifyPhoneNumber';
 
 const schema = yup.object().shape({
     name: yup.string().required('Введите имя'),
@@ -56,7 +57,7 @@ export default function ContactsBlock({ contacts }: { contacts: IContacts }) {
             <ThanksModal contacts={contacts} isModalThanksOpened={isModalThanksOpened} setIsModalThanksOpened={setIsModalThanksOpened} mail={mailToPass} />
             <h2 className='text-[32px] leading-[35.2px] mb-[30px] font-medium uppercase text-center lg:mb-[40px] lg:text-[56px] lg:leading-[61.6px]'>контакты и обратная связь</h2>
             <p className="text-[16px] font-normal text-center leading-[19.2px] mb-[40px] lg:mb-[60px] lg:font-light lg:text-[22px] lg:leading-[28.6px]">Если у Вас есть какие-либо вопросы или Вам нужна помощь, Вы можете связаться с нами.<br className='hidden lg:block' />
-                Тел: +7 927 520 33 00 Мы доступны с 10 утра до 20 вечера. <br className='hidden lg:block' />
+                Тел: {contacts.phone && prettifyPhoneNumber(contacts.phone)}. Мы доступны с 10 утра до 20 вечера. <br className='hidden lg:block' />
                 Также Вы можете заполнить форму обратной связи ниже.<br className='hidden lg:block' />
                 Ответ поступит на указанный e-mail.</p>
 
@@ -39,6 +39,8 @@ export default function PortfolioBlock({ contacts, portfolioItems }: IProps) {
         }
     };
 
+    console.log(portfolioItems);
+    
     return (
         <div className='max-w-[1220px] mx-auto mt-[40px] lg:mt-[90px]'>
             {isModalFeedbackOpened && <ModalFeedback isModalFeedbackOpened={isModalFeedbackOpened} setIsModalFeedbackOpened={setIsModalFeedbackOpened} contacts={contacts} />}
@@ -1,5 +1,5 @@
 'use client'
-import { faqData } from '@/src/shared/utils/staticMockData';
+import { faqData, rules } from '@/src/shared/utils/staticMockData';
 
 import { useState } from 'react';
 
@@ -8,7 +8,7 @@ import useWindowSize from '@/src/shared/utils/hooks/useWindowSize';
 
 export default function RulesPageBlock() {
     const [selected, setSelected] = useState<number | null>(null);
-    const {height, width} = useWindowSize()
+    const { height, width } = useWindowSize()
 
 
     const toggle = (i: number) => {
@@ -26,7 +26,7 @@ export default function RulesPageBlock() {
             <section className="flex flex-col relative overflow-x-scroll hideScroll">
                 <div className='wrapper w-full'>
                     <div className='accordion w-full'>
-                        {faqData.map((item, idx) => (
+                        {rules.map((item, idx) => (
                             <div className='group item hover:cursor-pointer' key={idx} onClick={() => toggle(idx)}>
                                 <div className='title'>
                                     <h2 className={`text-[18px] leading-[21.6px] max-w-[90%] font-semibold uppercase text-left pt-[5px] lg:text-[28px] lg:leading-[33.6px] group-hover:text-red-main ${selected === idx ? 'active-title' : 'not-active-title'}`}>{item.title}</h2>
@@ -39,7 +39,7 @@ export default function RulesPageBlock() {
                                 </div>
                                 <div className={`max-w-[880px] font-light text-[14px] leading-[19.6px] text-black lg:text-[18px] lg:leading-[25.2px] ${selected === idx ? 'content show' : 'content'}`}>
                                     <div className='w-full h-[20px]'></div>
-                                    {item.content}
+                                    <div dangerouslySetInnerHTML={{ __html: item.content }}></div>
                                 </div>
                             </div>
                         ))}
@@ -13,6 +13,7 @@ import { useState } from "react"
 
 import dynamic from 'next/dynamic';
 import Link from "next/link";
+import { prettifyPhoneNumber } from "@/src/shared/utils/funcs/prettifyPhoneNumber";
 const ModalFeedback = dynamic(() => import('@/src/shared/components/shared_components/Modals/ModalFeedback/ModalFeedback'));
 
 interface IProps {
@@ -29,8 +30,8 @@ export default function Footer(props: IProps) {
         <div className="mb-[60px] lg:mb-0">
           <span className="block text-[22px] font-bold text-white uppercase mb-[20px] leading-[30.01px]">контактные данные</span>
 
-          <span className="block text-[14px] font-semibold mb-[5px] text-white">Телефон: <span className="font-bold leading-[19.1px]">+7 927 520 33 00</span></span>
-          <span className="block text-[14px] font-semibold mb-[25px] text-white">Почта: <span className="font-bold leading-[19.1px]">studio@xessence.ru</span></span>
+          <a href={"tel:" + (props.contacts.phone)} className="block text-[14px] font-semibold mb-[5px] text-white">Телефон: <span className="font-bold leading-[19.1px]">{props.contacts.phone && prettifyPhoneNumber(props.contacts.phone)}</span></a>
+          <a href={"mailto:" + props.contacts.email} className="block text-[14px] font-semibold mb-[25px] text-white">Почта: <span className="font-bold leading-[19.1px]">{props.contacts.email}</span></a>
 
           <span className="block text-[14px] font-semibold mb-[5px] text-[#A0A1A5] leading-[19.1px] uppercase">ОГРН 323344300080545</span>
           <span className="block text-[14px] font-semibold mb-[38px] text-[#A0A1A5] leading-[19.1px] uppercase">ИНН 344600442682  /  ИП Плещенко Н.Н.</span>
@@ -18,6 +18,7 @@ import { IContacts } from '@/src/shared/models/models'
 import { useRouter } from 'next/navigation'
 
 import dynamic from 'next/dynamic';
+import { prettifyPhoneNumber } from "@/src/shared/utils/funcs/prettifyPhoneNumber";
 const ModalFeedback = dynamic(() => import('@/src/shared/components/shared_components/Modals/ModalFeedback/ModalFeedback'));
 
 
@@ -68,17 +69,17 @@ export default function Header(props: IProps) {
         </a>
 
         <div className='flex gap-[30px]'>
-          <div onClick={()=>{setIsModalFeedbackOpened(true)}} className='flex items-center gap-[5px] mt-[10px] lg:hidden'>
+          <div onClick={() => { setIsModalFeedbackOpened(true) }} className='flex items-center gap-[5px] mt-[10px] lg:hidden'>
             <Image src={phone_call} alt='Icon' width={14} height={14} className='hover:cursor-pointer' />
             <span className='text-gray-mainLight uppercase text-[10px]'>Связь</span>
           </div>
 
           <div className='hidden items-center gap-[10px] hover:cursor-pointer lg:flex'>
             <Image src={phone_call} alt='Icon' width={19} height={19} className='hover:cursor-pointer' />
-            <a href='tel:+79275203300' className='font-bold text-gray-mainLight'>+7 927 520 33 00</a>
+            <a href={`tel:${props.contacts.phone}`} className='font-bold text-gray-mainLight'>{props.contacts.phone && prettifyPhoneNumber(props.contacts.phone)}</a>
           </div>
 
-          <div onClick={()=>{setIsModalFeedbackOpened(true)}} className='hidden justify-center items-center  border-[2px] border-red-main w-[170px] h-[50px] hover:cursor-pointer lg:flex'>
+          <div onClick={() => { setIsModalFeedbackOpened(true) }} className='hidden justify-center items-center  border-[2px] border-red-main w-[170px] h-[50px] hover:cursor-pointer lg:flex'>
             <span className='font-normal text-[14px] uppercase mt-[1px]'>Связаться</span>
           </div>
         </div>
@@ -18,6 +18,8 @@ export interface IContacts {// реф. - контакты в хедере, фу
     whatsapp?: string,
     instagram?: string,
     youtube?: string
+    phone?: string
+    email?: string
 }
 
 export interface IProduct {// реф. - товар (на странице Прайс-лист)
@@ -0,0 +1,18 @@
+export function prettifyPhoneNumber(phone: string): string {
+    let newPhone = ""
+    const spacePositions = [0, 3, 6, 8]
+
+    if (/^\d+$/.test(phone) && phone.length === 11) { // если строка содержит только цифры
+        for (let i = 0; i < phone.length; i++) {
+            if (spacePositions.includes(i)) {
+                newPhone += phone[i] + " "
+            } else {
+                newPhone += phone[i]
+            }
+        }
+        return "+" + newPhone
+    } else {
+        return phone
+    }
+
+}
\ No newline at end of file
@@ -82,7 +82,7 @@ export const products2: IProduct[] = [
 ]
 
 
-export const faqData:IFaq[] = [
+export const faqData: IFaq[] = [
   {
     id: 0,
     title: "от чего зависит цена заказа?",
@@ -265,4 +265,67 @@ export const measurments: IMeasurement[] = [
     direction: "reverse",
     order: 12
   },
-]
\ No newline at end of file
+]
+
+
+export const rules: IFaq[] = [
+  {
+    id: 0,
+    title: "Первый визит или обращение",
+    content:
+      `Режим работы ателье устанавливается руководством ателье в зависимости от сезона. Заказчик может посетить Ателье в любой удобный для него день и момент, в рамках рабочего времени. Желательно осуществлять предварительную запись. В рамках первого визита Заказчик должен изложить суть обращения: рассказать, какая именно услуга востребована: пошив, ремонт или подгонка одежды. В зависимости от этого Администратор Ателье вызовет соответствующего специалиста. Совместно с Мастером и администратором утверждается модель (эскиз) изделия, на основании которого будет произведен расчет стоимости пошива и примерный расход материалов и фурнитуры, а так же выбираются подходящие материалы для пошива.`,
+  },
+  {
+    id: 1,
+    title: "Назначение стоимости работ и услуг",
+    content: `После того, как Заказчик вместе с Мастером оговорит нюансы заказа, администратор ателье назначает стоимость работ. Стоимость пошива определяется согласно утвержденному исполнителем прайс-листу и может изменяться в зависимости от модели изделия, наличия усложняющих элементов, используемого материала, а так же сроков пошива и в зависимости от сезонной нагрузки. Прайс-лист услуг по пошиву одежды является открытой информацией и размещен на стенде в Ателье, а так же в сети Интернет на нашем сайте. Расходные материалы (фурнитура), относящиеся к технологическим: (клеевая, плечевые накладки, долевики, нитки, отделочные канты (представленные в ассортименте в ателье) бейки, резинка (не декоративная), ригелин (до 10см шириной) бретели силиконовые, бегунки (за исключением именных и декоративных), регулировочные кольца, Чашечки (без PUSH UP), косточки для бюстгальтера и корсета, заглушки на косточки для корсета, крючки ( не декоративные), шнурки (не декоративные) идут как прикладные материалы и входят в стоимость пошива Изделия. Расходные материалы (фурнитура) не относящаяся к технологическим: (молнии, пуговицы, кнопки, люверсы, декоративные ленты, бахрома, аппликации, броши, стразы, бисер, декоративные клепки и т.д.), необходимые для декорирования заказа, оплачиваются Заказчиком отдельно. Количество, вид и стоимость фурнитуры согласовывается с заказчиком во время принятия заказа и вносится в бланк Заказа.`,
+  },
+  {
+    id: 2,
+    title: "доставка заказа по россии и снг",
+    content: `После согласования даты тестирования, Вам будут высланы реквизиты,
+            согласно которым Вы сможете произвести оплату.`,
+  },
+  {
+    id: 3,
+    title: "Оформление заказа",
+    content: `Если заказчик согласен со стоимостью работы по его заказу, то администратор приступает к процедуре оформления заказа, оформляет бланк. В бланке заказа администратор фиксирует номер и дату заказа, ФИО заказчика, данные для связи с ним, наименования работ и их стоимость, а так же выбранные заказчиком материалы и утвержденная необходимая фурнитура для выполнения заказа. Сроки пошива устанавливаются в индивидуальном порядке в соответствии со сложностью изделия и общей загруженностью Исполнителя на момент обращения Заказчика. Они так же вносятся в бланк заказа с указанием примерных дат примерки и даты сдачи изделия. схематично заносится модель изделия в Бланк заказа, которая не подлежит кардинальным изменениям с момента подписания бланка. В бланк заказа вносится информация о внесенной предоплате Заказчиком, а также ставится подпись Заказчика, которая свидетельствует утверждение заказа, его стоимость и выбранных им материалов, а также подтверждает согласие с правилами заказа в Ателье, с которыми ознакомился.`,
+  },
+  {
+    id: 4,
+    title: "Оплата заказа",
+    content: `Заказ поступает в производство только после внесения Заказчиком 100% предоплаты за выбранные и заказанные им материалы, а также в размере 30-50% от стоимости пошива изделия. Факт оплаты аванса фиксируется в бланке заказа, а клиенту выписывается квитанция (в случае наличной оплаты) и выдается чек (в случае безналичной оплаты). Остаточная стоимость заказа оплачивается в момент сдачи изделия после полной удовлетворенности клиента в качестве выполненных работ.`,
+  },
+  {
+    id: 5,
+    title: "Снятие мерок (в том числе и онлайн)",
+    content: `Индивидуальный план создается на основе результатов тестирования. В него
+            входит подробное описание материала, который будет использоваться в
+            процессе, а также оценка Вашего текущего уровня.`,
+  },
+  {
+    id: 6,
+    title: "Примерка",
+    content: `Исполнитель оставляет за собой право на различных этапах пошива проводить примерки, необходимые для посадки изделия. Для того, чтобы изделие, переданное, в пошив или на подгонку по фигуре сидело на теле идеально, мастерам необходимо на различных этапах кроя и шитья производить несколько примерок, в зависимости от категории сложности пошива Изделия. На первой примерке мастер с Заказчиком корректируют посадку и все детали будущего изделия, за исключением кардинального изменения модели в случае перекроя по желанию заказчика, дополнительные материалы оплачиваются им перед началом кроя. На второй примерке, корректируется длина и утверждается окончательный вид изделия. Возможно, в зависимости от сложности изделия, потребуется дополнительная примерка на усмотрение мастера, а также, по желанию заказчика, возможно, произвести дополнительные примерки, которые оплачиваются в размере 10% от стоимости пошива изделия. Если заказчик отказывается от одной или всех примерок, Исполнитель не несет ответственности за посадку изделия. Если заказчик по объективным причинам не может присутствовать на примерке в назначенный день/время, он обязан предварительно предупредить Исполнителя о своем отсутствии и перенести примерку на другой день/время. В таком случае, Заказчика ставят в известность, что сроки сдачи изделия увеличиваются.`,
+  },
+  {
+    id: 7,
+    title: "Выдача и доставка заказов",
+    content: `Выдача заказов осуществляется после финальной примерки и по факту полной выплаты остаточной стоимости заказа, после авансовой части стоимости работ. В случае внесений изменений и добавлений к заказу, изменения стоимости пошива, а также дополнительных материалов, то разница от стоимости так же оплачивается Заказчиком в полном объеме в день сдачи заказа. При невозможности внести финальную оплату, Заказчик соглашается, что изделие находится у Исполнителя до полного финального расчета по заказу. Так же возможно получения заказа после полной оплаты и без финальной примерки, в таком случае все претензии по посадке и пошиву не принимаются. Все корректировки и замечания по пошиву Изделия принимаются до сдачи готового изделия и полной оплаты.`,
+  },
+  {
+    id: 8,
+    title: "Права и обязанности заказчика",
+    content: `Все права заказчика регулируются законом о защите прав потребителя.
+Если Заказчиком обнаружено в момент получения заказа, что вещь плохо сшита, Заказчик вправе потребовать:
+<br/> - безвозмездного устранения недостатков оказанной услуги (выполненной работы) указав в письменном виде все замечания по пошиву и что именно Заказчик хотел бы изменить
+соответствующего уменьшения цены оказанной услуги (выполненной работы) до 50%.
+<br/> - в случае, если изделие не подлежит корректировке, Заказчик в праве потребовать бесплатного изготовления другой вещи из аналогичных по качеству и расцветке материалов или повторного выполнения работы. Некачественно сшитую вещь при этом, Заказчик обязан вернуть исполнителю.
+<br/> - возмещению понесенных Заказчиком расходов по устранению недостатков оказанной услуги (выполненной работы) своими силами или третьим лицом.
+<br/> - возмещение убытков осуществляется по предоставленным подтверждающимся документам (квитанциям, чекам) по оплате услуг по устранению недостатков.
+<br/> - При обнаружении дефектов изделия, которые не были выявлены на финальной примерке, Заказчик обязан в 10-ти дневной срок после сдачи предоставить изделие в ателье или уведомить об этом руководство ателье, путем обращения на официальную почту компании или отправкой заказного письма/телеграммы в адрес компании и на имя Генерального Директора. Все Претензии по качеству выполненных работ после забора изделия и полной оплаты принимаются в ПИСЬМЕННОМ виде, написанном заказчиком в двух экземплярах ( один экземпляр, заверенный печатью и подписью Генерального Директора, остается у Заказчика).
+<br/> - Претензии по качеству исполненных работ не принимаются, в случае, если Заказчик надевал платье, костюм и т.д. (исключая примерку дома) и провел в нем более часа (мероприятие, свадьба, корпоратив, фотосессия, прогулка, и другие выходы), об этом могут свидетельствовать следы носки изделия, запах, загрязнения, фото.
+<br/> - Заказчик вправе заказать курьерскую доставку. Оплату по услуге доставки Заказчик оплачивает в полном объеме курьеру или Исполнителю, на основании квитанции, уплаченной им за доставку изделия. За сохранность, сроки доставки и вид изделия Исполнитель ответственности не несет с момента передачи изделия курьеру.
+<br/> - Заказчик вправе проконсультироваться у Исполнителя по уходу за изделием или попросить осуществить доставку и забор изделия в Химчистку. Оплату Заказчик производит в соответствии с квитанцией из Химчистки и транспортных расходов. За работу химчистки, надлежащий вид изделия и сохранность изделия Исполнитель ответственности не несет с момента передачи изделия курьеру или сотруднику Химчистки.`,
+  },
+]
@@ -1 +1,2 @@
-NEXT_PUBLIC_CAPTCHA_KEY = 6LdbelMqAAAAABQIy1wn53ie7gOw_4bPfAnS0EwU
\ No newline at end of file
+NEXT_PUBLIC_CAPTCHA_KEY = 6LdbelMqAAAAABQIy1wn53ie7gOw_4bPfAnS0EwU
+NEXT_PUBLIC_API_URL = https://x-essense.ru
\ No newline at end of file