сделал reviews для пк

сделал free и text-form для пк
сделал projects и how, а также input для ПК
2024-12-18 22:38:55 +03:00 · 2024-12-18 19:49:11 +03:00 · 2024-12-18 16:44:16 +03:00 · 2024-12-17 20:45:58 +03:00 · 2024-12-17 18:54:39 +03:00 · 2024-12-17 15:35:14 +03:00
58 changed files with 2703 additions and 37 deletions
--- a/.htaccess
+++ b/.htaccess
@@ -0,0 +1,14 @@
+<IfModule mod_rewrite.c>
+    # Редирект: ...// -> .../
+    RewriteCond %{REQUEST_URI} (.*)\/\/$
+    RewriteRule ^(.*)$ https://%{HTTP_HOST}/%1/ [R=301,L]
+
+    # Редирект: с www -> без www
+    RewriteCond %{HTTP_HOST} ^www\.(.*)$
+    RewriteRule ^(.*)$ https://%{HTTP_HOST}/$1 [R=301,L]
+
+    # Редирект: HTTP -> HTTPS
+    RewriteCond %{HTTP:X-Forwarded-Proto} !https
+    RewriteCond %{HTTPS} off
+    RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
+</IfModule>
--- a/README.md
+++ b/README.md
@@ -1,6 +1,6 @@
-## Требования к верстке
+## **Требования к верстке**

-### С точки зрения веб-разработки:
+### **С точки зрения веб-разработки:**
 * верстаем на чистом HTML/CSS с использованием flex и grid (без подключение библиотек типа bootstrap и т.п.)
 * при именовании блоков используем методологию **БЭМ в стиле "Two Dashes"**:
    `block-name__elem-name--mod-name--mod-val`
@@ -11,10 +11,10 @@
    + значение модификатора отделяется от его имени двумя дефисами (--)
 * из конечного HTML-файла убрать все комментарии, если такие имеются 
 * все медиазапросы пишутся в отдельных файлах (которые мы подготовили) для того чтобы оптимизировать скорость загрузки; если используется препроцессор, то не нужно в классе каждого блока использовать импорты медиа запросов, а наоборот выносим  пример можно посмотреть на ["видео"](https://www.youtube.com/watch?v=9uaENbRyVT4)
-<!-- * для всех страниц прописывать уникальный класс в \<body\>, от которого строить CSS-правила  -->
+* **ВАЖНО:** если верстка делается для многостраничного сайта (особенно на CMS), то для всех страниц прописывать уникальный класс в \<body\>, от которого строить все CSS-правила на этой странице + для кажой станицы использовать свои отдельные CSS-файлы   


-### С точки зрения SEO:
+### **С точки зрения SEO:**
 * все теги использовать строго по назначению! Текстовые (strong, b, i, em, h1-h6… p) используем только в текстовых блоках и заголовках. Для дизайна используем div и span. Например не нужно втыкать в подвал, шапку или формы захвата h4 или закрывать просто крупный текст, который не является заголовком в h2.
 * на странице должен быть только один заголовок первого уровня (h1) 
 * должны присутствовать все основные теги и атрибуты — html, head, body, title, description, lang=ru, content=html, charset=utf8
@@ -22,9 +22,9 @@
 * для \<img\> самостоятельно проставляем атрибут alt="", со значением описывающим того что изображено на картинке


-## Порядок работы
+## **Порядок работы**

-### Подготовка окружения для локальной разработки
+### **Подготовка окружения для локальной разработки**
 1. Выкачивать локально на свой компьютер шаблон командой: `git clone https://git.good-production.xyz/Good-Production/template-for-verstka.git`
 2. Далее создать свою ветку командой: `git checkout -b ${project_name}--${name}`
 3. Приступить к локальной разработке в созданной ветке
@@ -37,7 +37,7 @@
 `${name}` -- имя/ник исполнителя


-## Оптимальный порядок непосредственно в процессе верстки
+## **Оптимальный порядок непосредственно в процессе верстки**
 1. Сначала определить CSS-переменные для основных цветов/градиентов, начертаний шрифтов (толщина, размер, модификация, межтрочный интервал) и занести в специально подгтовленный CSS-файл `style-core.css` 
 2. Все шрифты выкачать и сохранить локально в директорию `/assets/fonts/` и подключить их в файле `style-core.css`
 3. Далее начинать стоит с верстки UI kit (должен быть предоставлен в макете дизайнером), для того чтобы переиспользовать готовые элементы по ходу верстки макетов. Стили для UI kit писать так же в файл `style-core.css`. 
@@ -45,6 +45,6 @@
 3. Как UI kit будет готов, можно смело переходить к верстке основных листов макета "*.html" и просто использовать готовые классы из `style-core.css`


-### Примечания
+### **Примечания**

 Для работы с Figma рекомендуем использовать плагин ["Inspect Styles"](https://www.figma.com/community/plugin/1254262542670221199) для инспевтирования CSS-свойсв.
--- a/assets/css/gp-style-core.css
+++ b/assets/css/gp-style-core.css
@@ -1,16 +1,426 @@
 /* Переменные, шрифты, UI kit */

+@font-face {
+    font-family: "Proxima Nova";
+    src: local("Proxima Nova Bold"),
+      local("ProximaNova-Bold"),
+      url("/assets/fonts/ProximaNova-Bold.woff2") format("woff2"),
+      url("/assets/fonts/ProximaNova-Bold.woff") format("woff"),
+      url("/assets/fonts/ProximaNova-Bold.ttf") format("ttf");
+    font-weight: 700;
+}
+
+@font-face {
+    font-family: "Proxima Nova";
+    src: local("Proxima Nova Semibold"),
+      local("ProximaNova-Semibold"),
+      url("/assets/fonts/ProximaNova-Semibold.woff2") format("woff2"),
+      url("/assets/fonts/ProximaNova-Semibold.woff") format("woff"),
+      url("/assets/fonts/ProximaNova-Semibold.ttf") format("ttf");
+    font-weight: 600;
+}
+
+@font-face {
+    font-family: "Proxima Nova";
+    src: local("Proxima Nova Regular"),
+      local("ProximaNova-Regular"),
+      url("/assets/fonts/ProximaNova-Regular.woff2") format("woff2"),
+      url("/assets/fonts/ProximaNova-Regular.woff") format("woff"),
+      url("/assets/fonts/ProximaNova-Regular.ttf") format("ttf");
+    font-weight: 400;
+}
+
+@font-face {
+    font-family: "Proxima Nova";
+    src: local("Proxima Nova Light"),
+      local("ProximaNova-Light"),
+      url("/assets/fonts/ProximaNova-Light.woff2") format("woff2"),
+      url("/assets/fonts/ProximaNova-Light.woff") format("woff"),
+      url("/assets/fonts/ProximaNova-Light.ttf") format("ttf");
+    font-weight: 300;
+}


-
-/* 
-
-ШАБЛОН использования глобальных переменных:
+*{
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}

 :root {
-    --main-text: #e1667c;
-    --main-color: #8da6cb;
-    --font-family: "Craftwork Grotesk", sans-serif;
+  --font-family: "Proxima Nova", sans-serif;
+
+  --red: #d3241d;
+  --blood: #ae0b05;
+
+  --background-main: #111114;
+  --background-grey: #2a2a2d;
+  --background-grey-hover: #46464a;
+
+  --link: #86868b;
+
+  --text-white: #fff;
 } 

-*/
+body{
+    background-color: var(--background-main);
+
+    font-family: var(--font-family);
+}
+
+/* text */
+.title-1{
+    font-weight: 700;
+    text-transform: uppercase;
+    color: var(--text-white);
+}
+.title-2{
+    font-weight: 700;
+    color: var(--text-white);
+
+    text-decoration: none;
+}
+.title-3{
+    font-weight: 700;
+    color: var(--text-white);
+
+    text-decoration: none;
+}
+.title-4{
+    font-weight: 700;
+    color: var(--text-white);
+
+    text-decoration: none;
+}
+.title--center{
+    text-align: center;
+}
+.text-1{
+    font-weight: 400;
+    color: var(--text-white);
+}
+.text-2{
+    font-weight: 400;
+    color: var(--text-white);
+}
+.text-3{
+    font-weight: 400;
+    color: var(--text-white);
+    text-transform: uppercase;
+}
+.text--bo-line{
+    text-decoration: none;
+}
+/* text */
+
+/* components */
+.btn-social{
+    margin-left: 16px;
+
+    width: 40px;
+    aspect-ratio: 1;
+
+    padding: 8px;
+
+    display: flex;
+    align-items: center;
+
+    border-radius: 4px;
+
+    background-color: var(--background-grey);
+
+    transition: background-color .3s;
+
+    cursor: pointer;
+}
+.btn-social:first-child{
+    margin-left: 0;
+}
+.btn-social:hover{
+    background-color: var(--background-grey-hover);
+}
+.btn-social:active{
+    background-color: var(--background-grey-hover);
+}
+.btn-social> img{
+    width: 24px;
+    aspect-ratio: 1;
+}
+
+.btn-big{
+    display: block;
+
+    padding: 22.5px 32px;
+
+    font-weight: 400;
+    font-size: 16px;
+    text-transform: uppercase;
+    color: var(--text-white);
+    text-decoration: none;
+    text-align: center;
+
+    border-radius: 4px;
+
+    transition: background-color .3s;
+}
+.btn-big--border{
+    padding: 21px 32px;
+
+    border: 1px solid;
+}
+.btn-big--border--blood{
+    border-color: var(--blood);
+}
+.btn-big--border--white{
+    border-color: var(--text-white);
+}
+.btn-big--blood{
+    background-color: var(--blood);
+}
+
+.btn-big--social{
+    padding-right: 66px;
+
+    background-position: top 20px  right 34px;
+    background-size: 24px;
+    background-repeat: no-repeat;
+}
+.btn-big--tg{
+    background-image: url(/assets/img/social/telegram.svg);
+}
+.btn-big--ws{
+    background-image: url(/assets/img/social/whatsapp.svg);
+}
+
+.btn--100-per{
+    width: 100%;
+}
+
+.link{
+    font-weight: 400;
+    text-transform: uppercase;
+    text-decoration: underline;
+    text-decoration-skip-ink: none;
+    color: var(--link);
+}
+
+.input__block{
+    display: flex;
+    flex-direction: column;
+
+    border-radius: 4px;
+
+    position: relative;
+}
+.input__label{
+    position: absolute;
+    top: 14px;
+    left: 24px;
+
+
+    font-size: 12px;
+    color: var(--link);
+    text-transform: uppercase;
+
+    transition: all 0.3s;
+
+    pointer-events: none;
+}
+.input__field{
+    height: 64px;
+
+    padding: 31px 24px 14px 24px;
+
+    height: 64px;
+
+    background-color: var(--background-grey-hover);
+    border: none;
+    border-radius: 4px;
+
+    font-weight: 400;
+    font-size: 16px;
+    color: var(--text-white);
+
+    outline: none;
+    transition: all 0.3s;
+}
+.input__field:hover{
+    border: 1px solid var(--text-white);
+}
+.input__field:focus{
+    border: 1px solid var(--text-white);
+}
+.input__field:placeholder-shown + .input__label{
+    top: 22.5px;
+    left: 24px;
+
+    font-weight: 400;
+    font-size: 16px;
+    color: var(--text-white);
+}
+.input__field:focus + .input__label{
+    top: 14px;
+    left: 24px;
+
+
+    font-size: 12px;
+    color: var(--link);
+}
+.input__field:not(:placeholder-shown):invalid{
+    border: 1px solid #ef120a;
+}
+.input__error{
+    margin-top: 16px;
+
+    font-weight: 400;
+    font-size: 12px;
+    text-transform: uppercase;
+    color: var(--text-white);
+
+    display: none;
+}
+.form.checked .input__error{
+    display: block;
+}
+
+.form__item{
+    margin-top: 16px;
+}
+.form__item:first-child{
+    margin-top: 0;
+}
+.form__item--two{
+    display: flex;
+    justify-content: space-between;
+}
+.form__item--two .input__block{
+    width: calc(50% - 8px);
+}
+.form__additional{
+    margin-top: 32px;
+
+    display: flex;
+    align-items: center;
+}
+.form__additional input[type="file"]{
+    display: none;
+}
+.form-additional__text{
+    margin-left: 16px;
+}
+.form input[type=submit]{
+    margin-top: 32px;
+
+    width: 100%;
+
+    border: none;
+}
+.form__link{
+    margin-left: 6px;
+
+    font-size: 16px;
+    text-transform: uppercase;
+    text-decoration: underline;
+    text-decoration-skip-ink: none;
+    color: var(--link);
+}
+.form__file{
+    display: flex;
+    align-items: center;
+}
+.form__mini-btn{
+    background-color: var(--background-grey-hover);
+    border: none;
+
+    transition: all .3s;
+}
+.form__mini-btn:hover{
+    opacity: .8;
+}
+.form__checkbox{
+    display: none;
+}
+.form__checkbox:checked + .form-checkbox__square{
+    border-color: var(--blood);
+
+    background-image: url(/assets/img/icon/red-arrow.svg);
+    background-repeat: no-repeat;
+    background-position: center;
+}
+.form.checked .form__checkbox:invalid + .form-checkbox__square{
+    border-color: var(--blood);
+}
+.form__checkbox-block{
+    display: flex;
+    align-items: center;
+}
+.form-checkbox__square{
+    width: 18px;
+    aspect-ratio: 1;
+
+    border-radius: 4px;
+    border: 1.50px solid var(--text-white);
+
+    cursor: pointer;
+}
+/* components */
+
+/* header */
+.header__logo{
+    width: 74px;
+    height: 64px;
+    
+    background-image: url(/assets/img/main/logo.svg);
+    background-repeat: no-repeat;
+    background-size: contain;
+}
+/* header */
+
+/* footer */
+.footer__logo{
+    width: 74px;
+    height: 64px;
+}
+.footer__menu{
+    display: flex;
+}
+.footer-menu__list{
+    list-style-type: none;
+
+    font-weight: 400;
+    text-transform: uppercase;
+    color: var(--text-white);
+}
+.footer-menu__list a{
+    color: var(--text-white);
+    text-decoration: none;
+}
+.footer__text{
+    margin-top: 24px;
+
+    font-weight: 400;
+    color: var(--text-white);
+}
+.footer__text:first-child{
+    margin-top: 0;
+}
+.footer__text--no-line{
+    text-decoration: none;
+}
+.footer__media{
+    margin-top: 24px;
+
+    display: flex;
+    align-items: center;
+}
+.footer__review{
+    width: 309px;
+    height: 146px;
+}
+.footer__about{
+    font-weight: 400;
+    font-size: 16px;
+    text-transform: uppercase;
+    color: var(--link);
+}
+/* footer */
--- a/assets/css/gp-style-desktop.css
+++ b/assets/css/gp-style-desktop.css
@@ -1,18 +1,810 @@
-/* Основные стили для компьютера */
-
-
-
-/* писать сюда... */
-
-
+.wrapper{
+    margin: auto;
+
+    max-width: 1440px;
+}
+
+/* text */
+.title-1{
+    font-size: 88px;
+}
+.title-2{
+    font-size: 64px;
+}
+.title-3{
+    font-size: 40px;
+}
+.title-4{
+    font-size: 24px;
+}
+.text-1{
+    font-size: 24px;
+}
+.text-2{
+    font-size: 18px;
+}
+.text-3{
+    font-size: 16px;
+}
+/* text */
+
+/* header */
+.header__phone{
+    display: none;
+}
+.phone-menu{
+    display: none;
+}
+
+.header{
+}
+.header__wrapper{
+    padding: 24px 0;
+
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+.header__main{
+    display: flex;
+    align-items: center;
+}
+.header-main__item{
+    margin-left: 48px;
+
+    display: flex;
+    align-items: center;
+}
+.header-main__item:first-child{
+    margin-left: 0;
+}
+.header-main__btn{
+    margin-left: 16px;
+}
+.header-main__btn:first-child{
+    margin-left: 0;
+}
+.header__text{
+    font-weight: 400;
+    font-size: 18px;
+    color: var(--text-white);
+}
+.header__text a {
+    color: var(--text-white);
+}
+.header__text--bo-line{
+    text-decoration: none;
+}
+
+.header__menu{
+    padding: 16px 0;
+
+    background-color: var(--background-grey);
+}
+.header-menu__wrapper{
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+.header-menu__list{
+    display: flex;
+    align-items: center;
+
+    font-weight: 400;
+    font-size: 16px;
+    text-transform: uppercase;
+    color: var(--text-white);
+
+    list-style-type: none;
+}
+.header-menu__list li{
+    margin-left: 32px;
+}
+.header-menu__list li:first-child{
+    margin-left: 0;
+}
+.header-menu__list a{
+    color: var(--text-white);
+    text-decoration: none;
+}
+.header-menu-list__next{
+    padding-right: 24px;
+
+    background-image: url(/assets/img/icon/arrow-bottom.svg);
+    background-repeat: no-repeat;
+    background-position: center right;
+}
+.header-menu__search{
+    width: 32px;
+    aspect-ratio: 1;
+}
+/* header */


+/* footer */
+.footer{
+    margin-top: 200px;

+    padding: 56px 0;
+}
+.footer__wrapper{
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+}
+.footer__contact{
+    display: flex;
+}
+.footer__contact .footer__item{
+    margin-left: 58px;
+}
+.footer__contact .footer__item:first-child{
+    margin-left:  0px;
+}
+.footer-menu__item{
+    margin-left: 40px;
+}
+.footer-menu__item:first-child{
+    margin-left: 0;
+}
+.footer-menu__list{
+    font-size: 16px;
+}
+.footer-menu__list li{
+    margin-top: 16px;
+}
+.footer-menu__list li:first-child{
+    margin-top: 0px;
+}
+.footer__text{
+    display: block;

+    max-width: 297px;

+    font-size: 24px;
+}
+.footer__about{
+    margin-top: 33px;

+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+/* footer */

 /* Стили для лептопов  */
-/* @media only screen and (min-width: 992px) and (max-width: 1400px) {
+@media only screen and (min-width: 992px) and (max-width: 1400px) {
+.wrapper{
+    width: 100%;

-} */
+    padding: 20px;
+}
+
+/* header */
+.header__wrapper{
+    flex-wrap: wrap;
+    
+}
+.header__main{
+    margin-top: 10px;
+
+    width: 100%;
+
+    justify-content: center;
+}
+/* header */
+
+/* footer */
+.footer__wrapper{
+    justify-content: start;
+}
+.footer__item{
+    margin-left: 58px;
+}
+.footer__contact{
+    margin-top: 30px;
+
+    width: 100%;
+    justify-content: space-between;
+}
+.footer__about{
+    margin-left: 0;
+}
+/* footer */
+}
+
+
+@media only screen and (min-width: 992px) and (max-width: 1032px) {
+/* header */
+.header__main{
+    width: 100%;
+
+    justify-content: space-between;
+}
+.header-main__item{
+    margin-left: 0;
+
+    justify-content: space-between;
+}
+/* header */
+}
+
+
+/* space */
+.space{
+    margin-top: 56px;
+}
+.space__content{
+    margin-top: 56px;
+
+    display: flex;
+    align-items: end;
+}
+.space__statistics{
+    width: 947px;
+    height: 480px;
+
+    padding: 24px;
+
+    display: flex;
+    align-items: end;
+
+    position: relative;
+}
+.space-statistics__img{
+    position: absolute;
+    top: 0;
+    left: 0;
+
+    width: 100%;
+    height: 100%;
+
+    object-fit: cover;
+}
+.space-statistics__item{
+    margin-left: 24px;
+
+    width: 216px;
+    height: 173px; 
+
+    padding: 16px; 
+
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+
+    backdrop-filter: blur(10px);
+    background: rgba(42, 42, 45, 0.7);
+    border-radius: 4px;
+}
+.space-statistics__item:nth-child(2){
+    margin-left: 0;
+}
+.space__consultation{
+    margin-left: 40px;
+
+    max-width: 453px;
+}
+.space__consultation .btn-big{
+    margin-top: 64px;
+}
+/* space */
+
+.main__item{
+    margin-top: 200px;
+}
+
+/* gym */
+.gym{
+    margin: 34px -20px -20px -20px;
+}
+.gym .swiper-wrapper{
+    display: flex;
+    flex-wrap: wrap;
+}
+.gym .swiper-slide{
+    display: flex;
+}
+.gym__item{
+    margin: 20px;
+
+    height: 320px;
+
+    display: flex;
+    justify-content: space-between;
+}
+.gym-item__img{
+    min-width: calc(50% - 20px);
+    width: 100%;
+    height: 100%;
+
+    object-fit: cover;
+
+    border-radius: 4px;
+}
+.gym-item__text{
+    min-width: calc(50% - 20px);
+    width: 100%;
+
+    padding: 16px;
+
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+
+    background-color: var(--background-grey);
+    border-radius: 4px;
+}
+.gym-item-img--padding,
+.gym-item-text--padding{
+    max-width: calc(50% - 20px);
+}
+
+.gym-item-text__header{
+    display: flex;
+    align-items: end;
+}
+.gym-item-text__header .text-1{
+    margin-bottom: 11.5px;
+}
+.gym-item-text__header .title-2{
+    margin-left: 16px;
+}
+/* gym */
+
+@media only screen and (min-width: 992px) {
+.gym__item{
+    width: calc(50% - 40px) !important;
+}
+.gym .swiper-slide:nth-child(3){
+    width: 100% !important;
+}
+}
+
+/* projects */
+.projects{
+    margin: 37px -20px -20px -20px;
+
+    display: flex;
+    flex-wrap: wrap;
+}
+.projects__item{
+    margin: 20px;
+
+    width: calc(50% - 40px);
+
+    display: flex;
+    flex-direction: column;
+
+    border-radius: 4px;
+    overflow: hidden;
+}
+.projects-item__img{
+    width: 100%;
+    height: 304px;
+
+    object-fit: cover;
+}
+.projects-item__content{
+    min-height: 275px;
+
+    padding: 32px;
+
+    background-color: var(--background-grey);
+}
+.projects-item__tags{
+    display: flex;
+    align-items: center;
+}
+.projects-item__tag{
+    margin-left: 40px;
+
+    display: flex;
+    align-items: center;
+}
+.projects-item__tag:first-child{
+    margin-left: 0;
+}
+.projects-item-tag__icon{
+    width: 24px;
+    aspect-ratio: 1;
+}
+.projects-item-tag__name{
+    margin-left: 16px;
+}
+.projects-item__text{
+    margin-top: 32px;
+}
+.projects-item__text .text-2{
+    margin-top: 16px;
+}
+.projects__next{
+    margin-top: 56px;
+
+    display: flex;
+    justify-content: center;
+}
+/* projects */
+
+/* how */
+.how{
+    margin-top: 56px;
+
+    display: flex;
+}
+.how__control{
+    width: 577px;
+
+    flex-shrink: 0;
+}
+.how-control__item{
+    margin-top: 24px;
+
+    padding: 16px;
+
+    display: flex;
+    align-items: center;
+
+    background-color: var(--background-grey);
+    border-radius: 4px;
+
+    transition: background-color .3s;
+}
+.how-control__item:first-child{
+    margin-top: 0;
+}
+.how-control-item__number{
+    width: 64px;
+    aspect-ratio: 1;
+
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
+    border-radius: 4px;
+    background-color: var(--background-grey-hover);
+
+    transition: background-color .3s;
+}
+.how-control__item__name{
+    margin-left: 24px;
+
+    max-width: 440px;
+}
+.how-control__item:hover{
+    background-color: var(--background-grey-hover);
+}
+.how-control__item:hover .how-control-item__number{
+    background-color: var(--background-grey);
+}
+.how-control__item.active{
+    background-color: var(--background-grey-hover);
+}
+.how-control__item.active .how-control-item__number{
+    background-color: var(--background-grey);
+}
+
+.how__content{
+    margin-left: 40px;
+
+    width: 100%;
+}
+.how-content__item{
+    width: 100%;
+
+    padding: 32px;
+
+    background-color: var(--background-grey);
+
+    overflow: hidden;
+
+    display: none;
+}
+.how-content__item.active{
+    display: block;
+}
+.how-content__item .text-2{
+    margin-top: 16px;
+}
+.how-content-item__content{
+    margin-top: 24px;
+
+    display: flex;
+
+    position: relative;
+}
+.how-content-item__content .text-2{
+    margin-top: 16px;
+}
+.how-content-item__content .text-2:first-child{
+    margin-top: 0;
+}
+.how-content-item__text{
+    width: 480px;
+}
+.how-content-item__img--1{
+    position: absolute;
+    right: -36px;
+    bottom: -39px;
+
+    width: 303px;
+    height: 303px;
+}
+.how-content-item__img--2{
+    position: absolute;
+    right: -34px;
+    bottom: -41px;
+}
+.how-content-item__img--3{
+    position: absolute;
+    right: -31.98px;
+    bottom: -30.98px;
+
+    width: 336px;
+    height: 336px;
+}
+/* how */
+
+/* free */
+.free{
+    padding: 88px 64px;
+
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+
+    background-color: var(--background-grey);
+}
+/* .free > .title-1{
+    text-align: center;
+} */
+.free__content{
+    margin-top: 56px;
+
+    width: 800px;
+}
+/* free */
+
+/* reviews */
+.reviews{
+    margin-top: 56px;
+    
+    position: relative;
+
+    overflow: hidden;
+}
+.reviews__item{
+    display: flex;
+
+    padding-bottom: 88px;
+}
+.reviews-item__content{
+    width: 100%;
+}
+.reviews-item-content__header{
+    display: flex;
+    align-items: center;
+}
+.reviews-item-content-header__img{
+    width: 112px;
+    height: 112px;
+
+    border-radius: 4px;
+}
+.reviews-item-content-header__block{
+    margin-left: 40px;
+
+    width: 100%;
+}
+.reviews-item-content-header__item{
+    margin-top: 16px;
+
+    width: 100%;
+
+    display: flex;
+    justify-content: space-between;
+}
+.reviews-item-content-header__item:first-child{
+    margin-top: 0;
+}
+.reviews-item-content-header__pin{
+    padding-left: 40px;
+
+    display: flex;
+    align-items: center;
+
+    background-image: url(/assets/img/icon/pin.svg);
+    background-repeat: no-repeat;
+    background-position: left;
+}
+.reviews-item-content__text{
+    margin-top: 40px;
+}
+.reviews-item__img{
+    margin-left: 164px;
+
+    width: 577px;
+    height: 600px;
+    border-radius: 4px;
+
+    object-fit: cover;
+
+    flex-shrink: 0;
+}
+.reviews .swiper-pagination{
+    position: absolute;
+    right: 32px;
+    bottom: 104px;
+
+    padding-right: 32px;
+
+    text-align: end;
+}
+.reviews .swiper-pagination-bullet{
+    width: 97px;
+    height: 4px;
+
+    background-color: #111114;
+    opacity: 1 !important;
+
+    border-radius: 0;
+}
+.reviews .swiper-pagination-bullet-active{
+    background-color: var(--text-white);
+}
+.reviews__counter{
+    position: absolute;
+    bottom: 0px;
+
+    width: 100%;
+
+    display: flex;
+    justify-content: center;
+
+    font-weight: 400;
+    font-size: 24px;
+    color: var(--text-white);
+}
+.reviews__counter--grey{
+    color: var(--link);
+}
+
+.reviews .swiper-button-next::after, .reviews .swiper-button-prev::after{
+    position: static;
+
+    font-size: 0;
+}
+.reviews .swiper-button-next, .reviews .swiper-button-prev{
+    position: static;
+
+    margin-top: 0;
+
+    width: 32px;
+    height: 32px;
+}
+.reviews .swiper-button-next{
+    margin-left: 40px;
+
+    background-image: url(/assets/img/icon/slider-righ.svg);
+    background-repeat: no-repeat;
+}
+.reviews .swiper-button-prev{
+    margin-right: 40px;
+
+    background-image: url(/assets/img/icon/slider-left.svg);
+    background-repeat: no-repeat;
+}
+/* reviews */
+
+/* text and form */
+.text-form{
+    margin-top: 88px;
+
+    display: flex;
+}
+.text-form__content{
+    width: 100%;
+}
+.text-form__form{
+    margin-left: 40px;
+
+    width: 453px;
+
+    padding: 32px;
+
+    background-color: var(--background-grey);
+
+    flex-shrink: 0;
+}
+.text-form__form .title-3{
+    margin-bottom: 32px;
+
+    text-align: center;
+}
+.text-form__form .form__additional,
+.text-form__form input[type=submit]{
+    margin-top: 24px;
+}
+.text-form__form .form-additional__text a{
+    margin-left: 0;
+}
+.text-form__agreement--text-form{
+    height: 44px;
+
+    align-items: start;
+}
+/* text and form */
+
+/* services */
+.services{
+    margin: 34px -20px -20px -20px;
+
+    display: flex;
+    flex-wrap: wrap;
+}
+.services__item{
+    margin: 20px;
+
+    height: 257px;
+
+    padding: 24px;
+
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+
+    background-color: var(--background-grey);
+    border-radius: 4px;
+}
+.services__item:nth-child(1),
+.services__item:nth-child(2),
+.services__item:nth-child(3){
+    width: calc(33.3% - 40px);
+}
+.services__item:nth-child(n+4){
+    width: calc(50% - 40px);
+}
+.services__img{
+    width: 88px;
+    aspect-ratio: 1;
+}
+.services__content{
+    height: 89px;
+
+    /* display: flex; */
+}
+.services__content .title-4{
+    margin-bottom: 16px;
+}
+/* services */
+
+
+/* call */
+.call{
+    padding: 88px 64px;
+
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+
+    background-color: var(--background-grey);
+}
+.call__content{
+    margin-top: 56px;
+
+    width: 910px;
+    height: 152px;
+
+    display: flex;
+    justify-content: space-between;
+}
+.call__item{
+    height: 100%;
+
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+}
+/* call */
+@media only screen and (min-width: 992px) and (max-width: 1032px) {}
--- a/assets/css/gp-style-mobile.css
+++ b/assets/css/gp-style-mobile.css
@@ -1,5 +1,64 @@
 /* Стили для мобильных устройств  */
@media only screen and (max-width: 576px) {

+/* component */
+.link{
+    font-size: 14px;
+}

+
+/* footer */
+.footer{
+    padding: 40px 16px;
+}
+.footer__wrapper{
+    padding: 0;
+
+    display: block;
+}
+.footer__item{
+    margin-top: 40px;
+}
+.footer__item:nth-child(2){
+    margin-left: 0;
+}
+.footer__contact .footer__item:nth-child(2),
+.footer__contact .footer__item:nth-child(3){
+    margin-top: 40px;
+}
+.footer__contact{
+    display: block;
+}
+.footer__contact .footer__item{
+    margin-left: 0;
+}
+.footer-menu__item{
+    margin-left: 53px;
+}
+.footer-menu__item:first-child{
+    margin-left: 0;
+}
+.footer-menu__list{
+    font-size: 14px;
+}
+.footer-menu__list li{
+    margin-top: 16px;
+}
+.footer-menu__list li:first-child{
+    margin-top: 0;
+}
+.footer__text{
+    display: block;
+
+    font-size: 18px;
+}
+.footer__about{
+    display: flex;
+    flex-direction: column;
+    align-items: start;
+}
+.footer-about__link{
+    margin-top: 24px;
+}
+/* footer */
 }
--- a/assets/css/gp-style-tablet.css
+++ b/assets/css/gp-style-tablet.css
@@ -1,5 +1,332 @@
 /* Стили для планшетов  */
@media only screen and (max-width: 992px) {
+.wrapper{
+    width: 100%;
+}
+.phone--hone{
+    display: none;
+}

+/* text */
+.title-1{
+    font-size: 32px;
+}
+.title-2{
+    font-size: 32px;
+}
+.title-3{
+    font-size: 32px;
+}
+.text-1{
+    font-size: 18px;
+}
+.text-2{
+    font-size: 16px;
+}
+/* text */
+
+/* component */
+.btn-big{
+    padding: 23.5px 19.5px;
+
+    font-size: 14px;
+}
+/* component */
+
+/* header */
+.header{
+    padding: 24px 16px;
+
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+
+    position: relative;
+}
+.header__wrapper{
+    padding: 0;
+}
+.header__phone{
+    display: flex;
+    align-items: center;
+}
+.header-phone__item{
+    margin-left: 24px;
+
+    width: 32px;
+    height: 32px;
+
+    transition: opacity .3s;
+}
+.header-phone__item > img{
+    width: 100%;
+    height: 100%;
+}
+.header-phone__item:first-child{
+    margin-left: 0;
+}
+.header-phone__item:active{
+    opacity: .8;
+}
+
+.button-menu{
+    width: 100%;
+    height: 100%;
+
+    position: relative;
+
+    overflow: hidden;
+}
+.button-menu__open{
+    position: absolute;
+    top: 0;
+    left: 0;
+
+    width: 100%;
+    height: 100%;
+
+    transition: opacity .3s;
+}
+.button-menu__close{
+    position: absolute;
+    top: 0;
+    left: 0;
+
+    width: 100%;
+    height: 100%;
+
+    transition: opacity .3s;
+    opacity: 0;
+}
+.button-menu.open .button-menu__open{
+    opacity: 0;
+}
+.button-menu.open .button-menu__close{
+    opacity: 1;
+}
+
+.phone-menu{
+    position: absolute;
+    top: 112px;
+    right: 0;
+    left: 0;
    
-}
+    width: 100%;
+}
+.phone-menu__block-content{
+    /* height: 0; */
+    /* overflow: hidden; */
+}
+.phone-menu__content{
+    padding: 0 16px 40px 16px;
+
+}
+.phone-menu__block{
+    margin-top: 32px;
+}
+.phone-menu__title{
+    font-weight: 700;
+    font-size: 32px;
+    color: var(--text-white);
+}
+.phone-menu__list{
+    list-style-type: none;
+
+    font-weight: 400;
+    font-size: 14px;
+    text-transform: uppercase;
+    color: var(--text-white);
+}
+.phone-menu__list a{
+    font-weight: 400;
+    font-size: 14px;
+    text-transform: uppercase;
+    color: var(--text-white);
+
+    text-decoration: none;
+}
+.phone-menu__list li{
+    margin-top: 24px;
+}
+.phone-menu__list li:first-child{
+    margin-top: 0;
+}
+.phone-menu--next{
+    display: block;
+
+    background-image: url(/assets/img/icon/arrow-right.svg);
+    background-repeat: no-repeat;
+    background-position: center right;
+}
+
+.phone-menu__text{
+    margin-top: 24px;
+
+    display: block;
+
+    font-weight: 400;
+    font-size: 16px;
+    color: var(--text-white);
+}
+.phone-menu__text:first-child{
+    margin-top: 0;
+}
+.phone-menu__text > a {
+    color: var(--text-white);
+}
+.phone-menu__text--no-line{
+    text-decoration: none;
+}
+
+.phone-social{
+    margin-top: 24px;
+
+    display: flex;
+    align-items: center;
+}
+/* header */
+
+/* footer */
+.footer__wrapper{
+    padding: 0 16px;
+
+    justify-content: start;
+}
+.footer__item:nth-child(2){
+    margin-left: 38px;
+}
+.footer__contact{
+    margin-top: 20px;
+
+    flex-wrap: wrap;
+}
+.footer__contact .footer__item:nth-child(3){
+    margin-top: 20px;
+    margin-left: 0;
+
+    width: 100%;
+}
+/* footer */
+}
+/* footer */
+@media only screen and (max-width: 829px) {
+.footer__about{
+    flex-direction: column;
+}
+}
+
+@media only screen and (max-width: 630px) {
+.footer__wrapper{
+    justify-content: center;
+}
+.footer__contact{
+    flex-direction: column;
+    justify-content: center;
+}
+.footer__contact .footer__item:nth-child(2){
+    margin-top: 20px;
+    margin-left: 0;
+}
+}
+/* footer */
+
+main{
+    padding: 0 16px;
+}
+
+/* space */
+@media only screen and (max-width: 992px) {
+.space{
+    margin-top: 32px;
+}
+.space__content{
+    margin-top: 24px;
+
+    flex-direction: column;
+    align-items: center;
+}
+.space__consultation{
+    order: 1;
+
+    margin-left: 0;
+
+    max-width: 100%;
+    width: 100%;
+}
+.space__consultation .btn-big{
+    margin-top: 40px;
+}
+.space__statistics{
+    order: 2;
+
+    margin-top: 40px;
+
+    width: auto;
+    height: auto;
+
+    padding: 0;
+
+    flex-wrap: wrap;
+    justify-content: space-between;
+}
+.space-statistics__img{
+    position: static;
+
+    width: 100%;
+    min-height: 300px;
+}
+.space-statistics__item{
+    margin-top: 16px;
+    margin-left: 0;
+
+    width: calc(50% - 8px);
+    height: 160px;
+
+    background: #2a2a2d;
+}
+}
+/* space */
+
+@media only screen and (max-width: 992px) {
+.main__item{
+    margin-top: 96px;
+}
+}
+
+/* gym */
+@media only screen and (max-width: 992px) {
+.gym{
+    margin: 40px -16px 0 0;
+
+    overflow: hidden;
+}
+.gym .swiper-wrapper{
+    flex-wrap: nowrap;
+}
+.gym .swiper-slide:nth-child(3){
+    display: flex;
+    flex-direction: column-reverse;
+}
+.gym__item{
+    margin: 0;
+
+    flex-direction: column-reverse;
+    height: auto;
+}
+.gym-item__img, .gym-item__text{
+    max-width: 100%;
+    width: 100%;
+
+    height: 179px;
+}
+.gym-item__img{
+    margin-top: 24px;
+}
+.gym-item-text__header .text-1{
+    margin-bottom: 5px;
+}
+.gym-item-text__header .title-2{
+    margin-left: 8px;
+}
+}
+/* gym */
--- a/assets/fonts/ProximaNova-Bold.ttf
+++ b/assets/fonts/ProximaNova-Bold.ttf
--- a/assets/fonts/ProximaNova-Bold.woff
+++ b/assets/fonts/ProximaNova-Bold.woff
--- a/assets/fonts/ProximaNova-Bold.woff2
+++ b/assets/fonts/ProximaNova-Bold.woff2
--- a/assets/fonts/ProximaNova-Light.ttf
+++ b/assets/fonts/ProximaNova-Light.ttf
--- a/assets/fonts/ProximaNova-Light.woff
+++ b/assets/fonts/ProximaNova-Light.woff
--- a/assets/fonts/ProximaNova-Light.woff2
+++ b/assets/fonts/ProximaNova-Light.woff2
--- a/assets/fonts/ProximaNova-Regular.ttf
+++ b/assets/fonts/ProximaNova-Regular.ttf
--- a/assets/fonts/ProximaNova-Regular.woff
+++ b/assets/fonts/ProximaNova-Regular.woff
--- a/assets/fonts/ProximaNova-Regular.woff2
+++ b/assets/fonts/ProximaNova-Regular.woff2
--- a/assets/fonts/ProximaNova-Semibold.ttf
+++ b/assets/fonts/ProximaNova-Semibold.ttf
--- a/assets/fonts/ProximaNova-Semibold.woff
+++ b/assets/fonts/ProximaNova-Semibold.woff
--- a/assets/fonts/ProximaNova-Semibold.woff2
+++ b/assets/fonts/ProximaNova-Semibold.woff2
--- a/assets/img/icon/arrow-bottom.svg
+++ b/assets/img/icon/arrow-bottom.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 6L8 10L4 6" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+</svg>
--- a/assets/img/icon/arrow-right.svg
+++ b/assets/img/icon/arrow-right.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 4.5L10 8.5L6 12.5" stroke="white" stroke-width="1.55" stroke-linecap="round"/>
+</svg>
--- a/assets/img/icon/close.svg
+++ b/assets/img/icon/close.svg
@@ -0,0 +1,3 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7 25L16 16M16 16L25 7M16 16L25 25M16 16L7 7" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+</svg>
--- a/assets/img/icon/device-phone.svg
+++ b/assets/img/icon/device-phone.svg
@@ -0,0 +1,3 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11.7303 20.2701C20.574 29.1138 23.1655 26.9975 24.3228 26.1706C24.51 26.0644 28.7936 23.3042 26.1295 20.6407C19.9506 14.4612 21.2043 22.4932 15.3545 16.6446C9.50604 10.7947 17.5388 12.0494 11.3598 5.87056C8.69544 3.20623 5.9349 7.49023 5.8299 7.67609C5.00198 8.83351 2.88653 11.4265 11.7303 20.2701Z" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+</svg>
--- a/assets/img/icon/menu-hamburger.svg
+++ b/assets/img/icon/menu-hamburger.svg
@@ -0,0 +1,3 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M25.3334 9.3335L6.66675 9.33352M25.3334 16.0002H6.66675M25.3334 22.6668H6.66675" stroke="white" stroke-width="1.55" stroke-linecap="round"/>
+</svg>
--- a/assets/img/icon/paper-clip.svg
+++ b/assets/img/icon/paper-clip.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M13.9998 8.11765L8.05874 14.0587C7.26274 14.8547 7.26274 16.1453 8.05874 16.9413C8.85476 17.7373 10.1454 17.7373 10.9414 16.9413L18.3078 9.57484C19.7947 8.08801 19.7945 5.67732 18.3073 4.19077C16.8206 2.70461 14.4107 2.70483 12.9242 4.19127L5.55775 11.5577C3.38049 13.735 3.38049 17.265 5.55775 19.4423C7.73502 21.6196 11.2651 21.6196 13.4424 19.4423L18.8846 14" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+</svg>
--- a/assets/img/icon/pin.svg
+++ b/assets/img/icon/pin.svg
@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M19 10.2647C19 13.1109 15.4774 17.8245 13.43 20.3238C12.6809 21.2382 11.3191 21.2382 10.57 20.3238C8.52261 17.8245 5 13.1109 5 10.2647C5 6.25252 8.13401 3 12 3C15.866 3 19 6.25252 19 10.2647Z" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+<path d="M14.6004 10.0001C14.6004 11.436 13.4363 12.6001 12.0004 12.6001C10.5645 12.6001 9.40039 11.436 9.40039 10.0001C9.40039 8.56408 10.5645 7.40002 12.0004 7.40002C13.4363 7.40002 14.6004 8.56408 14.6004 10.0001Z" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+</svg>
--- a/assets/img/icon/red-arrow.svg
+++ b/assets/img/icon/red-arrow.svg
@@ -0,0 +1,3 @@
+<svg width="10" height="7" viewBox="0 0 10 7" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M1 3.5L3.75 6.25L9.25 0.749999" stroke="#AE0B05" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
--- a/assets/img/icon/search.svg
+++ b/assets/img/icon/search.svg
@@ -0,0 +1,3 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M21.2551 20.6112L26.6671 25.9998M23.9999 13.9998C23.9999 8.84518 19.8213 4.6665 14.6666 4.6665C9.51193 4.6665 5.33325 8.84518 5.33325 13.9998C5.33325 19.1545 9.51193 23.3332 14.6666 23.3332C19.8213 23.3332 23.9999 19.1545 23.9999 13.9998Z" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+</svg>
--- a/assets/img/icon/services-1.svg
+++ b/assets/img/icon/services-1.svg
@@ -0,0 +1,7 @@
+<svg width="88" height="88" viewBox="0 0 88 88" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M55 7.33325V43.9999C55 48.0333 51.7 51.3333 47.6667 51.3333H7.33337V21.9999C7.33337 13.8966 13.8967 7.33325 22 7.33325H55Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M80.6667 51.3333V62.3333C80.6667 68.4199 75.7534 73.3333 69.6667 73.3333H66C66 69.2999 62.7 65.9999 58.6667 65.9999C54.6334 65.9999 51.3334 69.2999 51.3334 73.3333H36.6667C36.6667 69.2999 33.3667 65.9999 29.3334 65.9999C25.3 65.9999 22 69.2999 22 73.3333H18.3334C12.2467 73.3333 7.33337 68.4199 7.33337 62.3333V51.3333H47.6667C51.7 51.3333 55 48.0333 55 43.9999V18.3333H61.7467C64.3867 18.3333 66.8067 19.7633 68.1267 22.0366L74.3967 32.9999H69.6667C67.65 32.9999 66 34.6499 66 36.6666V47.6666C66 49.6833 67.65 51.3333 69.6667 51.3333H80.6667Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M29.3333 80.6667C33.3834 80.6667 36.6667 77.3834 36.6667 73.3333C36.6667 69.2832 33.3834 66 29.3333 66C25.2832 66 22 69.2832 22 73.3333C22 77.3834 25.2832 80.6667 29.3333 80.6667Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M58.6667 80.6667C62.7168 80.6667 66 77.3834 66 73.3333C66 69.2832 62.7168 66 58.6667 66C54.6166 66 51.3334 69.2832 51.3334 73.3333C51.3334 77.3834 54.6166 80.6667 58.6667 80.6667Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M80.6667 44V51.3333H69.6667C67.65 51.3333 66 49.6833 66 47.6667V36.6667C66 34.65 67.65 33 69.6667 33H74.3967L80.6667 44Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
--- a/assets/img/icon/services-2.svg
+++ b/assets/img/icon/services-2.svg
@@ -0,0 +1,4 @@
+<svg width="88" height="88" viewBox="0 0 88 88" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M44 55C50.0751 55 55 50.0751 55 44C55 37.9249 50.0751 33 44 33C37.9249 33 33 37.9249 33 44C33 50.0751 37.9249 55 44 55Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M7.33337 47.2266V40.7733C7.33337 36.9599 10.45 33.8066 14.3 33.8066C20.9367 33.8066 23.65 29.1133 20.3134 23.3566C18.4067 20.0566 19.5434 15.7666 22.88 13.8599L29.2234 10.2299C32.12 8.5066 35.86 9.53326 37.5834 12.4299L37.9867 13.1266C41.2867 18.8833 46.7134 18.8833 50.05 13.1266L50.4534 12.4299C52.1767 9.53326 55.9167 8.5066 58.8134 10.2299L65.1567 13.8599C68.4934 15.7666 69.63 20.0566 67.7234 23.3566C64.3867 29.1133 67.1 33.8066 73.7367 33.8066C77.55 33.8066 80.7034 36.9233 80.7034 40.7733V47.2266C80.7034 51.0399 77.5867 54.1933 73.7367 54.1933C67.1 54.1933 64.3867 58.8866 67.7234 64.6433C69.63 67.9799 68.4934 72.2333 65.1567 74.1399L58.8134 77.7699C55.9167 79.4933 52.1767 78.4666 50.4534 75.5699L50.05 74.8733C46.75 69.1166 41.3234 69.1166 37.9867 74.8733L37.5834 75.5699C35.86 78.4666 32.12 79.4933 29.2234 77.7699L22.88 74.1399C19.5434 72.2333 18.4067 67.9433 20.3134 64.6433C23.65 58.8866 20.9367 54.1933 14.3 54.1933C10.45 54.1933 7.33337 51.0399 7.33337 47.2266Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
--- a/assets/img/icon/services-3.svg
+++ b/assets/img/icon/services-3.svg
@@ -0,0 +1,5 @@
+<svg width="88" height="88" viewBox="0 0 88 88" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M39.4146 60.6667H35.2439L31.0732 57.1944M21.3415 30.1111H27.5746C28.5726 30.1111 29.2456 31.1306 28.8524 32.0471L25.5122 39.8333M58.878 27.3333L50.5366 49.5556M70 19L63.4656 26.8336C63.2015 27.1502 62.8102 27.3333 62.3976 27.3333H50.5366M27.6542 69H58.8942C62.7243 69 65.8293 65.8981 65.8293 62.0717C65.8293 59.4994 64.4027 57.1388 62.1242 55.9407L34.4793 41.405C24.7209 36.274 13 43.3434 13 54.3601C13 62.4455 19.5609 69 27.6542 69ZM31.0732 53.7222C31.0732 56.0234 29.2059 57.8889 26.9024 57.8889C24.599 57.8889 22.7317 56.0234 22.7317 53.7222C22.7317 51.421 24.599 49.5556 26.9024 49.5556C29.2059 49.5556 31.0732 51.421 31.0732 53.7222Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M84.3332 58.5566C84.3332 72.7466 72.8565 84.2233 58.6665 84.2233L62.5165 77.8066" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M3.66663 29.2233C3.66663 15.0333 15.1433 3.55664 29.3333 3.55664L25.4833 9.97331" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
--- a/assets/img/icon/services-4.svg
+++ b/assets/img/icon/services-4.svg
@@ -0,0 +1,8 @@
+<svg width="88" height="88" viewBox="0 0 88 88" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M66 26.2533C65.78 26.2166 65.5233 26.2166 65.3033 26.2533C60.2433 26.0699 56.21 21.9266 56.21 16.7933C56.21 11.5499 60.4266 7.33325 65.67 7.33325C70.9133 7.33325 75.1299 11.5866 75.1299 16.7933C75.0933 21.9266 71.06 26.0699 66 26.2533Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M62.2233 52.9467C67.2466 53.79 72.7833 52.91 76.67 50.3067C81.84 46.86 81.84 41.2134 76.67 37.7667C72.7466 35.1634 67.1366 34.2833 62.1133 35.1633" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M21.89 26.2533C22.11 26.2166 22.3667 26.2166 22.5867 26.2533C27.6467 26.0699 31.68 21.9266 31.68 16.7933C31.68 11.5499 27.4633 7.33325 22.22 7.33325C16.9767 7.33325 12.76 11.5866 12.76 16.7933C12.7967 21.9266 16.83 26.0699 21.89 26.2533Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M25.6667 52.9467C20.6434 53.79 15.1067 52.91 11.22 50.3067C6.05003 46.86 6.05003 41.2134 11.22 37.7667C15.1434 35.1634 20.7534 34.2833 25.7767 35.1633" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M44 53.6434C43.78 53.6067 43.5233 53.6067 43.3033 53.6434C38.2433 53.4601 34.21 49.3167 34.21 44.1834C34.21 38.9401 38.4266 34.7234 43.67 34.7234C48.9133 34.7234 53.13 38.9767 53.13 44.1834C53.0933 49.3167 49.06 53.4967 44 53.6434Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M33.33 65.1933C28.16 68.64 28.16 74.2866 33.33 77.7333C39.1967 81.6566 48.8033 81.6566 54.67 77.7333C59.84 74.2866 59.84 68.64 54.67 65.1933C48.84 61.3067 39.1967 61.3067 33.33 65.1933Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
--- a/assets/img/icon/services-5.svg
+++ b/assets/img/icon/services-5.svg
@@ -0,0 +1,3 @@
+<svg width="88" height="88" viewBox="0 0 88 88" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M69.3333 77C75.4085 77 80.3333 72.0751 80.3333 66C80.3333 59.9249 75.4085 55 69.3333 55M69.3333 77C63.2582 77 58.3333 72.0751 58.3333 66C58.3333 59.9249 63.2582 55 69.3333 55M69.3333 77H14.7632C10.4757 77 7 73.5243 7 69.2368C7 65.3002 9.9465 61.9867 13.8562 61.5267L69.3333 55M69.3333 55L58.3333 22M69.3333 11L49.6911 28.8566C49.3537 29.1633 48.914 29.3333 48.4579 29.3333H34.5M71.1667 66C71.1667 64.9875 70.3459 64.1667 69.3333 64.1667C68.3208 64.1667 67.5 64.9875 67.5 66M71.1667 66C71.1667 67.0125 70.3459 67.8333 69.3333 67.8333C68.3208 67.8333 67.5 67.0125 67.5 66M71.1667 66H67.5" stroke="#F2F2F2" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
--- a/assets/img/icon/slider-left.svg
+++ b/assets/img/icon/slider-left.svg
@@ -0,0 +1,3 @@
+<svg width="33" height="32" viewBox="0 0 33 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M22.5 4L10.5 16L22.5 28" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+</svg>
--- a/assets/img/icon/slider-righ.svg
+++ b/assets/img/icon/slider-righ.svg
@@ -0,0 +1,3 @@
+<svg width="33" height="32" viewBox="0 0 33 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10.5 4L22.5 16L10.5 28" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+</svg>
--- a/assets/img/icon/square.svg
+++ b/assets/img/icon/square.svg
@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10.3273 10.3274L7.00001 7M7.00001 7H9.21823M7.00001 7L7 9.21825M13.6726 13.6726L17 17M17 17H14.7817M17 17V14.7818M10.3273 13.6726L7.00001 17M7.00001 17H9.21823M7.00001 17L7 14.7818M13.6726 10.3274L17 7M17 7H14.7817M17 7V9.21825" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+<path d="M15.1 2.5H8.9C6.65979 2.5 5.53969 2.5 4.68404 2.93597C3.93139 3.31947 3.31947 3.93139 2.93597 4.68404C2.5 5.53969 2.5 6.65979 2.5 8.9V15.1C2.5 17.3402 2.5 18.4603 2.93597 19.316C3.31947 20.0686 3.93139 20.6805 4.68404 21.064C5.53969 21.5 6.65979 21.5 8.9 21.5H15.1C17.3402 21.5 18.4603 21.5 19.316 21.064C20.0686 20.6805 20.6805 20.0686 21.064 19.316C21.5 18.4603 21.5 17.3402 21.5 15.1V8.9C21.5 6.65979 21.5 5.53969 21.064 4.68404C20.6805 3.93139 20.0686 3.31947 19.316 2.93597C18.4603 2.5 17.3402 2.5 15.1 2.5Z" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+</svg>
--- a/assets/img/main/logo.svg
+++ b/assets/img/main/logo.svg
@@ -0,0 +1,23 @@
+<svg width="222" height="192" viewBox="0 0 222 192" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2_549)">
+<mask id="mask0_2_549" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="222" height="192">
+<path d="M222 0H0V192H222V0Z" fill="white"/>
+</mask>
+<g mask="url(#mask0_2_549)">
+<path d="M11.4147 156.631V164.699H26.4437V176.018H11.4147V191.049H0V145.312H11.4147H26.7449V156.631H11.4147Z" fill="white"/>
+<path d="M43.2515 145.312H31.8369V191.019H43.2515V145.312Z" fill="white"/>
+<path d="M78.0935 156.631H68.3352V191.049H57.0108V156.631H47.2525V145.312H68.3352H78.0935V156.631Z" fill="white"/>
+<path d="M116.742 145.312V191.049H107.977L93.5208 167.398V191.049H82.106V145.312H90.9607L105.417 168.963V145.312H116.742Z" fill="white"/>
+<path d="M151.221 180.067V191.049H127.308H123.814V145.312H135.229H150.89V156.293H135.229V162.766H149.294V173.134H135.229V180.067H151.221Z" fill="white"/>
+<path d="M153.87 176.417H165.285C165.285 179.607 167.122 180.926 170.887 180.926C174.26 180.926 175.585 179.546 175.585 177.797C175.585 175.497 172.393 174.454 168.568 173.227C162.334 171.202 154.443 168.012 154.443 158.41C154.443 149.085 161.581 144.361 169.863 144.361C178.266 144.361 185.735 148.931 185.735 159.637H174.381C174.381 157.03 172.965 155.465 169.863 155.465C167.122 155.465 165.857 156.784 165.857 158.41C165.857 160.956 168.929 161.999 172.875 163.38C179.049 165.405 186.94 168.533 186.94 178.012C186.94 187.338 179.802 192.062 170.827 192.062C161.52 192 153.87 187.43 153.87 176.417Z" fill="white"/>
+<path d="M188.899 176.417H200.314C200.314 179.607 202.151 180.926 205.916 180.926C209.289 180.926 210.615 179.546 210.615 177.797C210.615 175.497 207.422 174.454 203.597 173.227C197.363 171.202 189.472 168.012 189.472 158.41C189.472 149.085 196.61 144.361 204.892 144.361C213.295 144.361 220.764 148.931 220.764 159.637H209.44C209.44 157.03 208.024 155.465 204.922 155.465C202.181 155.465 200.916 156.784 200.916 158.41C200.916 160.956 203.989 161.999 207.934 163.38C214.108 165.405 221.999 168.533 221.999 178.012C221.999 187.338 214.861 192.062 205.886 192.062C196.549 192 188.899 187.43 188.899 176.417Z" fill="white"/>
+<path d="M222 94.1133H151.674H79.2405H68.5184H60.2362H54.3328H44.5445H43.4603H36.6536H34.696V110.525L23.9739 94.1133H15.6915V128.624H25.4799V111.752L36.6838 128.624H43.4905H151.674H222V94.1133ZM0 94.1133H9.78836V128.624H0V94.1133Z" fill="#AE0B05"/>
+<path d="M221.97 1.19636H200.646H173.57V6.62597H194.894V77.2111H200.646V6.62597H221.97V1.19636ZM145.109 78.3768C157.788 78.3768 168.661 70.6771 168.661 58.4069C168.661 44.6333 156.403 40.6147 145.199 36.1668C135.591 32.4857 126.978 29.2034 126.978 19.3258C126.978 11.1967 133.815 5.55233 143.603 5.55233C153.512 5.55233 160.77 11.5341 160.77 20.7369H166.432C166.432 7.82234 155.891 0 143.633 0C131.586 0 121.346 7.4849 121.346 19.3258C121.346 33.774 133.604 37.4551 144.808 41.8111C154.295 45.4003 162.939 48.8666 162.939 58.4069C162.939 66.996 155.469 72.8551 145.139 72.8551C133.001 72.8551 124.99 66.6586 124.99 56.1367H119.237C119.207 70.3397 130.622 78.3768 145.109 78.3768ZM74.1204 71.7506V41.5658H106.859V36.1361H74.1204V6.62597H109.509V1.19636H74.1204H68.4582V77.1804H70.8978H110.021V71.7506H74.1204ZM29.3049 71.7506H5.66218V41.5351H32.8888C43.9723 41.5351 48.7309 49.02 48.7309 56.6275C48.7309 67.3949 40.3582 71.7506 29.3049 71.7506ZM29.8772 6.62597C43.6409 6.62597 46.3517 15.798 46.2613 20.7675C46.1108 28.866 38.7619 36.1054 33.1599 36.1054H5.66218V6.62597H29.8772ZM42.0447 37.7314C44.0325 35.7679 51.7128 32.363 51.8934 20.7675C51.9837 14.0802 48.1586 1.19636 29.8772 1.19636H5.66218H0V77.1804H1.05413H30.0276C43.5507 77.1804 54.4533 70.7998 54.4533 56.6275C54.4835 47.4247 51.1103 41.2284 42.0447 37.7314Z" fill="white"/>
+</g>
+</g>
+<defs>
+<clipPath id="clip0_2_549">
+<rect width="222" height="192" fill="white"/>
+</clipPath>
+</defs>
+</svg>
--- a/assets/img/photo/gym-1.png
+++ b/assets/img/photo/gym-1.png
--- a/assets/img/photo/gym-2.png
+++ b/assets/img/photo/gym-2.png
--- a/assets/img/photo/gym-3.png
+++ b/assets/img/photo/gym-3.png
--- a/assets/img/photo/how-1.png
+++ b/assets/img/photo/how-1.png
--- a/assets/img/photo/how-2.png
+++ b/assets/img/photo/how-2.png
--- a/assets/img/photo/how-3.png
+++ b/assets/img/photo/how-3.png
--- a/assets/img/photo/projects-1.png
+++ b/assets/img/photo/projects-1.png
--- a/assets/img/photo/projects-2.png
+++ b/assets/img/photo/projects-2.png
--- a/assets/img/photo/projects-3.png
+++ b/assets/img/photo/projects-3.png
--- a/assets/img/photo/projects-4.png
+++ b/assets/img/photo/projects-4.png
--- a/assets/img/photo/review.png
+++ b/assets/img/photo/review.png
--- a/assets/img/photo/reviews-person.png
+++ b/assets/img/photo/reviews-person.png
--- a/assets/img/photo/reviews.png
+++ b/assets/img/photo/reviews.png
--- a/assets/img/photo/space.png
+++ b/assets/img/photo/space.png
--- a/assets/img/social/YouTube.svg
+++ b/assets/img/social/YouTube.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.58364 19.1684H19.4163C21.401 19.1684 23.008 17.4219 23 15.2543V8.25102C23 6.09212 21.401 4.33691 19.4163 4.33691H4.58364C2.60702 4.33691 1 6.08334 1 8.25102V15.2543C1 17.4132 2.59898 19.1684 4.58364 19.1684ZM9.65166 8.04453L15.8914 11.6427L9.65166 15.2409V8.04453Z" fill="white"/>
+</svg>
--- a/assets/img/social/telegram.svg
+++ b/assets/img/social/telegram.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M22.009 3C22.687 3 23.1984 3.61218 22.9248 4.75084L19.6065 20.8512C19.3745 21.996 18.7025 22.2715 17.7748 21.7389L9.85949 15.7211C9.82879 15.6985 9.80379 15.6686 9.78654 15.634C9.76928 15.5994 9.76029 15.5611 9.76029 15.5222C9.76029 15.4833 9.76928 15.445 9.78654 15.4104C9.80379 15.3758 9.82879 15.3459 9.85949 15.3232L18.9999 6.82613C19.4162 6.44658 18.9107 6.26293 18.3636 6.60575L6.89198 14.056C6.85719 14.0794 6.81769 14.0943 6.77648 14.0996C6.73526 14.1049 6.69341 14.1004 6.65411 14.0866L1.78359 12.5011C0.701256 12.1766 0.701256 11.4114 2.02742 10.8665L21.5154 3.12856C21.67 3.05223 21.8378 3.00852 22.009 3Z" fill="white"/>
+</svg>
--- a/assets/img/social/whatsapp.svg
+++ b/assets/img/social/whatsapp.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M19.7163 3.71939C20.7469 4.6862 21.5587 5.80806 22.1242 7.05762C22.7079 8.3619 23.0089 9.73915 22.9998 11.1711C22.9998 12.594 22.6988 13.9803 22.1151 15.2755C21.5496 16.5251 20.7378 17.6469 19.7072 18.6137C18.6765 19.5805 17.4817 20.3285 16.15 20.8575C14.7728 21.4047 13.3134 21.6783 11.8085 21.6783C10.1941 21.6783 8.65269 21.3682 7.20247 20.748L2.35017 22.9097L3.26225 17.9388C1.55665 16.0417 0.626335 13.652 0.626335 11.162C0.626335 9.73915 0.927341 8.35278 1.51108 7.05762C2.07657 5.80806 2.88831 4.6862 3.91897 3.71939C4.94963 2.75258 6.14446 2.00467 7.4761 1.47566C8.85335 0.928411 10.3127 0.654785 11.8176 0.654785C13.3226 0.654785 14.7819 0.928411 16.1592 1.47566C17.4908 2.00467 18.6856 2.7617 19.7163 3.71939ZM15.2927 12.7855C15.539 12.8767 15.8856 13.0226 16.3598 13.2598C16.4878 13.3255 16.6223 13.3807 16.7579 13.4363C16.9799 13.5275 17.2049 13.6198 17.4087 13.7614C17.5729 13.9803 17.6185 14.1627 17.5091 14.6461C15.3566 20.2098 4.77639 12.1379 6.53672 7.8967C6.82858 7.23087 7.53997 5.95395 8.78041 6.59241C8.97433 6.68938 9.05553 6.89505 9.13634 7.09976C9.17716 7.20315 9.21788 7.30629 9.27297 7.39505C9.39301 7.64655 9.52378 7.93387 9.63612 8.18069C9.70304 8.32772 9.76342 8.46037 9.81109 8.56252C9.82607 8.61683 9.85605 8.6769 9.88934 8.74361C10.0182 9.00181 10.1966 9.35943 9.74723 9.8668C9.7084 9.94122 9.62135 10.0352 9.52641 10.1376C9.35375 10.324 9.15498 10.5385 9.17263 10.715C9.31857 10.9795 9.99351 11.9646 10.3583 12.3112C11.1792 13.1047 12.2281 13.88 13.3591 14.0989C13.626 13.9974 13.8835 13.6367 14.1317 13.2891C14.3075 13.0428 14.4787 12.8031 14.6451 12.6669C14.7543 12.5811 15.0367 12.6886 15.2133 12.7559C15.2433 12.7673 15.2702 12.7775 15.2927 12.7855Z" fill="white"/>
+</svg>
--- a/assets/img/social/yandex-zen.svg
+++ b/assets/img/social/yandex-zen.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.7357 13.7357C12.3214 15.195 12.225 17.0143 12.0964 21C15.8121 21 18.3771 20.9871 19.7014 19.7014C20.9871 18.3771 21 15.69 21 12.0964C17.0143 12.225 15.195 12.3214 13.7357 13.7357ZM11.9036 21C8.18786 21 5.62286 20.9871 4.29857 19.7014C3.01286 18.3771 3 15.69 3 12.0964C6.98571 12.225 8.805 12.3214 10.2643 13.7357C11.6786 15.195 11.775 17.0143 11.9036 21ZM10.2643 10.2643C8.805 11.6786 6.98571 11.775 3 11.9036C3 8.31 3.01286 5.62286 4.29857 4.29857C5.62286 3.01286 8.19429 3 11.9036 3C11.775 6.98571 11.6786 8.805 10.2643 10.2643ZM12.0964 3C12.2186 6.98571 12.3214 8.805 13.7357 10.2643C15.195 11.6786 17.0143 11.775 21 11.9036C21 8.31 20.9871 5.62286 19.7014 4.29857C18.3771 3.01286 15.8121 3 12.0964 3Z" fill="white"/>
+</svg>
--- a/assets/img/social/Вконтакте.svg
+++ b/assets/img/social/Вконтакте.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M13.0789 17.9498C13.0789 17.9498 13.476 17.9077 13.6793 17.6988C13.8655 17.5075 13.859 17.1464 13.859 17.1464C13.859 17.1464 13.8343 15.4602 14.6531 15.2112C15.4601 14.9664 16.4964 16.8418 17.596 17.563C18.4267 18.1083 19.0573 17.9889 19.0573 17.9889L21.9959 17.9498C21.9959 17.9498 23.5325 17.8593 22.804 16.704C22.7437 16.6093 22.379 15.8491 20.6197 14.2874C18.7764 12.6526 19.0239 12.917 21.2427 10.0889C22.5942 8.36672 23.1343 7.3153 22.9654 6.86572C22.8051 6.43569 21.8108 6.54989 21.8108 6.54989L18.5031 6.56943C18.5031 6.56943 18.2578 6.53754 18.076 6.64145C17.8984 6.7433 17.7833 6.98095 17.7833 6.98095C17.7833 6.98095 17.2603 8.31322 16.562 9.44694C15.0889 11.8378 14.5003 11.9644 14.2593 11.8162C13.6987 11.4695 13.8386 10.4253 13.8386 9.68356C13.8386 7.36571 14.2066 6.39968 13.123 6.14969C12.7636 6.06636 12.4989 6.01183 11.5789 6.00257C10.3985 5.99126 9.4 6.00669 8.83401 6.27109C8.4574 6.44701 8.16688 6.84 8.34442 6.86264C8.56285 6.89041 9.05782 6.99021 9.32037 7.33176C9.65932 7.77311 9.64748 8.7628 9.64748 8.7628C9.64748 8.7628 9.84224 11.4911 9.19233 11.8296C8.74685 12.0621 8.13567 11.5878 6.82185 9.41814C6.14934 8.30705 5.64146 7.07868 5.64146 7.07868C5.64146 7.07868 5.54354 6.84926 5.36815 6.72581C5.15617 6.57664 4.86027 6.53034 4.86027 6.53034L1.71721 6.54989C1.71721 6.54989 1.24484 6.56223 1.0716 6.75873C0.917726 6.93259 1.05976 7.2937 1.05976 7.2937C1.05976 7.2937 3.52062 12.7987 6.30751 15.5734C8.86306 18.1165 11.764 17.9498 11.764 17.9498H13.0789Z" fill="white"/>
+</svg>
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -0,0 +1,45 @@
+'use strict';
+
+const gymSwiper = new Swiper('.gym-swiper', {
+    direction: 'horizontal',
+    breakpoints: {
+        320:{
+            slidesPerView: 1.20,
+            spaceBetween: 24,
+        },
+        996: {
+            slidesPerView: 3
+        },
+    }
+});
+
+
+
+const reviewsSwiper = new Swiper('.reviews-swiper', {
+    spaceBetween: 24,
+    // If we need pagination
+    pagination: {
+        el: '.swiper-pagination',
+    },
+
+    // Navigation arrows
+    navigation: {
+        nextEl: '.swiper-button-next',
+        prevEl: '.swiper-button-prev',
+    },
+
+    // And if we need scrollbar
+    scrollbar: {
+        el: '.swiper-scrollbar',
+    },
+    runCallbacksOnInit: true,
+    // === new change
+    on: {
+        slideChange: function(){
+            let offer = document.querySelector('#numberReviews');
+            offer.innerHTML = (this.activeIndex +  1);
+        }
+    }
+})
+
+// gymSwiper.destroy();
--- a/index.html
+++ b/index.html
@@ -8,6 +8,8 @@
        <meta name="description" content="SEO Description">
        <link rel="shortcut icon" href="/assets/img/favicon.ico?v=1.0">

+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css"/>
+
        <!-- Базовые стили -->
        <link rel="stylesheet" href="/assets/css/gp-style-core.css?v=1.0">
        <link rel="stylesheet" href="/assets/css/gp-style-desktop.css?v=1.0">
@@ -48,22 +50,923 @@
    
    </head>
    <body>
+        <header class="header">
+            <div class="wrapper header__wrapper">
+                <div class="header__logo"></div>

+                <div class="header__text phone--hone">
+                    Работаем с гос.заказчиками <br>
+                    по <a href="#">44-ФЗ/223-ФЗ</a>
+                </div>
+
+                <div class="header__main phone--hone">
+                    <div class="header-main__item">
+                        <a href="tel:+74957988081" class="header__text header__text--bo-line">+7 (495) 798-80-81</a>
+                    </div>
+                    <div class="header-main__item">
+                        <a href="mailto:sales@bestinfitness.ru" class="header__text header__text--bo-line">sales@bestinfitness.ru</a>
+                    </div>
+                    <div class="header-main__item">
+                        <a href="#" class="btn-social">
+                            <img src="/assets/img/social/telegram.svg" alt="">
+                        </a>
+
+                        <a href="#" class="btn-social">
+                            <img src="/assets/img/social/whatsapp.svg" alt="">
+                        </a>
+                    </div>
+                    <div class="header-main__item">
+                        <a href="" class="btn-big btn-big--border btn-big--border--blood header-main__btn">
+                            Заказать звонок
+                        </a>
+                        <a href="" class="btn-big btn-big--blood header-main__btn">
+                            спецификация
+                        </a>
+                    </div>
+                </div>
+
+                <div class="header__phone">
+                    <div class="header-phone__item">
+                        <img src="/assets/img/icon/device-phone.svg" alt="phone">
+                    </div>
+    
+                    <div class="header-phone__item">
+                        <img src="/assets/img/icon/search.svg" alt="search">
+                    </div>
+    
+                    <div class="header-phone__item">
+                        <div class="button-menu">
+                            <img src="/assets/img/icon/menu-hamburger.svg" class="button-menu__open" alt="open"> 
+                            <img src="/assets/img/icon/close.svg" class="button-menu__close" alt="close"> 
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="header__menu phone--hone">
+                <div class="wrapper header-menu__wrapper">
+                    <ul class="header-menu__list">
+                        <li>
+                            <a href="#">О компании</a>
+                        </li>
+                        <li >
+                            <a href="#" class="header-menu-list__next">каталог</a>
+                        </li>
+                        <li>
+                            <a href="#" class="header-menu-list__next">бренды</a>
+                        </li>
+                        <li>
+                            <a href="#">зонирование</a>
+                        </li>
+                        <li>
+                            <a href="#">проекты</a>
+                        </li>
+                        <li>
+                            <a href="#">интересное</a>
+                        </li>
+                        <li>
+                            <a href="#">контакты</a>
+                        </li>
+                    </ul>
+
+                    <img src="/assets/img/icon/search.svg" alt="" class="header-menu__search">
+                </div>
+            </div>
+
+
+
+            <div class="phone-menu">
+                <div class="phone-menu__block-content">
+                    <div class="phone-menu__content">
+                        <ul class="phone-menu__list">
+                            <li>
+                                <a href="#">спецификация</a>
+                            </li>
+                            <li>О компании</li>
+                            <li>
+                                <a href="#" class="phone-menu--next">каталог</a>
+                            </li>
+                            <li>
+                                <a href="#" class="phone-menu--next">бренды</a>
+                            </li>
+                            <li>зонирование</li>
+                            <li>проекты</li>
+                            <li>интересное</li>
+                            <li>контакты</li>
+                        </ul>
+
+                        <div class="phone-menu__block">
+                            <p class="phone-menu__text">
+                                Работаем с гос.заказчиками по<br>
+                                <a href="">44-ФЗ/223-ФЗ</a>
+                            </p>
+
+                            <a class="phone-menu__text phone-menu__text--no-line" href="tel:+74957988081">+7 (495) 798-80-81</a>
+
+                            <a class="phone-menu__text phone-menu__text--no-line" href="mailto:sales@bestinfitness.ru">sales@bestinfitness.ru</a>
+
+                            <div class="phone-social">
+                                <a href="#" class="btn-social">
+                                    <img src="/assets/img/social/telegram.svg" alt="">
+                                </a>
+    
+                                <a href="#" class="btn-social">
+                                    <img src="/assets/img/social/whatsapp.svg" alt="">
+                                </a>
+                            </div>
+                        </div>
+
+                        <div class="phone-menu__block">
+                            <a href="#" class="btn-big btn-big--border btn-big--border--blood">
+                                Заказать звонок
+                            </a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </header>
+
+        <main class="wrapper">
+            <article class="space">
+                <p class="title-1">
+                    Создаем пространства, которые работают
+                </p>
+
+                <div class="space__content">
+                    <div class="space__statistics">
+                        <img src="/assets/img/photo/space.png" alt="" class="space-statistics__img">
+
+                        <div class="space-statistics__item">
+                            <p class="title-3">
+                                >20 лет
+                            </p>
+                            <p class="text-2">
+                                опыт работы
+                            </p>
+                        </div>
+                        <div class="space-statistics__item">
+                            <p class="title-3">
+                                140
+                            </p>
+                            <p class="text-2">
+                                успешно запущенных проектов
+                            </p>
+                        </div>
+                    </div>
+
+                    <div class="space__consultation">
+                        <p class="text-1">
+                            Увеличиваем посещаемость клубов на 18% за счет оптимального зонирования и подбора оборудования
+                        </p>
+
+                        <a href="" class="btn-big btn-big--blood">
+                            Получить бесплатную консультацию
+                        </a>
+                    </div>
+                </div>
+            </article>
+
+            <div class="main__item">
+                <p class="title-1">
+                    GYM EVOLUTION: Технология проектирования, которая увеличивает посещаемость
+                </p>
+
+                <article class="gym gym-swiper">
+                    <div class="swiper-wrapper">
+                        <div class="gym__item swiper-slide">
+                            <img src="/assets/img/photo/gym-1.png" alt="" class="gym-item__img gym-item-img--padding">
+    
+                            <div class="gym-item__text gym-item-text--padding">
+                                <div class="gym-item-text__header">
+                                    <p class="text-1">
+                                        На
+                                    </p>
+    
+                                    <p class="title-2">
+                                        20%
+                                    </p>
+                                </div>
+    
+                                <p class="text-1">
+                                    увеличение эффективности использования площади 
+                                </p>
+                            </div>
+                        </div>
+                        <div class="gym__item swiper-slide">
+                            <img src="/assets/img/photo/gym-2.png" alt="" class="gym-item__img gym-item-img--padding">
+    
+                            <div class="gym-item__text gym-item-text--padding">
+                                <div class="gym-item-text__header">
+                                    <p class="text-1">
+                                        На
+                                    </p>
+    
+                                    <p class="title-2">
+                                        15%
+                                    </p>
+                                </div>
+    
+                                <p class="text-1">
+                                    сокращение времени запуска клуба
+                                </p>
+                            </div>
+                        </div>
+                        
+                        <div class="swiper-slide">
+                            <div class="gym__item">
+                                <img src="/assets/img/photo/gym-3.png" alt="" class="gym-item__img">
+                            </div>
+
+                            <div class="gym__item">
+                                <div class="gym-item__text">
+                                    <div class="gym-item-text__header">
+                                        <p class="text-1">
+                                            На
+                                        </p>
        
-        <!-- Пример формы для отправки в Телеграмм (обработчик send-telegram.php) -->
-        <form class="form" method="post" action="/send-telegram.php">
-            <div class="form__item">
-                <input class="form__input" type="text" name="name" required>
-                <label class="form__label">Ваше имя</label>
+                                        <p class="title-2">
+                                            18%
+                                        </p>
+                                    </div>
+        
+                                    <p class="text-1">
+                                        повышение посещаемости (на основе кейсов)
+                                    </p>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </article>
            </div>
-            <div class="form__item">
-                <input class="form__input" type="text" name="phone" required>
-                <label class="form__label">Номер телефона</label>
+
+            <div class="main__item">
+                <p class="title-1">
+                    Разработанные проекты
+                </p>
+
+                <article class="projects">
+                    <div class="projects__item">
+                        <img src="/assets/img/photo/projects-1.png" alt="" class="projects-item__img">
+
+                        <div class="projects-item__content">
+                            <div class="projects-item__tags">
+                                <div class="projects-item__tag">
+                                    <img src="/assets/img/icon/pin.svg" alt="" class="projects-item-tag__icon">
+    
+                                    <p class="projects-item-tag__name text-2">Локация</p>
+                                </div>
+
+                                <div class="projects-item__tag">
+                                    <img src="/assets/img/icon/square.svg" alt="" class="projects-item-tag__icon">
+    
+                                    <p class="projects-item-tag__name text-2">Площадь</p>
+                                </div>
+                            </div>
+
+                            <div class="projects-item__text">
+                                <p class="text-1">Название проекта</p>
+                                <p class="text-2">
+                                    Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="projects__item">
+                        <img src="/assets/img/photo/projects-2.png" alt="" class="projects-item__img">
+
+                        <div class="projects-item__content">
+                            <div class="projects-item__tags">
+                                <div class="projects-item__tag">
+                                    <img src="/assets/img/icon/pin.svg" alt="" class="projects-item-tag__icon">
+    
+                                    <p class="projects-item-tag__name text-2">Локация</p>
+                                </div>
+
+                                <div class="projects-item__tag">
+                                    <img src="/assets/img/icon/square.svg" alt="" class="projects-item-tag__icon">
+    
+                                    <p class="projects-item-tag__name text-2">Площадь</p>
+                                </div>
+                            </div>
+
+                            <div class="projects-item__text">
+                                <p class="text-1">Название проекта</p>
+                                <p class="text-2">
+                                    Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="projects__item">
+                        <img src="/assets/img/photo/projects-3.png" alt="" class="projects-item__img">
+
+                        <div class="projects-item__content">
+                            <div class="projects-item__tags">
+                                <div class="projects-item__tag">
+                                    <img src="/assets/img/icon/pin.svg" alt="" class="projects-item-tag__icon">
+    
+                                    <p class="projects-item-tag__name text-2">Локация</p>
+                                </div>
+
+                                <div class="projects-item__tag">
+                                    <img src="/assets/img/icon/square.svg" alt="" class="projects-item-tag__icon">
+    
+                                    <p class="projects-item-tag__name text-2">Площадь</p>
+                                </div>
+                            </div>
+
+                            <div class="projects-item__text">
+                                <p class="text-1">Название проекта</p>
+                                <p class="text-2">
+                                    Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="projects__item">
+                        <img src="/assets/img/photo/projects-4.png" alt="" class="projects-item__img">
+
+                        <div class="projects-item__content">
+                            <div class="projects-item__tags">
+                                <div class="projects-item__tag">
+                                    <img src="/assets/img/icon/pin.svg" alt="" class="projects-item-tag__icon">
+    
+                                    <p class="projects-item-tag__name text-2">Локация</p>
+                                </div>
+
+                                <div class="projects-item__tag">
+                                    <img src="/assets/img/icon/square.svg" alt="" class="projects-item-tag__icon">
+    
+                                    <p class="projects-item-tag__name text-2">Площадь</p>
+                                </div>
+                            </div>
+
+                            <div class="projects-item__text">
+                                <p class="text-1">Название проекта</p>
+                                <p class="text-2">
+                                    Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект Описание про проект
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+                </article>
+
+                <div class="projects__next">
+                    <a href="" class="btn-big btn-big--border btn-big--border--blood header-main__btn">
+                        все проекты
+                    </a>
+                </div>
            </div>
-            <input class="form__input btn" type="submit" value="Отправить">
-        </form>
+
+            <div class="main__item">
+                <p class="title-1">
+                    Как мы это делаем? Не так просто, как кажется!
+                </p>
+
+                <article class="how">
+                    <div class="how__control">
+                        <div class="how-control__item">
+                            <div class="how-control-item__number title-3">
+                                1
+                            </div>
+
+                            <p class="how-control__item__name text-1">
+                                Проводим экспертизу помещения и определяем рыночный сегмент проекта
+                            </p>
+                        </div>
+
+                        <div class="how-control__item">
+                            <div class="how-control-item__number title-3">
+                                2
+                            </div>
+
+                            <p class="how-control__item__name text-1">
+                                Разрабатываем Эскизный проект фитнес клуба (Проект клуба на этапе голых стен)
+                            </p>
+                        </div>
+
+                        <div class="how-control__item">
+                            <div class="how-control-item__number title-3">
+                                3
+                            </div>
+
+                            <p class="how-control__item__name text-1">
+                                Осуществляем детализацию концепции и функциональное наполнение клуба
+                            </p>
+                        </div>
+                    </div>
+
+                    <div class="how__content">
+                        <div class="how-content__item active">
+                            <p class="text-1">
+                                Проводим экспертизу помещения и определяем рыночный сегмент проекта
+                            </p>
+
+                            <div class="how-content-item__content">
+                                <div class="how-content-item__text">
+                                    <p class="text-2">
+                                        1. Оцениваем локацию и коммерческую эффективность рассматриваемых площадей, выявляем их избыток или дефицит
+                                    </p>
+                                    <p class="text-2">
+                                        2. Определяем для фитнес-клуба какого формата выделенные площади технически подойдут лучше всего
+                                    </p>
+                                    <p class="text-2">
+                                        3. Выявляем соотношения полезной и вспомогательной площадей будущего клуба и рассчитываем его пропускную способность
+                                    </p>
+                                </div>
+
+                                <img src="/assets/img/photo/how-1.png" alt="" class="how-content-item__img how-content-item__img--1">
+                            </div>
+                        </div>
+
+                        <div class="how-content__item">
+                            <p class="text-1">
+                                Разрабатываем Эскизный проект фитнес клуба (Проект клуба на этапе голых стен)
+                            </p>
+                            <p class="text-2">
+                                Мы понимаем важность грамотного проекта фитнес клуба, поэтому делаем проектирование не только тренажерного зала, но и ВСЕХ зон, которые будут находится внутри
+                            </p>
+
+                            <div class="how-content-item__content">
+                                <div class="how-content-item__text">
+                                    <p class="text-2">
+                                        1. Определяем расположение и площади тренажерного зала и залов групповых программ
+                                    </p>
+                                    <p class="text-2">
+                                        2. Определяем размер раздевалок, количество шкафчиков и душевых. Расставляем в раздевалках мебель и сантехнику
+                                    </p>
+                                    <p class="text-2">
+                                        3. Прорисовываем входную группу, холлы, коридоры, служебные помещения
+                                    </p>
+                                    <p class="text-2">
+                                        4. Продумываем пути перемещения действующих и первичных клиентов, разделяем «грязные» и «чистые» потоки
+                                    </p>
+                                </div>
+
+                                <img src="/assets/img/photo/how-2.png" alt="" class="how-content-item__img how-content-item__img--2">
+                            </div>
+                        </div>
+
+                        <div class="how-content__item">
+                            <p class="text-1">
+                                Осуществляем детализацию концепции и функциональное наполнение клуба
+                            </p>
+
+                            <div class="how-content-item__content">
+                                <div class="how-content-item__text">
+                                    <p class="text-2">
+                                        1. Определяем набор основных фитнес-направлений и дополнительных услуг, наиболее соответствующих выбранной концепции и формату клуба
+                                    </p>
+                                    <p class="text-2">
+                                        2. Разрабатываем зонирование тренажерного зала и схему расстановки оборудования по фирменной методике Gym Evolution
+                                    </p>
+                                    <p class="text-2">
+                                        3. Формируем спецификации тренажеров, аксессуаров для групповых программ, инвентаря для боевых искусств, функционального тренинга и кроссфита
+                                    </p>
+                                </div>
+
+                                <img src="/assets/img/photo/how-3.png" alt="" class="how-content-item__img how-content-item__img--3">
+                            </div>
+                        </div>
+                    </div>
+                </article>
+            </div>
+
+            <div class="main__item">
+                <article class="free">
+                    <p class="title-1">
+                        Получи проект бесплатно
+                    </p>
+
+                    <div class="free__content">
+                        <form class="form" method="post" action="/send-telegram.php">
+                            <div class="form__item">
+                                <div class="input__block">
+                                    <input class="input__field" type="text" name="Имя" minlength="2" placeholder="" required>
+                                    <label class="input__label">Имя</label>
+                                    <span class="input__error">Имя введено не верно</span>
+                                </div>
+                            </div>
+                            <div class="form__item form__item--two">
+                                <div class="input__block">
+                                    <input class="input__field" type="phone" name="Имя" minlength="2" placeholder="" required>
+                                    <label class="input__label">Телефон</label>
+                                    <span class="input__error">Телефон введен не верно</span>
+                                </div>
+    
+                                <div class="input__block">
+                                    <input class="input__field" type="email" name="Имя" minlength="2" placeholder="" required>
+                                    <label class="input__label">E-mail</label>
+                                    <span class="input__error">E-mail введен не верно</span>
+                                </div>
+                            </div>
+
+                            <div class="form__additional">
+                                <input type="file" id="free__file">
+                                <label for="free__file" class="form__file">
+                                    <button href="#" class="btn-social form__mini-btn">
+                                        <img src="/assets/img/icon/paper-clip.svg" alt="">
+                                    </button>
+                                    <p class="form-additional__text text-3">Загрузить свой проект на просчет</p>
+                                </label>
+                            </div>


-        <script src="/assets/js/gp-main.js"></script>
+                            <div class="form__additional">
+                                <label for="free__agreement" class="form__checkbox-block">
+                                    <input type="checkbox" id="free__agreement" class="form__checkbox" required>
+                                    <div class="form-checkbox__square"></div>
+                                    <p class="form-additional__text text-3">
+                                        Я принимаю
+                                        <a href="#" class="text--bo-line form__link">Политику конфиденциальности</a>
+                                    </p>
+                                </label>
+                            </div>
+
+                            
+                            <input class="btn-big btn-big--blood" type="submit" value="оставить заявку">
+                        </form> 
+                    </div>
+                </article>
+            </div>
+
+            <div class="main__item">
+                <p class="title-1 title--center">
+                    Отзывы клиентов
+                </p>
+
+                <article class="reviews reviews-swiper">
+                    <div class="swiper-wrapper">
+                        <div class="reviews__item swiper-slide">
+                            <div class="reviews-item__content">
+                                <div class="reviews-item-content__header">
+                                    <img src="/assets/img/photo/reviews-person.png" alt="" class="reviews-item-content-header__img">
+    
+                                    <div class="reviews-item-content-header__block">
+                                        <div class="reviews-item-content-header__item">
+                                            <p class="text-1">Название клуба</p>
+    
+                                            <p class="reviews-item-content-header__pin text-2">Локация</p>
+                                        </div>
+                                        <div class="reviews-item-content-header__item">
+                                            <p class="text-2">ФИО</p>
+                                        </div>
+                                    </div>
+                                </div>
+    
+                                <div class="reviews-item-content__text">
+                                    <p class="text-2">
+                                        Недавно я воспользовался услугами этой компании, и остался в полном восторге! Сначала у меня были сомнения, но профессионализм команды моментально развеял все мои опасения. Каждый этап сотрудничества был тщательно продуман, начиная с первичной консультации и заканчивая реализацией проекта.<br><br>
+                                        Отдельно хочу отметить их внимание к деталям и индивидуальный подход. Каждое предложение звучало обоснованно, и я чувствовал, что мои идеи действительно важны для них. Проект был выполнен в срок и даже превзошел мои ожидания! <br><br>
+                                        Рекомендую эту компанию всем, кто ищет качественные услуги и надежное сотрудничество. Спасибо вам за отличную работу!
+                                    </p>
+                                </div>
+                            </div>
+    
+                            <img src="/assets/img/photo/reviews.png" alt="" class="reviews-item__img">
+                        </div>
+
+                        <div class="reviews__item swiper-slide">
+                            <div class="reviews-item__content">
+                                <div class="reviews-item-content__header">
+                                    <img src="/assets/img/photo/reviews-person.png" alt="" class="reviews-item-content-header__img">
+    
+                                    <div class="reviews-item-content-header__block">
+                                        <div class="reviews-item-content-header__item">
+                                            <p class="text-1">Название клуба</p>
+    
+                                            <p class="reviews-item-content-header__pin text-2">Локация</p>
+                                        </div>
+                                        <div class="reviews-item-content-header__item">
+                                            <p class="text-2">ФИО</p>
+                                        </div>
+                                    </div>
+                                </div>
+    
+                                <div class="reviews-item-content__text">
+                                    <p class="text-2">
+                                        Недавно я воспользовался услугами этой компании, и остался в полном восторге! Сначала у меня были сомнения, но профессионализм команды моментально развеял все мои опасения. Каждый этап сотрудничества был тщательно продуман, начиная с первичной консультации и заканчивая реализацией проекта.<br><br>
+                                        Отдельно хочу отметить их внимание к деталям и индивидуальный подход. Каждое предложение звучало обоснованно, и я чувствовал, что мои идеи действительно важны для них. Проект был выполнен в срок и даже превзошел мои ожидания! <br><br>
+                                        Рекомендую эту компанию всем, кто ищет качественные услуги и надежное сотрудничество. Спасибо вам за отличную работу!
+                                    </p>
+                                </div>
+                            </div>
+    
+                            <img src="/assets/img/photo/reviews.png" alt="" class="reviews-item__img">
+                        </div>
+
+                        <div class="reviews__item swiper-slide">
+                            <div class="reviews-item__content">
+                                <div class="reviews-item-content__header">
+                                    <img src="/assets/img/photo/reviews-person.png" alt="" class="reviews-item-content-header__img">
+    
+                                    <div class="reviews-item-content-header__block">
+                                        <div class="reviews-item-content-header__item">
+                                            <p class="text-1">Название клуба</p>
+    
+                                            <p class="reviews-item-content-header__pin text-2">Локация</p>
+                                        </div>
+                                        <div class="reviews-item-content-header__item">
+                                            <p class="text-2">ФИО</p>
+                                        </div>
+                                    </div>
+                                </div>
+    
+                                <div class="reviews-item-content__text">
+                                    <p class="text-2">
+                                        Недавно я воспользовался услугами этой компании, и остался в полном восторге! Сначала у меня были сомнения, но профессионализм команды моментально развеял все мои опасения. Каждый этап сотрудничества был тщательно продуман, начиная с первичной консультации и заканчивая реализацией проекта.<br><br>
+                                        Отдельно хочу отметить их внимание к деталям и индивидуальный подход. Каждое предложение звучало обоснованно, и я чувствовал, что мои идеи действительно важны для них. Проект был выполнен в срок и даже превзошел мои ожидания! <br><br>
+                                        Рекомендую эту компанию всем, кто ищет качественные услуги и надежное сотрудничество. Спасибо вам за отличную работу!
+                                    </p>
+                                </div>
+                            </div>
+    
+                            <img src="/assets/img/photo/reviews.png" alt="" class="reviews-item__img">
+                        </div>
+
+                        <div class="reviews__item swiper-slide">
+                            <div class="reviews-item__content">
+                                <div class="reviews-item-content__header">
+                                    <img src="/assets/img/photo/reviews-person.png" alt="" class="reviews-item-content-header__img">
+    
+                                    <div class="reviews-item-content-header__block">
+                                        <div class="reviews-item-content-header__item">
+                                            <p class="text-1">Название клуба</p>
+    
+                                            <p class="reviews-item-content-header__pin text-2">Локация</p>
+                                        </div>
+                                        <div class="reviews-item-content-header__item">
+                                            <p class="text-2">ФИО</p>
+                                        </div>
+                                    </div>
+                                </div>
+    
+                                <div class="reviews-item-content__text">
+                                    <p class="text-2">
+                                        Недавно я воспользовался услугами этой компании, и остался в полном восторге! Сначала у меня были сомнения, но профессионализм команды моментально развеял все мои опасения. Каждый этап сотрудничества был тщательно продуман, начиная с первичной консультации и заканчивая реализацией проекта.<br><br>
+                                        Отдельно хочу отметить их внимание к деталям и индивидуальный подход. Каждое предложение звучало обоснованно, и я чувствовал, что мои идеи действительно важны для них. Проект был выполнен в срок и даже превзошел мои ожидания! <br><br>
+                                        Рекомендую эту компанию всем, кто ищет качественные услуги и надежное сотрудничество. Спасибо вам за отличную работу!
+                                    </p>
+                                </div>
+                            </div>
+    
+                            <img src="/assets/img/photo/reviews.png" alt="" class="reviews-item__img">
+                        </div>
+
+                        <div class="reviews__item swiper-slide">
+                            <div class="reviews-item__content">
+                                <div class="reviews-item-content__header">
+                                    <img src="/assets/img/photo/reviews-person.png" alt="" class="reviews-item-content-header__img">
+    
+                                    <div class="reviews-item-content-header__block">
+                                        <div class="reviews-item-content-header__item">
+                                            <p class="text-1">Название клуба</p>
+    
+                                            <p class="reviews-item-content-header__pin text-2">Локация</p>
+                                        </div>
+                                        <div class="reviews-item-content-header__item">
+                                            <p class="text-2">ФИО</p>
+                                        </div>
+                                    </div>
+                                </div>
+    
+                                <div class="reviews-item-content__text">
+                                    <p class="text-2">
+                                        Недавно я воспользовался услугами этой компании, и остался в полном восторге! Сначала у меня были сомнения, но профессионализм команды моментально развеял все мои опасения. Каждый этап сотрудничества был тщательно продуман, начиная с первичной консультации и заканчивая реализацией проекта.<br><br>
+                                        Отдельно хочу отметить их внимание к деталям и индивидуальный подход. Каждое предложение звучало обоснованно, и я чувствовал, что мои идеи действительно важны для них. Проект был выполнен в срок и даже превзошел мои ожидания! <br><br>
+                                        Рекомендую эту компанию всем, кто ищет качественные услуги и надежное сотрудничество. Спасибо вам за отличную работу!
+                                    </p>
+                                </div>
+                            </div>
+    
+                            <img src="/assets/img/photo/reviews.png" alt="" class="reviews-item__img">
+                        </div>
+                    </div>
+
+                    <div class="swiper-pagination"></div>
+
+                    <div class="reviews__counter">
+                        <div class="swiper-button-prev"></div>
+                        <span id="numberReviews">1</span>/<span class="reviews__counter--grey">5</span>
+                        <div class="swiper-button-next"></div> 
+                    </div>
+                </article>
+            </div>
+
+            <div class="main__item">
+                <div class="text-form">
+                    <div class="text-form__content">
+                        <p class="title-1">
+                            КАкой-то заголовок
+                        </p>
+                        <p class="text-2">
+                            С учётом сложившейся международной обстановки, дальнейшее развитие различных форм деятельности прекрасно подходит для реализации системы обучения кадров, соответствующей насущным потребностям. Сложно сказать, почему представители современных социальных резервов формируют глобальную экономическую сеть и при этом — преданы социально-демократической анафеме. И нет сомнений, что независимые государства являются только методом политического участия и объединены в целые кластеры себе подобных.<br><br>
+                            В рамках спецификации современных стандартов, тщательные исследования конкурентов могут быть объединены в целые кластеры себе подобных. Разнообразный и богатый опыт говорит нам, что выбранный нами инновационный путь играет важную роль в формировании стандартных подходов. <br><br>
+                            <a href="#" class="link">Читать подробнее</a>
+                        </p>
+                    </div>
+    
+                    <div class="text-form__form">
+                        <p class="title-3">Получи проект бесплатно</p>
+    
+                        <form action="" class="form">
+                            <div class="form__item">
+                                <div class="input__block">
+                                    <input class="input__field" type="text" name="Имя" minlength="2" placeholder="" required="">
+                                    <label class="input__label">Имя</label>
+                                    <span class="input__error">Имя введино не верно</span>
+                                </div>
+                            </div>
+                            <div class="form__item">
+                                <div class="input__block">
+                                    <input class="input__field" type="phone" name="Имя" minlength="2" placeholder="" required="">
+                                    <label class="input__label">Телефон</label>
+                                    <span class="input__error">Телефон введен не верно</span>
+                                </div>
+                            </div>
+                            <div class="form__item">
+                                <div class="input__block">
+                                    <input class="input__field" type="email" name="Имя" minlength="2" placeholder="" required="">
+                                    <label class="input__label">E-mail</label>
+                                    <span class="input__error">E-mail введен не верно</span>
+                                </div>
+                            </div>
+                            <div class="form__additional">
+                                <input type="file" id="text-form__file">
+                                <label for="text-form__file" class="form__file">
+                                    <div href="#" class="btn-social form__mini-btn">
+                                        <img src="/assets/img/icon/paper-clip.svg" alt="">
+                                    </div>
+                                    <p class="form-additional__text text-3">Загрузить свой проект на просчет</p>
+                                </label>
+                            </div>
+                            <div class="form__additional">
+                                <label for="text-form__agreement" class="form__checkbox-block text-form__agreement--text-form">
+                                    <input type="checkbox" id="text-form__agreement" class="form__checkbox" required="">
+                                    <div class="form-checkbox__square"></div>
+                                    <p class="form-additional__text text-3">
+                                        Я принимаю<br><a href="#" class="text--bo-line form__link">Политику конфиденциальности</a>
+                                    </p>
+                                </label>
+                            </div>
+                            <input class="btn-big btn-big--blood" type="submit" value="оставить заявку">
+                        </form>
+                    </div> 
+                </div>
+                               
+            </div>
+
+            <div class="main__item">
+                <p class="title-1">
+                    Дополнительные услуги
+                </p>
+
+                <article class="services">
+                    <div class="services__item">
+                        <img src="/assets/img/icon/services-1.svg" alt="" class="services__img">
+                        
+                        <div class="services__content">
+                            <p class="title-4">Доставка</p>
+                            <p class="text-2">Быстрая доставка по всей России и СНГ</p>
+                        </div>
+                    </div>
+                    <div class="services__item">
+                        <img src="/assets/img/icon/services-2.svg" alt="" class="services__img">
+                        
+                        <div class="services__content">
+                            <p class="title-4">Сервис и запчасти</p>
+                            <p class="text-2">Большой ассортимент запчастей и качественный сервис</p>
+                        </div>
+                    </div>
+                    <div class="services__item">
+                        <img src="/assets/img/icon/services-3.svg" alt="" class="services__img">
+                        
+                        <div class="services__content">
+                            <p class="title-4">Трейд-Ин</p>
+                            <p class="text-2">Забираем старое оборудование и даем скидку на новое</p>
+                        </div>
+                    </div>
+                    <div class="services__item">
+                        <img src="/assets/img/icon/services-4.svg" alt="" class="services__img">
+                        
+                        <div class="services__content">
+                            <p class="title-4">Обучение персонала</p>
+                            <p class="text-2">Обучаем полный состав персонала навыкам повышающим эффективность работы клуба</p>
+                        </div>
+                    </div>
+                    <div class="services__item">
+                        <img src="/assets/img/icon/services-5.svg" alt="" class="services__img">
+                        
+                        <div class="services__content">
+                            <p class="title-4">Лизинг</p>
+                            <p class="text-2">Предоставляем оборудование в аренду с правом выкупа</p>
+                        </div>
+                    </div>
+                </article>
+            </div>
+
+            <div class="main__item">
+                <article class="call">
+                    <p class="title-1">
+                        Свяжитесь с нами
+                    </p>
+
+                    <div class="call__content">
+                        <div class="call__item">
+                            <a href="tel:+74957988081" class="title-3">+7 (495) 798-80-81</a>
+
+                            <a href="mailto:sales@bestinfitness.ru" class="title-3">sales@bestinfitness.ru</a>
+                        </div>
+                        <div class="call__item">
+                            <a href="" class="btn-big btn-big--border btn-big--border--white btn-big--social btn-big--ws">
+                                написать в whatsaap
+                            </a>
+
+                            <a href="" class="btn-big btn-big--border btn-big--border--white btn-big--social btn-big--tg">
+                                написать в telegram
+                            </a>
+                        </div>
+                    </div>
+                </article>
+            </div>
+        </main>
+
+        <footer class="footer">
+            <div class="wrapper footer__wrapper">
+                <img src="/assets/img/main/logo.svg" alt="" class="footer__logo">
+
+                <div class="footer__item">
+                    <div class="footer__menu">
+                        <div class="footer-menu__item">
+                            <ul class="footer-menu__list">
+                                <li><a href="">О компании</a></li>
+                                <li><a href="">каталог</a></li>
+                                <li><a href="">бренды</a></li>
+                                <li><a href="">зонирование</a></li>
+                            </ul>
+                        </div>
+                        <div class="footer-menu__item">
+                            <ul class="footer-menu__list">
+                                <li><a href="">проекты</a></li>
+                                <li><a href="">интересное</a></li>
+                                <li><a href="">контакты</a></li>
+                            </ul>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="footer__contact">
+                    <div class="footer__item">
+                        <p class="footer__text">
+                            г. Москва, улица Обручева, 52с3, офис 406 (Бизнес-центр⠀«РТС»)
+                        </p>
+                    </div>
+
+                    <div class="footer__item">
+                        <a href="tel:+74957988081" class="footer__text footer__text--no-line">+7 (495) 798-80-81</a>
+    
+                        <a href="mailto:sales@bestinfitness.ru" class="footer__text footer__text--no-line">sales@bestinfitness.ru</a>
+    
+                        <div class="footer__media">
+                            <a href="#" class="btn-social">
+                                <img src="/assets/img/social/telegram.svg" alt="">                        
+                            </a>
+    
+                            <a href="#" class="btn-social">
+                                <img src="/assets/img/social/whatsapp.svg" alt="">                        
+                            </a>
+    
+                            <a href="#" class="btn-social">
+                                <img src="/assets/img/social/YouTube.svg" alt="">                        
+                            </a>
+    
+                            <a href="#" class="btn-social">
+                                <img src="/assets/img/social/Вконтакте.svg" alt="">                        
+                            </a>
+    
+                            <a href="#" class="btn-social">
+                                <img src="/assets/img/social/yandex-zen.svg" alt="">                        
+                            </a>
+                        </div>
+                    </div>
+                    
+                    <div class="footer__item">
+                        <img src="/assets/img/photo/review.png" alt="" class="footer__review">
+                    </div>
+                </div>
+
+                <div class="footer__item footer__about">
+                    <p>©️2024. BEST IN FITNESS на базе «ООО ЛАЙФ-ИН-ФИТНЕС»</p>
+                
+                    <a href="#" class="link footer-about__link">политика конфиденциальности</a>
+                </div>
+            </div>
+        </footer>
+
+        <script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
+        <script src="/assets/js/main.js"></script>
    </body>
 </html>
--- a/13
+++ b/13
@@ -0,0 +1,13 @@
+<!-- Пример формы для отправки в Телеграмм (обработчик send-telegram.php) -->
+<!-- <form class="form" method="post" action="/send-telegram.php">
+    <div class="form__item">
+        <input class="form__input" type="text" name="name" required>
+        <label class="form__label">Ваше имя</label>
+    </div>
+    <div class="form__item">
+        <input class="form__input" type="text" name="phone" required>
+        <label class="form__label">Номер телефона</label>
+    </div>
+    <input class="form__input btn" type="submit" value="Отправить">
+</form> -->
+
Author	SHA1	Message	Date
Kirill Pet	8ec1dd88d6	сделал reviews для пк	2024-12-18 22:38:55 +03:00
Kirill Pet	c082f320f6	сделал free и text-form для пк	2024-12-18 19:49:11 +03:00
Kirill Pet	d07d972c10	сделал projects и how, а также input для ПК	2024-12-18 16:44:16 +03:00
Kirill Pet	dd58ea60e5	сделал services и call сделал пк версии	2024-12-17 20:45:58 +03:00
Kirill Pet	077f5baf53	сделал gym с адаптивностью	2024-12-17 18:54:39 +03:00
Kirill Pet	cd23fb02ae	сделал space с адаптивностью	2024-12-17 15:35:14 +03:00
Kirill Pet	bf2dd875e0	сделал header и footer для планшетов	2024-12-16 21:41:21 +03:00
Kirill Pet	72ea7506a3	сделал header и footer для лептопов	2024-12-16 21:10:39 +03:00
Kirill Pet	73acc61c2b	сделал footer для пк и телефон	2024-12-16 20:26:19 +03:00
Kirill Pet	3396d6e974	сделал header для пк	2024-12-16 18:37:54 +03:00
Kirill Pet	13da123645	сделал header для телефона	2024-12-16 17:05:10 +03:00
Максим Максимов	b1afb0f09c	GP \| feat: add .htaccess	2024-07-20 07:46:52 +00:00
Max	4961f2b1c9	GP \| feat: upd readme	2024-07-03 00:15:56 +03:00