@import url("font/montserrat/stylesheet.css");

:root{
    --color1:#2B415C;
    --color2: #4B72A2;
    --color3:#6888AE;
    --color4:#C6AD87;
    --color5:#F3F6F9;
}
HTML{}

BODY{line-height:1.5; font-size:14px; font-family: 'Montserrat', sans-serif; color: var(--color1)}
BODY._inner{ }

.__wrapper{ max-width: 1920px; padding-top: 80px }
.__container{ max-width: 1320px; margin:0  auto; }

._inner .__wrapper{ padding-top: 70px;}

/***/
h1{ font-weight: 800}
h2{ font-size: 22px; font-weight: 700}
a{ color: inherit}


.button{ font-size: 14px; font-weight: 500; letter-spacing: 1px; color: #fff; background-color: #C6A470; width: 210px; line-height: 48px; text-align: center; border-radius: 15px; box-shadow: 0px 16px 7px -9px rgb(43 65 92 / 18%); display: block;   text-decoration: none; border: none; cursor: pointer; transition: all 0.3s ease; max-width: 100%  }
.button:hover{ box-shadow: 3px 5px 13px rgba(13, 38, 79, 0.4); background-color: var(--red)}

/***/
header{ position: fixed; top: 0; left: 0; width: 100%; z-index: 100;  background: #fff   }
.header-items{ border-bottom: 1px solid rgb(0 0 0 / 10%);  padding: 12px 0 }
.header-item-logo{ width: 120px; height: 36px;    flex-grow: 1; z-index: 10}
.header-item-logo .header-logo{display: inline-block; height: 100%; width: 100%; background-image: url(../images/logo-m.svg); background-size: contain; background-position: left; background-repeat: no-repeat;}

.header-item-menu{ display: none}

.header-item-contacts{ display: flex; align-items: center;margin-right: 20px;}
.header-item-phones  a{ display:block; background-size: 20px; background-repeat: no-repeat; background-position: 0 center; display: block; font-weight: 400; font-size: 13px; }

.header-item-email{ margin-right: 15px;}
.header-item-email a{ display:block; background-image: url(../images/contacts-email-icon-w.svg); background-repeat: no-repeat; background-position: center; background-size: 22px; font-size: 0; width: 22px; height: 22px;}

.header-item-cosial{ margin-right: 20px}

.cosial-link{display: block; width: 24px; height: 24px; background-position: center; background-size: contain; background-repeat: no-repeat;}
.cosial-link.tg{ background-image: url(../images/social-tg.svg)}

/***/
.menu-button{ display:block; width: 22px; height:22px; z-index: 7100;  -webkit-transition: all 0.5s ease; transition: all 0.5s ease; right: 0; }
.menu-button .menu-icon{ display:block; width:22px;position:absolute; height:2px;  top:0; bottom:0; left:0; right:0; margin:auto;
    background: var(--color1);border-radius: 2px;}
.menu-button .menu-icon:before,
.menu-button .menu-icon:after{ display:block; content:""; position:absolute; height:2px; width:100%; left:0;
    margin:auto; background: var(--color1); -webkit-transition: all .3s ease; transition: all 0.3s ease; border-radius: 2px;}
.menu-button .menu-icon:before{ top:7px;}
.menu-button .menu-icon:after{ bottom:7px;}
.menu-button.is_open .menu-icon, .menu-button.is_open .menu-icon:before, .menu-button.is_open .menu-icon:after{  background: var(--red);}
.menu-button.is_open { -webkit-transform: rotate(-180deg)}
.menu-button.is_open .menu-icon{ height:0; }
.menu-button.is_open .menu-icon:before{-webkit-transform: rotate(-45deg);    transform: rotate(-45deg);      width: 100%;   top: 0; bottom:0;}
.menu-button.is_open .menu-icon:after{-webkit-transform: rotate(45deg);    transform: rotate(45deg);      width: 100%;   top: 0; bottom:0;}


.over-content nav:before{ display: block; content:""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(288.4deg, rgba(161, 163, 187, 0.3) 5.41%, rgba(234, 234, 234, 0.111) 93.94%)}
.over-content nav{ padding: 80px 30px; padding-left: 80px; -webkit-flex-direction: column; flex-direction: column;  -webkit-justify-content: flex-start !important; justify-content: flex-start !important; position: relative; -webkit-align-items: flex-start !important; align-items: flex-start !important; box-sizing: border-box; min-height: 100% }
.over-content nav a{ display: block; padding: 5px 0; margin: 5px 0; font-size: 16px; color: #191468;}


.over-content .header-item-menu{ display: block; height: 100%;display: flex;align-items: center;}
.over-content .menu-items{ color: var(--color1)}
.over-content  .menu-items ul li a{ color: var(--color1)}

/***/
.page{ }
.page p{ }
.page ol li,
.page ul li,
.page .ol .li,
.page .ul .li { }

.more-button{ color: #6888AE; display: inline-block; padding-right: 20px; background-repeat: no-repeat; background-position: right center; background-size: 16px; background-image: url("data:image/svg+xml,%3Csvg width='14' height='15' viewBox='0 0 14 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7 13.316C3.61725 13.316 0.875 10.6321 0.875 7.32331C0.875 4.01447 3.61725 1.33059 7 1.33059C10.3827 1.33059 13.125 4.01447 13.125 7.32331C13.125 10.6321 10.3827 13.316 7 13.316ZM7 0.474487C3.13381 0.474487 0 3.53934 0 7.32331C0 11.1073 3.13381 14.1721 7 14.1721C10.8662 14.1721 14 11.1073 14 7.32331C14 3.53934 10.8662 0.474487 7 0.474487ZM9.85906 6.94662L7.38456 4.52384C7.2135 4.3569 6.93656 4.3569 6.76594 4.52384C6.59487 4.69506 6.59487 4.96475 6.76594 5.13169L8.56887 6.89526H3.9375C3.69556 6.89526 3.5 7.08788 3.5 7.32331C3.5 7.55874 3.69556 7.75136 3.9375 7.75136H8.56887L6.76594 9.51493C6.59487 9.68187 6.59487 9.95584 6.76594 10.1228C6.93656 10.2897 7.2135 10.2897 7.38456 10.1228L9.85906 7.7C9.96406 7.59726 9.99688 7.45601 9.97282 7.32331C9.99688 7.19061 9.96406 7.04935 9.85906 6.94662Z' fill='%236888AE'/%3E%3C/svg%3E%0A");}

.block-link{ position: absolute; display: block; top:0; left: 0; width: 100%; height: 100%}

/**/
.double-block{ }
.double-block > div{ border-radius: 15px;}
.double-block-content{ background-color: rgb(243 246 249 / 80%); z-index: 10; font-weight: 500}
.double-block-image{ overflow: hidden; position: absolute; z-index: 0; top: 0; left: 0; width: 100%; height: 100%}
.double-block-image img{height: 100%; width: 100%; object-fit: cover}


/***/
.topbanner-content{ padding: 60px 20px;}
.topbanner-content h1{ margin: 0; line-height: 1.2; margin-bottom: 20px}
.topbanner-content h1 span:first-child{ display: block; font-size: 22px; max-width: 200px; }
.topbanner-content h1 span:last-child{ display: block; font-size: 50px; }
.topbanner-content p{ font-size: 14px;}
.topbanner-content .button-wrapper{margin-top: 20px}

.toppagebanner h1{ line-height: 1.2}
.toppagebanner img{ border-radius: 10px; max-height: 240px; width: 100%; object-fit: cover}

/**/
.company .double-block-content{ padding: 15px;}
.company-content h2{ margin-top: 0}
.company-content .more-button-wrap { text-align: right; margin-top: 15px}
.company-digits { display: flex; flex-wrap: wrap; }
.company-digits .digit-item{ flex-basis: calc(50% - 10px); margin-bottom: 15px; box-sizing: border-box; padding-left: 10px; max-width: 240px}
.company-digits .digit-item:before{content: ''; display: block; position: absolute; top:0; left: 0; width:2px; border-radius: 3px; height: 100%; background: var(--color4)  }
.company-digits .digit-val{     font-weight: 900; font-size: 22px; color: var(--color2)}
.company-digits .digit-desc{ color: var(--color2); padding-right: 20px; font-weight: 400}
/***/

.app{ margin: 40px 0}
.app-block{ background: var(--color5); border-radius: 15px; padding: 15px; box-sizing: border-box}
.app-image{ display: none  }
.app-title h2{ margin-top: 0}
.app-qr-wrap{ background: #fff; padding: 20px; border-radius: 15px; justify-content: center; margin: 15px 0}
.app-qr { flex-shrink: 0;}
.app-qr img{ width:100px; height:100px; margin: 10px auto; display: block }
.app-qr-desc{ text-align: center}
.app-icon-links{ justify-content: space-around}
.app-link{ width: 120px;  display: block; margin: 5px auto}
.app-link img{ width: 100%; height: auto;}
.app-contacts{ align-items: center; }
.app-contacts *{ display: inline-block; padding: 0; margin: 3px 0 }
.app-contacts a{  font-weight: 600 }

/***/
.services{ margin-top: 40px;}
.services-block{ }
.service-item-wrap{ margin-bottom:20px;}
.service-item{ background: var(--color5); border-radius: 10px; transition: all 0.3s ease;}
.service-item h3{font-size: 16px; font-weight: 600; margin: 0; padding: 15px; line-height: 1.2}
.service-item img{ width: 100%; height: 180px; object-fit: cover; border-radius: 10px;}
.service-item:hover{box-shadow: 0 5px 10px -3px rgb(0 0 0 /20%);transform: translateY(-10px);}


/**/
.embla__viewport { overflow: hidden; width: 100%;}
.embla__viewport.is-draggable {cursor: move;cursor: grab;}
.embla__viewport.is-dragging {cursor: grabbing;}
.embla__container {display: flex; user-select: none;-webkit-touch-callout: none; -khtml-user-select: none; -webkit-tap-highlight-color: transparent;}
.embla__slide { position: relative; flex: 0 0 100%;  min-width: 0; }

/***/
.news-block{ margin-bottom: 20px;}
.news-item{padding: 15px; border-radius: 10px; background: var(--color5); display: flex; flex-direction: column; justify-content: space-between; margin-bottom: 10px; box-sizing: border-box;   height: 100%; transition: all 0.3s ease;}
.news-item-section{ font-size: 13px; color: var(--color2); font-weight: 400; padding-left: 17px;}
.news-item-section:before{ content: ''; display: block; position: absolute; width: 8px; height: 8px; background: var(--color4); border-radius: 50%;
    top:0; bottom: 0; left: 0; margin:auto }
.news-item h3{ font-weight: 600; flex: 1; font-size: 14px; margin: 15px 0}
.news-date{ font-size: 13px; color: var(--color2); }
.news-item:hover{box-shadow: 0 5px 10px -3px rgb(0 0 0 /20%);transform: translateY(-10px);}


.news-link{ justify-content: center}
.news-link img{ width: 60px; display: block}
.news-link h3{ padding-right: 30px; background-repeat: no-repeat; background-position: right center; background-size: 22px; background-image: url("data:image/svg+xml,%3Csvg width='14' height='15' viewBox='0 0 14 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7 13.316C3.61725 13.316 0.875 10.6321 0.875 7.32331C0.875 4.01447 3.61725 1.33059 7 1.33059C10.3827 1.33059 13.125 4.01447 13.125 7.32331C13.125 10.6321 10.3827 13.316 7 13.316ZM7 0.474487C3.13381 0.474487 0 3.53934 0 7.32331C0 11.1073 3.13381 14.1721 7 14.1721C10.8662 14.1721 14 11.1073 14 7.32331C14 3.53934 10.8662 0.474487 7 0.474487ZM9.85906 6.94662L7.38456 4.52384C7.2135 4.3569 6.93656 4.3569 6.76594 4.52384C6.59487 4.69506 6.59487 4.96475 6.76594 5.13169L8.56887 6.89526H3.9375C3.69556 6.89526 3.5 7.08788 3.5 7.32331C3.5 7.55874 3.69556 7.75136 3.9375 7.75136H8.56887L6.76594 9.51493C6.59487 9.68187 6.59487 9.95584 6.76594 10.1228C6.93656 10.2897 7.2135 10.2897 7.38456 10.1228L9.85906 7.7C9.96406 7.59726 9.99688 7.45601 9.97282 7.32331C9.99688 7.19061 9.96406 7.04935 9.85906 6.94662Z' fill='%232B415C'/%3E%3C/svg%3E%0A");     align-self: flex-start; flex: 0;}

.news-block .embla__viewport{ padding:15px 0 15px 15px;box-sizing: border-box;}
.news-block .embla__slide{ flex-basis: 80%}
.embla__slide .news-item{margin-right: 15px;}


/**/
footer{ padding: 15px 0}
.footer{border-bottom: 1px solid rgb(0 0 0 / 10%); border-top: 1px solid rgb(0 0 0 / 10%); padding-top: 25px; padding-bottom: 15px}
.footer-item{ text-align: center; margin-bottom: 15px}
.footer-item-title{ display: none}
.footer-logo a{ width: 150px; height: 60px; display: inline-block; background-image: url(../images/logo-m.svg); background-size: contain; background-position: center top; background-repeat: no-repeat;}
.footer-menu ul{list-style: none; margin: 0; padding: 0; display: flex; justify-content: center; flex-wrap: wrap; }
.footer-menu li{ margin: 5px 10px; }
.footer-social a{ margin: auto}
.footer-text{font-size: 12px; opacity: .8}

.message-box{ border: 1px dashed var(--color2); border-radius: 10px;  text-align: center; padding: 40px 20px; margin: 20px auto; }
@media only screen and (min-width: 480px) {

    .services-block{ display: flex; flex-wrap: wrap; margin: 0 -10px; }
    .services-block > div{ flex-basis: calc(50% - 20px); margin: 10px;}
    .service-item{ display: flex; flex-direction: column; justify-content: space-between; height: 100%}
    .news-block .embla__slide{ flex-basis: 70%}



}


@media only screen and (min-width: 768px) {

    .__wrapper{ padding-top: 84px;}
    ._inner .__wrapper{ padding-top: 74px;}
    /**/
    .header-items{ padding: 15px 0 }
    .header-item-phones{ display: flex; }
    .header-item-phones .header-phone { padding-left: 35px;background-size: 26px;line-height: 26px; margin-right: 20px; }
    .header-item-phones .phone-mob{background-image: url(../images/phone-m.svg) }
    .header-item-phones .phone-city{background-image: url(../images/phone-h.svg)}

    /**/
    .company-digits{ justify-content: flex-start; max-width: 600px }
    .company-digits  .digit-item{ margin-bottom: 20px}
    .company-digits .digit-val{font-size: 28px;}

    /***/
    .topbanner-content{ padding: 60px}
    .topbanner-content h1 span:first-child{font-size: 26px;}
    .topbanner-content h1 span:last-child{ font-size: 60px; }
    .topbanner-content p{ font-size: 16px;}

    .toppagebanner img{ max-height: 300px}
    /**/


    /**/
    .services-block > div{ flex-basis: calc(33.33% - 20px); margin: 10px;}

    .news-block .embla__slide{ flex-basis:40%}

    .news-section .news-block{display: flex; flex-wrap: wrap; margin: 0 -10px; }
    .news-section .news-item{ flex-basis: calc(50% - 20px); margin: 0 10px 20px 10px; height: unset}

    .app-qr > img{ width: 140px; height: 140px; }
    .app-link{ width: 160px; }

}

@media only screen and (min-width: 1024px) {
    .__wrapper{ padding-top: 120px;}
    ._inner .__wrapper{ padding-top: 110px;}

    article h1{ font-size: 38px;}

    h2{font-size: 26px;}

    article.news h1{ font-size: 32px;}

    .header-items{ padding: 10px 0}
    .header-item-logo{ flex-grow: 0; width: 260px; height: 40px}
    .header-item-logo .header-logo{ background-image: url(../images/logo-hz.svg);}
    .header-item-contacts,
    .header-item-cosial{margin-right: 0px;}
    .header-item-contacts{ display: flex; flex-direction: column; align-items: flex-start}
    .header-item-contacts > div{ margin: 7px 0}
    .header-item-phones a { font-size: 14px;}
    .header-item-menu{display: block}
    .header-item-menu ul{ margin: 0; padding: 0; list-style: none; display: flex; gap: 20px; font-weight: 600}
    .header-item-menu li{ }

    .cosial-link{width: 28px; height: 28px;}

    .double-block{ display: flex; gap: 20px;}
    .double-block > div{ flex-basis: 50%; height: auto}
    .double-block-content{ display: flex; align-items: center}
    .double-block-image{position: relative;top: auto; left: auto }


    /***/
    .topbanner-content{ padding: 60px}
    .topbanner-content h1 span:first-child{font-size: 28px; max-width: 250px;}
    .topbanner-content h1 span:last-child{ font-size: 60px; }
    .topbanner-content p{ font-size: 16px;}

    /**/
    .company-digits .digit-item{ max-width: none}
    .company-digits .digit-desc{ padding-right: 40px}

    /**/
    .app{ margin: 40px 0}
    .app-block{display: flex; padding: 40px}
    .app-block > div{ flex-basis: 50%;  }
    .app-image{ display: flex; max-width:420px; align-items: center; justify-content: center; padding-left: 40px; box-sizing: border-box  }
    .app-text{ font-size: 16px}
    .app-qr > img {}
    .app-qr-desc{display: flex;flex-direction: column;justify-content: space-between;}

    /**/
    /**/
    .toppagebanner-block{ display: flex; }
    .toppagebanner-block > div{ flex-basis: 50%; box-sizing: border-box}
    .toppagebanner-image{ order: 2; margin-left: 10px; max-height: none; }
    .toppagebanner-image img{max-height: none; height: 100%}
    .toppagebanner-content{ display: flex; flex-direction: column; justify-content: center; padding: 30px; margin-right: 10px; background: var(--color5); border-radius: 10px}
    .toppagebanner-content p{ font-size: 16px}
    .page-block{ padding: 30px;   margin: auto}

    .news-block .embla__slide{ flex-basis:25%}

    .news-section .news-block{  margin: 0 -15px; }
    .news-section .news-item{ flex-basis: calc(33.33% - 30px); margin: 0 15px 20px 15px;}

    .footer-items{ gap:25px}
    .footer-item{ text-align: left; margin-bottom: 0px; max-width: 250px}
    .footer-item-title{ display: block; font-weight: 600; margin-bottom: 15px}
    .footer-menu ul{ justify-content: left; flex-direction: column }
    .footer-menu ul li{  margin: 0; margin-bottom: 5px; min-width: 200px}
    .footer-phones{ margin-bottom: 15px}
    .footer-phones a{ display: flex; flex-direction: column; }
}

@media only screen and (min-width: 1280px) {


    .header-item-logo{  width: 280px; height: 42px}
    .header-item-menu{ font-size: 15px}
    .header-item-menu ul{gap:40px}


    /**/
    .company .double-block-content{ padding: 25px;}
    .company-digits .digit-item { padding-left: 20px}

    /**/
    .app-content{max-width: 640px;}
    .app-content h2{ font-size: 38px}
    .app-image{ max-width: none;  }
    .app-text{ margin-bottom: 20px}
    .app-qr-desc{font-size: 16px; margin-left: 30px}
    .app-contacts * {font-size: 16px; margin-right: 40px;}

    .news-block{ padding: 0 15px;}

    /***/
    .topbanner-content h1 span:first-child{font-size: 40px; line-height: 1.1}
    .topbanner-content h1 span:last-child{ font-size: 80px;  line-height: 1.1}
    .topbanner-content p{ font-size: 18px;}
    .topbanner-content .button-wrapper{margin-top: 40px}
    .topbanner.page .topbanner-content p{ font-size: 16px;}
    /**/
    .services-block > div{ flex-basis: calc(20% - 20px); margin: 10px;}
    .inpage .services-block > div{ flex-basis: calc(25% - 20px); margin: 10px;}

    .news-section .news-block{  margin: 0 -30px; }

}
.fancybox__nav{ position: unset}

[class*="copyrights-pane"] {
    display: none !important;
}
