/* изображение в хедер */
:root {
  /* общий левый край — совпадает с левой гранью логотипа */
  --edge-left: 24px;
  --hero-max: 1200px;
  --hero-pad: 40px;
  --hero-gap: 40px;
  --col-left: 1.15fr;
  --col-right: 0.85fr;
}


.header {
  height: auto;
  
}

/* .grayscale-bg-img::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: #D7E3F4;
  background-size: cover;
  filter: grayscale(1);
  z-index: 0;
  pointer-events: none;
  height: auto;
}
.grayscale-bg-img > * {
  position: relative;
  z-index: 1;
} */


.dv_hd_txt div {
  font-family: "helveticaneuecyrlight",  sans-serif;
  font-size: 34px;
  color: #005B96;
  line-height: 38px;
  
}
.background_grid_hero {
  padding: 100px;        
  background-color: #D7E3F4 ;
  justify-content: center;
   /* min-height: 60vh; */
}



/* Контейнер секции под навбаром */

.podlowka_dv.hero {
  padding: 40px 20px 40px var(--edge-left); 
  margin: 0 auto; 
  height: 70%;
  width: 1560px;      
}

.hero-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 40px;
  align-items: center;
}

/* Левая колонка (текст) / Правая (картинка) */
.hero-left { 
  text-align: left;
  height: 250px;

}

.hero-right {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Заглушка под изображение */

.hero-placeholder {
  width: 100%;
  aspect-ratio: 4 / 3;  
  min-height: 320px;
  border: 2px dashed #cfcfcf;
  border-radius: 10px;
  background: #f9f9f9;
  color: #888;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Если вместо заглушки будет картинка */
.hero-image {
  width: 100%;
  max-width: 560px;
  height: auto;
  object-fit: contain;
  border-radius: 10px;
}

.dv_hd_txt, .komplex-block {
  text-align: left;
}


/* Дополнительно, если меню должно быть сразу под блоком без зазора */
.custom-menu {
  margin-top: 0;
}


.dv_menu {
  width: 100%;
  font-family: "helveticaneuecyrlight", sans-serif;
  font-size: 14px;
  color: #000000;
  margin: 0 0 0; 
  
}

.dv_mn {
  display: flex;
  justify-content: space-around;
  align-items: center;
  background-color: #FFFFFF;
  opacity: 0.9;
  width: 100%;
  box-sizing: border-box;
  padding: 0 40px;

}

.dv_menu ul,
.tel {
  display: flex;
  align-items: center;
}

.dv_menu ul li {
  padding: 5px 40px;
  cursor: pointer;
  position: relative;
 

}

/* цвет текста в nav bar  */



 .main-menu li a {
  color: #4A4A4A;
  text-decoration: none; 
}

.main-menu li a:hover {
  color: #E65100 ; 
}
.main-nav > ul {
  list-style: none;
  margin: 0;
  padding-left: var(--edge-left);
}
.zayavka-button_menu{
  padding: 12px 24px;
    background-color: #F57C00;
    color: #FFFFFF !important;
    text-decoration: none;
    margin-left: 150px;
    border: none;
    border-radius: 4px;
    font-size: 16px;
    transition: background-color 0.3s ease;
    cursor: pointer;

  
}
.zayavka-button_menu:hover {
    background-color: #f78437;
  }

.zayavka-button {
    display: inline-block;
    padding: 12px 24px;
    background-color: #F57C00;
    color: #FFFFFF !important;
    text-decoration: none;
    margin-left: 150px;
    border: none;
    border-radius: 4px;
    font-size: 16px;
    transition: background-color 0.3s ease;
    cursor: pointer;
  }

  .zayavka-button:hover {
    background-color: #ffffff;
  }



.podlowka_dv {
  position: relative;
  transform-origin: initial;

  border-radius: 10px;
  box-shadow: 0 0 30px 40px #fff;
  background-color: #fff;
  opacity: 0.95;

  padding: 32px 40px;
  margin: 150px;
  }


 
/* текст на главной в header  */

.komplex-block {
  max-width: calc(50vw - var(--edge-left));
  text-align: left;
}

.komplex-title {
  font-size: 35px;
  color: #005B96;
  font-family: "helveticaneuecyrmedium", sans-serif;
}

.komplex-desc {
  color: #6B7280;
  font-size: 18px;
  line-height: 1.55;
  margin: 0 0 20px;
}
/* Общий стиль кнопки */


.zayavka-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 20px;
  background: #F57C00;
  color: #fff;
  text-decoration: none;
  border-radius: 8px;
  font-weight: 600;
  margin: 0; 
}


.zayavka-button:hover {
  background-color: #ebc5b4;
  color: #ffffff;             
  border-color: #F57C00;       
}

/* меню после блока  */
.custom-menu {
  background-color: #005B96;
  padding: 20px 0;
}



.menu-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 30px;
}

.menu-list li a {
  color: #FFFFFF;
  text-decoration: none;
  font-size: 18px;
  font-family: Arial, sans-serif;
  transition: color 0.3s;
}

.menu-list li a:hover {
  text-decoration: underline;
}


/* почему выбирают нас */
.why-choose-us {
  max-width: 1140px;
  margin:  auto;
  padding: 20px;
  text-align: center;
}

.why-title {
  color: #005B96;
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 30px;
  font-family: Arial, sans-serif;
}

.why-cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
}

.why-card {
  background-color: #F5F5F5;
  border-radius: 10px;
  padding: 20px;
  flex: 1 1 300px;
  max-width: 320px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  transition: transform 0.3s ease;
  text-align: left;
}

.why-card:hover {
  transform: translateY(-5px);
}

.why-card h3 {
  font-size: 18px;
  font-weight: bold;
  color: #000;
  margin-bottom: 10px;
  display: inline-block;
  padding: 4px 8px;
  border-radius: 4px;
}

.why-card p {
  font-size: 14px;
  color: #333;
  margin: 0;
  line-height: 1.5;
}

/* блок о компнии */
.dv_welcome {
  font-family: "helveticaneuecyrroman",  sans-serif;
  background-color: #D7E3F4;
  
  background-size: 100%;
  padding: 59px 0 400px ;
  padding-bottom: 0;
  color: #4A4A4A;
  margin: 0 auto;

}
.dv_welcome img {
  display: block;
    width: 100%;
    max-height: 100%;
  }


  
.wel_dv1,
.wel_dv2 {
  width: 550px;
  line-height: 29px;
  z-index: 1;
}

.wel_tit {
  font-family: "helveticaneuecyrbold",  sans-serif;
  font-size: 25px;
  color: #005B96;
  font-weight: bold;
  margin-bottom: 20px;
  text-decoration: none;
  margin: 0 0 14px;
  line-height: 2.2;
}

.wel_txt {
  font-family: "helveticaneuecyrbold",  sans-serif;
  font-size: 15px;
  line-height: 1.6;
  text-align: justify;
}

.custom-list {
  list-style-type: disc;
  padding-left: 18px;
  margin: 0;
}

.custom-list li {
  margin-bottom: 5px;
  line-height: 1.7;
}
.clear {
  clear: both;
}

/* слайдер */
.slider-section {
  background-color: #005B96;
  padding: 40px 0;
  text-align: center;
}

.slider-title {
  color: #ffffff;
  font-size: 28px;
  margin-bottom: 30px;
  font-family: Arial, sans-serif;
}

.slick-slider {
  max-width: 100%;
}


.slide {
  position: relative;
  background-size: cover;
  background-position: center;
  height: 500px; 
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-top: 100px;
  padding-left: 200px;
  padding-right: 0;
}

.slide-content {
  background-color: #ffffff;
  padding: 30px;
  border-right: 6px solid #F57C00;
  color: #4A4A4A;
  text-align: left;
  max-width: 500px;
  font-family: Arial, sans-serif;
  margin-top: 100px;
  margin-right: 50px;
}

.slide.slide--lower .slide-content {
  margin-top: 255px;        
}


.slide.slide--lower_1 .slide-content {
  margin-top: 190px;        
}

.slide.slide--lower_2 .slide-content {
  margin-top: 200px;        
}
.slide.slide--lower_3 .slide-content {
  margin-top: 250px;        
}
.slide.slide--lower_4 .slide-content {
  margin-top: 220px;        
}

.slide-content h3 {
  font-size: 22px;
  color: #005B96;
  margin-bottom: 15px;
 
}

.slide-content ul {
  padding-left: 20px;
  margin: 0;
}

.slide-content ul li {
  margin-bottom: 8px;
  font-size: 15px;
  line-height: 1.4;
}

/* Общие стили для стрелок */
.slick-prev,
.slick-next {
  background-color: #F57C00;
  color: #ffffff;
  border: none;
  z-index: 5;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 0; /* скрывает текст */
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  transition: background-color 0.3s ease;
}

.slick-prev:hover,
.slick-next:hover {
  background-color: #E65100;
}

/* ------ Размещение ------ */
.slick-prev {
  left: 20px;
}

.slick-next {
  right: 20px;
}

.slick-prev::before,
.slick-next::before {
  font-family: "slick";
  font-size: 24px;
  line-height: 1;
  opacity: 1;
  color: #ffffff;
}

.slider-dots {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 12px 0 18px;
  position: relative;
  z-index: 2;
}

.slider-dots .slick-dots {
    justify-content: center;
  position: static;               
  display: flex;
  gap: 10px;
  list-style: none;
  flex-wrap: wrap; 
  margin: 0;
  padding: 0;
}

.slider-dots .slick-dots li { margin: 0; }
.slider-dots .slick-dots li button {
  width: 10px; height: 10px;
  border-radius: 50%;
  border: 0;
  background: rgba(255,255,255,.6);
  font-size: 0;                   /* гасим текст */
  cursor: pointer;
  transition: background .2s, transform .2s;
  align-items: center;
}

.slider-dots .slick-dots li button::before { content: none; }

.slider-dots .slick-dots li.slick-active button {
  background: #F57C00;
  transform: scale(1.15);
}


/* блок наши преимущества */
.advantages-block {
  background-color: #D7E3F4;
  padding: 60px 20px;
  
  box-sizing: border-box;
  font-family: "helveticaneuecyrlight", sans-serif;
}

.advantages-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 50px;
}

.adv-left {
  display: flex;
  align-items: center;
  gap: 20px;
  flex: 1 1 250px;
  min-width: 250px;
}

.adv-icon img {
  width: 48px;
  height: 48px;
}

.adv-title-main {
  font-size: 18px;
  font-weight: bold;
  color: #000000;
  text-transform: uppercase;
  margin-bottom: 4px;
}

.adv-title-sub {
  font-size: 14px;
  color: #777777;
  text-transform: uppercase;
}

.adv-items {
  display: flex;
  flex: 3 1 800px;
  gap: 40px;
  flex-wrap: wrap;
}

.adv-item {
  flex: 1 1 250px;
  min-width: 220px;
}

.adv-item h4 {

  font-size: 14px;
  font-weight: bold;
  color: #005B96;
  text-transform: uppercase;
  margin-bottom: 10px;
}



.adv-item p {
  color: #4A4A4A;
  font-size: 14px;
  line-height: 1.5;
}

/* размеры логотипов */
.tr_cnt img {
    width: 150px;
    height: auto;
    display: block;
  }

.tr_cnt.tr_cnt--cheb img { width: 100px; height: auto; } 
.tr_cnt.tr_cnt--hanti img { width: 150px; height: auto; } 
.tr_cnt.tr_cnt--nizhni_novgorod img { width: 270px; height: auto; }
.tr_cnt.tr_cnt--kazan img { width: 200px; height: auto; }
.tr_cnt.tr_cnt--sarov img { width: 200px; height: auto; }

.dv_lst_tit_1 {
  font-family: "helveticaneuecyrmedium", sans-serif;
}


.trust_us_dv {
  margin: 25px 0 0 0;
  width: 85%;
  display: inline-block;
  color: #005B96;
  font-size: 40px;
}

.tr_sl .slick-prev  { left: -56px; top: 45px;}
.tr_sl .slick-next  { right: -56px; top: 45px;}

.trust_us {
  display: inline-block;
  width: 100%;
  text-align: center;
  padding: 0 0 48px;
  position: relative;
  z-index: 4;
  background-color: #ffffff;
}
/* блок Наши преимущества в цифрах */
.fn_dv,
.fn_dv_txt {
  font-size: 20px;
  display: inline-block;
  text-transform: uppercase;
}

.fn_dv div:before {
  content: " ";
  display: block;
  width: 53px;
  height: 53px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'  viewBox='0 0 24 24'%3E%3Cpath d='M12 2L3 5V9C3 15 7.5 20 12 22C16.5 20 21 15 21 9V5L12 2Z' stroke='%23FFFFFF' stroke-width='1.5' fill='none'/%3E%3Ctext x='11.5' y='14' text-anchor='middle' font-size='6' font-family='Arial' fill='%23FFFFFF' font-weight='bold'%3E15%3C/text%3E%3C/svg%3E")
    center center no-repeat;
  position: absolute;
  left: 0px;
  top: -64px;
  right: 0px;
  margin: 0 auto;
}


@media (max-width: 768px) {
  .menu-list {
    flex-direction: column;
    align-items: center;
    gap: 15px;
  }

  .fn_dv {
    display: grid !important;                
    grid-template-columns: repeat(2, 1fr);
    gap: 20px 12px;
    width: 100%;
  }

  .fn_dv > div {
    padding-top: 40px;                       
  }
  .fn_tit {
    margin-bottom: 50px;
  }
  .fn_dv div:before {
    width: 40px;
    height: 40px;
    top: -50px;                               
  }

}

@media (max-width: 1200px) {
  :root {
    --hero-pad: 32px;
    --hero-gap: 32px;
  }
}
@media (max-width: 992px) {
  :root {
    --hero-pad: 24px;
    --hero-gap: 24px;
  }
}
@media (max-width: 576px) {
  :root {
    --edge-left: 16px; /* чтобы контент не лип к краю */
    --hero-pad: 16px;
    --hero-gap: 16px;
  }
}



@media (max-width: 768px) {
  .slide {
    justify-content: center;
    padding: 0 15px;
  }

  .slide-content {
    max-width: 100%;
    font-size: 14px;
  }
  .slide.slide--lower .slide-content {
    margin-top: 120px;        
  }


  .slide.slide--lower_1 .slide-content {
    margin-top: 0px;        
  }

  .slide.slide--lower_2 .slide-content {
    margin-top: 50px;        
  }
  .slide.slide--lower_3 .slide-content {
    margin-top: 50px;        
  }
  .slide.slide--lower_4 .slide-content {
    margin-top: 150px;        
  }
}

@media (max-width: 768px) {
  .advantages-block {
    background-color: #D7E3F4;
    box-sizing: border-box;
    font-family: "helveticaneuecyrlight", sans-serif;
    display: flex;
    flex-direction: column;
  }

  .advantages-inner {
    flex-direction: column;
    max-width: 500px;
    margin: 0 ;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 20px;
  }

  .adv-left {
    display: flex;
    align-items: center;
    gap: 20px;
    flex: 1 1 50px;
    min-width: 250px;
  }

  .adv-items {
    display: flex;
    flex-direction: row;
    gap: 30px;
    flex: 1 1 250px;
  }

  .adv-item {
    flex: 1 1 100%;
    min-width: unset; 
    /* width: 100%;       */
    height: 0;
  }

  .adv-left .div {
    flex-direction: row;
    align-items: flex-start;
    /* gap: 15px; */
    padding-bottom: 20px;
  }

  .adv-icon img {
    width: 40px;
    height: 40px;
  }

  .adv-title-main {
    font-size: 16px;
  }

  .adv-title-sub {
    font-size: 13px;
  }
}
@media (max-width: 992px) {
  .hero-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    
  }
  .background_grid_hero .podlowka_dv.hero {
    padding-left: 16px;         
    padding-right: 16px;
     padding: 15px 16px;
  }
  .hero-left {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center; 
    text-align: center;
    padding-top: 20px;
    min-height: auto; 
  }

}


.podlowka_dv.hero { 
  margin: 0 !important;     
}


.background_grid_hero {
  position: relative;
  display: flex;
  justify-content: center;
  padding: clamp(16px, 5vw, 100px);
  background-color: #D7E3F4;
  overflow: hidden;             
}
.background_grid_hero .podlowka_dv.hero {
  box-sizing: border-box;
  position: relative;
  /* width: min(960px, 100%);       */
  margin: 0 auto;               
  height: auto;                 
  padding: 24px 20px 24px var(--edge-left);
  justify-content: center;
}


@media (max-width: 576px) {
  .hero-placeholder { min-height: 180px; margin-top: 20px;}
  .zayavka-button { width: 100%; }
}

@media (max-width: 576px) {
  .podlowka_dv { box-shadow: 0 8px 24px rgba(0,0,0,.08); }
 
}


@media (max-width: 768px) {
  .zayavka-button_menu {
     padding: 12px 24px;
    background-color: #F57C00;
    color: #FFFFFF !important;
    text-decoration: none;
    margin-left: 0;
    margin-top: 70px;
    border: none;
    border-radius: 4px;
    font-size: 16px;
    transition: background-color 0.3s ease;
    cursor: pointer;
  }

  .zayavka-button {
    text-align: center;
    font-size: 14px;
    padding: 10px;
    max-width: 500px;

  }

  .podlowka_dv {
    transform: none;
    left: auto;
    top: auto;
    width: 100%;
    box-sizing: border-box;
    padding: 15px;
    margin: 10px auto;
    position: absolute;
  }
  .grnt-icon-bg {
    position: relative;
    width: 80px;
    height: 80px;
    margin-bottom: 40px;
    margin-top: 20px;
    margin-left: 20px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.07);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .grnt-icon-bg:before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 140px;
    height: 140px;
    background: radial-gradient(rgba(255, 153, 0, 0.07) 60%, transparent 100%);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    z-index: 0;
  }
  .dv_lst_1,
  .dv_lst_2 {
    width: 100vw;
    min-width: 100px;
    float: none;
    padding: 0;
    height: auto;
  }


  .dv_inps {
    width: 90%;
    padding: 0 8px 24px;
  }
  .dv_inps input {
    height: 40px;
    font-size: 15px;
    width: 90%;
    margin-bottom: 16px;
  }
  .dv_but {
    height: 44px;
    font-size: 16px;
    line-height: 44px;
    width: 98%;
    margin-bottom: 12px;
  }
  .dv_lst_txt {
    font-size: 11px;
    width: 98%;
  }

  .komplex-title {
    font-size: 20px;
    width: 170px;
  }

  .komplex-desc {
    font-size: 12px;
    width: 170px;
  }

  .komplex-block {
    text-align: left;
  }


  .trust_us_dv {
    margin: 25px 0 0 0;
    width: 85%;
    display: inline-block;
    color: #005B96;
    font-size: 40px;
  }

  .trust_us {
    display: inline-block;
    width: 100%;
    height: 200px;
    text-align: center;
    /* padding: 0 0 48px; */
    position: relative;
    z-index: 4;
    background-color: #ffffff;
  }

  .tr_sl .slick-prev  { 
    left: -26px; 
    top: 40px;
    }
  .tr_sl .slick-next  { 
    right: -26px; 
    top: 40px;
  }

  .tr_sl {
    height: 100px;
    margin-top: 0;
  }
  .tr_sl .img {
    height: 50px;
    width: 50px;
    margin-top: 0;
  }

  .tr_sl .tr_cnt img {
    width: clamp(90px, 20vw, 120px); /* управляем шириной */
    height: auto;                    /* сохраняем пропорции */
    max-height: 70px;                /* чтобы не вылезали по высоте */
    object-fit: contain;
  }

  .grnt-bottom-text {
    font-size: 15px;
    color: #222;
    max-width: 900px;
    margin: 20 auto 48px auto;
    text-align: center;
    font-family: "helveticaneuecyrmedium",  sans-serif;
    padding-top: 16px;
  }
  .dv_welcome {
     background-size: 500px auto; 
    padding: 40px 15px 200px 15px;
    margin-bottom: 50px;
    background-position: center bottom;
    background-repeat: no-repeat;
    padding-bottom: 0;
    margin: 0 auto;
  }
  .dv_welcome img {
    justify-content: center;
    max-height: 500px;
    height: 200px;
  }

  .wel_dv1,
  .wel_dv2 {
    width: 100%;
    padding: 0 10px;
    box-sizing: border-box;
    line-height: 1.5;
  }

  .wel_tit {
    font-size: 20px;
    margin-bottom: 12px;
    text-align: center;
  }

  .wel_txt {
    font-size: 16px;
    text-align: left;
    line-height: 1.5;
  }

  .dv_mn {
    flex-direction: column;
    padding: 10px 20px;
    background-color: #FFFFFF;
  }

  .dv_menu {
    font-size: 12px;
  }

  .dv_menu ul {
    flex-direction: column;
    width: 100%;
    padding: 0;
    margin: 0;
  }

  .main-menu {
    display: none;
    flex-direction: column;
    width: 100vw;
    background: #ffffff;
    position: relative;
    left: 0;
    top: 60px;
    z-index: 1000;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  }

  .dv_menu ul li {
    padding: 15px 20px;
    text-align: center;
    width: 100%;
    border-bottom: 1px solid #ddd;
  }

  
  
}
