html{
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
  }
  
  body {
      display: block;
      position: relative;
      width: 100%;
      background: #F3F3F3;
font-family: 'Montserrat', sans-serif;
      font-size: 16px;
      font-size: clamp(10px, 2vw, 16px);
      font-weight: 500;
      line-height: 100%;
      text-align: left;
      color: #000000;
      overflow-x: hidden;
       
    }
  
    
    .content {
      display: block;
      position: relative;
      width: 100%;
      max-width: 1020px;
      max-width: 100%;
      /* overflow: hidden; */
      border-radius: 6px;
      background: #ffffff;
      padding:32px 20px;
      margin: 0 auto 20px auto;
    }
    
    h1,
    h2,
    h3,
    h4,
    .title {
      display: block;
      position: relative;
      font-size: 96px;
      font-size: clamp(32px, 7vw, 96px);
      font-weight: 900;
      line-height:100%;
      text-align: center;
      color: #E60004;
    }
    
    h1,
    .title.general {
      text-transform: uppercase;
       font-family: 'Bebas Neue', sans-serif;
  font-style: italic;
    }
    
    h2,
    .title.high {
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 64px;
       font-size: clamp(28px, 7vw, 64px);
     font-family: 'Bebas Neue', sans-serif;
  font-style: italic;
      text-transform: uppercase;
     
    }

    
  
    .button {
      
      position: relative;
    display: inline-block;
      min-width: 100px;
      height: 36px;
      border-radius: 10px;
      background: #045C63;
      overflow: hidden;
      font-size: 16px;
      font-weight: 500;
      line-height: 120%;
      text-align: center;
      text-decoration: none;
      text-transform: uppercase;
      color: #ffffff;
      white-space: nowrap;
      cursor: pointer;
      padding: 8px;
      margin: 0 auto;
    
      transition: all 0.5s;
    }
    
    
    
    .header,
    .main ,.footer {
      display: flex;
      position: relative;
      justify-content: space-between;
      align-items: center;
     
      max-width: 1440px;
      max-width: 100%;
      
      margin: 0 auto;
    }
    
    .background{
      display: block;
      position: absolute;
      bottom: 0;left: 0;
      height: 100%;
      width: 100%;
      overflow: hidden;
    }
    
    .background img{
      position: relative;
      width: 100%;height: 100%;object-fit: cover;
      
    }

    .background-page img{
      border-radius: 0;
    }
    
    .images img{
      border-radius: 6px;
      width: 100%;
      height: 100%;
      overflow: hidden;
      display: block;
    }

    .faq {
      overflow-anchor: none;
    }

    .logo .logo__img{
      display: none;
    }
    
    /* -------------------HEADER---------------- */
    .header {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      width: 100%;
      z-index: 100;
    background: linear-gradient(71.59deg, #022023 20.71%, #0A8F9B 91.52%);

    }
    
    .header__content {
      position: relative;
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
      max-width: 1440px;
      max-height: 100px;
      border-radius: 0;
      
background: transparent;
      padding: 16px 30px;
      margin: 0 auto;
    }
    
    .logo {
      display: block;
      position: relative;
      flex: 0 0 225px;
      margin-right: 24px;
    }
    
    .logo img {
      display: block;
      position: relative;
      /* width: auto; */
      max-height: 100px;
    }
    
   
    .header__menu {
      display: flex;
      white-space: nowrap;
      max-height: calc(100vh - 70px);
    /* overflow-y: auto; */
     margin-left: auto;
    }
    
    
    
    .header__menu-list {
      display: flex;
      justify-content: center;
      align-items: center;
      white-space: nowrap;
      flex: 1 1 auto;
      gap: 20px;
     


    }
    .header__menu-list li {
      display: block;
      padding:  0;
    }
    
    .header__menu-list li a {
      display: inline-flex;
      position: relative;
      align-items: center;
      
      transition: all 0.5s;
     
    }
    
    
    .menu a{
      display: none;
    }
    
  
    span {
      display: inline-block;
    }
    
    .header__menu-list a img    {
      width: 24px;
      height: 24px;
      vertical-align: middle;
    }
    
    


    .button__login{
        margin-left: auto;
    }

    .button__login{
     
      
     
       background: #045C63;
        
        margin: 0 24px 0 40px;
    }
    
 .button__singup{

  background: #E60004;

    margin: 0;
 }

 .button__singup:hover{
  background: #045C63;
 }
    

   
    .button__login:hover {
      background: #E60004;
    }
    
    .header__btn-menu{
      display: block;
      flex: 0 1 auto;
      min-width: 0;
      border:1px solid #ffffff; 
      border-radius: 10px;
      background: #054146;

      padding: 12px;
      margin-left: 12px;
      order: 3;
     
      
    }
    
    
    svg {
      position: relative;
      fill: #ffffff;
      line-height: 1;
      vertical-align: 1;
    }
      .header__time{
        color:#FFFFFF;
        position: relative;
        padding-left: 28px;
        margin-left: 24px;
    }
     
   
    
    
    /* ------------------ MAIN------------- */
    .main.home{
      display: flex;
     
    }
    
    .main__wrap {
      display: flex;
      position: relative;
      flex: 1 1 100%;
      justify-content: center;
      align-items: stretch;
      max-width: 1400px;
      padding: 20px 30px;
      margin: 0 auto;
    }
    
    
    
    
  
      
    /* -----------hero ----------- */
    .content__wrapper{
      position: relative;
       
     
    
    }

    header, footer {
  margin: 0;
}

* {
  box-sizing: border-box;
}
    
    .hero{
      padding: 0;
     
      background: #F3F3F3;
min-height: calc(100dvh - 100px - 137px);
      align-items: center;
      padding: 42px;
      
      position: relative;
     
       
        padding-left: calc(50% - 710px);
        padding-right: calc(50% - 710px);
       margin:0 20px;
       
   
  }
    
    .hero__wrapper {
     
      display: flex;
      align-items: center;
     
    }

  
 
  
    .hero__data{
    display: block;
      position: relative;
        max-width: 100%;
      
    }
    
    .hero__title{
      margin-bottom: 24px;
      text-align: center;
     
    }
    .hero__background{
      position: relative;


    }

    .background__decor{
    position: relative;
      left: 0px;
      height: 100%;
      width: 100%;
       max-width: 790px;
    }

    .background__decor img{
      height: 100%;
      object-fit: cover;
      width: 100%;
      max-width: 790px;
    }

    .background__decor
  
    .hero__data p{
      text-align: center;
      margin-bottom: 42px;
    }
    
    

    
    .hero__forma{
      position: relative;
      background: 
linear-gradient(105.54deg, #0A8F9B 6.72%, #022023 90.3%);
border-radius: 54px;
display: flex;
flex-direction: row;
padding: 50px 50px 50px 0;
margin-top: 42px;
    }
   

/*  */

 .form{

max-width: 600px;
width: 100%;
right: 40px;

display: flex;
flex-direction: column;
background: #FFFFFF;
border-radius: 45px;
gap: 16px;
padding: 36px;
 }

 .form h2{
  margin-bottom: 8px;
 }

 .form input{
  background: #F3F3F3;
border-radius: 10px;
padding: 13.5px 24px;
outline: none;
border: none;
width: 100%;
 }
 .hero__text{
  text-align: center;
 }

 
.file-input {
  position: relative;
  width: 100%;
  border: 1px solid transparent;
  border-radius: 10px;
}

.file-input input[type="file"] {
  opacity: 0;
  width: 100%;
  height: 50px;
  position: absolute;
  z-index: 2;
  cursor: pointer;
}

.file-input label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4.5px 5px 4.5px 24px;
  
background: #F3F3F3;
  border-radius: 10px;
  cursor: pointer;
}

.file-input .placeholder,.form input::placeholder {
  font-size: 16px;
  font-weight: 500;line-height: 100%;
  color: #A7A7A7;
}

.file-input .btn {
 background: #045C6333;
border: 1px solid #045C63;
 
  padding: 11px 12px;
  border-radius: 8px;
  cursor: pointer;
  font-weight: 500;
  color: #045C63;
  font-size: 12px;line-height: 120%;
  display: flex;
  text-transform: uppercase;
  align-items: center;
  gap: 4px;
}

.file-input .btn span{
  display: flex;align-items: center;
  gap: 4px;
}



.file-input .btn img{
  vertical-align: middle;
  width: 16px;height: 16px;
}


.file-input input[type="file"]:valid + label .placeholder::after {
  content: attr(data-file-name);
  color: #000;
  margin-left: 5px;
 
  
}




.submit{
  background: #045C63;
  min-width: 154px;
  height: 52px;
  padding: 16px;
  width: max-content;
  border-radius: 10px;
  color: #FFFFFF;
  font-size: 16px;font-weight: 700;
  line-height: 100%;
  margin-left: auto;margin-right: auto;

}
    
     
  .content:last-child{
    margin-bottom: 0;
  }

 

.form-group, .file-input {
  position: relative; 

}

.error-message {
  position: absolute;
  top: 50%;
  left: 20px; 
  transform: translateY(-50%);
  color: #E60004;
  font-size: 13px;
  white-space: nowrap;
  opacity: 0;
  transition: opacity 0.3s;
}

input.error, .file-input.error input {
  border: 1px solid #E60004;
}

.file-input.error {
  border-color: #E60004; 
}

.file-input .placeholder {
  pointer-events: none;
}

    /* ------------footer----------------- */
    .footer{
       display: flex;
      position: relative;
     background: linear-gradient(269.32deg, #022023 30.87%, #0A8F9B 92.73%);
color: #FFFFFF;
      
    }
    
    .footer__content{
      display: flex
;
    flex-direction: row;
    align-items: center;
      gap:47px;
      max-width: 1440px;
      padding: 40px 20px 0 20px;
    
      background: transparent;
      margin-bottom: 0;
      
    }
    .footer__logo{
    margin-right: 0;
    
    }


    .footer__wrapp{
      display: flex;
      /* width: 100%; */
      flex-direction: row;
      justify-content: center;
      align-items: center;
      gap: 30px;
  
    }
    .footer__text{
      width: 95%;
    }
    .footer__btn{
      min-width: 169px;
      height: 28px;
      padding: 4px 20px;
      background: #E60004;
      font-size: 16px;font-weight: 700;
      
    }
    
 .footer p{
  font-size: 11px;font-weight: 500;line-height: 100%;
  text-align: center;
 }
  
   

    .main-page.home{
   
      padding-top: 100px;
      display: block;
    }
    
    .main__wrap-page{
      justify-content: flex-start
    }