
:root {
  --black: #1D1F24;
  --space-gray: #6E7480;
  --steel-gray: #BBBFC7;
  --silver-gray: #EBEDF2;
  --white: #FFF;
  --beige-light: #FAEFD7;
  --beige: #E9C48D;
  --green: #006742;
  --green-light: #8CC5B0;
  --green-extra-light: #C4EADC;
  --error: #DF5634;
}

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}

body {position: relative; min-width: 100%; min-height: 100%; font-family: 'Raleway','Tahoma','Arial', sans-serif; font-size: 16px; line-height: normal; color: var(--black); font-weight: normal; overflow: auto; background: var(--white); -webkit-font-smoothing: antialiased; -webkit-text-size-adjust:none; text-size-adjust:none; -ms-text-size-adjust:none;}

body {font-variant-numeric: lining-nums; -moz-font-feature-settings:"lnum" 1; -moz-font-feature-settings:"lnum=1"; -ms-font-feature-settings:"lnum" 1; -o-font-feature-settings:"lnum" 1; -webkit-font-feature-settings:"lnum" 1; font-feature-settings:"lnum" 1;}

button, textarea, select, input {font-family: 'Raleway','Tahoma','Arial', sans-serif; font-size: 16px; line-height: normal; color: var(--black); outline: none !important; box-shadow: none;}

button,
input[type="button"],
input[type="submit"] {-webkit-appearance: none; box-shadow: none;}

ul, ol, li {list-style-type:none; padding: 0; margin: 0;}

a,
a:focus,
a:hover {text-decoration: none; outline: none; box-shadow: none;}

svg, path, g, circle, rect {transition: 0.2s;}

::selection {background: #DC0505; color: #FFF;}
::-moz-selection {background: #DC0505; color: #FFF;}

h1 {position: relative; font-weight: 500; font-size: 48px; color: var(--white);}

h2,
.h2_title {position: relative; margin: 0 0 24px; font-weight: 500; font-size: 38px; line-height: normal;}

.h2_center {margin: 0 0 48px; text-align: center;}

.h2_large {font-size: 48px;}

.block {width: 1320px; margin: 0 auto; box-sizing: border-box; position: relative; z-index: 3;}

.back_img {position: absolute; left: 0; top: 0; width: 100%; bottom: 0; z-index: 1; overflow: hidden;}
.back_img img,
.back_img source {position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; z-index: 1;}

.back_img__relative {position: relative; left: auto; top: auto; bottom: auto; width: 100%;}
.back_img__relative img,
.back_img__relative source {position: relative; display: block; left: auto; top: auto; width: 100%; height: auto; object-fit: initial; object-position: 0 0;}

.button_wrap {position: relative;}

.button {height: 70px; padding: 0 28px 2px; font-size: 18px; border-radius: 8px; border: 1px solid #000; display: inline-block; box-sizing: border-box; vertical-align: top; position: relative; text-align: center; margin: 0; transition: 0.2s;}
.button:hover {cursor: pointer;}

a.button {padding-top: 24px;}

.button_green {background: var(--green); border-color: var(--green); color: var(--white);}
.button_green:hover {background: transparent; color: var(--green);}

.button_lightgreen {background: var(--green-extra-light); border-color: var(--green-extra-light); color: var(--black);}
.button_lightgreen:hover {background: transparent; border-color: var(--green-light);}

.button_grey {background: var(--silver-gray); border-color: var(--silver-gray); color: var(--black);}
.button_grey:hover {background: transparent; border-color: var(--space-gray); color: var(--black);}

.button.disabled {opacity: 0.4;}

.container {position: relative; box-sizing: border-box;}

.cookie_notification {position: fixed; z-index: 80; left: -540px; bottom: 24px; width: 540px; font-size: 16px; line-height: 125%; color: var(--white); border-radius: 20px; padding: 20px 170px 20px 32px; background: var(--green); transition: 0.3s; box-sizing: border-box;}
.cookie_notification strong {font-weight: 700;}
.cookie_notification strong a {color: inherit; text-decoration: underline;}
.cookie_notification .button {position: absolute; height: 56px; right: 32px; top: 50%; transform: translateY(-50%);}

.flex_items {position: relative; width: 100%; display: flex; flex-flow: row wrap; justify-content: flex-start; align-items: flex-start;}
.flex_items__sb {justify-content: space-between;}

.h40 {height: 40px; width: 100%;}

.popup_zone,
.mobmenu_in,
.hidden {display: none;}

.main_layout {position: relative; background: var(--white);}

.notification {position: fixed; left: 24px; bottom: 24px; padding: 24px 32px; background: var(--black); transform: translateX(-100vw); font-size: 18px; line-height: 122%; z-index: 90; color: var(--white); border-radius: 8px; transition: 0.3s;}
.notification.error {background: var(--error); z-index: 91;}

.popup_in:hover {cursor: pointer;}


.solutions_item {position: relative; margin: 0 0 24px; border-radius: 20px; background: var(--beige-light); display: block; overflow: hidden;}
.solutions_item:last-of-type {margin: 0;}
.solutions_item__img {height: 180px; position: relative;}
.solutions_item__content {padding: 24px 32px; position: relative;}
.solutions_item__title {font-weight: 500; font-size: 26px; color: var(--black);}
.solutions_item svg {position: absolute; right: 32px; top: 50%; transform: translateY(-50%);}
.solutions_item:hover svg {right: 72px;}



/* ШАПКА И СУБМЕНЮ */

.header_container {width: 100%; position: absolute; left: 0; top: 0; z-index: 80; height: 85px; background: linear-gradient(0deg, rgba(30, 30, 30, 0) 17.19%, rgba(30, 30, 30, 0.6) 100%);}

.header_container .header_logo {position: absolute; left: 0; top: 18px;}
.header_container .header_logo svg {width: 236px;}

.header_container .header_menu {position: relative; margin: 0 0 0 295px; top: 18px; display: flex; justify-content: flex-end;}
.header_container .header_menu li {font-size: 16px; line-height: 125%; padding: 12px 12px; color: var(--white); position: relative; white-space: nowrap;}
.header_container .header_menu a {color: var(--white); display: block; white-space: nowrap; transition: 0.3s;}
.header_container .header_menu li:last-of-type {padding-right: 0;}

.header_container li.active,
.header_container li.active a {color: var(--green);}

.header_container .submenu_in:hover {cursor: pointer;}

body.light .header_container {background: transparent;}
body.light .header_container .header_logo g {fill: var(--green);}
body.light .header_container .header_menu li,
body.light .header_container .header_menu a {color: var(--black);}



.submenu {position: absolute; left: 0; width: 100%; height: 100%; z-index: -1; bottom: 100vh; transition: 0.3s;}
.submenu .submenu_container {position: relative; padding: 85px 0 0 0; border-radius: 0 0 24px 24px; background: var(--white);}
.submenu .submenu_block {padding: 36px 0 20px 342px; position: relative;}
.submenu .submenu_block:before {content:""; left: 342px; right: 0; position: absolute; top: 0; height: 1px; background: var(--steel-gray);}

.submenu .submenu_title {display: inline-block; color: var(--black); margin: 0 0 16px; font-weight: 500; font-size: 26px; transition: 0.2s;}
.submenu ul {margin: 0 0 32px;}
.submenu li {margin: 0 0 16px; font-size: 18px;}
.submenu li:last-of-type {margin: 0;}
.submenu li a {color: var(--black); transition: 0.2s;}


body.submenu_show .submenu {bottom: 0; z-index: 70; background: rgba(0, 0, 0, .5)}
body.submenu_show .header_container {background: transparent;}
body.submenu_show .header_container .header_logo g {fill: var(--green);}
body.submenu_show .header_container .header_menu li,
body.submenu_show .header_container .header_menu a {color: var(--black);}

body.submenu_show .header_container .submenu_in.active,
body.submenu_show .header_container .submenu_in.active span {color: var(--green);}



/* ГЛАВНАЯ */

.hometop_container .hometop_block {height: 100vh; padding: 0 0 60px; display: flex; align-items: flex-end; align-content: flex-end;}
.hometop_container .hometop_content {position: relative; margin: 0 0 0 auto; padding: 60px; box-sizing: border-box; width: 645px; background: var(--white); border-radius: 20px;}
.hometop_container .hometop_title {font-size: 38px; margin: 0 0 24px; color: var(--black); hyphens: auto;}
.hometop_container .hometop_text {font-size: 18px; line-height: 144%; margin: 0 0 48px;}

body.home .hometop_container .hometop_block {padding: 0 0 176px;}
body.home .hometop_container .hometop_content {width: 536px; background: var(--beige-light);}


.homedigits_container {padding: 40px 0;}
.homedigits_container li {width: calc((100% - 24px * 3)/4); padding: 14px 0 0 0; position: relative; display: block; text-align: center;}
.homedigits_container strong {display: block; padding: 0 0 16px; margin: 0 0 16px; font-weight: 500; font-size: 32px; line-height: normal; color: var(--green); border-bottom: 1px solid var(--steel-gray);}
.homedigits_container p {margin: 0; padding: 0; font-size: 18px; line-height: 122%; color: var(--space-gray);}


.homesolutions_container {padding: 40px 0;}
.homesolutions_container .homesolutions_left {border: 1px solid var(--steel-gray); border-radius: 20px; padding: 60px; width: 536px; min-height: 100%; position: relative; box-sizing: border-box; align-self: stretch; align-content: center;}
.homesolutions_container .homesolutions_left__title {font-weight: 500; margin: 0 0 24px;}
.homesolutions_container .homesolutions_left__text {font-size: 20px; line-height: 130%; margin: 0 0 48px; width: 100%; font-weight: 600; color: var(--space-gray);}
.homesolutions_container .homesolutions_right {width: calc(100% - 536px - 24px); position: relative;}


.homeprod_container {background: var(--green);}
.homeprod_container .homeprod_block {padding: 80px 0;}
.homeprod_container .homeprod_left {position: relative; width: calc(100% - 533px -24px); border-radius: 24px; overflow: hidden;}
.homeprod_container .homeprod_right {position: relative; padding: 60px; width: 533px; font-weight: 500; font-size: 38px; color: var(--white); box-sizing: border-box; align-self: stretch; align-content: center;}


.homesafe_container {background: var(--beige-light); padding: 40px 0 calc(40px - 24px);}
.homesafe_container .homesafe_left {position: relative; width: 424px; align-self: center;}
.homesafe_container .homesafe_left h2 {margin: 0;}
.homesafe_container .homesafe_right {width: calc(100% - 424px - 24px); position: relative; align-items: stretch; align-content: stretch;}
.homesafe_container .homesafe_item {width: calc((100% - 24px)/2); margin: 0 24px 24px 0; padding: 40px 40px 40px 144px; border: 1px solid var(--beige); border-radius: 20px; font-size: 18px; line-height: 122%; position: relative; box-sizing: border-box; display: flex; align-content: center; align-items: center;}
.homesafe_container .homesafe_item:nth-child(2n) {margin-right: 0;}
.homesafe_container .homesafe_item img {position: absolute; left: 40px; top: 50%; transform: translateY(-50%);}


.homeevolve_container {padding: 40px 0;}
.homeevolve_container .homeevolve_block {border-radius: 20px; overflow: hidden;}
.homeevolve_container .homeevolve_block:before {content:""; z-index: 4; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: linear-gradient(90deg, #e9ebf0 0%, rgba(233, 235, 240, 0) 100%);}
.homeevolve_container .homeevolve_content {display: flex; padding: 60px; height: 625px; max-width: 620px; box-sizing: border-box; position: relative; z-index: 5; flex-flow: row wrap; align-items: center; align-content: center;}
.homeevolve_container .homeevolve_title {margin: 0 0 32px; width: 100%; font-weight: 500; font-size: 26px;}
.homeevolve_container .homeevolve_text {font-size: 18px; line-height: 144%;}
.homeevolve_container .homeevolve_text p {margin: 0 0 18px; padding: 0;}
.homeevolve_container .homeevolve_text p:last-of-type {margin: 0;}


.homearticles_container {padding: 40px 0;}
.homearticles_container .homearticles_head {position: relative; margin: 0 0 48px;}
.homearticles_container .homearticles_head h2 {margin: 0;}
.homearticles_container .button {position: absolute; height: 58px; padding: 17px 24px 0; right: 0; top: 50%; transform: translateY(-50%);}


