@font-face {
font-family: 'Manrope-Regular';
src: local("Manrope-Regular"),
url('./fonts/Manrope-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;

}
@font-face {
font-family: 'Manrope-SemiBold';
src: local("Manrope-SemiBold"),
url('./fonts/Manrope-SemiBold.ttf') format('truetype');
font-weight: 600;
font-style: normal;

}
@font-face {
font-family: 'Manrope-ExtraBold';
src: local("Manrope-ExtraBold"),
url('./fonts/Manrope-ExtraBold.ttf') format('truetype');
font-weight: 800;
font-style: normal;

}
:root{
    --gradient-decor: linear-gradient(90deg, #b89232 0%, #785d1d 94.23%);
    --text-color: #785d1d;
    --number-color:  #b89232;
    --section-padding: 120px 0 0 0;
    --content-padding: 40px 0 0 0;

}

*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

input
{
  color: inherit;
  background-color: transparent !important;
  border: none;
  outline: none;
}
input:focus{
  outline: none;
   border: none;
}
input[type="submit"] {
  display: inline-block;
 box-shadow: none;
 cursor: pointer
}
ul li{
   list-style-type: none
}
img{
 width: 100%;
 height: 100%;
  object-fit: cover;
  object-position: center;
}

.no-scroll {
  height: 100vh;
  overflow-y: hidden;
}
a{
text-decoration: none;
color: inherit;
}
html, body{
  font-family: 'Manrope-Regular';
  font-size: 16px;
  color: rgb(255, 255, 255);
   background: rgb(18, 26, 23) !important;
   scrollbar-gutter: stable;
  letter-spacing: 1px;
  
}
.wrapper{
  max-width: 100%;
  overflow: hidden;

}

.container{
  max-width: 1510px;
margin: 0 auto;
padding: 0 5px;
}
.header{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: rgb(27, 41, 35);
  box-shadow: 0 0px 7px rgba(184, 146, 50, 0.5);
  font-size: 1.19rem;
  z-index: 50;
 
}


.header__container{
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1510px;
  margin: 0 auto;
  padding: 0 5px;
  

}
.header__menu a,
.header__contacts a
{
 
  transition: color .2s ease 0s;
}
.header__menu a:hover,
.header__contacts a:hover{
  color: rgba(184, 146, 50, 1);
  transition: color .2s ease 0s;
}
.header__menu a:not(:last-child){
  margin: 0 30px 0 0;
}
.header__contacts{
  display: flex;
  column-gap: 30px;
} 
.header__contacts li svg{
  display: none;
  width: 45px;
  height: 45px;
  border: 1px solid white;
  padding: 10px;
}

.header__logo{
  width: 120px;
  height: 120px;
 
}
.header__mobile-toggle-menu{
  cursor: pointer;
  position: relative;
  width: 25px;
  height: 20px;
  display: none;
  pointer-events: none;

}   
.header__mobile-toggle-menu span{
  position: absolute;
  display: block;
  /* top: 10px;
 width: 100%;
  height: 2px;
  background-color: white; */

}
.header__mobile-toggle-menu span::before{
  position: absolute;
  content: '';
  display: block;
  top: -8px;
 width: 100%;
  height: 2px;
  background-color: white;
    transition: transform .2s ease-in, top .2s ease-in;

}
.header__mobile-toggle-menu span::after{
  position: absolute;
  content: '';
  display: block;
  top: 8px;
 width: 100%;
  height: 2px;
  background-color: white;
   transition: transform .2s ease-in, top .2s ease-in;

}
section:not(:first-child) {
   padding: var(--section-padding);
}
.main-screen{
  display: flex;
  align-items: flex-end;
justify-content: space-between;
  height: 100vh;
}
.main-screen__block-text{

  padding: 0 0 100px 0;
}
.main-screen__block-text h1{
  white-space: nowrap;
  font-size: 6rem;
  font-family: 'Manrope-ExtraBold';
}
.main-screen__block-text p{
  max-width: 725px;
  font-size: 1.9rem;

 
}
.main-screen__images{
 position: relative;
   min-width: 480px;
  height: 800px;
  margin: 0 20px 0 0;
}
.main-screen__images::before,
.conditions__block-images::before{
 position: absolute;
 content: '';
 width: 100%;
 height: 100%;
 background-color: rgba(0, 0, 0, 0);
}
.main-screen__text-span {
  margin: 50px 0 0 0;
  font-size: 1.5rem;
}
.main-screen__text-span span {
  display: inline-block;
  padding:10px 30px;
  border-radius: 50px;
  background: var( --gradient-decor);
}
.main-screen__text-span span:last-child {
margin: 20px 0 0 0;
}



 h2 {
    font-size: 3.3rem;
  font-family: 'Manrope-ExtraBold';
}
.conditions__body {
  display: flex;
justify-content: space-between;
  padding: var(--content-padding)
}
.conditions__block-images{
  position: relative;
  margin: 0 50px 0 0;
  width: 450px;
  height: 100%;
}
.conditions__block-text {

  margin: 0px 0 0 25px;
}
.conditions__block-text .conditions__text-item:not(:last-child) {

 padding: 0 0 30px 0;
}
.conditions__block-text .conditions__text-item:not(:last-child) span{
  padding: 3px 0 10px;
}
.item-list p {
  position: relative;
  font-size: 2rem;
   font-family: 'Manrope-ExtraBold';
   color: var(--number-color);
}
.item-list p:before {
  position: absolute;
  content: " ";
  top: 14px;
  left: -25px;
  width: 17px;
  height: 17px;
  border-radius: 3px;

 background: var(--gradient-decor);
}
.item-list span {
  display: inline-block;
  font-size: 1.5rem;
  

}

.accounting__list {
  position: relative;
  display: flex;
  flex-wrap: wrap;
 row-gap: 30px;
 justify-content: space-between;
  padding: var(--content-padding);


}
.accounting__list::before {
  position: absolute;
  bottom: -110px;
  right: -80px;
  content: " ";
  width: 320px;
  height: 320px;
  background: url(./images/clock.png) no-repeat center/cover;
z-index: 3;

}
.accounting__list .accounting__item:nth-child(4){
  order: 2;
}
.accounting__list .accounting__item:nth-child(2){
  order: 3;
}
.accounting__list .accounting__item:nth-child(5){
  order: 4;
}
.accounting__list .accounting__item:nth-child(3){
  order: 5;
}
.accounting__item{
  flex: 0 1 45%;
  display: flex;
  align-items: center;
  column-gap: 20px;
 z-index:5;
}
.accounting__item span {
  min-width: 36.2px;
  font-size: 4rem;

  color: var(--number-color);
  font-family: 'Manrope-ExtraBold';

}
.accounting__item p {
 
  font-size: 1.5rem;
 
}

.protection__list{
  position: relative;
  display: flex;
  justify-content: space-between;
  row-gap: 30px;
  flex-wrap: wrap;
  padding: var(--content-padding);
  margin: 0 0 0 25px;
}
.protection__list:before{
  position: absolute;
  content: " ";
  bottom: -55px;
  right: 105px;
 
  width: 320px;
  height: 340px;
  background: url(./images/scales.png) no-repeat center/cover;

}
.protection__item span{
  max-width: 750px;
}
.protection__list .protection__item:first-child,
.protection__list .protection__item:nth-child(2){
  flex: 0 1 50%;
}
.protection__list .protection__item:last-child,
.protection__list .protection__item:nth-child(3){
  flex: 0 1 100%;
}

.advantages p {
  padding: 10px 0 0 0;
   font-size: 1.5rem;
}
.advantages__list {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px;
  padding: var(--content-padding);

}
.advantages__item {
flex: 0 1 49%;
  border: 3px solid var(--text-color);
  border-radius: 5px;
  padding: 20px 10px;
}
.advantages__item p {
  padding: 0;
 font-size: 1.6rem;
  font-family: 'Manrope-ExtraBold';

}
.advantages__item span{
  font-size: 1.3rem;
}

.footer__contacts svg{
  width: 25px;
  height: 25px;
}


.footer  {
  position: relative;
  padding: 60px 0 0 0;
  font-size: 1.5rem;

}
.footer::before  {
  position: absolute;
 content: " ";
 bottom: 100px;
 right: 150px;
 width: 350px;
 height: 420px;
   background: url(./images/calc.png) no-repeat center/cover;

}

.footer input{

  font-size: 1.5rem;
  color: white;

}
.footer form{
   margin: 20px 0;
}
.footer input[type="submit"] {
   padding: 10px 20px;
background: var(--gradient-decor);
border-radius: 5px;
margin: 0 0 0 20px;
 transition: all .2s ease 0s;
 letter-spacing: 1px;
}
.footer input[type="submit"]:hover{
  background: transparent !important;
 
  transition: all .2s ease 0s;
  outline: 1px solid var(--number-color);
}
 input[type="tel"]{
  display: inline-block;
   padding: 10px 0px 10px 5px;
    border-bottom: 2px solid var(--number-color);
 


}
 input[type="tel"]::placeholder{
  font-size: 1rem;
  color: rgb(95, 95, 95);
  letter-spacing: 1px;
  

}
.footer__gendir {
  margin: 40px 0 20px 0;
  max-width: 290px;
  
}
.footer__contacts{
  padding-bottom: 40px;
}
.footer__contacts a {
  background: var(--gradient-decor);
  padding:10px 15px;
  border-radius: 50px;
  /* display: inline-block; */
  display: inline-flex;
  align-items: center;
  column-gap: 10px;
}
.footer__contacts-phone {
}
.footer__contacts-mail {
  margin: 20px 0;
}
.footer__contacts-adress {
}

.footer__copy{
  display: block;
margin: 40px 0;
  padding: 40px 0 0 0;
  text-align: center;
  font-size: 1rem;
  border-top: 1px solid var(--text-color);
  

}
.footer__container__popup{
  position: fixed;
 z-index: 200;
  bottom: -100px ;
  box-shadow: 0 -2px 2px 0 var(--number-color);

  background-color:#525252;
  color: inherit;
  
  padding: 10px 10px 15px;
  text-align: center;
  opacity: 0;
   transition: all .5s ease 0s;
}
.footer__container__popup.add{
  opacity: 1;
   bottom: 0px ;
   transition: all .5s ease 0s;
}

.add-error .add-error-closse{
  position: absolute;
   top: 0px;
  right: 0px;
  border: 2px solid var(--number-color);
  /* border-radius: 50px; */
  width: 25px;
  height: 25px;
  cursor: pointer;
  z-index: 10;
 

}
.add-error .add-error-closse::before{
  position: absolute;
  content: '';
  width: 100%;
  height: 2px;
  top: 9px;
  right: 0px;
  background-color: white;
 transform: rotate(45deg);

}
.add-error .add-error-closse::after{
  position: absolute;
  content: '';
  width: 100%;
  height: 2px;
  top: 9px;
  right: 0px;
  background-color: white;
 transform: rotate(136deg);

}
.footer__container__popup span:nth-child(3){
  display: block;
font-size: .8em;
margin: 5px 0;

}
.footer__container__popup a{

display: block;

}
@media (max-width: 1400px){
.header__contacts span{
  display: none;
  pointer-events: none;
}
.header__contacts li svg {
  display: block;

}
.main-screen__images {
  margin: 0;
}
}

@media (max-width: 1220px){

  .header__logo{
    width: 60px;
    height: 60px;
  }
 .header__menu.header__nav--active {
        background-color: rgb(27, 41, 35);
        position: fixed;
        width: 100%;
        height: 100vh;
        top: 60px;
        left: 0px;
        display: flex;
        flex-direction: column;
        align-items: center;
        row-gap: 10px;
        font-size: 1.4em;
        padding: 80px 0 0 0;
        z-index: 40;
      }

   .header__menu.header__nav--active a:not(:last-child){
          margin: 0;
        }
  .header__mobile-toggle-menu{
    
    display: block;
    pointer-events: all;
    margin: 0 10px 0 0;
    order: 3;
   
   width: 45px;
   height: 45px;
    border: 1px solid var(--text-color);
  }
  .header__mobile-toggle-menu span{
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
 
    width: 60%;
    height: 2px;
    background: white;
    
  }

  .header__mobile-toggle-menu.add span::before

{
  transform: rotate(45deg);
  transition: top .2s ease-in,transform .2s ease-in;
  top: 0;
}

.header__mobile-toggle-menu.add span::after
{
  transform: rotate(-45deg);
  transition: top .2s ease-in,transform .2s ease-in;
  top: 0;
}

  .header__logo{
    order: 2;
  }
  .header__contacts{
    order: 1;
    margin: 0 0 0 10px;
    column-gap: 10px;
    border-color: var(--text-color);
  }
  .header__contacts li svg{
        border-color: var(--text-color);
  }
  .main-screen {
    height: 100%;
    padding: 150px 0 0 0;
    text-align: center;
  }
  .main-screen__block-text p {
    max-width: 100%;
  }
  .header__menu{
    display: none;
  }
 .main-screen__images{
display: none;
pointer-events: none;
      }

.main-screen__block-text{
  padding: 0;
}  
.accounting__item{
  flex: 0 1 50%;
} 
.footer::before{
  right: 0;
}   
}
@media (max-width: 1025px){
h2{
          font-size: calc(24px + 29 * (100vw - 320px) / 1120);
}
.advantages p,
.footer,
.footer input{
   font-size: calc(16px + 8 * (100vw - 320px) / 1120);
}
.advantages__item span{
  font-size: calc(12px + 4 * (100vw - 320px) / 1120);
}
.protection__list:before,
.footer::before{
  display: none;
}
.protection__list .protection__item:first-child, .protection__list .protection__item:nth-child(2){
  flex: 0 1 100%;
}
.advantages__item{
  flex: 0 1 100%;
}
.footer form {
display: flex;
justify-content: center;
}
.footer__gendir{
  max-width: 100%;
}
.footer__contacts{
  display: flex;
  align-items: flex-start;
  gap:10px 5px;
  flex-wrap: wrap;
}
.footer__contacts-mail{
  margin: 0;
}
.footer__contacts li:not(:last-child){
  flex: 1 1 49.7%;
}
.footer__contacts li:last-child{
  flex: 0 1 100%;
}
.footer__contacts li a{
  width: 100%;
}
}
@media (max-width: 920px){
.conditions__block-images:before,
.conditions__block-images img,
.accounting__list::before{
  display: none;
}
.conditions__body,
.protection__list{
  display: block;
}
.conditions__block-text .conditions__text-item:not(:last-child){
  padding: 0;
}
.item-list p:before{
  display: none;
}
.conditions__block-text,
.protection__list{
  margin: 0;
}
.item-list p {
  font-size: calc(20px + 12 * (100vw - 320px) / 1120);
}
.item-list span {
   font-size: calc(16px + 8 * (100vw - 320px) / 1120);
}
.accounting__list {
  row-gap: 0px;
}
.accounting__item{
  flex: 0 1 100%;
} 
.accounting__list .accounting__item:nth-child(3){
  order: 3;
}
.accounting__list .accounting__item:nth-child(4){
  order: 4;
}
.accounting__item p{
   font-size: calc(16px + 8 * (100vw - 320px) / 1120);
}
}
@media (max-width: 769px){
.main-screen__text-span span {
  display: block;
}
.main-screen__text-span span:last-child {
  margin: 0;
}
.main-screen__text-span span:nth-child(2) {
margin: 20px 0;
}
.main-screen__block-text h1{
    font-size: calc(35px + 61 * (100vw - 320px) / 1120);
}
.main-screen__text-span{
  margin: 20px 0 0 0;
}
.main-screen__block-text p 
   {
       font-size: calc(16px + 16 * (100vw - 320px) / 1120);
    }

.main-screen__text-span span{
       font-size: calc(12px + 16 * (100vw - 320px) / 1120);
    }
 section:not(:first-child),
 .footer{
  padding: 65px 0 0 0;
 } 
   

.conditions__body,
.accounting__list,
.protection__list,
.advantages__list{
 padding: 10px 0 0 0;
}

.advantages__item {
  padding: 10px;
}
.footer input[type="submit"]{
  margin: 0;
}
.footer form{
flex-direction: column;
row-gap: 20px;
width: 70%;
margin: 20px auto 0;
    }
.footer__gendir {
      margin: 20px 0 10px;
      text-align: center;
    }
  .footer__contacts{
    padding-bottom: 20px;
  }
  .footer__copy{
    margin: 20px 0;
    padding: 20px 0 0 0;
  }
  .footer p:nth-child(6),
  .advantages p:nth-child(2),
  h2,
  footer p{
    text-align: center;
  }
}





div#preloader {
    margin: auto;
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(27, 41, 35, 1);
;
    z-index: 9999999;
    display: flex;
    align-content: center;
    justify-content: center;
      opacity: 0;
    pointer-events: none;
    transition: opacity .5s ease 0s ;
 
}
div#preloader.preloader-add{
   opacity: 1 !important;
    pointer-events: all !important;
    transition: opacity .5s ease 0s ;
}
.sk-folding-cube {
    top: 50%;
    left: 50%;
    margin-left: -25px;
    margin-top: -25px;
    width: 50px;
    height: 50px;
    position: absolute;
   
    transform: rotateZ(45deg);
}

.sk-folding-cube .sk-cube {
    float: left;
    width: 50%;
    height: 50%;
    position: relative;
   
    transform: scale(1.1);
}

.sk-folding-cube .sk-cube2 {
  
    transform: scale(1.1) rotateZ(90deg);
}


.sk-folding-cube .sk-cube4 {
   
    transform: scale(1.1) rotateZ(270deg);
}

.sk-folding-cube .sk-cube3 {
   
    transform: scale(1.1) rotateZ(180deg);
}

.sk-folding-cube .sk-cube:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
    animation: sk-foldCubeAngle 2.4s infinite linear both;
  
    transform-origin: 100% 100%;
    background: var(--number-color);
}

.sk-folding-cube .sk-cube2:before {
    
    animation-delay: .3s;
}

.sk-folding-cube .sk-cube4:before {
   
    animation-delay: .9s;
}

.sk-folding-cube .sk-cube3:before {
    
    animation-delay: .6s;
}

@keyframes sk-foldCubeAngle{0%,10%{-webkit-transform:perspective(140px) rotateX(-180deg);transform:perspective(140px) rotateX(-180deg);opacity:0}25%,75%{-webkit-transform:perspective(140px) rotateX(0);transform:perspective(140px) rotateX(0);opacity:1}100%,90%{-webkit-transform:perspective(140px) rotateY(180deg);transform:perspective(140px) rotateY(180deg);opacity:0}}
