@import url('https://fonts.googleapis.com/css2?family=Archivo+Narrow:ital,wght@0,400..700;1,400..700&family=Archivo:ital,wght@0,100..900;1,100..900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Manrope:wght@200..800&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Oswald:wght@200..700&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

body {
    font-family: "Roboto", sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.6;
    color: #252f39;
}
#sp-component {
  padding-left: 0px;
  padding-right: 0px;
}
@font-face {
    font-family: 'Conthrax Sb';
    src: url('../fonts/conthrax/ConthraxSb-Regular.eot');
    src: url('../fonts/conthrax/ConthraxSb-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/conthrax/ConthraxSb-Regular.woff2') format('woff2'),
        url('../fonts/conthrax/ConthraxSb-Regular.woff') format('woff'),
        url('../fonts/conthrax/ConthraxSb-Regular.ttf') format('truetype'),
        url('../fonts/conthrax/ConthraxSb-Regular.svg#ConthraxSb-Regular') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
.manrope {
  font-family: "Manrope", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Oswald", sans-serif;
  margin: 0px 0px 0px 0px;
}
h1::before, h2::before {
    content: "[";
    color: #000000;
    font-weight: 600;
    margin-right: 5px;
    transition: all 0.3s ease-in-out;
    position: relative;
    bottom: 2px;
}

h1::after, h2::after {
    content: "]";
    color: #000000;
    font-weight: 600;
    margin-left: 5px;
    transition: all 0.3s ease-in-out;
    position: relative;
    bottom: 2px;
}
h2.cta-title::before {
    content: "[";
    color: #ffffff;
    font-weight: 600;
    margin-right: 5px;
    transition: all 0.3s ease-in-out;
    position: relative;
    bottom: 2px;
}
h2.cta-title:hover::before {
    content: "[";
    color: #ffffff;
}
h2.cta-title:hover::after {
    content: "]";
    color: #ffffff;
}
h2.cta-title::after {
    content: "]";
    color: #ffffff;
    font-weight: 600;
    margin-left: 5px;
    transition: all 0.3s ease-in-out;
    position: relative;
    bottom: 2px;
}
h1:hover::before, h2:hover::before, h3:hover::before,
h1:hover::after, h2:hover::after, h3:hover::after {
    color: #28a745;   /* меняем цвет, а не content */
    transform: translateY(-2px); /* опционально: небольшой подскок */
}

#main-slide h1::before, #main-slide h2::before {
    content: none;
}

#main-slide h1::after, #main-slide h2::after {
    content: none;
}
/*
transition: 0.3s;
-webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s;
-ms-transition: all 0.3s ease-in-out 0s;
-o-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;
*/
h1 {
  font-size: 34px;
}
h2 {
  text-transform: uppercase;
  font-size: 24px;
}
h3 {
  text-transform: uppercase;
  font-size: 22px;
}
h1 span, h2 span, h3 span, h4 span, h5 span, h6 span {
  color: #28a745;
  font-weight: 600;
}
h2#b24-form-form-1-title {
  font-family: "Oswald", sans-serif!important;
  font-weight: 600!important;
}
a {
  font-weight: 600;
}
.download-wrapper {
  text-align: center;
  margin: 0px 0px 30px 0px;
}
.download-wrapper a {

}
.pdfagogo-container {
  border-radius: 10px;
}
ul.pagination {
  margin-top: 20px;
  margin-bottom: 20px !important;
}
ul.pagination li.page-item {

}
ul.pagination li.page-item:before {
  content: none!important;
}
.com-content-category__pagination {
  display: flex;
  justify-content: center;
}
section {
  /*min-height: 60vh;*/
  padding: 50px 0px;
}
#sp-section-breadcrumbs {
  min-height: 0vh;
  padding: 15px 0px 0px 0px;
}
#sp-section-breadcrumbs .breadcrumb {
  padding: 15px 0px;
  background-color: transparent;
}
body.home #sp-section-breadcrumbs {
  display: none;
  padding: 0vh;
  min-height: 0vh;
}
body.home #sp-section-1 {
  display: none;
}
.bg-gray {
  background-color: #f6f7f8;
}
.bg-white {
  background-color: #ffffff;
}
.text-accent {
    color: #28a745;
    font-weight: bold;
}
.mtt-5 {
  margin-top: 5px;
}
.mb-5-px {
  margin-bottom: 5px;
}
.mb-30 {
  margin-bottom: 30px;
}
.border-25 {
  border-radius: 10px;
}
.rounded-10 {
  border-radius: 10px;
}
.modal {
  z-index: 99999;
}
.btn,
.btn:first-child:active:focus-visible {
  -webkit-transition: all 0.3s ease-in-out 0s;
  -moz-transition: all 0.3s ease-in-out 0s;
  -ms-transition: all 0.3s ease-in-out 0s;
  -o-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
  -webkit-box-shadow: 0px 0px 0px 0px rgba(34, 60, 80, 0.15);
  -moz-box-shadow: 0px 0px 0px 0px rgba(34, 60, 80, 0.15);
  box-shadow: 0px 0px 0px 0px rgba(34, 60, 80, 0.15);
}
.btn:hover {
  -webkit-box-shadow: 0px 0px 25px 10px rgba(34, 60, 80, 0.15);
  -moz-box-shadow: 0px 0px 25px 10px rgba(34, 60, 80, 0.15);
  box-shadow: 0px 0px 25px 10px rgba(34, 60, 80, 0.15);
}
.button-order {

}
.tt {
  font-weight: 600;
}

.tt::before {
  content: "[";
  color: #000000;
  font-weight: 600;
  margin-right: 5px;
  position: relative;
  bottom: 2px;
}

.tt::after {
  content: "]";
  color: #000000;
  font-weight: 600;
  margin-left: 5px;
  position: relative;
  bottom: 2px;
}
.tt:hover::before,
.tt:hover::after {
    color: #28a745;
    transform: translateY(-2px);
}
h1 {
  font-family: "Oswald", sans-serif;
  font-weight: 600;
  text-transform: none;
  font-size: 32px;
  line-height: 1.2;
  display: block;
}


.name {
  margin: 15px 0px;
  font-size: 74px;
}

.name span {
  color: #28a745;
  font-size: 34px;
  position: relative;
  bottom: 35px;
  left: 10px;
}

.lead {
  font-size: 1.25rem;
  font-weight: 600;
}

ul {
  list-style: none;
  padding: 0;
}
ul li {
  margin-bottom: 0.5rem;
}
ul li:before {
  content: '✓';
  color: #28a745;
  margin-right: 5px;
  font-weight: 500;
}
ol {
  padding-left: 20px;
}
ol li::marker {
  list-style: auto;
  font-weight: 800;
}
#sp-header-topbar ul li:before,
#sp-header ul li:before {
  content: none;
}
/* Main slide start */

section#main-slide {
    position: relative;
    width: 100%;
    height: 75vh;
    overflow: hidden;
}
.video-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.bg-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
    transition: opacity 4s ease; /* 4 секунды */
}
#videoA { opacity: 1; }
#videoB { opacity: 0; }
.hero-content {
  position: relative;
  z-index: 1;
  text-align: center;
  color: white;
  padding: 150px 50px;
  background: rgba(0, 0, 0, 0.4);
  height: 100%;
  display: flex;
  align-items: center;
  flex-direction: row;
  border-radius: 10px;
  flex-wrap: nowrap;
  justify-content: space-between;
}
h1.main-home__title {
  text-transform: uppercase;
  font-family: 'Conthrax Sb';
}
.logo__animate {
  z-index: 2;
}
.main__logo-animate {

}
.main__logo-slogan {
  font-size: 30px;
  font-weight: 700;
  font-family: "Oswald", sans-serif;
  color: #ffffff;
  padding-left: 50px;
  opacity: 0;
  transition: opacity 0.2s ease;
}
.main__logo-slogan.visible {
  opacity: 1;
}
.main__logo-slogan .letter {
  display: inline-block;
  opacity: 0;
  transform: translateY(10px);
}
.main__logo-slogan .letter.animate {
  animation: fadeInUp 0.4s ease forwards;
}
@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}
.main__logo-slogan .letter.space {
  width: 0.3em;
  white-space: pre;
}
.hero-content .flex-start {
  align-self: flex-start;
}
.hero-content .flex-end {
  align-self: flex-end;
}
/* =============================================
   MENU
   ============================================= */
.megamenu-item.active {

}
.menu-bg .offcanvas-overlay {
  background: rgba(0, 0, 0, 0.7);
  bottom: 0;
  left: 0;
  opacity: 1;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 3;
  visibility: visible;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
.menu-bg .megamenu-item.active {

}
/* =============================================
   MAP
   ============================================= */
   /* ============================================
      Секция карты (география проектов)
      ============================================ */
   #geografy {
       background-color: #f6f7f8;  /* светлый фон секции */
   }
   /* Контейнер карты */
   #geografy .map-container {
       max-width: 1200px;
       margin: 0 auto;
       background: white;
       border-radius: 1.5rem;
       padding: 1rem;
   }
   @media (max-width: 768px) {
       #geografy .map-container {
           padding: 0.75rem;
           border-radius: 1rem;
       }
   }

   /* Сама SVG-карта */
   #geografy svg {
       width: 100%;
       height: auto;
       display: block;
       border-radius: 0.75rem;
   }

   /* ============================================
      Регионы (path) – анимация при наведении
      ============================================ */
   #geografy .g-map__region {
       transition: fill 0.6s ease-in-out, stroke 0.6s ease-in-out;
       cursor: pointer;
       fill: #28a745;
       stroke: #ffffff;
   }
   #geografy .g-map__region:hover {
       fill: #218838;      /* новый цвет фона региона */
       stroke: #ffffff;    /* белая обводка */
       stroke-width: 0.8;             /* толщина обводки (можно 0.5–1.2) */
   }

   /* ============================================
      Города (кружки) – пульсация и наведение
      ============================================ */
   #geografy .g-map__city {
       transition: fill 0.2s, stroke 0.2s, r 0.2s;
       cursor: pointer;
       transform-origin: center;
   }
   #geografy .g-map__region:hover,
   #geografy .g-map__region.auto-hover {
       fill: #218838;
       stroke: #ffffff;
       stroke-width: 0.8;
       transition: fill 0.2s ease-in-out, stroke 0.2s ease-in-out;
   }
   /* Анимация пульсации (добавится через GSAP, но можно и CSS) */
   @keyframes pulse {
       0% { transform: scale(1); opacity: 0.8; }
       100% { transform: scale(1.25); opacity: 0.4; }
   }
   /* Класс для пульсации (будет добавлен скриптом) */
   .pulse-animation {
       animation: pulse 1.2s infinite ease-in-out alternate;
       color: #ffffff;
   }

   /* ============================================
      Всплывающий тултип
      ============================================ */
   #regionTooltip {
       color: #28a745;
       font-size: 14px;
       font-weight: 600;
       white-space: wrap;
       pointer-events: none;
       z-index: 1000;
       opacity: 0;
       display: flex;
       text-align: center;
       flex-direction: column;
   }
   #regionTooltip .tooltip-name {
     font-size: 18px;
     font-family: "Oswald", sans-serif;
   }
   #regionTooltip.active {
       opacity: 1;
       transform: translateY(-5px);
   }
   /* Адаптация тултипа на мобильных */
   @media (max-width: 768px) {
       #regionTooltip {
           font-size: 24px;
           white-space: normal;
           max-width: 220px;
           text-align: center;
       }
   }

   /* ============================================
      Заголовки и текст внутри секции
      ============================================ */
   #geografy .section-title {
       font-size: 24px;
       font-weight: 600;
       margin-bottom: 30px;
       color: #1a2c3e;
       text-align: center;
   }
   #geografy .section-subtitle {
       font-size: 18px;
       color: #4a5b6e;
       text-align: center;
       margin-bottom: 30px;
   }
   #geografy .tt-title,
   #geografy .tt-desc {
     font-size: 18px;
     font-family: "Oswald", sans-serif;
     text-transform: uppercase;
   }
   #geografy .tt-desc {
     color: #000000;
   }
   #geografy .tt-num {
     font-family: "Oswald", sans-serif;
     font-size: 24px;
     font-weight: bold;
   }
   @media (max-width: 768px) {
       #geografy .section-title {
           font-size: 1.5rem;
       }
       #geografy .section-subtitle {
           font-size: 1rem;
           margin-bottom: 1.5rem;
       }
   }
   .regionName {
     display: flex;
     text-align: center;
     justify-content: center;
   }
   /* ============================================
      Дополнительно: улучшение pointer-events для всей карты
      ============================================ */
   #geografy svg path,
   #geografy svg circle {
       pointer-events: visible; /* гарантирует, что события мыши дойдут до элементов */
   }
/* =============================================
   2. ICON BLOCK
   ============================================= */

#icon-block {
  background-color: #f6f7f8;
}
#icon-block h2 {
  margin-bottom: 50px;
}
#icon-block .icon__block-wrapper {
  width: 12.5%;
  background: transparent;
  -webkit-transition: all .6s ease-in-out 0s;
  -moz-transition: all .6s ease-in-out 0s;
  -ms-transition: all .6s ease-in-out 0s;
  -o-transition: all .6s ease-in-out 0s;
  transition: all .6s ease-in-out 0s;
  -webkit-box-shadow: 0px 0px 0px 0px rgba(34, 60, 80, 0.15);
  -moz-box-shadow: 0px 0px 0px 0px rgba(34, 60, 80, 0.15);
  box-shadow: 0px 0px 0px 0px rgba(34, 60, 80, 0.15);
}
#icon-block .icon__block-wrapper:hover {
  background: #ffffff;
  -webkit-box-shadow: 0px 0px 15px 10px rgba(34, 60, 80, 0.1);
  -moz-box-shadow: 0px 0px 15px 10px rgba(34, 60, 80, 0.1);
  box-shadow: 0px 0px 15px 10px rgba(34, 60, 80, 0.1);
  border-radius: 10px;
}
#icon-block  .icons-block__outer {
  display: flex;
  min-height: 135px;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  padding: 15px;
  position: relative;
  margin-bottom: 15px;
/*  border-radius: 10px;
  -webkit-transition: all .6s ease-in-out 0s;
  -moz-transition: all .6s ease-in-out 0s;
  -ms-transition: all .6s ease-in-out 0s;
  -o-transition: all .6s ease-in-out 0s;
  transition: all .6s ease-in-out 0s;
  -webkit-box-shadow: 0px 0px 0px 0px rgba(34, 60, 80, 0.15);
  -moz-box-shadow: 0px 0px 0px 0px rgba(34, 60, 80, 0.15);
  box-shadow: 0px 0px 0px 0px rgba(34, 60, 80, 0.15); */
}
/* #icon-block  .icons-block__outer:hover {
  -webkit-box-shadow: 0px 0px 25px 10px rgba(34, 60, 80, 0.3);
  -moz-box-shadow: 0px 0px 25px 10px rgba(34, 60, 80, 0.3);
  box-shadow: 0px 0px 25px 10px rgba(34, 60, 80, 0.3);
} */
/* Общий контейнер иконки */
/* ========== ОБЩИЕ СТИЛИ ДЛЯ ИКОНОК ========== */
/* Родительский контейнер иконки */
.service-icon {
  position: relative;   /* чтобы псевдоэлементы позиционировались внутри */
  width: 60px;
  height: 60px;
  margin-bottom: 15px;
}

/* Оба состояния (обводка и заливка) — абсолютные слои друг на друге */
.service-icon::before,
.service-icon::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;  /* или cover — подберите под свои иконки */
  transition: opacity 0.3s ease-in-out; /* плавное изменение прозрачности */
}

/* По умолчанию показываем иконку с обводкой (полностью видна) */
.service-icon::before {
  opacity: 1;
}

/* Иконка с заливкой по умолчанию полностью прозрачна (скрыта) */
.service-icon::after {
  opacity: 0;
}

/* ========== ЭФФЕКТ ПРИ НАВЕДЕНИИ ========== */
/* При наведении на карточку или на сам блок меняем прозрачность */
.service-card:hover .service-icon::before,
.icons-block__inner:hover .service-icon::before {
  opacity: 0;   /* обводка исчезает */
}

.service-card:hover .service-icon::after,
.icons-block__inner:hover .service-icon::after {
  opacity: 1;   /* заливка появляется */
}

/* ========== УКАЗЫВАЕМ ФОНОВЫЕ КАРТИНКИ ДЛЯ КАЖДОЙ ИКОНКИ ========== */
/* Замените пути на свои реальные файлы (можно .png или .webp) */

/* 1. Строительство зданий */
.icon-building .service-icon::before {
  background-image: url('/images/icons/icons-block/01_building.webp');
}
.icon-building .service-icon::after {
  background-image: url('/images/icons/icons-block/01_building-fill.webp');
}

/* 2. Капитальный ремонт */
.icon-kapremont .service-icon::before {
  background-image: url('/images/icons/icons-block/02_kapremont.webp');
}
.icon-kapremont .service-icon::after {
  background-image: url('/images/icons/icons-block/02_kapremont-fill.webp');
}

/* 3. Монтаж */
.icon-montage .service-icon::before {
  background-image: url('/images/icons/icons-block/03_montage.webp');
}
.icon-montage .service-icon::after {
  background-image: url('/images/icons/icons-block/03_montage-fill.webp');
}

/* 4. Трубопровод */
.icon-pipeline .service-icon::before {
  background-image: url('/images/icons/icons-block/04_pipeline.webp');
}
.icon-pipeline .service-icon::after {
  background-image: url('/images/icons/icons-block/04_pipeline-fill.webp');
}

/* 5. Дороги */
.icon-road .service-icon::before {
  background-image: url('/images/icons/icons-block/05_road.webp');
}
.icon-road .service-icon::after {
  background-image: url('/images/icons/icons-block/05_road-fill.webp');
}

/* 6. Фасады */
.icon-facade .service-icon::before {
  background-image: url('/images/icons/icons-block/06_facade.webp');
}
.icon-facade .service-icon::after {
  background-image: url('/images/icons/icons-block/06_facade-fill.webp');
}

/* 7. Внутренние работы */
.icon-internal .service-icon::before {
  background-image: url('/images/icons/icons-block/07_internal.webp');
}
.icon-internal .service-icon::after {
  background-image: url('/images/icons/icons-block/07_internal-fill.webp');
}

/* 8. Краны */
.icon-crane .service-icon::before {
  background-image: url('/images/icons/icons-block/08_crane.webp');
}
.icon-crane .service-icon::after {
  background-image: url('/images/icons/icons-block/08_crane-fill.webp');
}

/* ========== ДОПОЛНИТЕЛЬНО: ПРЕДОТВРАЩАЕМ МЕРЦАНИЕ ========== */
/* Убедитесь, что у родительских блоков нет фона, который может просвечивать */
.service-icon::before,
.service-icon::after {
  backface-visibility: hidden; /* улучшает производительность анимации */
}

#icon-block .icons-block__inner a {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#icon-block .service-card {

}
#icon-block .service-card h5 {

}
#icon-block .service-icon {

}
#icon-block .service-title {
  font-family: "Roboto", sans-serif;
  text-align: center;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.6;
}

/* =============================================
   3. PORTFOLIO
   ============================================= */
#portfolio {
    background-color: #f6f7f8;
}
.portfolio-item {

}
.portfolio-item:hover {

}
.portfolio-item img {

}
#portfolio .portfolio-item {

}
#portfolio .portfolio-item img {

}
.portfolio-caption {
  font-family: "Roboto", sans-serif;
  text-align: center;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.6;
}
.portfolio-caption span {
  text-align: center;
  text-transform: none;
  font-family: "Oswald", sans-serif;
  font-weight: bold;
  font-size: 14px;
  color: #28a745;
}
#pdfModal {
  min-height: 80vh;
}
/* =============================================
   3. ADVANTAGES
   ============================================= */
 #advantages {
  min-height: 35vh;
 }
#advantages .card {
  position: relative;
  display: block;
  padding: 15px;
  margin-bottom: 30px;
  background: #f6f7f8;
  border-radius: 10px;
  border-left: 2px solid #28a745;
  border-top: 2px solid #28a745;
  border-top-style: dashed;
  border-top-right-radius: 25px;
  border-right: 2px solid #28a745;
  border-right-style: dashed;
  border-bottom: 2px solid #28a745;
  border-bottom-style: dashed;
  transition: 0.6s;
  -webkit-transition: all 0.6s ease-in-out 0s;
  -moz-transition: all 0.6s ease-in-out 0s;
  -ms-transition: all 0.6s ease-in-out 0s;
  -o-transition: all 0.6s ease-in-out 0s;
  transition: all 0.6s ease-in-out 0s;
 }
 #advantages .card .text-accent {
   color: #28a745;
   transition: 0.6s;
   -webkit-transition: all 0.6s ease-in-out 0s;
   -moz-transition: all 0.6s ease-in-out 0s;
   -ms-transition: all 0.6s ease-in-out 0s;
   -o-transition: all 0.6s ease-in-out 0s;
   transition: all 0.6s ease-in-out 0s;
 }
 #advantages .card:hover .text-accent {
   color: #ffffff;
 }
 #advantages .card:hover,
 #advantages .animate-hover {
   background: #28a745;
   color: #fff;
   border-left: 2px solid #f6f7f8;
   border-left-style: dashed;
   border-top: 2px solid #f6f7f8;
   border-top-style: dashed;
   border-right: 2px solid #f6f7f8;
   border-right-style: dashed;
   border-bottom: 2px solid #f6f7f8;
   border-bottom-style: dashed;
 }
 .advantage-icon {
     margin-bottom: 30px;
 }
 .advantage-icon img {
     width: 56px;
     height: 56px;
     object-fit: contain;
 }
 .advantage-title {
   font-family: "Roboto", sans-serif;
   font-size: 24px;
   font-weight: 600;
   margin-bottom: 30px;
   color: #1a2c3e;
 }
 .advantage-text {
     color: #4a5b6e;
     line-height: 1.6;
     font-size: 16px;
 }
 .trust-badge {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     gap: 1.5rem;
     padding-top: 1rem;
 }
 .badge-item {
     background: #28a745;
     padding: 0.5rem 1.2rem;
     border-radius: 10px;
     font-size: 0.9rem;
     font-weight: 500;
     color: #ffffff;
     transition: 0.6s;
     -webkit-transition: all 0.6s ease-in-out 0s;
     -moz-transition: all 0.6s ease-in-out 0s;
     -ms-transition: all 0.6s ease-in-out 0s;
     -o-transition: all 0.6s ease-in-out 0s;
     transition: all 0.6s ease-in-out 0s;
     -webkit-box-shadow: 0px 0px 0px 0px rgba(34, 60, 80, 0.15);
     -moz-box-shadow: 0px 0px 0px 0px rgba(34, 60, 80, 0.15);
     box-shadow: 0px 0px 0px 0px rgba(34, 60, 80, 0.15);
 }
  .badge-item:hover {
    -webkit-box-shadow: 0px 0px 25px 10px rgba(34, 60, 80, 0.3);
    -moz-box-shadow: 0px 0px 25px 10px rgba(34, 60, 80, 0.3);
    box-shadow: 0px 0px 25px 10px rgba(34, 60, 80, 0.3);
  }
 @media (max-width: 768px) {
     .advantage-card {
         padding: 1.2rem;
     }
     .advantage-title {
         font-size: 1.1rem;
     }
     .advantage-icon img {
         width: 48px;
         height: 48px;
     }
     .trust-badge {
         gap: 0.8rem;
     }
     .badge-item {
         font-size: 0.8rem;
         padding: 0.3rem 0.8rem;
     }
 }

/* =============================================
   4. ABOUT TEXT BLOCK
   ============================================= */
   #about-text h4 {
     font-family: "Oswald", sans-serif;
     font-size: 24px;
     font-weight: 600;
     margin-bottom: 30px;
     color: #1a2c3e;
   }
  #about-text .advantage-list {
       list-style: none;
       padding-left: 0;
   }
  #about-text .advantage-list li {
       padding-left: 1.5rem;
       margin-bottom: 0.75rem;
       position: relative;
   }
  #about-text .advantage-list li::before {
       content: "✓";
       color: #218838;
       font-weight: bold;
       position: absolute;
       left: 0;
   }
  #about-text .about-card {
       background: white;
       border-radius: 10px;
       box-shadow: 0 10px 30px rgba(0,0,0,0.05);
   }
   #about-text form button {
     background: #28a745;
     color: #ffffff;
     font-size: 18px;
     font-weight: normal ;
   }
   #about-text form button:hover {
     background: #218838;
   }
   #about-text form input,
   #about-text form button {
     border-radius: 10px;
   }
   #about-text form .form-check-input:checked {
    background-color: #28a745;
    border-color: ##28a745;
  }
   /* ========== СЕКЦИЯ ОТЗЫВЫ ========== */
   #reviews {
       background-color: #f6f7f8;
       /* padding: 3rem 0; */
   }
   .section-title {
       font-size: 2rem;
       font-weight: 700;
       margin-bottom: 1rem;
       color: #1a2c3e;
   }
   #reviews .lead {
       font-size: 1.1rem;
       color: #4a5b6e;
   }
   .com-content-article #reviews {
     margin-bottom: 30px;
   }
   /* Карточка отзыва */
   .review-img-card {
       padding: 15px;
   }
   .review-img-card img {

   }
   .rev-title {
     font-size: 16px;
     text-align: center;
     padding: 15px 0px;
     font-weight: 600;
     min-height: 100px;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
   }
   .rev-title span {
     text-align: center;
     font-family: "Oswald", sans-serif;
     font-weight: bold;
     font-size: 18px;
    color: #28a745;
   }
   .review-caption {
       padding: 0.25rem 0.75rem 0.75rem 0.75rem;
       font-size: 0.85rem;
       color: #4a5b6e;
       border-top: none;
   }

   /* Адаптив для телефонов */
   @media (max-width: 768px) {
       #reviews {
           padding: 2rem 0;
       }
       .section-title {
           font-size: 1.5rem;
       }
       .review-img-card img {
           height: 160px;
       }
       .rev-title {
           font-size: 0.9rem;
       }
       .review-caption {
           font-size: 0.75rem;
       }
   }
   @media (max-width: 576px) {
       .review-img-card img {
           height: 140px;
       }
   }


/* =============================================
   5. GEOGRAFY
   ============================================= */
#geografy {

}
#geografy .container {

}
#geografy .row {

}
#geografy .col-12 {

}
#geografy .geo-map-placeholder {

}
#geografy .geo-list {

}
#geografy .geo-list span {

}

/* =============================================
   5. FEAT
   ============================================= */
.feat__block {

}
.feat__wrapper {
  position: relative;
  display: flex;
  height: 135px;
  padding: 15px;
  margin-bottom: 30px;
  background: #f6f7f8;
  border-radius: 10px;
  border-left: 5px solid #28a745;
  border-top: 2px solid #28a745;
  border-top-style: dashed;
  border-top-right-radius: 25px;
  border-right: 2px solid #28a745;
  border-right-style: dashed;
  border-bottom: 2px solid #28a745;
  border-bottom-style: dashed;
  transition: 0.6s;
  -webkit-transition: all 0.6s ease-in-out 0s;
  -moz-transition: all 0.6s ease-in-out 0s;
  -ms-transition: all 0.6s ease-in-out 0s;
  -o-transition: all 0.6s ease-in-out 0s;
  transition: all 0.6s ease-in-out 0s;
}
.feat__wrapper:hover {
  background: #28a745;
  color: #fff;
  border-left: 2px solid #f6f7f8;
  border-left-style: dashed;
  border-top: 2px solid #f6f7f8;
  border-top-style: dashed;
  border-right: 2px solid #f6f7f8;
  border-right-style: dashed;
  border-bottom: 2px solid #f6f7f8;
  border-bottom-style: dashed;
}
.feat__wrapper.animate-hover {
  background: #28a745;
  color: #fff;
  border-left: 2px solid #f6f7f8;
  border-left-style: dashed;
  border-top: 2px solid #f6f7f8;
  border-top-style: dashed;
  border-right: 2px solid #f6f7f8;
  border-right-style: dashed;
  border-bottom: 2px solid #f6f7f8;
  border-bottom-style: dashed;
}
.feat__inner {

}
.feat__icon {

}
.feat__title {
  font-weight: 700;
  margin-bottom: 5px;
}
.feat__content {
  font-size: 14px;
}
.features__subtitle.section__subtitle {
  margin-bottom: 15px;
}
/* =============================================
   6. HOW-WORKS
   ============================================= */
#how-works {

}
#how-works .container {

}
#how-works .row {

}
#how-works .col-sm-6 {

}
#how-works .col-md-3 {

}
#how-works .step-card {

}
#how-works .step-number {

}
#how-works .step-title {

}
#how-works .step-desc {

}

/* =============================================
   7. REWIEVS
   ============================================= */
#rewievs {

}
#rewievs .container {

}
#rewievs .row {

}
#rewievs .col-md-6 {

}
#rewievs .col-lg-4 {

}
#rewievs .review-card {

}
#rewievs .review-text {

}
#rewievs .review-author {

}
#rewievs .review-position {

}

#rewievs .rev-title span {

}

/* =============================================
   8. CERTIFYCATE
   ============================================= */
   .com-content-article__body #certifycate {
     margin-bottom: 30px;
   }
   #certifycate .section-title {
       font-size: 2rem;
       font-weight: 700;
       margin-bottom: 1rem;
       color: #1a2c3e;
   }
   #certifycate .lead {
       font-size: 1.1rem;
       color: #4a5b6e;
   }

   /* Карточка сертификата */
   .certify-item {

   }
   .certify-item img {

   }

   /* Адаптив */
   @media (max-width: 768px) {
       #certifycate {

       }
       .certify-item img {

       }
   }
   @media (max-width: 576px) {
       .certify-item img {

       }
   }

/* =============================================
   9. CTA
   ============================================= */
   #cta {

   }
   .cta-section {
       background: #28a745;
       min-height: 30vh;
       height: 40vh;
       position: relative;
       color: white;
       display: flex;
   }
   /* Паттерн или декоративные элементы (опционально) */
   .cta-section::before {
       content: '';
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" opacity="0.05"><path fill="white" d="M10,10 L90,10 L90,90 L10,90 Z" stroke="white" stroke-width="1" fill="none"/><circle cx="50" cy="50" r="20" stroke="white" stroke-width="1" fill="none"/></svg>');
       background-repeat: repeat;
       pointer-events: none;
   }
   .cta-title {
       font-size: 2rem;
       font-weight: 700;
       margin-bottom: 1rem;
   }
   .cta-text {

   }
   .cta-buttons {
       display: flex;
       gap: 1rem;
       justify-content: center;
       flex-wrap: wrap;
       margin-bottom: 1rem;
   }
   .btn-cta-primary {
       background-color: white;
       color: #218838;
       padding: 0.75rem 2rem;
       font-weight: 600;
       border-radius: 10px;
       transition: 0.2s;
       border: none;
   }
   .btn-cta-primary:hover {
       background-color: #f0f0f0;
       transform: translateY(-2px);
       box-shadow: 0 5px 12px rgba(0,0,0,0.15);
       color: #218838;
   }
   .btn-cta-outline {
       background-color: transparent;
       color: white;
       border: 2px solid white;
       padding: 0.75rem 2rem;
       font-weight: 600;
       border-radius: 10px;
       transition: 0.2s;
   }
   .btn-cta-outline:hover {
       background-color: white;
       color: #218838;
       transform: translateY(-2px);
   }
   .cta-note {
       font-size: 0.85rem;
       opacity: 0.8;
   }
   /* Стили для формы (вариант 2) */
   .cta-form {
       background: rgba(255,255,255,0.1);
       backdrop-filter: blur(10px);
       border-radius: 1.5rem;
       padding: 1.5rem;
   }
   .cta-form .form-control {
       border-radius: 10px;
       border: none;
       background: white;
       padding: 0.75rem 1.25rem;
   }
   .cta-form .form-control:focus {
       box-shadow: 0 0 0 3px rgba(255,255,255,0.5);
   }
   .cta-list {
       list-style: none;
       padding-left: 0;
       margin-top: 1rem;
   }
   .cta-list li {
       margin-bottom: 0.5rem;
       font-size: 1rem;
   }
   .cta-list li:before {
       content: '✓';
       color: #ffffff;
       margin-right: 5px;
       font-weight: 500;
   }
   .features__body h3 {
     margin-bottom: 15px;
   }
   .features__image-wrapper {
     display: flex;
     align-content: center;
     flex-wrap: wrap;
     flex-direction: column;
     justify-content: center;
     height: stretch;
   }
   .features__image-wrapper img {
     margin-bottom: 15px;
     max-height: 345px;
   }
   .form-note {
     font-size: 0.75rem;
     text-align: center;
     margin-top: 0.75rem;
     opacity: 0.8;
   }
   /* Адаптив */
   @media (max-width: 768px) {
       .cta-section {
           padding: 2.5rem 0;
       }
       .cta-title {
           font-size: 1.5rem;
       }
       .cta-text {
           font-size: 1rem;
       }
       .btn-cta-primary, .btn-cta-outline {
           padding: 0.6rem 1.5rem;
           font-size: 0.9rem;
       }
       .cta-form {
           padding: 1rem;
       }
   }

/* =============================================
   10. NEWS
   ============================================= */
#news {

}
#news .container {

}
#news .row {

}
#news .mod-articles-item-content {
  min-height: 360px;
  position: relative;
  bottom: 0px;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: space-between;
  margin-bottom: 15px;
  background: #fff;
  padding: 15px;
  border: 1px solid #999999;
  border-bottom: 5px solid #28a745;
  border-radius: 10px;
  -webkit-box-shadow: 0px 0px 0px 0px rgba(34, 60, 80, 0.15);
  -moz-box-shadow: 0px 0px 0px 0px rgba(34, 60, 80, 0.15);
  box-shadow: 0px 0px 0px 0px rgba(34, 60, 80, 0.15);
  -webkit-transition: all .6s ease-in-out;
  transition: all .6s ease-in-out;
}
#news .mod-articles-item-content:hover {
  border-bottom: 5px solid #28a745;
  -webkit-box-shadow: 0px 0px 25px 10px rgba(34, 60, 80, 0.15);
  -moz-box-shadow: 0px 0px 25px 10px rgba(34, 60, 80, 0.15);
  box-shadow: 0px 0px 25px 10px rgba(34, 60, 80, 0.15);
}
#news .mod-articles-title {
  font-size: 18px;
  font-weight: bold;
  min-height: 115px;
  margin-bottom: 15px;
}
#news .mod-articles-title a {
  text-decoration: none;
  font-size: 18px;
  font-weight: bold;
  min-height: 115px;
  margin-bottom: 15px;
  color: #000000;
  background: transparent;
  padding: 0;
}
#news .mod-articles-title a:hover {
  color: #000000;
}
#news .mod-articles-introtext {
  font-weight: normal;
  font-size: 16px;
  min-height: 160px;
  margin-bottom: 15px;
}
#news .mod-articles-item-content .readmore {
  display: flex;
  justify-content: flex-start;
}
#news .news-date {

}
#news .news-title {

}
#news .news-excerpt {

}

#home_how__work {
    background-color: #f6f7f8;
}
#home_how__work h2 {
    margin-bottom: 50px;
}
#home_how__work .row .work__item-wrap .work__item {
  min-height: 410px;
  position: relative;
  bottom: 0px;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
  background: #fff;
  padding: 30px;
  border: 1px solid #ddd;
  border-left: 5px solid transparent;
  box-shadow: 0px 9px 81px -9px rgba(0, 0, 0, 0.0);
  -webkit-box-shadow: 0px 9px 81px -9px rgba(0, 0, 0, 0.0);
  -moz-box-shadow: 0px 9px 81px -9px rgba(0,0,0,0.0);
  -webkit-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
}
#home_how__work .row .work__item-wrap .work__item .h3 {
  font-family: "Oswald", sans-serif;
}
#home_how__work .row .work__item-wrap .work__item:hover {
    bottom: 10px;
    border-left: 5px solid #28a745;
    box-shadow: 0px 15px 31px -8px rgba(191,191,191,0.76);
    -webkit-box-shadow: 0px 15px 31px -8px rgba(191,191,191,0.76);
    -moz-box-shadow: 0px 15px 31px -8px rgba(191,191,191,0.76);
}

#home_how__work .row .work__item-wrap .work__item .num {
  transition: all .5s ease-in-out;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 168px;
  font-weight: 600;
  color: rgba(0, 0, 0, 0.05);   /* едва заметный – как фон */
  /* или цвет: #e9ecef; */
  white-space: nowrap;
  pointer-events: none;          /* чтобы номер не мешал кликам по контенту */
  z-index: 0;                    /* ниже, чем остальной контент */
  margin: 0;
  line-height: 1;
}

#home_how__work .row .work__item-wrap .work__item:hover .num {
  color: rgb(39 167 69 / 40%);
}
#home_how__work .row .home__wrap .work__item .h3 {
    font-size: 18px;
    margin-bottom: 18px;
}
#home_how__work .row .work__item-wrap .work__item .m-right {
    font-family: "Roboto", sans-serif;
    font-size: 16px;
    text-align: right;
}
#home_how__work .row .work__item-wrap {
    margin-bottom: 40px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}


/* =============================================
   11. CLIENTS
   ============================================= */
#clients {
  height: 40vh;
  min-height: 40vh;
}
#clients .container {

}
#clients .row {

}
#clients .col-6 {

}
#clients .col-md-3 {

}
#clients .client-item {

}
#clients .client-item .num {

}
#clients .client-item img {
  filter: grayscale(100%);
  transition: filter 0.2s ease, opacity 0.2s ease;
  opacity: 0.7;
  border: none;
}
#clients .client-item:hover img {
  filter: grayscale(0);
  opacity: 1;
}

#clients .owl-item {
  transition: transform 0.5s ease, filter 0.5s ease;
  filter: blur(1px);
  transform: scale(1);
}

#clients .owl-item.highlighted {
  filter: blur(0);
  transform: scale(1.3);
  z-index: 10;
  position: relative;
}
#clients .owl-item.highlighted img {
  filter: grayscale(0%);
}

/* Родительский блок должен быть относительным */
.work__item {
    position: relative;
    overflow: hidden;   /* чтобы номер не вылезал за скруглённые углы */
}

/* Стили для фонового номера */
.work__item .num {

}

/* Убедитесь, что контент внутри .work__item имеет z-index выше, чем у .num */
.work__item .h3,
.work__item .text,
.work__item button,
.work__item script {
    position: relative;
    z-index: 1;
}
/* ========== ФУТЕР ========== */
.footer {
    background: #f6f7f8;
    color: #000000;
    padding: 50px;
}
.footer-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 40px;
    margin-bottom: 30px;
}
.footer-col {
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.footer-logo-wrap {
    margin-bottom: 15px;
}
.footer-logo img {
    max-width: 150px;
    height: auto;
}
.footer-company-name {
    font-size: 16px;
    font-weight: 600;
    color: #000000;
}
.footer-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.footer-list li {
    margin-bottom: 8px;
    font-size: 16px;
    line-height: 1.2;
    color: #000000;
}
.footer-list a {
    color: #d1e0e0;
    text-decoration: none;
    transition: color 0.2s;
}
.footer-list.contacts a {
    color: #ffffff!important;
    text-decoration: none;
    transition: color 0.2s;
}
.footer-list.contacts a:hover {
    color: #ffffff;
    text-decoration: none;
    transition: color 0.2s;
}
.footer-list.rekvizity li {
  font-size: 14px;
}
.footer-list a:hover {
    color: #218838;
}
.footer-title {
    font-size: 24px;
    font-family: "Oswald", sans-serif;
    font-weight: bold;
    margin-bottom: 15px;
    color: #0000000;
}
.footer-present-btn {
    background: transparent;
    border: 1px solid #218838;
    border-radius: 40px;
    padding: 8px 20px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    transition: all 0.2s;
    margin-top: 10px;
    color: #ffffff;
    font-size: 14px;
    font-weight: 500;
}
.footer-present-btn img {
    width: 20px;
    height: 20px;
}
.footer-present-btn:hover {
    background: #218838;
    border-color: #218838;
}
.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
    padding-top: 25px;
    border-top: 1px solid rgba(255,255,255,0.1);
    font-size: 13px;
}
.footer-bottom-link {
    color: #d1e0e0;
    text-decoration: none;
}
.footer-bottom-link:hover {
    color: #218838;
}
.footer-copyright {
    color: #8a9da7;
}
@media (max-width: 768px) {
    .footer {
        padding: 40px 0 20px;
    }
    .footer-grid {
        gap: 30px;
    }
    .footer-bottom {
        flex-direction: column;
        text-align: center;
    }
    .footer-title {
        font-size: 16px;
    }
    .footer-list li {
        font-size: 13px;
    }
}

/* ========== МОДАЛЬНОЕ ОКНО ДЛЯ PDF ========== */
.modal-pdf {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    visibility: hidden;
    opacity: 0;
    transition: visibility 0.2s, opacity 0.2s;
}
.modal-pdf.active {
    visibility: visible;
    opacity: 1;
}
.modal-pdf__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(4px);
}
.modal-pdf__container {
    position: relative;
    background: #fff;
    width: 90%;
    max-width: 1000px;
    height: 85%;
    border-radius: 16px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transform: translateY(30px);
    transition: transform 0.3s ease;
}
.modal-pdf.active .modal-pdf__container {
    transform: translateY(0);
}
.modal-pdf__header {
    padding: 12px 20px;
    background: #218838;
    color: white;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.modal-pdf__header h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
}
.modal-pdf__close {
    background: none;
    border: none;
    font-size: 34px;
    cursor: pointer;
    color: white;
    line-height: 1.6;
    transition: opacity 0.2s;
}
.modal-pdf__close:hover {
    opacity: 0.8;
}
.modal-pdf__body {
    flex: 1;
    background: #f5f5f5;
}
.modal-pdf__body iframe {
    width: 100%;
    height: 100%;
    border: none;
}
@media (max-width: 768px) {
    .modal-pdf__container {
        width: 95%;
        height: 90%;
    }
}
#sp-section-2 {
    padding: 0px ;
    min-height: 0;
}

/* ========== Статьи ========== */
.com-content-article__body {
  margin-top: 00px;
}
.com-content-article__body .content__inner,
.com-content-article__body .content__inner-blog {
  text-align: justify;
  margin-bottom: 15px;
}
.com-content-article__body .content__inner ol li,
.com-content-article__body .content__inner ul li {
  text-align: left;
}
.com-content-article__body .content__inner img {
  border-radius: 10px;
}
.com-content-article__body .page-header {
  background: #e4e7ea;
  padding: 50px 15px;
  border-radius: 10px;
  margin-bottom: 30px;
  border-bottom: 5px solid #28a745;
}
.com-content-article__body .content__inner section:nth-child(2n) img {
  padding: 5px 30px 15px 0px;
  width: 55%;
  float: left;
  border-radius: 10px;
}
.com-content-article__body .content__inner section:nth-child(2n+1) img {
  padding: 5px 0px 15px 30px;
  width: 55%;
  float: right;
  border-radius: 10px;
}
.com-content-article__body .page-header h1 {
  font-family: "Oswald", sans-serif;
  font-size: 34px;
  line-height: 1.2;
  font-weight: 900;
  color: #252f39;
  padding: 0px 0px 30px 0px;
  max-width: 600px;
  text-transform: uppercase;
}
.com-content-article__body h2 {
  font-family: "Oswald", sans-serif;
  font-size: 24px;
  line-height: 1.2;
  font-weight: 900;
  color: #252f39;
  padding: 14px 0px 30px 0px;
  margin-bottom: 0;
  text-transform: uppercase;
  /* text-decoration: underline; */
  /* text-decoration-style: dashed; */
  text-decoration-color: #28a745;
  text-align: left;
  max-width: 700px;
}
.com-content-article__body .normativy-text h2 {
  max-width: 100%;
}
.com-content-article__body #certifycate h2 {
  padding-top: 0px;
}
.com-content-article__body #certifycate .section-title {
    margin-bottom: 0;
}
.com-content-article__body h3 {
  text-transform: uppercase;
}
.com-content-article__body .page-header .page-header-adv {
  max-width: 600px;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
  margin-bottom: 30px;
}
.content__article section {
  position: relative;
  /* display: inline-block; */
  min-height: 0vh;
  padding: 30px;
  margin-bottom: 30px;
  background: #f6f7f8;
  border-radius: 10px;
  /* -webkit-box-shadow: 0px 0px 25px 10px rgba(34, 60, 80, 0.3);
  -moz-box-shadow: 0px 0px 25px 10px rgba(34, 60, 80, 0.3);
  box-shadow: 0px 0px 25px 10px rgba(34, 60, 80, 0.3); */
}
.content__article section > * {
  position: relative;
  z-index: 2;
}
.content__article section:nth-child(2n) {
  border-left: 5px solid #28a745;
}
.content__article section:nth-child(2n+1) {
  border-right: 5px solid #28a745;
}
.content__article section id="one" {
  width: 100%;
}
.com-content-article__body .content__inner ul {
  list-style: none;
  padding: 0;
}
.com-content-article__body .content__inner ul li {

}
.com-content-article__body .content__inner ul li:before {
  content: '✓';
  color: #28a745;
  margin-right: 5px;
  font-weight: 500;
}
.com-content-article__body .content__inner ul ol li:before {
  content: none;
}
.com-content-article__body .content__inner ol {

}
.com-content-article__body .content__inner ol li {

}
#main-slide .article-video {
  position: relative;
  aspect-ratio: 577 / 340;
  background: #000000;
  border-radius: 10px;
}
#main-slide .article-video video {
  position: absolute;
  inset: 0;
  object-fit: cover;
  border-radius: inherit;
  width: 100%;
  height: 100%;
}
.com-content-article__body .article-video {
  position: relative;
  aspect-ratio: 577 / 340;
  background: #000000;
  border-radius: 10px;
}
.com-content-article__body .article-video video {
  position: absolute;
  inset: 0;
  object-fit: cover;
  border-radius: inherit;
  width: 100%;
  height: 100%;
}
.video__img-ppr {
  position: absolute;
  bottom: -30px;
  right: -30px;
  width: 220px;
  height: auto;
  animation: float 6s ease-in-out infinite;
}
@keyframes float {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-5px);  /* поднимаем вверх */
  }
  100% {
    transform: translateY(0px);    /* возвращаем в исходное положение */
  }
}
.video__img-ppr img {

}
/* ========== Комерческое предложение ========== */
.commercial {
  position: relative;
  display: block;
  min-height: 0vh;
  padding: 30px;
  margin-bottom: 30px;
  background: #f6f7f8;
  border-radius: 10px;
  border-left: 5px solid #28a745;
}
.commercial__block {
  background-image: url('/images/commercial/commercial_bg.webp');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  color: #ffffff;
  border-radius: 10px;
  padding: 30px;
  margin-bottom: 30px;
}
body.home .commercial__block {
  padding: 50px 0px;0
}
.commercial__title {
  font-family: "Oswald", sans-serif;
  font-size: 24px;
  font-weight: 900;
  line-height: 1;
  color: #ffffff;
  padding: 0px 0px 30px 0px;
  text-transform: uppercase;
  /* text-decoration: underline; */
}
.commercial__title span.comm {

}
.commercial__inner {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
}
.commercial__inner-block {
  display: flex;
  flex-direction: column;
  align-content: flex-start;
  flex-wrap: wrap;
  align-items: flex-start;
}
.commercial__icons {
  min-height: 120px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.commercial__icons svg#russian_map {
  width: 160px;
  height: auto;
  margin-bottom: 30px;
  stroke: #ffffff;
  fill: #ffffff;
}
.commercial__icons svg#clock {
  width: 80px;
  height: auto;
  margin-bottom: 30px;
  stroke: #ffffff;
  fill: #ffffff;
}
.commercial__icons svg#worksheet {
  width: 80px;
  height: auto;
  margin-bottom: 30px;
  stroke: #ffffff;
  fill: #ffffff;
}
.commercial__text {
  font-weight: 400;

}
.commercial__text span {
  font-weight: 900;
}
.commercial__text small {
  margin-bottom: 15px;
  font-size: 12px;
}
.commercial__text span.star {
  color: #ff0000;
  margin-bottom: 5px;

}
.commercial__btn {
  max-width: 270px;
}
.commercial__feat-icon {

}
.commercial__inner-block-img-wrapper {
  position: relative;
}
.commercial__inner-block-img {
  position: absolute;
  top: -45px;
  right: 20px;
  width: 300px;
  height: auto;
  animation: float 6s ease-in-out infinite;
}

@keyframes float {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-10px);
  }
  100% {
    transform: translateY(0px);
  }
}

.commercial__feat span.greenline {
  /* text-decoration: underline; */
  text-decoration-color: #28a745;
}
.commercial__feat ul {
  display: flex;
  margin-bottom: 15px;
  flex-wrap: wrap;
  flex-direction: row;
}
.commercial__feat ul li.commercial__feat-icon {
  margin-right: 10px;
}
.commercial__feat ul li.commercial__feat-icon:before {
  content: none;
}
.commercial__feat ul li.commercial__feat-icon img {
  width: 45px;
  height: auto;
}
.commercial__feat-features-buttons {

}
.commercial__bottom {

}
.commercial__bottom-wrapper {

}
#sp-main-body {
    padding: 100px 0px 0px 0px;
}
body.home .commercial {
    position: relative;
    display: block;
    min-height: 0vh;
    padding: 30px;
    margin-bottom: 0;
    background: #f6f7f8;
    border-radius: 10px;
    border-left: 5px solid #28a745;
}

/* О НАС */
.team__wrapper {

}
.team__wrapper .team-wrap span.tt {
  font-family: "Oswald", sans-serif;
  font-style: normal;
}
.team__wrapper .team-wrap .team__img {

}
.team__wrapper .team-wrap .team__img img {
  border-left: 5px solid #28a745;
  border-radius: 10px;
}
.team__wrapper .team-wrap .team__title {
  min-height: 45px;
  margin-top: 15px;
  margin-bottom: 15px;
}
.team__wrapper .team-wrap .team__title div {
  font-family: "Oswald", sans-serif;
  text-align: center;
  text-transform: uppercase;
  font-weight: 600;
}
.team__wrapper .team-wrap .team__title p {
  font-size: 16px;
  text-align: center;
}
.team__wrapper .team-rekvizity {

}
.team__wrapper .team-rekvizity .txt__block {
  font-size: 16px;
  text-align: left;
}

/* ЦЕНЫ И АКЦИИ */
.price-top {
  font-size: 16px;
  margin-bottom: 30px;
}
.price-top h3.text-left {
  text-align: left;
  font-size: 26px;
}
.price-top .price-top-wrapper {
  padding: 15px;
  background-color: #f6f7f8;
  border-radius: 10px;
}
.price-top .price-top-wrapper .price-top-data {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.price-top .price-top-wrapper .format,
.price-top .price-top-wrapper .price {
  font-weight: 600;
  font-size: 18px;
}
.price-top .price-top-wrapper .text {
  min-height: 105px;
  margin-bottom: 30px;
}
.price-content h2 {
  padding: 30px 0px;
}
.price-content .navigation-block a {

}
.product-layout.product-listing {
  margin-bottom: 30px;
}
.product-listing .product-thumb {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: 15px;
  margin-bottom: 5px;
  border-radius: 10px;
  border-left: 5px solid #f6f7f8;
  background-color: #f6f7f8;
  align-items: center;
  flex-wrap: wrap;
  transition: 0.3s;
  -webkit-transition: all 0.3s ease-in-out 0s;
  -moz-transition: all 0.3s ease-in-out 0s;
  -ms-transition: all 0.3s ease-in-out 0s;
  -o-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
}
.product-listing .product-thumb:hover {
  border-left: 5px solid #28A745;
}
.product-listing .product-thumb .image {
  width: 10%;
  text-align: center;
}

.product-listing .product-thumb .name-wrap {
  width: 60%;
}

.product-listing .product-thumb .name-wrap .price-name a {
  color: #000;
  cursor: default;
  font-weight: 400;
}

.product-listing .product-thumb .name-wrap .price-name {
  color: #1c1c1c;
  font-size: 18px;
  font-weight: bold;
}

.product-listing .product-thumb .name-wrap .description {
  font-size: 12px;
}

.product-listing .product-thumb .name-wrap .description ul {
  font-size: 14px;
  padding: 0;
  margin: 0;
}

.product-listing .product-thumb .name-wrap .description ul li {
  margin-bottom: 0px;
}

.product-listing .product-thumb .price {
  width: 20%;
  text-align: center;
  font-weight: 600;
}

.product-listing .product-thumb .button-cta {
  width: 10%;
  text-align: center;
}

.product-listing .product-thumb .button-cta button {
  background: #28A745;
  color: #fff;
  padding: 10px 15px;
  margin-bottom: 0;
  border-radius: 10px;
}

.product-listing .product-thumb .image {
  background-image: url('/images/icons/doc.svg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 60px;
  height: 60px;
  transition: 0.5s;
  -webkit-transition: all 0.5s ease-in-out 0s;
  -moz-transition: all 0.5s ease-in-out 0s;
  -ms-transition: all 0.5s ease-in-out 0s;
  -o-transition: all 0.5s ease-in-out 0s;
  transition: all 0.5s ease-in-out 0s;
}
.product-listing .product-thumb:hover .image {
  background-image: url('/images/icons/doc-fill.svg');
}
.product-listing .wr-sales {
  margin-top: 30px;
}
.product-listing .wr-sales .sub_tit {
  margin-bottom: 30px;
}
.product-listing .wr-sales .status {
  font-size: 34px;
  font-weight: 600;
  color: #28A745;
}
.product-listing .wr-sales-wrapper {
  background: #f6f7f8;
  border-left: 5px solid transparent;
  border-radius: 10px;
  padding: 15px;
  transition: 0.3s;
  -webkit-transition: all 0.3s ease-in-out 0s;
  -moz-transition: all 0.3s ease-in-out 0s;
  -ms-transition: all 0.3s ease-in-out 0s;
  -o-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
}
.product-listing .wr-sales-wrapper:hover {
  border-left: 5px solid #28A745;
}
.product-listing .wr-sales-wrapper button {
  padding: 10px 15px;
}
.product-listing .wr-sales .text {
  font-size: 16px;
  margin-bottom: 30px;
}
.listing-h2.h2 {
  font-family: "Roboto", sans-serif;
  font-size: 2rem;
  font-weight: bold;
  color: #1c1c1c;
  margin-top: 15px;
  margin-bottom: 15px;
}

.navigation-block {
  display: flex;
  margin-bottom: 30px;
}
.navigation-links {
  display: flex;
  flex-direction: column;
}
.navigation-links span {
  color: #28A745;
  margin-right: 10px;
}
.navigation-links a {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  color: #28A745;
  margin-bottom: 10px;
}
.b24-form-sign {
  display: none!important;
}
/* Наши партнеры */
.partners-page .partner-wrap {
    margin-bottom: 50px;
}

.partners-page .partner-wrap .partner-img {
}

.partners-page .partner-wrap .partner-img img {
    margin: 0px 30px 30px 0px;
    max-width: 250px;
}
/* PDF */
.pdfagogo-container {
  margin-bottom: 30px;
}
.normativy-text {
  text-align: justify;
}
/* Tags */
.tags-cloud {
  margin-bottom: 30px;
}
.tags-cloud article {

}
.article-tags-item {

}
.article-tags-content {

}
.mod-articles-link {
  font-size: 9px;
  font-weight: 400;
  color: #fff;
  background: #28A745;
  padding: 5px 10px;
  border-radius: 10px;
}
.mod-articles-link:hover {
  color: #fff;
}
/* Contacts */
.contacts__block {

}
.contacts__block .contacts__inner {
  background: #f6f7f8;
  padding: 30px;
  border-radius: 10px;
  height: 100%;
}
.contacts__inner-block {
  margin-bottom: 15px;
}
.contacts__inner-block .contacts__inner-name {
  font-size: 18px;
  font-weight: 600;
}
.contacts__inner-block .contacts__inner-value {

}
.contacts__block .map.yamap_wrap {
  display: block;
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  max-width: 450px;
  height: 470px;
}
.contacts__block .map:before {
  content: "";
  display: block;
  padding-top: 100%;
}
.contacts__block .map.yamap_wrap .map_inner {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}
.contacts__block .map.yamap_wrap .map_inner .ymaps-2-1-56-controls__control, .contacts__block .map.yamap_wrap .map_inner .ymaps-2-1-56-controls__toolbar_right {
  display: none;
}

.contacts__block .map.yamap_wrap .map_inner .ymaps-2-1-56-events-pane {
  -webkit-box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, 0.4);
  box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, 0.4);
  border-radius: 50%;
}

/* Contacts Bitrix Form */
.contacts__inner-block.bitrix .b24-form-wrapper {
  background-color: transparent;
}
.contacts__inner-block.bitrix .b24-form-header {
  padding: 0;
}
.contacts__inner-block.bitrix h2#b24-form-form-1-title {
  font-size: 34px;
  padding: 0;
  margin-bottom: 8px;
}
.contacts__inner-block.bitrix h2#b24-form-form-1-title:before {
  content: none;
}
.contacts__inner-block.bitrix h2#b24-form-form-1-title:after {
  content: none;
}
.contacts__inner-block.bitrix .b24-form-content {
  padding: 0;
}
.contacts__inner-block.bitrix .b24-form-wrapper.b24-form-border-bottom {
  border-bottom: none;
}
.contacts__inner-block.bitrix .b24-form-control-string .b24-form-control {

}
.contacts__inner-block.bitrix .b24-form-sign {

}
.contacts__inner-block.bitrix .b24-form-btn {
  border-radius: 10px;
  font-size: 16px;
  font-weight: 400;
}
.contacts__inner-block.bitrix .b24-form-btn:hover {
  border-color: #218838;
  background-color: #218838;
}
.contacts__inner-block.bitrix {

}
/* Blog */
.blog-item {

}
.blog-item figure {
  overflow: hidden;
  border: 1px solid #28a745;
  border-left: 5px solid #28a745;
  -webkit-border-radius: 10px;
  border-radius: 10px;
}
.blog-item figure .img-responsive.slim {
  display: block;
  width: 100%;
  object-fit: cover;
  max-height: 280px;
  scale: 1;
  transition: 1.6s;
  -webkit-transition: all 1.6s ease-in-out 0s;
  -moz-transition: all 1.6s ease-in-out 0s;
  -ms-transition: all 1.6s ease-in-out 0s;
  -o-transition: all 1.6s ease-in-out 0s;
  transition: all 1.6s ease-in-out 0s;
}
.blog-item figure .img-responsive.slim:hover {
  scale: 1.1;
}
.blog-item .item-content {

}
.blog-item .blog__page-header {

}
.blog-item .blog__item-title {
  color: #0000000;
  font-size: 18px;
  text-overflow: ellipsis;
  font-weight: bold;
  text-align: center;
  margin-bottom: 15px;
  margin-top: 30px;
  min-height: 75px;
  line-height: 1.2;
}
.blog-item .blog__item-title a {
  color: #000000;
  font-weight: 400;
}
/* FAQ */
.question {

}
.question article {
    margin-bottom: 30px;
}
.question .wr-num {
  display: flex;
  flex-direction: row;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  height: 80px;
  padding-bottom: 30px;
}
.question .wr-num h3 {
    padding-left: 20px;
}
.question .wr-num .num {
  font-size: 68px;
  font-weight: 900;
  color: #dbdbdb;
  min-width: 62px;
  text-align: left;
}
.question .wr-qa {
    padding-left: 0;
    border: 1px solid #eceaea;
    border-radius: 10px;
    margin-bottom: 5px;
    border-left: 5px solid #28a745;
}
.question .wr-qa .quest.open:before {
    content: "";
    background-image: none;
    position: absolute;
    top: 40px;
    right: 40px;
    border: .4em solid transparent;
    border-bottom: .4em solid #28a745;
    font-size: 18px;
}
.question .wr-qa .quest {
    background: #f6f7f8;
    color: #000;
    position: relative;
}
.question .wr-qa .quest:before {
    content: "";
    background-image: none;
    position: absolute;
    top: 40px;
    right: 40px;
    border: .4em solid transparent;
    border-top: .4em solid #28a745;
    font-size: 18px;
}
.question .wr-qa .quest:hover {
    cursor: pointer;
}
.question .wr-qa .answer {
    display: none;
}
.question .wr-qa .answer,.question .wr-qa .quest {
    padding: 15px 0 15px 15px;
}
/* Glossariy */
.question.glossariy .wr-num {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    height: 80px;
    padding-bottom: 15px;
    padding-top: 15px;
    margin-bottom: 15px;
}

.wr-qa-gl .quest {
    font-size: 1.25rem;
    font-weight: bold;
    color: #000;
    margin-bottom: 15px;
}

.wr-qa-gl .answer .letter {
    font-size: 1.75rem;
    font-weight: bold;
    color: #000;
    margin-bottom: 15px;
    margin-top: 15px;
}

.question.glossariy article {

}
/* Free */
.article-item.free a {
  font-size: 14px;
  color: #000000;
  padding: 0px 30px;
  border: 1px solid #28a745;
  border-left: 5px solid #28a745;
  border-radius: 10px;
  min-height: 60px;
  display: flex;
  flex-direction: row;
  align-items: center;
  background: #f6f7f8;
}
/* Partners */
.partners .button__img img {
  border: none;
}