.elementor-kit-8{--e-global-color-primary:#BEBEBE;--e-global-color-secondary:#FFFFFF;--e-global-color-text:#222222;--e-global-color-accent:#E1B165;--e-global-color-d9f6c8d:#E0E0E0;--e-global-typography-primary-font-family:"Montserrat";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Lora";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Open Sans";--e-global-typography-accent-font-weight:500;background-color:#F0F0F0;color:var( --e-global-color-text );font-family:"Roboto", Sans-serif;font-size:18px;}.elementor-kit-8 button,.elementor-kit-8 input[type="button"],.elementor-kit-8 input[type="submit"],.elementor-kit-8 .elementor-button{background-color:#333333;font-family:"Roboto", Sans-serif;font-size:18px;font-weight:600;line-height:1.5px;letter-spacing:0.4px;color:#333333;border-radius:0px 0px 0px 0px;}.elementor-kit-8 e-page-transition{background-color:#FFFFFF;}.elementor-kit-8 p{margin-block-end:16px;}.elementor-kit-8 a{color:#222222;font-family:"Montserrat", Sans-serif;}.elementor-kit-8 a:hover{color:#E1B165;}.elementor-kit-8 h1{color:#222222;font-family:"Montserrat", Sans-serif;font-size:32px;font-weight:700;line-height:1.4em;}.elementor-kit-8 h2{color:#222222;font-family:"Montserrat", Sans-serif;font-size:24px;font-weight:700;line-height:1.4em;letter-spacing:0.4px;}.elementor-kit-8 h3{color:#222222;font-family:"Montserrat", Sans-serif;font-size:18px;font-weight:700;line-height:1.4em;letter-spacing:0.3px;}.elementor-kit-8 h4{color:#222222;font-family:"Lora", Sans-serif;font-size:16px;font-weight:400;line-height:1.4em;letter-spacing:0.3px;}.elementor-kit-8 h5{color:#222222;font-family:"Montserrat", Sans-serif;font-size:14px;font-weight:700;line-height:1.4em;letter-spacing:0.2px;}.elementor-kit-8 h6{color:#222222;font-family:"Lora", Sans-serif;font-size:12px;font-weight:400;line-height:1.4em;letter-spacing:0.2px;}.elementor-kit-8 button:hover,.elementor-kit-8 button:focus,.elementor-kit-8 input[type="button"]:hover,.elementor-kit-8 input[type="button"]:focus,.elementor-kit-8 input[type="submit"]:hover,.elementor-kit-8 input[type="submit"]:focus,.elementor-kit-8 .elementor-button:hover,.elementor-kit-8 .elementor-button:focus{color:#717171;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:100%;}.e-con{--container-max-width:100%;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* Подключение шрифтов */

/* Montserrat */
@font-face {
  font-family: 'Montserrat';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url('https://energosteel.su/wp-content/uploads/Fonts/Montserrat-Regular.woff2') format('woff2'),
       url('https://energosteel.su/wp-content/uploads/Fonts/Montserrat-Regular.woff') format('woff');
}

@font-face {
  font-family: 'Montserrat';
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  src: url('https://energosteel.su/wp-content/uploads/Fonts/Montserrat-SemiBold.woff2') format('woff2'),
       url('https://energosteel.su/wp-content/uploads/Fonts/Montserrat-SemiBold.woff') format('woff');
}

@font-face {
  font-family: 'Montserrat';
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: url('https://energosteel.su/wp-content/uploads/Fonts/Montserrat-Bold.woff2') format('woff2'),
       url('https://energosteel.su/wp-content/uploads/Fonts/Montserrat-Bold.woff') format('woff');
}

/* Lora */
@font-face {
  font-family: 'Lora';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url('https://energosteel.su/wp-content/uploads/Fonts/Lora-Regular.woff2') format('woff2'),
       url('https://energosteel.su/wp-content/uploads/Fonts/Lora-Regular.woff') format('woff');
}

/* Open Sans */
@font-face {
  font-family: 'Open Sans';
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src: url('https://energosteel.su/wp-content/uploads/Fonts/OpenSans-Medium.woff2') format('woff2'),
       url('https://energosteel.su/wp-content/uploads/Fonts/OpenSans-Medium.woff') format('woff');
}

/* Roboto */
@font-face {
  font-family: 'Roboto';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url('https://energosteel.su/wp-content/uploads/Fonts/Roboto-Regular.woff2') format('woff2'),
       url('https://energosteel.su/wp-content/uploads/Fonts/Roboto-Regular.woff') format('woff');
}

/* Основные стили */
body {
  background-color: #e0e0e0; /* Цвет фона страницы */
  font-family: 'Roboto', sans-serif; /* Основной шрифт */
}


.menu-container {
  display: flex;
}

.menu-container .menu-item {
  /* Выпуклая прямая кнопка и поле ввода */
  
  border-radius: 20px;
  box-shadow: 2px 2px 4px #bebebe, -2px -2px 4px #ffffff;
  transition: box-shadow 0.9s ease;
  margin: 0 10px; /* Добавляет расстояние по горизонтали */
  flex-grow: 1; /* Равномерно распределяет пространство */
  text-align: center; /* Центрирует текст внутри кнопки */

}

.menu-item:hover {
  box-shadow: 4px 4px 8px #bebebe, -4px -4px 7px #ffffff;
  /* Подсветка при наведении */
  border-bottom: 2px solid #e1b165; /* Линия внизу */
}

/* Стиль для выпадающего меню */
.elementor-nav-menu1 .sub-menu {
    background-color: rgba(255, 255, 255, 0.9) !important; /* Полупрозрачная подложка */
    padding: 30px !important;
    border-radius: 30px !important; /* Легкое скругление углов */
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1) !important; /* Легкая тень */
    backdrop-filter: blur(5px); /* Эффект размытия фона (необязательно) */
}

/* Стиль для пунктов выпадающего меню */
.elementor-nav-menu1 .sub-menu li a {
      

    padding: 10px 15px !important;
    display: flex !important;
    align-items: center;
    color: #222222 !important;
    text-decoration: none !important;
    border-radius: 30px !important; /* Легкое скругление углов */
    background-color: transparent !important;
    transition: background-color 0.3s ease, color 0.9s ease !important;
    
}

.elementor-nav-menu1 .sub-menu li {
    margin-bottom: 10px; /* Отступ между пунктами */
}

/* Убираем отступ у последнего элемента */
.elementor-nav-menu1 .sub-menu li:last-child {
    margin-bottom: 0;
}

/* Стиль при наведении на пункты выпадающего меню */
.elementor-nav-menu1 .sub-menu li a:hover {
    background-color: rgba(255, 255, 255, 0.9) !important; /* Более светлый фон при наведении */
    color: #e1b165 !important; /* Цвет текста при наведении */
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1) !important; /* Легкая тень */
  
}

@media (max-width: 768px) {
  .menu-container .menu-item {
    font-family: 'Montserrat', sans-serif !important;
    color: #222222 !important;
    display: block !important; /* Обеспечивает видимость текста */
    text-align: center !important; /* Центрирует текст */
    line-height: 1.4 !important; /* Улучшает читаемость */
    /*white-space: nowrap !important; /* Предотвращает перенос строк */
  }
}


/* Выпуклая прямая */
.neumorphic-flat {
  border-radius: 50px;
  background: #e0e0e0;
  box-shadow: 10px 10px 20px #bebebe, -10px -10px 20px #ffffff;
  transition: box-shadow 0.3s ease;
}

.neumorphic-flat:hover {
  box-shadow: 5px 5px 10px #bebebe, -5px -5px 10px #ffffff;
  /* Подсветка при наведении */
  border-bottom: 2px solid #e1b165; /* Линия внизу */
}

/* Выпуклая, но вогнутая */
.neumorphic-concave {
  border-radius: 50px;
  background: linear-gradient(145deg, #cacaca, #f0f0f0);
  box-shadow: 10px 10px 20px #bebebe, -10px -10px 20px #ffffff;
  transition: box-shadow 0.3s ease;
}

.neumorphic-concave:hover {
  box-shadow: 5px 5px 10px #bebebe, -5px -5px 10px #ffffff;
  /* Подсветка при наведении */
  border-bottom: 2px solid #e1b165; /* Линия внизу */
}

/* Выпуклая наружу */
.neumorphic-convex {
  border-radius: 50px;
  background: linear-gradient(145deg, #f0f0f0, #cacaca);
  box-shadow: 10px 10px 20px #bebebe, -10px -10px 20px #ffffff;
  transition: box-shadow 0.3s ease;
}

.neumorphic-convex:hover {
  box-shadow: 5px 5px 10px #bebebe, -5px -5px 10px #ffffff;
  /* Подсветка при наведении */
  border-bottom: 2px solid #e1b165; /* Линия внизу */
}

/* Утопленная */
.neumorphic-inset {
  border-radius: 50px;
  background: #e0e0e0;
  box-shadow: inset 0 0 10px #bebebe;
  transition: box-shadow 0.3s ease;
}

.neumorphic-inset:hover {
  box-shadow: inset 0 0 20px #bebebe;
  /* Подсветка при наведении */
  border-bottom: 2px solid #e1b165; /* Линия внизу */
}

/* Выпуклая прямая кнопка и поле ввода */
.neumorphic-flat-small {
  border-radius: 20px !important;
 
  box-shadow: 3px 3px 6px #bebebe, -3px -3px 6px #ffffff !important;
  transition: box-shadow 0.9s ease !important;
}

.neumorphic-flat-small:hover {
  box-shadow: 2px 2px 4px #bebebe, -2px -2px 4px #ffffff !important;
  /* Подсветка при наведении */
  border-bottom: 2px solid #e1b165 !important; /* Линия внизу */
}


.call-button, .neumorphic-flat-small {
    border-radius: 20px !important;
    background: #f0f0f0 !important;
    color: #333 !important;
    border: none !important;
    box-shadow: 3px 3px 6px #bebebe, -3px -3px 6px #ffffff !important;
    transition: box-shadow 0.9s ease !important;
    font-weight: normal !important; /* Сделаем шрифт обычным */
    font-size: 24px !important; /* Установим стандартный размер */
    padding: 20px 20px !important; /* Добавим отступы внутри кнопки */
    text-align: center !important; /* Выравнивание текста */
    display: inline-block !important; /* Для корректного отображения */
}

.call-button:hover, .neumorphic-flat-small:hover {
    box-shadow: 2px 2px 4px #bebebe, -2px -2px 4px #ffffff !important;
    border-bottom: 2px solid #e1b165 !important;
}





/* Выпуклая, но вогнутая кнопка и поле ввода */
.neumorphic-concave-small {
  border-radius: 20px;
  background: linear-gradient(145deg, #cacaca, #f0f0f0);
  box-shadow: 3px 3px 6px #bebebe, -3px -3px 6px #ffffff;
  transition: box-shadow 0.3s ease;
}

.neumorphic-concave-small:hover {
  box-shadow: 2px 2px 4px #bebebe, -2px -2px 4px #ffffff;
  /* Подсветка при наведении */
  border-bottom: 2px solid #e1b165; /* Линия внизу */
}

/* Выпуклая наружу кнопка и поле ввода */
.neumorphic-convex-small {
  border-radius: 20px;
  background: linear-gradient(145deg, #f0f0f0, #cacaca);
  box-shadow: 3px 3px 6px #bebebe, -3px -3px 6px #ffffff;
  transition: box-shadow 0.3s ease;
}

.neumorphic-convex-small:hover {
  box-shadow: 2px 2px 4px #bebebe, -2px -2px 4px #ffffff;
  /* Подсветка при наведении */
  border-bottom: 2px solid #e1b165; /* Линия внизу */
}

/* Утопленная кнопка и поле ввода */
.neumorphic-inset-small {
  border-radius: 20px;
  background: #e0e0e0;
  box-shadow: inset 0 0 5px #bebebe;
  transition: box-shadow 0.3s ease;
}

.neumorphic-inset-small:hover {
  box-shadow: inset 0 0 10px #bebebe;
  /* Подсветка при наведении */
  border-bottom: 2px solid #e1b165; /* Линия внизу */
}

/* Текст */
.neumorphic-text {
  color: #000; /* Черный текст */
}

.neumorphic-text:hover {
  /* Подсветка при наведении */
  border-bottom: 2px solid #e1b165; /* Линия внизу */
}

  .logo-container  {
  border-radius: 50px;
  /*background: #e0e0e0;*/
  box-shadow: 6px 6px 10px #bebebe, -6px -6px 10px #ffffff;
  transition: box-shadow 0.3s ease;
}

.logo-container:hover {
  box-shadow: 3px 3px 6px #bebebe, -3px -3px 6px #ffffff;
  /* Подсветка при наведении */
  border-bottom: 2px solid #e1b165; /* Линия внизу */
}




/* Поле ввода */ 
.FeedbackForm .input-form { 
    position: relative; display: flex; 
    align-items: center; margin-bottom: 20px; /* Добавляем отступ между полями */
} 
    
.FeedbackForm .input-form__field { 
    width: 300px; height: 40px; 
    background: #f0f0f0; 
    box-shadow: inset 2px 2px 3px #bebebe, inset -2px -2px 3px #ffffff; 
    border-radius: 40px !important; 
    border: none !important; 
    outline: none !important; 
    padding: 0 20px; 
    padding-left: 60px; 
    font-size: 16px; 
    font-family: 'Montserrat', sans-serif; 
    color: #6C7587; 
    line-height: 40px; 
    transition: all 0.3s ease; 
    box-sizing: border-box; 
} 

.FeedbackForm .input-form__field:focus { 
    border-bottom: 2px solid #e1b165 !important; 
} 

.FeedbackForm .input-form__field:hover { 
    box-shadow: 10px 10px 20px #bebebe, -10px -10px 20px #ffffff; 
    border-bottom: 2px solid #e1b165; 
} 

.FeedbackForm .input-form__field::placeholder { 
    font-family: 'Montserrat', sans-serif; 
    font-size: 12px; 
    color: #6C7587; opacity: 0.6; 
} 

.ImgForm { 
    background: #f0f0f0; 
    box-shadow: inset 2px 2px 3px #bebebe, inset -2px -2px 3px #ffffff; 
    border-radius: 40px; 
    border: none; 
    outline: none; 
    padding: 0 20px; 
    font-size: 16px; 
    font-family: 'Montserrat', sans-serif; 
    color: #6C7587; 
    line-height: 40px; 
    transition: all 0.3s ease; 
    box-sizing: border-box; 
    border-bottom: 1px solid #bebebe; /* Линия внизу */ 
} 

.ImgForm:focus { 
    border-bottom: 2px solid #e1b165; 
} 

.ImgForm:hover { 
    box-shadow: 1px 1px 4px #bebebe, -1px -1px 4px #ffffff; 
    border-bottom: 2px solid #e1b165; 
    
} /* Стили для текстовых ссылок */ 

.phone-link { 
    color: var(--e-global-color-text); /* Цвет текста */ 
    text-decoration: underline; /* Подчёркивание */ 
    cursor: pointer; /* Курсор указывает на интерактивность */ 
} 

.phone-link:hover { 
    color: #e1b165; /* Цвет при наведении */ 
} /* Стили для текстовых ссылок */ 

.phone-link { 
    color: var(--e-global-color-text); /* Цвет текста */ 
    text-decoration: underline; /* Подчёркивание */ 
    cursor: pointer; /* Курсор указывает на интерактивность */ 
} 

.phone-link:hover { 
    color: #e1b165; /* Цвет при наведении */ 
} /* Стили для модального окна */ 

#customModal { 
    position: fixed; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    background: rgba(0, 0, 0, 0.5); 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    z-index: 1000; 
} 

#customModal .modal-content { 
    background: #f0f0f0; 
    padding: 30px; 
    border-radius: 30px; 
    max-width: 400px; 
    text-align: center; 
    box-shadow: 3px 3px 6px #6b6b6b, -2px -2px 4px #ffffff; 
    position: relative; 
} 

#customModal h3 { 
    font-family: 'Montserrat', sans-serif; 
    font-size: 18px; 
    color: #222222; 
    margin-bottom: 50px; 
} 

#customModal input, #customModal textarea { 
    width: 100%; 
    height: 40px; 
    background: #f0f0f0; 
    box-shadow: inset 2px 2px 3px #bebebe, inset -2px -2px 3px #ffffff; 
    border-radius: 40px !important; 
    border: none !important; 
    outline: none !important; 
    padding: 10px 20px; 
    font-size: 16px; 
    font-family: 'Montserrat', sans-serif; 
    color: #6C7587; 
    margin-bottom: 15px; 
    transition: all 0.3s ease; 
    box-sizing: border-box; 
    font-weight: normal !important; 
} 

#customModal textarea { 
    height: 80px; 
    border-radius: 20px !important; 
} 

#customModal input:focus, #customModal textarea:focus { 
    border-bottom: 2px solid #e1b165 !important; 
} 

#customModal button { 
    border-radius: 20px; 
    background: #f0f0f0; 
    color: #333; 
    border: none; 
    box-shadow: 3px 3px 6px #bebebe, -3px -3px 6px #ffffff; 
    transition: box-shadow 0.3s ease; 
    font-size: 16px; 
    padding: 10px 20px; 
    text-align: center; 
    display: inline-block; 
    width: 100%; 
    cursor: pointer; 
    font-weight: normal !important; 
    padding: 20px !important; 
    margin-bottom: 15px; 
} 

#customModal button:hover { 
    box-shadow: 2px 2px 4px #bebebe, -2px -2px 4px #ffffff; 
    border-bottom: 2px solid #e1b165; 
} 

#customModal #closeModal { 
    background: url("https://energosteel.su/wp-content/uploads/2025/01/CloseModal_1.webp") no-repeat center center; 
    background-size: contain; 
    width: 30px !important; 
    height: 30px !important; 
    border: none; 
    box-shadow: 3px 3px 6px #bebebe, -3px -3px 6px #ffffff; 
    transition: box-shadow 0.3s ease, border-bottom 0.3s ease; 
    cursor: pointer; 
    position: absolute; 
    top: 15px; 
    right: 15px; 
    padding: 0; 
} 

#customModal #closeModal:hover { 
    box-shadow: 2px 2px 4px #bebebe, -2px -2px 4px #ffffff; 
    border-bottom: 2px solid #e1b165; 
}

/* Поле ввода 
.input {
  position: relative;
  display: flex;
  align-items: center;
}
.input__field {
  width: 300px;
  height: 40px;
  background: #f0f0f0;
  box-shadow: inset 2px 2px 3px #bebebe, inset -2px -2px 3px #ffffff;
  border-radius: 40px !important;
  border: none !important;
  outline: none !important;
  padding: 0 20px; /* Убираем padding слева 
  padding-left: 60px; /* Добавляем padding слева отдельно 
  font-size: 16px;
  font-family: 'Montserrat', sans-serif;
  color: #6C7587;
  line-height: 40px; /* Добавляем line-height 
  transition: all 0.3s ease;
  box-sizing: border-box; /* Добавляем box-sizing 
}
.input__field:focus {
  border-bottom: 2px solid #e1b165 !important;
}
.input__field:hover {
  box-shadow: 10px 10px 20px #bebebe, -10px -10px 20px #ffffff;
  border-bottom: 2px solid #e1b165;
}
.input__field::placeholder {
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  color: #6C7587;
  opacity: 0.6;
}

/* Кнопка отправки 
.FeedbackForm .neumorphic-flat-small-form {
  border-radius: 20px;
  box-shadow: 3px 3px 6px #bebebe, -3px -3px 6px #ffffff;
  transition: box-shadow 0.9s ease;
}
.FeedbackForm .neumorphic-flat-small-form:hover {
  box-shadow: 2px 2px 4px #bebebe, -2px -2px 4px #ffffff;
  border-bottom: 2px solid #e1b165;
}

/* Всплывающее окно 
#popupMessage {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    background: #f0f0f0;
    padding: 20px 30px;
    border-radius: 20px;
    box-shadow: 3px 3px 6px #bebebe, -3px -3px 6px #ffffff;
    z-index: 1001;
    text-align: center;
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    color: #222222;
    max-width: 400px;
    width: 100%;
    opacity: 0;
    transform: translateY(-20px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}
#popupMessage.show {
    opacity: 1;
    transform: translateY(0);
}
#popupMessage.success {
    background: #d4edda; /* Зеленый фон для успеха 
    color: #155724;
    box-shadow: 3px 3px 6px #c3e6cb, -3px -3px 6px #ffffff;
}
#popupMessage.error {
    background: #f8d7da; /* Красный фон для ошибки 
    color: #721c24;
    box-shadow: 3px 3px 6px #f5c6cb, -3px -3px 6px #ffffff;
}
#popupMessage button.close-popup {
    background: none;
    border: none;
    font-size: 20px;
    cursor: pointer;
    position: absolute;
    top: 10px;
    right: 10px;
    color: inherit;
}
#popupMessage button.close-popup:hover {
    color: #e1b165; /* Цвет при наведении *//* End custom CSS */