without final images

src/blocks/about/about.scss

@@ -76,5 +76,10 @@
 
   &.decor:after {
     bottom: -100px;
+
+    @media (min-width: 2100px) {
+      bottom: -150px;
+      height: 150px;
+    }
   }
 }
\ No newline at end of file

src/blocks/accordeon/accordeon.scss

@@ -26,6 +26,9 @@
       .accordeon__btn:after {
         background: linear-gradient(0deg, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45));
       }
+      .accordeon__btn-img{
+        filter: grayscale(0%);
+      }
 
       .accordeon__content {
         max-height: 5000px;
@@ -58,7 +61,7 @@
 
     @media (min-width: $screen-lg) {
       padding: 0 80px;
-      height: 256px;
+      min-height: 160px;
       margin-bottom: 40px;
     }
 
@@ -71,13 +74,45 @@
       width: 100%;
       height: 100%;
       cursor: pointer;
+      opacity: 1;
       background: linear-gradient(0deg, rgba(1, 73, 60, 0.6), rgba(1, 73, 60, 0.6)), linear-gradient(180deg, rgba(0, 221, 164, 0.5) 0%, rgba(0, 212, 192, 0.5) 100%);
-      transition: all $transition-time;
+      transition: all .5s;
     }
 
     &:hover {
       &:after {
-        background: linear-gradient(0deg, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45));
+        opacity: 0;
+      }
+
+      .accordeon__check::after,
+      .accordeon__check::before {
+        background-color: $main-light;
+      }
+    }
+
+    &::before {
+      position: absolute;
+      content: '';
+      opacity: 0;
+      top: 0;
+      left: 0;
+      border-radius: 16px;
+      width: 100%;
+      height: 100%;
+      cursor: pointer;
+      z-index: 2;
+      background: linear-gradient(0deg, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45));
+      transition: all .5s;
+    }
+
+    &:hover {
+      &:before {
+        opacity: 1;
+
+      }
+
+      .accordeon__btn-img{
+        filter: grayscale(0%);
       }
 
       .accordeon__check::after,
@@ -88,6 +123,17 @@
 
   }
 
+  &__btn-img{
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    left: 0;
+    top: 0;
+    border-radius: 16px;
+    filter: grayscale(99%);
+    transition: all $transition-time;
+  }
+
   &__content {
     max-height: 0;
     opacity: 0;
@@ -184,7 +230,22 @@
 
 }
 
+.accordeon.accordeon--industries {
+
+}
+
 .accordeon--industries {
+
+  margin-bottom: 0;  padding: 30px 0;
+
+  @media (min-width: $screen-xxl) {
+    margin-bottom: 0px;
+  }
+
+  @media (min-width: $screen-lg) {
+    padding: 50px 0;
+  }
+
   .accordeon__btn {
     &::after {
       background: linear-gradient(0deg, rgba(64, 119, 115, 0.85), rgba(64, 119, 115, 0.85));
@@ -199,19 +260,26 @@
 
   .accordeon__element {
     &.open {
-      .accordeon__btn:after {
-        background: linear-gradient(0deg, rgba(64, 119, 115, 0.85), rgba(64, 119, 115, 0.85));
-      }
+      // .accordeon__btn:after {
+      //   background: linear-gradient(0deg, rgba(64, 119, 115, 0.85), rgba(64, 119, 115, 0.85));
+      // }
     }
   }
 
-  .task__item::before{
+  .task__item::before {
     background-color: $color-accent;
   }
-  .collapse__btn{
+
+  .collapse__btn {
     color: $black;
+    transition: all $transition-time;
+
+    // &:hover {
+    //   color: $main-light;
+    // }
   }
-  .collapse__btn::before{
+
+  .collapse__btn::before {
     background: url(../img/arrow-down-black.svg);
     width: 23px;
     height: 24px;

src/blocks/apply/apply.scss

@@ -7,7 +7,8 @@
   $block-name: &; // #{$block-name}__element
 
   margin-bottom: 40px;
-  @media (min-width: $screen-lg){
+
+  @media (min-width: $screen-lg) {
     margin-bottom: 64px;
   }
 
@@ -29,16 +30,18 @@
 
   &__item {
     margin-bottom: 16px;
-    @media (max-width: ($screen-xxl - 1)){
-      flex: 0 0 50%;
-      margin-bottom: 20px;
-    }
+    padding: 0 20px;
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-c) {
       padding: 0 20px;
       flex: 0 0 25%;
       margin-bottom: 0;
     }
+
+    @media (max-width: ($screen-c - 1)) {
+      flex: 0 0 50%;
+      margin-bottom: 20px;
+    }
   }
 
   &__body {
@@ -63,7 +66,7 @@
       height: 60px;
     }
 
-    svg{
+    svg {
       width: 100%;
       height: 100%;
     }

src/blocks/best/best.scss

@@ -116,7 +116,7 @@
     list-style: none;
     margin-bottom: 40px;
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-md) {
       display: flex;
       flex-wrap: wrap;
       margin: 0 -20px 40px;
@@ -126,7 +126,7 @@
   &__screen-item {
     margin-bottom: 24px;
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-md) {
       padding: 20px;
       flex: 0 0 33.333%;
       display: flex;

src/blocks/branch/branch.pug

@@ -22,9 +22,11 @@ mixin branch(text, mods)
     .branch__inner.container
       h2.branch__title.h2 Отрасли 
       .branch__block 
-        .branch__top(style="background-image: url(img/branch1.jpg);") 
+        .branch__top
+
           a(href="javascript:void(0);").branch__link
             .branch__item-body
+              img(src="img/branch1.jpg", alt="").branch__item-img
               h3.branch__item-title Цифровизация производства
               ul.branch__item-bottom 
                 li.branch__item-item
@@ -36,9 +38,10 @@ mixin branch(text, mods)
                 li.branch__item-item
                   span.branch__item-subtitle.h5 Распределённая командная работа и цифровой рабочий
         ul.branch__grid 
-          .branch__item(style="background-image: url(img/branch2.jpg);")  
+          .branch__item  
             a(href="javascript:void(0);").branch__link
-              .branch__body 
+              .branch__body
+                img(src="img/branch2.jpg", alt="").branch__item-img 
                 h3.branch__title-h3 Нефть и газ
                 ul.branch__bottom 
                   li.branch__subtitle.h5 Цифровые двойники
@@ -46,21 +49,22 @@ mixin branch(text, mods)
                   li.branch__subtitle.h5 Интегрированное планирование и оптимизация
                   li.branch__subtitle.h5 Переработка и сбыт
                   li.branch__subtitle.h5 Корпоративные сервисы
-          .branch__item(style="background-image: url(img/branch3.jpg);")  
+          .branch__item  
             a(href="javascript:void(0);").branch__link
-              .branch__body 
+              .branch__body
+                img(src="img/branch3.jpg", alt="").branch__item-img 
                 h3.branch__title-h3 Энергетика
                 ul.branch__bottom 
                   li.branch__subtitle.h5 Генерация
                   li.branch__subtitle.h5 Ресурсоснабжающие организации и сбыт
                   li.branch__subtitle.h5 Корпоративные сервисы
-          .branch__item(style="background-image: url(img/branch4.png);")  
+          .branch__item  
             a(href="javascript:void(0);").branch__link
-              .branch__body 
+              .branch__body
+                img(src="img/branch4.jpg", alt="").branch__item-img 
                 h3.branch__title-h3 Промышленное производство
                 ul.branch__bottom 
                   li.branch__subtitle.h5 Цифровые двойники
-                  li.branch__subtitle.h5 Достоверность данных
-                  li.branch__subtitle.h5 Проактивные приложения
-                  li.branch__subtitle.h5 Распределённая командная работа и цифровой рабочий
+                  li.branch__subtitle.h5 Ресурсоснабжающие организации и сбыт
+                  li.branch__subtitle.h5 Корпоративные сервисы
 

src/blocks/branch/branch.scss

@@ -9,15 +9,27 @@
   margin-bottom: 48px;
 
   @media (min-width: $screen-xxl) {
-    padding: 148px 0;
+    padding: 160px 0;
+    margin-bottom: 104px;
+  }
+
+  @media (min-width: $screen-c) {
+    padding: 136px 0;
+    margin-bottom: 118px;
   }
 
   @media (min-width: $screen-xl) {
-    padding: 108px 0;
+    padding: 118px 0 136px;
+    margin-bottom: 132px;
   }
 
   @media (min-width: $screen-lg) {
-    padding: 100px 0;
+    padding: 102px 0 112px;
+    margin-bottom: 40px;
+  }
+  @media (min-width: $screen-md) {
+    padding: 102px 0;
+    margin-bottom: 100px;
   }
 
   @media (min-width: $screen-sm) {
@@ -28,7 +40,10 @@
     color: $white;
     margin: 0 0 30px;
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-xxl) {
+      margin: 0 0 56px;
+    }
+    @media (min-width: $screen-md) {
       margin: 0 0 48px;
     }
 
@@ -61,7 +76,7 @@
       bottom: 0;
       right: 0;
       left: 0;
-      z-index: -1;
+      z-index: 2;
       border-radius: 16px;
       pointer-events: none;
       transition: all $transition-time;
@@ -76,7 +91,6 @@
       bottom: 0;
       right: 0;
       left: 0;
-      z-index: -1;
       border-radius: 16px;
       pointer-events: none;
       background: linear-gradient(0deg, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45));
@@ -92,6 +106,10 @@
       &:after {
         opacity: 1;
       }
+
+      .branch__item-img{
+        filter: grayscale(0%);
+      }
     }
   }
 
@@ -113,7 +131,7 @@
       padding: 48px;
     }
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-md) {
       padding: 32px;
       align-items: center;
     }
@@ -123,14 +141,15 @@
     font: 18px $ff-i-b;
     font-weight: 700;
     margin: 0;
+    z-index: 3;
 
     @media (min-width: $screen-xxl) {
       font-size: 36px;
       margin: 0 0 40px;
     }
 
-    @media (min-width: $screen-lg) {
-      font-size: 30px;
+    @media (min-width: $screen-md) {
+      font-size: 26px;
       text-align: center;
       margin: 0 0 32px;
     }
@@ -156,7 +175,7 @@
       right: 50%;
       transform: translateY(-50%);
 
-      @media (min-width: $screen-lg) {
+      @media (min-width: $screen-md) {
         top: 50%;
         right: -32px;
       }
@@ -170,24 +189,32 @@
         width: 28%;
       }
 
-      @media (min-width: $screen-lg) {
-        margin-bottom: 16px;
+      @media (min-width: $screen-md) {
+        margin-bottom: 12px;
       }
     }
   }
 
   &__item-subtitle {
     text-align: center;
+
+    @media (min-width: $screen-xxl) {
+      font-size: 20px;
+    }
+
+    @media (min-width: $screen-c) {
+      font-size: 17px;
+    }
   }
 
   &__item-bottom {
     margin: 0;
     padding: 0;
-
+z-index: 3;
     list-style: none;
     display: none;
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-md) {
       display: flex;
       flex-wrap: wrap;
       justify-content: space-between;
@@ -202,13 +229,10 @@
     grid-template-columns: repeat(1, 1fr);
     gap: 16px;
 
-    @media (min-width: $screen-xxl) {
-      gap: 40px;
-    }
 
     @media (min-width: $screen-xl) {
       grid-template-columns: repeat(3, 1fr);
-      gap: 16px;
+      gap: 40px;
     }
   }
 
@@ -225,10 +249,9 @@
     z-index: 1;
 
     @media (min-width: $screen-xxl) {
-      aspect-ratio: 1/1;
+      min-height: auto;
     }
 
-
     &::after {
 
       @media (min-width: $screen-xl) {
@@ -251,7 +274,7 @@
           bottom: 0;
           right: 0;
           left: 0;
-          z-index: -1;
+          z-index: 2;
           border-radius: 16px;
           pointer-events: none;
           background: linear-gradient(0deg, rgba(0, 16, 91, 0.55), rgba(0, 16, 91, 0.55));
@@ -267,6 +290,9 @@
           &:after {
             opacity: 1;
           }
+          .branch__item-img{
+            filter: grayscale(0%);
+          }
         }
       }
 
@@ -281,7 +307,7 @@
           bottom: 0;
           right: 0;
           left: 0;
-          z-index: -1;
+          z-index: 2;
           border-radius: 16px;
           pointer-events: none;
           background: linear-gradient(0deg, rgba(237, 28, 36, 0.5), rgba(237, 28, 36, 0.5));
@@ -297,6 +323,10 @@
           &:after {
             opacity: 1;
           }
+
+          .branch__item-img{
+            filter: grayscale(0%);
+          }
         }
       }
     }
@@ -310,7 +340,7 @@
           bottom: 0;
           right: 0;
           left: 0;
-          z-index: -1;
+          z-index: 2;
           border-radius: 16px;
           pointer-events: none;
           background: linear-gradient(0deg, rgba(0, 71, 99, 0.66), rgba(0, 71, 99, 0.66));
@@ -326,11 +356,28 @@
           &:after {
             opacity: 1;
           }
+
+          .branch__item-img{
+            filter: grayscale(0%);
+          }
         }
       }
     }
   }
 
+  
+  &__item-img{
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    left: 0;
+    top: 0;
+    border-radius: 16px;
+    filter: grayscale(99%);
+    object-fit: cover;
+    transition: all $transition-time;
+  }
+
   &__body {
     display: flex;
     flex-direction: column;
@@ -343,7 +390,7 @@
       padding: 48px;
     }
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-md) {
       padding: 32px;
     }
 
@@ -354,7 +401,7 @@
       bottom: 0;
       right: 0;
       left: 0;
-      z-index: -1;
+      z-index: 2;
       border-radius: 16px;
       pointer-events: none;
       background: linear-gradient(0deg, rgba(1, 73, 60, 0.6), rgba(1, 73, 60, 0.6)),
@@ -367,10 +414,16 @@
     font: 18px $ff-i-b;
     font-weight: 700;
     margin: 0;
+    z-index: 3;
 
     @media (min-width: $screen-xxl) {
       font-size: 36px;
       min-height: 86px;
+      margin: 0 0 40px;
+    }
+
+    @media (min-width: $screen-c) {
+      margin: 0 0 32px;
     }
 
     @media (min-width: $screen-xl) {
@@ -378,7 +431,7 @@
       margin: 0 0 40px;
     }
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-md) {
       font-size: 28px;
       margin: 0 0 32px;
     }
@@ -387,19 +440,35 @@
   &__bottom {
     list-style: disc;
     display: none;
+    z-index: 3;
 
     @media (min-width: $screen-xxl) {
       padding-left: 20px;
     }
-    @media (min-width: $screen-lg) {
+
+    @media (min-width: $screen-md) {
       display: block;
     }
   }
 
   &__subtitle {
 
+    @media (min-width: $screen-xxl){
+      font-size: 20px;
+    }
+    @media (min-width: $screen-c){
+      font-size: 17px;
+    }
+
     &:not(:last-child) {
       margin-bottom: 8px;
     }
   }
+}
+
+.without-top {
+  .branch__item::after{
+    visibility: hidden;
+  }
+
 }
\ No newline at end of file

src/blocks/breadcrumbs/breadcrumbs.scss

@@ -36,7 +36,7 @@
   }
 
   span {
-    opacity: 0.5;
+    opacity: 0.7;
   }
 
   &__item {

src/blocks/callback-popup/callback-popup.scss

@@ -24,10 +24,11 @@
   &__text {
     display: flex;
     justify-content: center;
-    margin-bottom: 40px;
+    margin-bottom: 24px;
 
     p {
       text-align: center;
+      margin-bottom: 0;
     }
   }
 

src/blocks/collapse/collapse.scss

@@ -4,36 +4,55 @@
 
 .collapse {
 
-  $block-name:                &; // #{$block-name}__element
+  $block-name: &; // #{$block-name}__element
 
   width: 100%;
   display: flex;
   justify-content: center;
 
-  &__btn{
+  &__btn {
     color: $white;
     position: relative;
+    transition: all $transition-time;
 
-    &::before{
-      position: absolute;
-      content: '';
-      background: url(../img/arrow-down-white.svg);
-      background-repeat: no-repeat;
-      background-position: center;
-      background-size: contain;
-      border: 0;
-      width: 20px;
-      height: 24px;
-      top: -100%;
-      left: 50%;
-      transform: translateX(-50%);
-      transition: all $transition-time;
-    }
+    // &::before {
+    //   position: absolute;
+    //   content: '';
+    //   background: url(../img/arrow-down-white.svg);
+    //   background-repeat: no-repeat;
+    //   background-position: center;
+    //   background-size: contain;
+    //   border: 0;
+    //   width: 23px;
+    //   height: 24px;
+    //   top: -100%;
+    //   left: 50%;
+    //   transform: translateX(-50%);
+    //   transition: all $transition-time;
+    // }
+
+    svg {
+      width: 24px;
+      display: block;
+      margin: 4px auto;
+      transition: transform .5s;
   }
 
-  &:hover{
-    .collapse__btn::before{
-      top: -110%;
+    &:hover {
+
+      svg{
+        transform: translateY(-10px);
+        // animation: scroll .5s ease-out alternate infinite;
+      }
     }
   }
 }
+
+@keyframes scroll {
+  0% {
+    transform: translateY(0px);
+  }
+  100% {
+    transform: translateY(-10px);
+  }
+}
\ No newline at end of file

src/blocks/download/download.scss

@@ -20,6 +20,9 @@
       margin-right: 40px;
       margin-bottom: 0;
     }
+    @media (min-width: $screen-lg) {
+      max-width: 440px;
+    }
   }
 
   &__body {

src/blocks/error/error.scss

@@ -14,8 +14,9 @@
   }
 
   &__descr {
-    padding: 70px 0 40px;
+    padding: 40px 0 40px;
     text-align: center;
+
   }
 
   &__error {

src/blocks/main-title/main-title.scss

@@ -33,9 +33,13 @@
   }
 
   &__text {
-    @media (min-width: $screen-xxl) {
+    max-width: 1180px;
+    @media (min-width: $screen-c) {
       margin-bottom: 24px;
       transform: translateY(-28px);
     }
+    @media (min-width: $screen-lg) {
+      margin-bottom: 16px;
+    }
   }
 }
\ No newline at end of file

src/blocks/map/map.scss

@@ -11,7 +11,11 @@
     padding: 80px 0;
   }
 
-  &__top{
+  @media (min-width: $screen-xl) {
+    padding: 46px 0 46px;
+  }
+
+  &__top {
     margin: 0;
     margin-bottom: 64px;
   }
@@ -30,6 +34,7 @@
 
   &__item {
     margin-bottom: 32px;
+
     @media (min-width: $screen-lg) {
       flex: 0 0 33.3333%;
       padding: 0 20px;
@@ -46,9 +51,10 @@
 
   &__label {
     color: $main-dark;
-    
+
     margin-bottom: 16px;
-    @media (min-width: $screen-lg){
+
+    @media (min-width: $screen-lg) {
       margin-bottom: 32px;
     }
 
@@ -63,7 +69,8 @@
       color: $black;
       text-decoration: none;
     }
-    p{
+
+    p {
       margin: 0;
     }
 

src/blocks/more/more.scss

@@ -4,29 +4,36 @@
 
 .more {
 
-  $block-name:                &;
-  
+  $block-name: &;
 
-  &__wrapper{
 
-  display: flex;
-  justify-content: center;
+  &__wrapper {
+
+    display: flex;
+    justify-content: center;
   }
 }
 
 .news {
-  .more{
+  .more {
     margin-bottom: 48px;
+
     @media (min-width: $screen-lg) {
       margin-bottom: 80px;
     }
   }
 }
+
 .projects__more {
-  .more{
+  @media (min-width: $screen-xl) {
+    margin-top: 32px;
+  }
+
+  .more {
     margin-bottom: 48px;
+
     @media (min-width: $screen-lg) {
       margin-bottom: 80px;
     }
   }
-}
+}
\ No newline at end of file

src/blocks/news-det/news-det.scss

@@ -65,12 +65,15 @@
     display: flex;
     align-items: center;
     flex-direction: column;
-    padding: 40px 0;
+    padding: 20px 0;
     margin: 0;
 
     @media (min-width: $screen-lg) {
       padding: 64px 0;
     }
+    @media (min-width: $screen-md) {
+      padding: 40px 0;
+    }
   }
 
   figcaption {

src/blocks/num-solutions/num-solutions.scss

@@ -9,11 +9,11 @@
   padding: 46px 0 80px;
 
   @media (min-width: $screen-xxl) {
-    padding: 160px 0 220px;
+    padding: 160px 0 140px;
   }
 
   @media (min-width: $screen-xl) {
-    padding: 100px 0 180px;
+    padding: 100px 0 140px;
   }
 
   @media (min-width: $screen-lg) {

src/blocks/page-footer/page-footer.pug

@@ -42,14 +42,16 @@ mixin page-footer(mods)
         form.page-footer__form.footer-form 
           .footer-form__left
             .footer-form__title.h5 Обратная связь
-            label.footer-form__label
-              input(type="text" name="name" placeholder="Имя Фамилия").footer-form__input
-            label.footer-form__label
-              input(type="text" name="name" placeholder="Компания").footer-form__input
-            label.footer-form__label
-              input(type="text" name="name" placeholder="Должность").footer-form__input
-            label.footer-form__label.message-desc
-              textarea(name="name", cols="30", rows="6", placeholder="Ваше сообщение").footer-form__textarea
+            .footer-form__left-input
+              label.footer-form__label
+                input(type="text" name="name" placeholder="Имя Фамилия").footer-form__input
+              label.footer-form__label
+                input(type="text" name="name" placeholder="Компания").footer-form__input
+              label.footer-form__label
+                input(type="text" name="name" placeholder="Должность").footer-form__input
+            .footer-form__left-textarea
+              label.footer-form__label.message-desc
+                textarea(name="name", placeholder="Ваше сообщение").footer-form__textarea
           .footer-form__right
             label.footer-form__label
               input(type="text" name="name" placeholder="Телефон").footer-form__input

src/blocks/page-footer/page-footer.scss

@@ -14,15 +14,23 @@
     padding: 120px 0 56px;
   }
 
+  @media (min-width: $screen-c) {
+    padding: 86px 0 48px;
+  }
+
   @media (min-width: $screen-lg) {
     padding: 80px 0 48px;
   }
 
+  @media (min-width: $screen-md) {
+    padding: 64px 0 56px;
+  }
+
 
   &__body {
     position: relative;
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-md) {
       display: flex;
     }
   }
@@ -33,14 +41,24 @@
 
     @media (min-width: $screen-xxl) {
       margin-right: 42px;
+      flex: 0 0 30%;
     }
+
+    @media (min-width: $screen-c) {
+      flex: 0 0 35%;
+    }
+
     @media (min-width: $screen-xl) {
       margin-right: 52px;
     }
 
     @media (min-width: $screen-lg) {
+      margin-right: 208px;
+    }
+
+    @media (min-width: $screen-md) {
       margin-bottom: 0;
-      margin-right: 66px;
+      margin-right: 120px;
     }
   }
 
@@ -50,6 +68,11 @@
     @media (min-width: $screen-xxl) {
       flex: 0 0 18%;
     }
+
+    @media (min-width: $screen-c) {
+      flex: 0 0 21%;
+    }
+
     @media (min-width: $screen-xl) {
       display: block;
       flex: 0 0 17%;
@@ -64,14 +87,15 @@
 
       margin-bottom: 54px;
     }
+
     @media (min-width: $screen-xl) {
 
       margin-bottom: 46px;
     }
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-md) {
       width: 267px;
-      margin-bottom: 56px;
+      margin-bottom: 46px;
     }
   }
 
@@ -88,7 +112,7 @@
       margin-bottom: 16px;
     }
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-md) {
       padding-left: 80px;
     }
   }
@@ -99,7 +123,7 @@
     margin-bottom: 0;
     letter-spacing: 0.05em;
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-md) {
       padding-left: 80px;
     }
   }
@@ -121,9 +145,9 @@
       margin-bottom: 16px;
     }
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-md) {
       font-size: 16px;
-      margin-bottom: 24px;
+      margin-bottom: 16px;
     }
   }
 
@@ -146,12 +170,12 @@
       margin-bottom: 16px;
     }
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-md) {
       font-size: 16px;
-      margin-bottom: 24px;
+      margin-bottom: 16px;
     }
 
-    &:hover{
+    &:hover {
       color: $main-light;
     }
   }
@@ -175,6 +199,19 @@
 
     @media (min-width: $screen-xxl) {
       font-size: 14px;
+      max-width: 280px;
+    }
+
+    @media (min-width: $screen-c) {
+      max-width: 240px;
+    }
+
+    @media (min-width: $screen-xl) {
+      max-width: 210px;
+    }
+
+    @media (min-width: $screen-md) {
+      margin-bottom: 16px;
     }
   }
 
@@ -186,7 +223,7 @@
 
   &__item {
     color: $white;
-    font: 18px/1.3 $ff-i-m;
+    font: 16px/1.3 $ff-i-m;
     font-weight: 500;
     letter-spacing: 0.05em;
     margin-bottom: 32px;
@@ -206,7 +243,7 @@
     color: $white;
     transition: color $transition-time;
 
-    &:hover{
+    &:hover {
       color: $main-light;
     }
   }
@@ -215,26 +252,60 @@
 .footer-form {
 
 
-  @media (min-width: $screen-lg) {
+  @media (min-width: $screen-md) {
     display: flex;
     justify-content: space-between;
   }
 
   &__left {
     flex: 0 0 47%;
+
+    @media (min-width: $screen-xxl) {
+      flex: 0 0 47%;
+    }
+
+    @media (min-width: $screen-c) {
+      flex: 0 0 49%;
+    }
+
+    @media (min-width: $screen-md) {
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+    }
+  }
+
+  &__left-textarea{
+    flex: 1 0 auto;
   }
 
   &__right {
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-xxl) {
       margin-top: 50px;
       flex: 0 0 47%;
     }
+
+    @media (min-width: $screen-c) {
+      flex: 0 0 49%;
+      margin-top: 40px;
+    }
+
+    @media (min-width: $screen-md) {
+      margin-top: 39px;
+      flex: 0 0 47%;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+    }
   }
 
   &__label {
     width: 100%;
 
+    p {
+      margin-bottom: 0;
+    }
   }
 
   &__input {
@@ -253,7 +324,7 @@
       font: 12px/1.3 $ff-i-r;
       letter-spacing: 0.05em;
 
-      @media (min-width: $screen-lg) {
+      @media (min-width: $screen-xxl) {
         font-size: 14px;
       }
     }
@@ -276,10 +347,31 @@
     border: 1px solid #336D69;
     transition: all $transition-time;
 
+    @media (min-width: $screen-xxl) {
+
+      min-height: 103px;
+    }
+
+    @media (min-width: $screen-xl) {
+
+      min-height: 96px;
+    }
+
+    @media (min-width: $screen-lg) {}
+
+    @media (min-width: $screen-md) {
+      margin-bottom: 0;
+      height: 100%;
+    }
+
     &::placeholder {
       color: $placeholder-color;
-      font: 14px/1.3 $ff-i-r;
+      font: 12px/1.3 $ff-i-r;
       letter-spacing: 0.05em;
+
+      @media (min-width: $screen-xxl) {
+        font-size: 14px;
+      }
     }
 
     &:focus {
@@ -293,15 +385,25 @@
     margin: 0;
     margin-bottom: 18px;
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-xxl) {
       margin-bottom: 24px;
+      font-size: 20px;
+    }
+
+    @media (min-width: $screen-c) {
+      font-size: 17px;
+      margin-bottom: 16px;
+    }
+
+    @media (min-width: $screen-md) {
+      margin-bottom: 16px;
     }
   }
 
   &__submit {
     width: 113px;
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-md) {
       width: 100%;
     }
   }
@@ -311,18 +413,27 @@
     margin-bottom: 16px;
 
     @media (min-width: $screen-xxl) {
-      padding-top: 24px;
+      padding-top: 16px;
       padding-bottom: 24px;
     }
+
     @media (min-width: $screen-xl) {
-      padding-top: 4px;
-      padding-bottom: 4px;
+      padding-top: 8px;
+      padding-bottom: 16px;
     }
 
     @media (min-width: $screen-lg) {
+      padding: 8px 0 8px;
+      padding-left: 40px;
+    }
+
+    @media (min-width: $screen-md) {
       margin-bottom: 0;
-      padding: 24px 0;
+      padding: 8px 0 24px;
       padding-left: 40px;
+      flex: 1 0 auto;
+      display: flex;
+      align-items: center;
     }
   }
 
@@ -354,7 +465,7 @@
       font-weight: 700;
       transition: color $transition-time;
 
-      &:hover{
+      &:hover {
         color: $main-light;
       }
     }
@@ -384,7 +495,7 @@
 .message-mob {
   display: block;
 
-  @media (min-width: $screen-lg) {
+  @media (min-width: $screen-md) {
     display: none;
   }
 }
@@ -392,8 +503,13 @@
 .message-desc {
   display: none;
 
-  @media (min-width: $screen-lg) {
+  @media (min-width: $screen-md) {
     display: block;
   }
+
+  .footer-form__textarea {}
 }
 
+.footer-form__label.message-desc {
+  height: 100%;
+}
\ No newline at end of file

src/blocks/page-header/page-header.pug

@@ -84,9 +84,13 @@ mixin page-header(mods)
               svg.page-header__search-btn(width='23' height='22' viewBox='0 0 23 22' fill='none' xmlns='http://www.w3.org/2000/svg')
                 path(d='M9.11 17.22C13.589 17.22 17.22 13.589 17.22 9.11C17.22 4.63097 13.589 1 9.11 1C4.63097 1 1 4.63097 1 9.11C1 13.589 4.63097 17.22 9.11 17.22Z' stroke='#00E68A' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round' fill='none')
                 path(d='M15.52 14.28L21.6 20.36' stroke='#00E68A' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round' fill='none')
-            .search-block 
+            .search-block.fix-block
               .search-block__inner.container
                 .search-block__content
+                  button.search-block__close.search-block-close.btn-reset    
+                    svg(width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg')
+                      path(d='M15.625 4.375L4.375 15.625' stroke='#014945' stroke-width='2' stroke-linecap='round' stroke-linejoin='round')
+                      path(d='M15.625 15.625L4.375 4.375' stroke='#014945' stroke-width='2' stroke-linecap='round' stroke-linejoin='round')
                   label.search-block__label Введите запрос
                   input.search-block__input(type="search" name="" placeholder="Поиск по сайту")
                   svg.search-block__btn(width='20' height='18' viewBox='0 0 20 18' fill='none' xmlns='http://www.w3.org/2000/svg')
@@ -95,7 +99,7 @@ mixin page-header(mods)
           .page-header__lang 
             a(href="javascript:void(0)").page-header__lang-btn ENG
             
-      #callback-popup(style="display:none;max-width:440spx;").popup.callback-popup
+      #callback-popup(style="display:none;max-width:440px;").popup.callback-popup
         .callback-popup__title.h4 Обратный звонок
         .callback-popup__text
           p.text Оставьте свои контакты, и мы перезвоним Вам в ближайшее время.

src/blocks/page-header/page-header.scss

@@ -21,10 +21,12 @@
 
     @media (min-width: $screen-xl) {
       padding: 32px 0 24px;
+      align-items: flex-start;
     }
 
-    @media (min-width: $screen-lg) {
-      padding: 24px 0 12px;
+    @media (min-width: $screen-md) {
+      padding: 24px 0 24px;
+      align-items: center;
     }
 
     @media (min-width: $screen-sm) {
@@ -38,11 +40,29 @@
     order: 1;
 
     @media (min-width: $screen-xxl) {
-      margin-right: 78px;
+      margin-right: 64px;
+      width: 24%;
+    }
+
+    @media (min-width: $screen-c) {
+      width: 23%;
     }
 
     @media (min-width: $screen-xl) {
-      width: 22%;
+      width: 250px;
+      margin-right: 0;
+      max-height: 39px;
+    }
+
+    @media (min-width: $screen-lg) {
+      margin-right: 50px;
+      max-height: 33px;
+    }
+
+    @media (min-width: $screen-md) {
+      margin-right: 50px;
+      max-height: 33px;
+      width: 210px;
     }
 
     @media (min-width: $screen-sm) {
@@ -58,15 +78,25 @@
 
     @media (min-width: $screen-xxl) {
       justify-content: flex-start;
+      width: 40%;
+      order: 2;
+    }
+
+    @media (min-width: $screen-c) {
+      width: 30%;
     }
 
     @media (min-width: $screen-xl) {
-      width: 40%;
+      width: 34%;
       order: 2;
     }
 
     @media (min-width: $screen-lg) {
-      width: 12%;
+      width: 15%;
+    }
+
+    @media (min-width: $screen-md) {
+      width: 17%;
     }
 
   }
@@ -77,12 +107,21 @@
     display: flex;
     justify-content: center;
 
+    @media (min-width: $screen-xxl) {
+      order: 3;
+      width: 32%;
+    }
+
+    @media (min-width: $screen-c) {
+      width: 21%;
+    }
+
     @media (min-width: $screen-xl) {
       order: 3;
-      width: 30%;
+      width: 26%;
     }
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-md) {
       justify-content: space-between;
     }
 
@@ -102,6 +141,7 @@
 
   &__phone {
     display: none;
+    text-decoration: none;
 
     color: $main-light;
     font: 14px $ff-i-b;
@@ -114,10 +154,15 @@
     }
 
     @media (min-width: $screen-lg) {
-      font-size: 17px;
+
       margin-bottom: 8px;
       display: block;
     }
+
+    @media (min-width: $screen-md) {
+      display: block;
+      font-size: 17px;
+    }
   }
 
   &__magnify {
@@ -125,7 +170,7 @@
     position: relative;
   }
 
-  &__search-btn path{
+  &__search-btn path {
     transition: all $transition-time;
   }
 
@@ -144,8 +189,8 @@
       }
     }
 
-    &:hover{
-      .page-header__search-btn path{
+    &:hover {
+      .page-header__search-btn path {
         stroke: $white;
       }
     }
@@ -179,20 +224,27 @@
       justify-content: flex-end;
 
       @media (min-width: $screen-xxl) {
-        padding-top: 80px;
-        padding-right: 86px;
+        padding-top: 66px;
+        padding-right: 96px;
       }
 
       @media (min-width: $screen-xl) {
         padding-top: 52px;
-        padding-right: 36px;
+        padding-right: 84px;
       }
 
       @media (min-width: $screen-lg) {
         padding-right: 214px;
       }
-      @media (min-width: $screen-md) {
-      }
+
+      @media (min-width: $screen-md) {}
+    }
+
+    &__close{
+      position: absolute;
+      right: 24px;
+      width: 20px;
+      height: 20px;
     }
 
     &__content {
@@ -297,9 +349,8 @@
       font-size: 15px;
     }
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-md) {
       display: block;
-      ;
     }
   }
 
@@ -322,6 +373,12 @@
 
     @media (min-width: $screen-xxl) {
       width: auto;
+      display: block;
+    }
+
+    @media (min-width: $screen-c) {
+      display: flex;
+      justify-content: center;
     }
 
     @media (min-width: $screen-xl) {
@@ -360,7 +417,7 @@
         height: 100%;
         z-index: 99;
         background: linear-gradient(0deg, #00BFFF 0%, #00E68A 100%);
-        padding: 24px 32px;
+        padding: 24px 16px;
         transition: right $transition-time;
       }
 
@@ -377,7 +434,7 @@
       left: -24%;
       width: 24%;
       height: 100%;
-      background: rgba(1,73,69,.48);
+      background: rgba(1, 73, 69, .48);
       transition: all $transition-time;
 
 
@@ -452,6 +509,9 @@
         pointer-events: none;
         transition: all $transition-time;
 
+        @media (min-width: $screen-xxl) {
+          top: 10px;
+        }
         @media (min-width: $screen-xl) {
           display: block;
           top: 8px;
@@ -522,7 +582,7 @@
       }
 
       & .menu__sublist {
-        padding-top: 24px;
+        padding-top: 16px;
         max-height: 500px;
         opacity: 1;
       }
@@ -593,7 +653,7 @@
 
   &__subitem {
     position: relative;
-    padding: 8px 24px;
+    padding: 8px 16px;
 
     cursor: pointer;
     transition: all $transition-time;
@@ -607,8 +667,8 @@
     @media (min-width: $screen-xl) {
       background-color: $white;
 
-      &:not(:last-child){
-              border-bottom: 1px solid #E3E3E3;
+      &:not(:last-child) {
+        border-bottom: 1px solid #E3E3E3;
       }
     }
 
@@ -635,10 +695,17 @@
 
   }
 
-  
+
   &__sublink {
     color: $main-dark;
     text-decoration: none;
+
+    @media (min-width: $screen-xxl) {
+      font-size: 18px !important;
+    }
+    @media (min-width: $screen-xl) {
+      font-size: 15px !important;
+    }
   }
 
   &__burger {
@@ -662,7 +729,7 @@
       width: 30px;
     }
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-md) {
       margin-right: 16px;
     }
 
@@ -705,9 +772,12 @@
     white-space: nowrap;
 
     @media (min-width: $screen-lg) {
-      font-size: 15px;
       font-weight: 700;
     }
+
+    @media (min-width: $screen-md) {
+      font-size: 15px;
+    }
   }
 
   &__top {

src/blocks/page/page.scss

@@ -123,7 +123,7 @@ body {
       left: 0px;
       width: 100%;
       height: 100%;
-      background: rgba(1,73,69,.48);
+      background: rgba(1, 73, 69, .48);
       z-index: 10;
       transition: all $transition-time;
     }
@@ -374,21 +374,23 @@ pre {
 
   @media (min-width: $screen-xxl) {
     --container-width: calc(1460px - var(--container-horizontal-padding) * 2);
+    --container-horizontal-padding: 15px;
+  }
+
+  @media (min-width: $screen-c) {
+    --container-horizontal-padding: 60px;
   }
 
   @media (min-width: $screen-xl) {
-    --container-horizontal-padding: 15px;
-    --container-width: calc(1020px - var(--container-horizontal-padding) * 2);
+    --container-horizontal-padding: 40px;
   }
 
   @media (min-width: $screen-lg) {
-    --container-horizontal-padding: 15px;
-    --container-width: calc(828px - var(--container-horizontal-padding) * 2);
+    --container-horizontal-padding: 40px;
   }
 
   @media (min-width: $screen-md) {
-    --container-horizontal-padding: 15px;
-    --container-width: calc(600px - var(--container-horizontal-padding) * 2);
+    --container-horizontal-padding: 16px;
   }
 }
 
@@ -419,12 +421,20 @@ pre {
 
 .partners-slider__title {
   background: linear-gradient(270deg, #00bfff -.23%, #00e68a 99.77%);
-  -webkit-background-clip: text;
+  background-clip: text;
   -webkit-text-fill-color: transparent;
   margin-bottom: 32px;
 
-  @media (min-width: $screen-lg) {
-    margin-bottom: 56px;
+  @media (min-width: $screen-xxl) {
+    margin-bottom: 92px;
+  }
+
+  @media (min-width: $screen-c) {
+    margin-bottom: 80px;
+  }
+
+  @media (min-width: $screen-md) {
+    margin-bottom: 80px;
   }
 }
 
@@ -436,6 +446,7 @@ pre {
   background-color: $white;
   border: 1px solid #e3e3e3;
   border-radius: 4px;
+  height: 100%;
 }
 
 .choices__item {
@@ -452,6 +463,13 @@ pre {
   }
 }
 
+.choices[data-type*=select-one] {
+  height: 100%;
+}
+
+.choices[data-type*=select-one] .choices__inner {
+  padding-top: 9.5px;
+}
 
 .is-focused .choices__inner,
 .is-open .choices__inner {
@@ -532,7 +550,7 @@ pre {
   }
 }
 
-.mb-64 {
+.mt-64 {
   margin-top: 48px;
 
   @media (min-width: $screen-lg) {
@@ -540,6 +558,18 @@ pre {
   }
 }
 
+.mb-section-80 {
+  margin-bottom: 40px;
+
+  @media (min-width: $screen-xxl) {
+    margin-bottom: 80px;
+  }
+
+  @media (min-width: $screen-md) {
+    margin-bottom: 72px;
+  }
+}
+
 //fancybox
 
 .popup>.carousel__button.is-close {
@@ -550,11 +580,13 @@ pre {
   color: #336D69;
   padding: 0;
 }
-.carousel__button svg{
-width: 18px;
-height: 18px;
+
+.carousel__button svg {
+  width: 18px;
+  height: 18px;
   filter: none;
 }
+
 .fancybox__content :focus:not(.carousel__button.is-close) {
   outline: none;
 }
@@ -611,6 +643,7 @@ height: 18px;
     background-color: $main-light;
   }
 }
+
 .custom-checkbox--white {
 
   font: 12px/1.3 $ff-i-r;
@@ -651,4 +684,8 @@ height: 18px;
   }
 }
 
-
+.disable-scroll {
+  position: relative;
+  overflow: hidden;
+  height: 100vh;
+}
\ No newline at end of file

src/blocks/partners/partners.scss

@@ -8,9 +8,13 @@
   $block-name: &; // #{$block-name}__element
   margin-bottom: 86px;
 
-  @media (min-width: $screen-lg) {
-    margin-bottom: 120px;
+  @media (min-width: $screen-xxl) {
+    margin-bottom: 152px;
   }
+  @media (min-width: $screen-c) {
+    margin-bottom: 80px;
+  }
+
 
   &__title {
     background: linear-gradient(270deg, #00BFFF -0.23%, #00E68A 99.77%);

src/blocks/plus/plus.scss

@@ -13,17 +13,23 @@
   margin-top: 80px;
   z-index: -1;
 
-  @media (min-width: $screen-xl) {
-    padding-bottom: 120px;
-  }
-
-  @media (min-width: $screen-lg) {
-    margin-top: 204px;
+  @media (min-width: $screen-xxl) {
     padding-bottom: 108px;
+    margin-top: 206px;
+  }
+  @media (min-width: $screen-c) {
+    padding-bottom: 100px;
+    margin-bottom: 0;
+  }
+  @media (min-width: $screen-xl) {
+    padding-bottom: 18px;
+    margin-top: 194px;
   }
 
   @media (min-width: $screen-md) {
-    margin-top: 100px;
+    margin-top: 166px;
+    padding-bottom: 70px;
+    margin-bottom: 80px;
   }
 
   @media (min-width: $screen-sm) {
@@ -37,6 +43,13 @@
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
+
+    @media (min-width: $screen-xxl) {
+      margin-bottom: 56px;
+    }
+    @media (min-width: $screen-md) {
+      margin-bottom: 46px;
+    }
   }
 
   &__grid {
@@ -46,7 +59,7 @@
     grid-template-columns: repeat(1, 1fr);
     gap: 40px;
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-md) {
       grid-template-columns: repeat(4, 1fr);
     }
 
@@ -72,6 +85,9 @@
       margin-bottom: 32px;
     }
 
+    @media (min-width: $screen-md) {
+      margin-bottom: 24px;
+    }
     @media (min-width: $screen-sm) {
       margin-bottom: 8px;
     }

src/blocks/project-search/project-search.scss

@@ -56,6 +56,7 @@ padding-top: 48px;
   &__search {
     @media (min-width: $screen-lg) {
       width: 120px;
+      padding-left: 6px;
     }
   }
 

src/blocks/project-tasks/project-tasks.scss

@@ -8,9 +8,10 @@
 
   margin: 48px 0;
 
-  @media (min-width: $screen-lg){
+  @media (min-width: $screen-lg) {
     margin: 80px 0 64px;
   }
+
   &__list {
 
     padding: 0;
@@ -38,14 +39,10 @@
     }
 
     &:hover {
-      .project-tasks__body {
-        background: linear-gradient(0deg, rgba(64, 119, 115, 0.85), rgba(64, 119, 115, 0.85)), url("../img/fill-img.jpg");
-        background-repeat: no-repeat;
-        background-color: $main-dark;
-        background-position: right center;
-        background-size: cover;
+      .project-tasks__body::after {
+        opacity: 1;
       }
-    
+
 
       .project-tasks__title {
         color: $white;
@@ -54,6 +51,7 @@
   }
 
   &__body {
+    position: relative;
     text-decoration: none;
     box-shadow: 0px 8px 32px rgba(0, 0, 0, 0.05);
     border-radius: 16px;
@@ -69,9 +67,28 @@
     background-size: cover;
     transition: all $transition-time;
 
+    &::after {
+      position: absolute;
+      content: '';
+      top: 0;
+      left: 0;
+      border-radius: 16px;
+      width: 100%;
+      height: 100%;
+      cursor: pointer;
+      opacity: 0;
+      background: linear-gradient(0deg, rgba(64, 119, 115, 0.85), rgba(64, 119, 115, 0.85)), url("../img/fill-img.jpg");
+      background-repeat: no-repeat;
+      background-color: $main-dark;
+      background-position: right center;
+      background-size: cover;
+      transition: all .5s;
+    }
+
     @media (min-width: $screen-xxl) {
       padding: 48px;
     }
+
     @media (min-width: $screen-lg) {
       padding: 36px;
       flex: 0 0 25%;
@@ -83,8 +100,10 @@
   &__title {
     color: $black;
     font: 14px/1.5 $ff-i-sb;
+    z-index: 2;
     transition: color $transition-time;
 
+
     @media (min-width: $screen-xl) {
       font-size: 18px;
 

src/blocks/solutions-grid/solutions-grid.scss

@@ -4,41 +4,44 @@
 
 .solutions-grid {
 
-  $block-name:                &; // #{$block-name}__element
+  $block-name: &; // #{$block-name}__element
 
 
+  margin: 0;
+  list-style: none;
+  padding: 0;
+  display: grid;
+  grid-template-columns: repeat(12, 1fr);
+  gap: 16px;
+  z-index: 7;
+  filter: drop-shadow(0px 8px 32px rgba(0, 0, 0, 0.24));
+  transform: translateY(20px);
+
+
+  @media (min-width: $screen-c) {
     margin: 0;
-    list-style: none;
-    padding: 0;
-    display: grid;
-    grid-template-columns: repeat(12, 1fr);
-    gap: 16px;
-    z-index: 7;
-    filter: drop-shadow(0px 8px 32px rgba(0, 0, 0, 0.24));
-    transform: translateY(20px);
+    gap: 40px;
+  }
 
-    @media (min-width: $screen-xxl) {
-      margin: 0;
-      gap: 40px;
-    }
+  @media (min-width: $screen-xl) {
+    margin: 0 20%;
+  }
 
-    @media (min-width: $screen-xl) {
-      margin: 0 14%;
-      row-gap: 32px;
-      column-gap: 40px;
-    }
+  @media (min-width: $screen-lg) {
+    margin: 0 13%;
+  }
 
-    @media (min-width: $screen-lg) {
-      margin: 0 6%;
-      row-gap: 32px;
-      column-gap: 40px;
-    }
+  @media (min-width: $screen-md) {
+    margin: 0 4%;
+    row-gap: 32px;
+    column-gap: 40px;
+  }
 
   &__item {
     grid-column: 12 span;
     background-color: $black;
     border-radius: 16px;
-
+    position: relative;
     background-repeat: no-repeat;
     background-color: $black;
     background-position: center center;
@@ -50,16 +53,22 @@
 
     @media (min-width: $screen-xxl) {
       grid-column: 3 span;
+      height: 320px;
+      aspect-ratio: 1/1;
+    }
+
+    @media (min-width: $screen-c) {
+      grid-column: 3 span;
+      height: 200px;
     }
 
     @media (min-width: $screen-xl) {
       grid-column: 6 span;
       width: 320px;
-      aspect-ratio: 1/1;
-      height: 320px;
+
     }
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-md) {
       grid-column: 6 span;
       width: 320px;
       height: 200px;
@@ -70,13 +79,35 @@
     }
 
 
+
     &:nth-child(1) {
       background-image: url("../img/a1.jpg");
+      position: relative;
+
+      // &::before {
+      //   content: '';
+      //   position: absolute;
+      //   width: 100%;
+      //   height: 100%;
+      //   background: rgba(0, 0, 0, 0.48);
+      //   opacity: 0;
+      //   top: 0;
+      //   left: 0;
+      //   z-index: 1;
+      //   pointer-events: none;
+      // }
 
       &:hover {
+
+        // &::before {
+        //   opacity: 1;
+        // }
+
         background-image: url("../img/a2.jpg");
+
       }
     }
+
     &:nth-child(2) {
       background-image: url("../img/b1.jpg");
 
@@ -84,6 +115,7 @@
         background-image: url("../img/b2.jpg");
       }
     }
+
     &:nth-child(3) {
       background-image: url("../img/c1.jpg");
 
@@ -91,6 +123,7 @@
         background-image: url("../img/c2.jpg");
       }
     }
+
     &:nth-child(4) {
       background-image: url("../img/d1.jpg");
 
@@ -98,6 +131,7 @@
         background-image: url("../img/d2.jpg");
       }
     }
+
     &:nth-child(5) {
       background-image: url("../img/e1.jpg");
 
@@ -105,6 +139,7 @@
         background-image: url("../img/e2.jpg");
       }
     }
+
     &:nth-child(6) {
       background-image: url("../img/f1.jpg");
 
@@ -112,6 +147,7 @@
         background-image: url("../img/f2.jpg");
       }
     }
+
     &:nth-child(7) {
       background-image: url("../img/g1.jpg");
 
@@ -119,6 +155,7 @@
         background-image: url("../img/g2.jpg");
       }
     }
+
     &:nth-child(8) {
       background-image: url("../img/h1.jpg");
 
@@ -136,17 +173,22 @@
     width: 100%;
     height: 100%;
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-c) {
       padding: 32px;
     }
 
     @media (min-width: $screen-md) {
-      padding: 16px;
+      padding: 24px;
     }
   }
 
   &__subtitle {
     margin: 0;
     color: $white;
+    z-index: 2;
+
+    @media (min-width: $screen-md) {
+      font-size: 20px;
+    }
   }
-}
+}
\ No newline at end of file

src/blocks/solutions/solutions.pug

@@ -22,10 +22,10 @@ mixin solutions(text, mods)
     .solutions__inner.container
       .solutions__content
         .solutions__top 
-          .solutions__top-title.h3 Advanced Digital Solutions
+          .solutions__top-title Advanced Digital Solutions
           .solutions__top-descr 
             p.solutions__top-text.text Команда профессионалов высокой квалификации проводит обследование, консалтинг, выбор оптимальных параметров проектного решения, реализацию, внедрение, сопровождение и поддержку.
             p.solutions__top-text.text Мы предлагаем набор планов и возможностей, инноваций и связанных с ними технологических решений, которые помогают компаниям и промышленным предприятиям перейти на новые уровни автоматизации и цифровизации.
-            p.solutions__top-text.text Наши Заказчики — основные предприятия реального сектора экономики: энергетики, нефтегазодобычи, промышленного производства. Наши продукты помогают им контролировать критическую инфраструктуру, обеспечивают аналитику для принятия управленческих решений, оптимизируют сложные технологические процессы.
+            p.solutions__top-text.text Наши Заказчики&nbsp;&mdash; основные предприятия реального сектора экономики: энергетики, нефтегазодобычи, промышленного производства. Наши продукты помогают им&nbsp;контролировать критическую инфраструктуру, обеспечивают аналитику для принятия управленческих решений,<br> оптимизируют сложные технологические процессы.
         h2.solutions__title.h2 Решения
         +solutions-grid()
\ No newline at end of file

src/blocks/solutions/solutions.scss

@@ -12,10 +12,6 @@
     margin-top: 0px;
   }
 
-  @media (min-width: $screen-lg) {
-    margin-top: 22px;
-  }
-
   @media (min-width: $screen-md) {
     margin-top: 24px;
   }
@@ -26,22 +22,29 @@
 
   &__content {
     transform: translateY(6px);
+    padding-bottom: 20px;
 
 
     @media (min-width: $screen-xxl) {
       transform: translateY(80px);
     }
 
-    @media (min-width: $screen-lg) {
-      transform: translateY(60px);
+    @media (min-width: $screen-c) {
+      transform: translateY(73px);
+    }
+
+    @media (min-width: $screen-xl) {
+      transform: translateY(73px);
+      padding-bottom: 0;
     }
 
     @media (min-width: $screen-md) {
-      transform: translateY(24px);
+      transform: translateY(48px);
     }
 
     @media (min-width: $screen-sm) {
       transform: translateY(18px);
+      padding-bottom: 50px;
     }
   }
 
@@ -49,22 +52,42 @@
     @media (min-width: $screen-xxl) {
       margin-bottom: 72px;
     }
+    @media (min-width: $screen-c) {
+      margin-bottom: 66px;
+    }
+    @media (min-width: $screen-md) {
+      margin-bottom: 66px;
+    }
   }
 
   &__top-title {
+    font: 25px/1.2 $ff-i-b;
+    font-weight: 700;
+    letter-spacing: 0.02em;
     margin-bottom: 16px;
 
+    @media (min-width: $screen-xxl) {
+      margin-bottom: 32px;
+      font-size: 36px;
+    }
+
+    @media (min-width: $screen-c) {
+      margin-bottom: 24px;
+      font-size: 26px;
+    }
+
     @media (min-width: $screen-lg) {
       margin-bottom: 24px;
     }
 
     @media (min-width: $screen-md) {
-      margin-bottom: 20px;
+      margin-bottom: 24px;
     }
 
     @media (min-width: $screen-sm) {
       margin-bottom: 20px;
     }
+
   }
 
   &__top-descr {
@@ -81,6 +104,9 @@
     @media (min-width: $screen-lg) {
       margin-bottom: 24px;
     }
+    @media (min-width: $screen-md) {
+      margin-bottom: 26px;
+    }
 
     @media (min-width: $screen-sm) {
       margin-bottom: 18px;
@@ -91,8 +117,14 @@
     color: $white;
     margin: 0;
 
-    @media (min-width: $screen-lg) {
-      margin-bottom: 12px;
+    @media (min-width: $screen-xxl) {
+      margin-bottom: 32px;
+    }
+    @media (min-width: $screen-c) {
+      margin-bottom: 20px;
+    }
+    @media (min-width: $screen-md) {
+      margin-bottom: 16px;
     }
   }
 

src/blocks/task/task.scss

@@ -7,6 +7,7 @@
   $block-name: &;
 
   margin-bottom: 40px;
+
   @media (min-width: $screen-lg) {
     margin-bottom: 64px;
   }
@@ -24,19 +25,21 @@
     list-style: none;
     padding-left: 20px;
     margin-bottom: 40px;
+
     @media (min-width: $screen-lg) {
       padding-left: 26px;
-      margin-bottom: 80px;
+      margin-bottom: 64px;
     }
   }
 
+
   &__item {
     position: relative;
     margin-bottom: 8px;
     font-size: 18px;
     color: $black;
 
-    p{
+    p {
       margin: 0;
     }
 
@@ -48,6 +51,7 @@
       width: 10px;
       height: 10px;
       background-color: $color-accent;
+
       @media (min-width: $screen-lg) {
         left: -26px;
       }
@@ -57,4 +61,44 @@
       margin-bottom: 26px;
     }
   }
+}
+
+.task--links .task__item::before {
+  background-color: #fff;
+}
+
+.task--links {
+  margin-top: 64px;
+
+
+  .hyperlink__link {
+    color: $black;
+    width: fit-content;
+    transition: color $transition-time;
+
+    &:hover {
+      color: $white;
+
+      .hyperlink__svg svg path {
+        stroke: #fff;
+      }
+    }
+  }
+
+  .hyperlink__svg {
+    padding-left: 8px;
+    display: inline-block;
+  }
+
+  .hyperlink__svg svg path {
+    transition: all $transition-time;
+  }
+}
+
+.task__list.task__list--inner {
+  margin-bottom: 24px;
+
+  @media (min-width: $screen-lg) {
+    margin-bottom: 24px;
+  }
 }
\ No newline at end of file

src/blocks/top-slider/top-slider.pug

@@ -28,17 +28,17 @@ mixin top-slider(text, mods)
                 .top-slider__descr
                   p Разработка комплексных программных продуктов на заказ, реализация решений в области цифровизации производства и снижения импортозависимости.
       .swiper-slide.top-slider__slide 
-        .top-slider__img(style="background-image: url(img/slider2.jpg);")
+        .top-slider__img(style="background-image: url(img/bgrd_solutions-mon.jpg);")
           .top-slider__inner.container
             .top-slider__body
-                h2.top-slider__title Advanced Digital Solutions
+                h2.top-slider__title Комплексные программные продукты
                 .top-slider__descr
-                  p Разработка комплексных программных продуктов на заказ, реализация решений в области цифровизации производства и снижения импортозависимости.
+                  p Мы предлагаем набор планов и возможностей, инноваций,  которые помогают компаниям которые помогают компаниям и промышленным предприятиям перейти на новые уровни автоматизации и цифровизации.
       .swiper-slide.top-slider__slide 
-        .top-slider__img(style="background-image: url(img/slider1.jpg);")
+        .top-slider__img(style="background-image: url(img/bgrd_ind-cif.jpg);")
           .top-slider__inner.container
             .top-slider__body
-                h2.top-slider__title Advanced Digital Solutions
+                h2.top-slider__title Технологические решения для предприятий
                 .top-slider__descr
                   p Разработка комплексных программных продуктов на заказ, реализация решений в области цифровизации производства и снижения импортозависимости.
     .top-slider__wrapper.container

src/blocks/top-slider/top-slider.scss

@@ -9,33 +9,50 @@
 
   position: relative;
 
+  &__inner {
+
+    height: 100%;
+  }
+
 
   &__body {
-    max-width: 540px;
-    padding: 10% 0 19%;
+    max-width: calc(100% - 32px);
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    height: calc(100% - 30px);
 
     @media (min-width: $screen-xxl) {
       max-width: 960px;
-      padding: 154px 136px 272px;
+      padding-left: 136px;
+    }
+
+
+    @media (min-width: $screen-c) {
+      max-width: 1092px;
+      padding-left: 80px;
+      height: calc(100% - 120px);
     }
 
     @media (min-width: $screen-xl) {
-      max-width: 670px;
-      padding: 6% 0 17% 10%;
+      max-width: 773px;
+      padding-left: 100px;
+      height: calc(100% - 112px);
     }
 
     @media (min-width: $screen-lg) {
-      padding: 8% 0 17% 10%;
-      max-width: 540px;
+      max-width: 635px;
+      padding-left: 80px;
+      height: calc(100% - 76px);
     }
 
     @media (min-width: $screen-md) {
-      padding: 5% 0 11% 0%;
-      max-width: 547px;
+      max-width: 473px;
+      padding-left: 66px;
+      height: calc(100% - 76px);
     }
 
     @media (min-width: $screen-sm) {
-      padding: 5% 0 10%;
       max-width: 547px;
     }
   }
@@ -45,6 +62,24 @@
     background-color: $main-light;
     background-position: center center;
     background-size: cover;
+    height: 344px;
+
+
+    @media (min-width: $screen-xxl) {
+      height: 780px;
+    }
+
+    @media (min-width: $screen-c) {
+      height: 488px;
+    }
+
+    @media (min-width: $screen-lg) {
+      height: 488px;
+    }
+
+    @media (min-width: $screen-md) {
+      height: 377px;
+    }
 
   }
 
@@ -53,19 +88,29 @@
     font-weight: 600;
     color: $white;
     margin: 0 0 14px;
+    -webkit-line-clamp: 3;
+    text-overflow: ellipsis;
+    display: flex;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    flex-direction: column;
+    overflow: hidden;
 
     @media (min-width: $screen-xxl) {
       font-size: 80px;
     }
 
-    @media (min-width: $screen-lg) {
-      font-size: 56px;
-      margin: 0 0 24px;
+    @media (min-width: $screen-c) {
+      margin: 0 0 16px;
     }
 
+    @media (min-width: $screen-lg) {}
+
     @media (min-width: $screen-md) {
-      margin: 0 0 30px;
+      margin: 0 0 16px;
+      font-size: 40px;
     }
+
     @media (min-width: $screen-sm) {
       margin: 0 0 24px;
     }
@@ -73,14 +118,25 @@
   }
 
   &__descr {
-    font: 18px/1.5 $ff-i-sb;
+    font: 16px/1.5 $ff-i-sb;
     font-weight: 600;
     color: $black;
     margin: 0;
+    letter-spacing: .02em;
 
     @media (min-width: $screen-xxl) {
       font-size: 24px;
     }
+
+    p{
+      -webkit-line-clamp: 3;
+      text-overflow: ellipsis;
+      display: flex;
+      display: -webkit-box;
+      -webkit-box-orient: vertical;
+      flex-direction: column;
+      overflow: hidden;
+    }
   }
 
   &__nav {
@@ -94,8 +150,12 @@
     z-index: 5;
     padding: 0;
 
-    @media (min-width: $screen-lg) {
+    @media (min-width: $screen-xl) {
       bottom: 100px;
+    }
+
+    @media (min-width: $screen-md) {
+      bottom: 60px;
       width: 40px;
     }
 
@@ -107,8 +167,9 @@
       opacity: .5;
       transition: all $transition-time;
     }
-    &:hover{
-      svg path{
+
+    &:hover {
+      svg path {
         opacity: 1;
       }
     }
@@ -122,9 +183,12 @@
     right: 0%;
     padding: 0;
 
-    @media (min-width: $screen-lg) {
-      right: 0;
+    @media (min-width: $screen-xl) {
       bottom: 100px;
+    }
+
+    @media (min-width: $screen-md) {
+      bottom: 60px;
       width: 40px;
     }
 
@@ -136,8 +200,9 @@
       opacity: .5;
       transition: all $transition-time;
     }
-    &:hover{
-      svg path{
+
+    &:hover {
+      svg path {
         opacity: 1;
       }
     }
@@ -149,26 +214,36 @@
 
   &__pagination {
     display: flex;
-    justify-content: center;
-    bottom: 20px !important;
+    left: 37% !important;
+    bottom: 30px !important;
     width: var(--container-width) !important;
-    max-width: 960px;
+    max-width: 200px;
 
     @media (min-width: $screen-xxl) {
       bottom: 118px !important;
       left: 10% !important;
     }
 
+    @media (min-width: $screen-c) {
+      bottom: 112px !important;
+      left: 10% !important;
+      justify-content: flex-start;
+    }
+
     @media (min-width: $screen-xl) {
-      bottom: 100px !important;
-      left: 14% !important;
+      bottom: 112px !important;
       justify-content: flex-start;
     }
 
     @media (min-width: $screen-lg) {
-      bottom: 100px !important;
-      left: 17% !important;
+      left: 12% !important;
+    }
+
+    @media (min-width: $screen-md) {
+      bottom: 76px !important;
+      left: 11% !important;
       justify-content: flex-start;
+      max-width: 500px;
     }
 
     @media (min-width: $screen-sm) {
@@ -190,7 +265,7 @@
     opacity: 1;
     transition: all $transition-time;
 
-    &:hover{
+    &:hover {
       background-color: $white;
     }
   }

src/img/arrow-down-lightgreen.svg

+<svg width="24" height="29" viewBox="0 0 24 29" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2.71672 14.1858C2.1311 14.7718 1.18135 14.772 0.595402 14.1864C0.00944948 13.6008 0.0091809 12.6511 0.594802 12.0651L2.71672 14.1858ZM12 2.77539L10.939 1.71503L12 0.65347L13.0609 1.71503L12 2.77539ZM23.4052 12.0651C23.9908 12.6511 23.9905 13.6008 23.4046 14.1864C22.8186 14.772 21.8689 14.7718 21.2832 14.1858L23.4052 12.0651ZM0.594802 12.0651L10.939 1.71503L13.0609 3.83575L2.71672 14.1858L0.594802 12.0651ZM13.0609 1.71503L23.4052 12.0651L21.2832 14.1858L10.939 3.83575L13.0609 1.71503Z" fill="#00E68A"/>
+<path d="M10.4995 3.0271C10.4995 2.19867 11.1711 1.5271 11.9995 1.5271C12.8279 1.5271 13.4995 2.19867 13.4995 3.0271H10.4995ZM13.4995 26.7755C13.4995 27.6039 12.8279 28.2755 11.9995 28.2755C11.1711 28.2755 10.4995 27.6039 10.4995 26.7755H13.4995ZM13.4995 3.0271L13.4995 26.7755H10.4995L10.4995 3.0271H13.4995Z" fill="#00E68A"/>
+</svg>

src/img/arrow-down-white.svg

-<svg width="24" height="29" viewBox="0 0 24 29" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M2.71721 14.4104C2.13159 14.9964 1.18184 14.9967 0.59589 14.411C0.00993776 13.8254 0.00966918 12.8757 0.59529 12.2897L2.71721 14.4104ZM12.0005 3L10.9395 1.93964L12.0005 0.87808L13.0614 1.93964L12.0005 3ZM23.4057 12.2897C23.9913 12.8757 23.991 13.8254 23.4051 14.411C22.8191 14.9967 21.8694 14.9964 21.2837 14.4104L23.4057 12.2897ZM0.59529 12.2897L10.9395 1.93964L13.0614 4.06036L2.71721 14.4104L0.59529 12.2897ZM13.0614 1.93964L23.4057 12.2897L21.2837 14.4104L10.9395 4.06036L13.0614 1.93964Z" fill="white"/>
-<path d="M10.5 3.25195C10.5 2.42353 11.1716 1.75195 12 1.75195C12.8284 1.75195 13.5 2.42353 13.5 3.25195H10.5ZM13.5 27.0004C13.5 27.8288 12.8284 28.5004 12 28.5004C11.1716 28.5004 10.5 27.8288 10.5 27.0004H13.5ZM13.5 3.25195L13.5 27.0004H10.5L10.5 3.25195H13.5Z" fill="white"/>
+<svg width="23" height="24" viewBox="0 0 23 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2.71672 14.1858C2.1311 14.7718 1.18135 14.772 0.595402 14.1864C0.00944948 13.6008 0.0091809 12.6511 0.594802 12.0651L2.71672 14.1858ZM12 2.77539L10.939 1.71503L12 0.65347L13.0609 1.71503L12 2.77539ZM23.4052 12.0651C23.9908 12.6511 23.9905 13.6008 23.4046 14.1864C22.8186 14.772 21.8689 14.7718 21.2832 14.1858L23.4052 12.0651ZM0.594802 12.0651L10.939 1.71503L13.0609 3.83575L2.71672 14.1858L0.594802 12.0651ZM13.0609 1.71503L23.4052 12.0651L21.2832 14.1858L10.939 3.83575L13.0609 1.71503Z" fill="#FFFFFF"/>
+<path d="M10.4995 3.0271C10.4995 2.19867 11.1711 1.5271 11.9995 1.5271C12.8279 1.5271 13.4995 2.19867 13.4995 3.0271H10.4995ZM13.4995 26.7755C13.4995 27.6039 12.8279 28.2755 11.9995 28.2755C11.1711 28.2755 10.4995 27.6039 10.4995 26.7755H13.4995ZM13.4995 3.0271L13.4995 26.7755H10.4995L10.4995 3.0271H13.4995Z" fill="#FFFFFF"/>
 </svg>

src/js/script.js

@@ -46,12 +46,20 @@ window.addEventListener("load", () => {
       speed: 1500,
       pagination: {
         el: '.top-slider__pagination',
-      clickable: true,
+        clickable: true,
       },
       navigation: {
         nextEl: '.top-slider__next',
         prevEl: '.top-slider__prev',
       },
+      breakpoints: {
+        320: {
+          speed: 1000,
+        },
+        1710: {
+          speed: 1250,
+        },
+      }
     });
   }
 
@@ -79,7 +87,7 @@ window.addEventListener("load", () => {
           slidesPerView: 2,
           spaceBetween: 0
         },
-        992: {
+        768: {
           slidesPerView: 3,
           spaceBetween: 0
         },
@@ -168,86 +176,147 @@ window.addEventListener("load", () => {
 
   if (gradientAccordeon) {
 
-    function GradientAccordeon() {
-      const accordeonContents = document.querySelectorAll('.accordeon__content');
-      const accordeonBtns = document.querySelectorAll('.accordeon__btn');
+    // function GradientAccordeon() {
+    const accordeonContents = document.querySelectorAll('.accordeon__content');
+    const accordeonBtns = document.querySelectorAll('.accordeon__btn');
 
-      accordeonBtns.forEach((btn, index) => {
-        btn.addEventListener('click', () => {
-          accordeonBtns.forEach((btnItem, idx) => {
+    accordeonBtns.forEach((btn, index) => {
+      btn.addEventListener('click', () => {
+        accordeonBtns.forEach((btnItem, idx) => {
 
-            if (btnItem === btn) {
-              const accordeonelement = btn.closest('.accordeon__element');
-              const collapseBtn = accordeonelement.querySelector('.collapse__btn');
-              accordeonelement.classList.toggle('open');
+          if (btnItem === btn) {
+            const accordeonelement = btn.closest('.accordeon__element');
+            const collapseBtn = accordeonelement.querySelector('.collapse__btn');
+            accordeonelement.classList.toggle('open');
 
-              collapseBtn.addEventListener('click', () => {
-                accordeonelement.classList.remove('open');
-              })
-            }
-          })
+            collapseBtn.addEventListener('click', () => {
+              accordeonelement.classList.remove('open');
+            })
+          }
         })
       })
-    }
-    GradientAccordeon();
+    })
+    // }
+    // GradientAccordeon();
     // window.addEventListener('resize', GradientAccordeon);
   }
 
   /*-- Search --*/
 
   const searchBtn = document.querySelector('.search-btn');
+  const body = document.querySelector('body');
 
   if (searchBtn) {
-    searchBtn.addEventListener('click', () => {
-      const searchBlock = document.querySelector('.search-block');
-      searchBlock.classList.toggle('active');
-      searchBtn.classList.toggle('active');
-      document.body.classList.toggle('lock');
+
+    const timeout = 400;
+
+    const fixBlocks = document.querySelectorAll('.fix-block');
+
+    searchBtn.addEventListener('click', function (e) {
+      searchBlockOpen();
     })
 
-    const searchInput = document.querySelector('.search-block input')
+    function searchBlockOpen() {
+      const searchBlock = document.querySelector('.search-block');
+      searchBlock.classList.add('active');
+      // searchBtn.classList.add('active');
+      searchBodyLock();
 
-    searchInput.addEventListener('focus', function () {
-      const searchIcon = document.querySelector('.search-block__btn');
-      const searchPaths = document.querySelectorAll('.search-block__btn path');
+      searchBlock.addEventListener('click', function (e) {
+        console.log(e.target)
+        if (!e.target.closest('.search-block')) {
 
-      searchPaths.forEach(searchPath => {
-        searchPath.style.stroke = '#00E68A';
+          searchBlockClose(e.target.closest('.search-block'));
+        }
       })
-    })
+    }
+
+    function searchBlockClose(doUnlock = true) {
+      const searchBlock = document.querySelector('.search-block');
+      searchBlock.classList.remove('active');
+      searchBtn.classList.remove('active');
+      searchBodyUnlock();
+    }
+
+    const serchBlockItem = document.querySelectorAll('.search-block-close');
+
+    if (serchBlockItem.length > 0) {
+      for (let i = 0; i < serchBlockItem.length; i++) {
+        const el = serchBlockItem[i];
+        el.addEventListener('click', function (e) {
+          searchBlockClose(el.closest('.search-block'));
+          e.preventDefault();
+        })
+      }
+    }
+
+    function searchBodyLock() {
+      let paddingOffset = window.innerWidth - body.offsetWidth + "px";
+      body.style.paddingRight = paddingOffset;
+      fixBlocks.forEach((el) => {
+        el.style.paddingRight = paddingOffset;
+      })
+      body.classList.add('lock');
+    }
+
+    function searchBodyUnlock() {
+      body.style.paddingRight = 0;
+      fixBlocks.forEach((el) => {
+        el.style.paddingRight = 0;
+      })
+      body.classList.remove('lock');
+    }
+
+
+    // const searchInput = document.querySelector('.search-block input')
+
+    // searchInput.addEventListener('focus', function () {
+    //   const searchIcon = document.querySelector('.search-block__btn');
+    //   const searchPaths = document.querySelectorAll('.search-block__btn path');
+
+    //   searchPaths.forEach(searchPath => {
+    //     searchPath.style.stroke = '#00E68A';
+    //   })
+    // })
   }
-  /*-- Thanks popup --*/
 
-  // const body = document.querySelector('body');
-  // const popupBtn = document.querySelector('.popup-submit');
+  /*--Collapse--*/
+
+  const topElement = document.querySelector('.accordeon')
+
+  if (topElement) {
+    let topPosition = topElement.offsetTop;
 
-  // let unlock = true;
+    const collapseBtns = document.querySelectorAll('.collapse__btn');
+    collapseBtns.forEach((collapseBtn) => {
+      collapseBtn.addEventListener('click', (e) => {
+        scrollTo(topElement);
+      })
+    })
+
+    function scrollTo(element) {
+      window.scroll({
+        behavior: 'smooth',
+        left: 0,
+        top: topPosition
+      });
+    }
+  }
 
-  // const timeout = 400;
 
-  // popupBtn.addEventListener('click', function (e) {
-  //   const popupName = popupBtn.getAttribute('data-id').replace('#', '');
-  //   const currentPopup = document.getElementById(popupName);
-  //   popupOpen(currentPopup);
-  //   console.log(currentPopup);
-  // })
+  /*--Fancybox--*/
 
-  // function popupOpen(currentPopup) {
-  //   if (currentPopup && unlock) {
-  //     const popupActive = document.querySelector('.popup.open');
-  //     if (popupActive) {
-  //       popupClose(popupActive, false);
-  //     } else {
-  //       bodyLock();
+  // Fancybox.bind('[data-fancybox="trigger"]', {
+  //   closeButton: true,
+  //   // dragToClose: false,
+  //   // click: false,
+  
+  //   on : {
+  //     ready : (fancybox) => {
+  //       const previousPOpup = document.querySelector('[data-fancybox="trigger"]');
+  //       console.log(previousPOpup);
   //     }
-  //     currentPopup.classList.add('open');
-  //     body.style.overflow = 'hidden';
-  //     currentPopup.addEventListener('click', function (e) {
-  //       if (!e.target.closest('.popup')) {
-  //         popupClose(e.target.closest('.popup'));
-  //       }
-  //     })
   //   }
-  // }
+  // });
 
 });

src/pages/monitoring.pug

@@ -11,7 +11,7 @@ block meta
 
 block content
   +inner-wrapper()
-    +inner-wrapper-top(style="background-image: url(img/slider2.jpg);")
+    +inner-wrapper-top(style="background-image: url(img/bgrd_solutions-mon.jpg);")
       +breadcrumbs()
         +breadcrumbs-item('Главная', '/')
         +breadcrumbs-item('Решения', '/')

src/pages/project-descr.pug

@@ -29,16 +29,35 @@ block content
       p.text-block__text.text Для реализации проекта была приглашена компания ИНЛАЙН ГРУП, специалисты которой предложили собственные инновационные методические подходы и технические решения, с помощью которых удалось реализовать управление сетью терминальных устройств значительно проще и с меньшими затратами, чем это могло быть при выборе другого решения.
       p.text-block__text.text Принципиальной особенностью предложенного решения было использование методологии управления ИТ-активами (ITAM) для управления жизненным циклом терминальных устройств.
       p.text-block__text.text Первым шагом в этом направлении стало формирование единых требований банка для оптимизации процесса управления сетью терминального оборудования. Проектной командой ИНЛАЙН ГРУП совместно с командой заказчика были разработаны: описание процесса управления сетью терминальных устройств, техническое задание на настройку системы, требования к интеграциям, а также алгоритмы выполнения стандартных запросов на обслуживание.
-  section.text-block
+      p.text-block__text.text-bold Автоматизация процесса управления сетью терминальных устройств самообслуживания и POS-терминалов позволила:
+      ul.task__list.task__list--inner
+        li.task__item
+          p.text Постановка на учет; 
+        li.task__item
+          p.text Перемещения; 
+        li.task__item 
+          p.text Обновления и ремонты;
+        li.task__item
+          p.text Изменения атрибутов; 
+        li.task__item
+          p.text Постановка и снятие с сервисного обслуживания; изменение сервисной компании.
+        li.task__item
+          p.text Сократить время на интеграцию данных о новых устройствах.
+      p.text-block__text.text Еще одной особенностью реализованного проекта стало внедрение единого централизованного решения на базе уже существующей в банке ITSM-системы НРE Service Manager 9.30. HPE Service Manager — широко распространенный и хорошо зарекомендовавший себя на российском рынке продукт для автоматизации ITSM-процессов. Он обладает большой гибкостью настройки бизнес-логики и кастомизации, что позволяет быть уверенным в возможности построения самых разнообразных процессов с учетом требований заказчиков.
+      p.text-block__text.text Разработанные специалистами ИГ на базе HP SM решения позволили расширить функционал ITSM-продукта и реализовать универсальное управление активами, в том числе не относящимися к ИТ. Для конечных пользователей, не связанных с эксплуатацией IMAC-процессов, взаимодействие с системой реализовано в максимально привычной форме через портал самообслуживания. Использование в полной мере функционала multi-tennancy позволило достичь удовлетворяющей заказчика изолированности рабочих сред для различных подразделений.
+      p.text-block__text.text Помимо этого, внедренная система позволила учитывать выполнение работ на стороне внешних контрагентов, что дало возможность банку обеспечить взаимодействие и контроль над бизнес-процессами в режиме реального времени.
+      p.text-block__text.text В рамках проекта система НРE Service Manager была интегрирована с информационно-банковской системой, MS Active Directory и программным комплексом по управлению информационно-платежными терминалами и устройствами АТМ (Automatic Teller Machine). Кроме этого, была выполнена загрузка данных из систем по управлению POS-терминалами (Unipos, TMS).
+      
+  section.text-block.mb-section-80
     .text-block__inner.container
       h2.text-block__h2.h2-inner Результат
       p.text-block__text.text-bold Автоматизация процесса управления сетью терминальных устройств самообслуживания и POS-терминалов позволила:
-      ul.task__list
+      ul.task__list.task__list--inner
         li.task__item
           p.text Обеспечить руководство банка возможностью получать объективную статистическую информацию о работе и обслуживании устройств, работе поддерживающих подразделений, а также принимать эффективные управленческие решения на основе этих данных;
         li.task__item
           p.text Повысить темпы внедрения новых банковских продуктов за счет владения достоверной информацией о работе терминальных устройств и процедурах обслуживания;
-        li.task__item
+        li.task__item 
           p.text Организовать работу в системе с внешними контрагентами в рамках единого процесса;
         li.task__item
           p.text Улучшить контроль исполнения поставщиками и сервисными организациями своих обязательств;
@@ -51,7 +70,7 @@ block content
       p.text-block__text.text Большой опыт компании-исполнителя в применении методологий ITSM и ITAM для организации процессов управления информационными технологиями позволил решить широкий спектр бизнес-задач без серьезного увеличения бюджета заказчика. Это дало возможность не закупать еще одно специализированное и дорогостоящее решение, а быстро применить существующий функционал для реализации принципиально новых задач.
       p.text-block__text.text Результаты внедрения убедительно демонстрируют уникальные преимущества использования методик ITSM для управления активами в сферах деятельности, традиционно контролируемыми сложными и дорогими системами класса ERP.
       
-      ul.download.mb-64
+      ul.download.mt-64
         li.download__item 
           .download__body
             .download__pic 

src/scss/global.scss

@@ -155,9 +155,14 @@
     top: -31px;
     background-color: $main-light;
 
+    @media (min-width: 2100px) {
+      height: 170px;
+    }
+
     @media (min-width: $screen-xl) {
       top: 0;
     }
+
     @media (min-width: $screen-md) {
       top: -24px;
     }
@@ -171,11 +176,16 @@
   &:after {
     transform-origin: 100%;
     bottom: -32px;
-    background-color: $color-accent;
+    background-color: $white;
     z-index: -1;
 
+
+    @media (min-width: 2100px) {
+      bottom: -150px;
+      height: 150px;
+    }
     @media (min-width: $screen-sm) {
-      bottom: -80px;
+      bottom: -100px;
     }
   }
 }
@@ -209,9 +219,9 @@
     background: linear-gradient(270deg, #44D0FF -0.23%, #33FFAD 99.77%);
   }
 
-  &:focus {
-    outline: 2px solid #64D8FF;
-  }
+  // &:focus {
+  //   outline: 2px solid #64D8FF;
+  // }
 
   &:active {
     border: none;
@@ -232,7 +242,7 @@
 
 .h2 {
   margin: 0;
-  font: 28px/1.2 $ff-i-sb;
+  font: 26px/1.2 $ff-i-sb;
   font-weight: 600;
   letter-spacing: 0.02em;
 
@@ -240,8 +250,8 @@
     font-size: 72px;
   }
 
-  @media (min-width: $screen-lg) {
-    font-size: 60px;
+  @media (min-width: $screen-md) {
+    font-size: 42px;
   }
 }
 
@@ -294,11 +304,11 @@
   letter-spacing: 0.05em;
   margin: 0;
 
-  @media (min-width: $screen-xxl) {
+  @media (min-width: $screen-c) {
     font-size: 20px;
   }
 
-  @media (min-width: $screen-lg) {
+  @media (min-width: $screen-md) {
     font-size: 17px;
   }
 }
@@ -314,7 +324,7 @@
     font-size: 18px;
   }
 
-  @media (min-width: $screen-lg) {
+  @media (min-width: $screen-md) {
     font-size: 15px;
   }
 }
@@ -354,20 +364,16 @@
     font-size: 24px;
   }
 }
+
 .info {
   font: 12px/1.3 $ff-i-r;
   letter-spacing: 0.05em;
 
   @media (min-width: $screen-xxl) {
-    font-size:  14px;
+    font-size: 14px;
   }
 }
 
 .pt-16 {
   padding-top: 16px;
-}
-
+}
\ No newline at end of file
-
-
-
-

src/scss/variables.scss

@@ -99,6 +99,7 @@ $screen-sm: 576px;
 $screen-md: 768px;
 $screen-lg: 992px;
 $screen-xl: 1200px;
+$screen-c: 1480px;
 $screen-xxl: 1800px;
 
 $container-sm: 100%;