*{margin:0px; padding:0px;box-sizing: border-box;font-family: "toxigenesis";}
@font-face {
  font-family: "toxigenesis";
  src:    url("./fonts/toxigenesis.otf");
}
.quiz{position: relative;}

.quiz.formSent .entryFlex,.quiz.formSent .allForm{display: none;}



#bg-video{position: absolute; width: 100%; height: 100%;object-fit: cover;z-index: -2;left: 0px;top: 0px;}
.entryFlex:after{content:'';background-color: rgba(0,0,0,0.6);position: absolute;width: 100%;height: 100%;top:0px;left:0px;z-index: -1;}
/* .entry{padding: 50px 20px 20px 50px;} */
.entryTop .hight{color: #CDCDCD;text-transform: uppercase;font-size: 10vw;line-height: 11vw;}
.entryFlex{position: relative;z-index: 3;display: flex;flex-direction: column;justify-content: space-between;padding: 50px 50px 20px 50px;min-height: 100vh;}
.entryTop p{color: #fff;font-size: 20px;max-width: 1000px;}
.entryTop p span{color: #2DA700;}


.entryMiddle{padding:24px;border: 2px dashed #CDCDCD;max-width: 700px;margin: 6vw auto 3vw;}
.entryMiddle h3{ text-align: center;color: #fff;font-size: 32px;margin-bottom: 40px;}

.goForm{border-radius: 8px;background-color: #2DA700;color: #fff;font-size: 24px;padding:26px 100px;display: flex;width: max-content;cursor: pointer;gap:10px;margin: 0 auto;
align-items: center;}


.entryBottomFlex{display: flex;gap:30px;justify-content: space-between;align-items: center;}
.entryBottom{display: flex;flex-direction: column;align-items: flex-end;}
.entryBottom .hight{color: #CDCDCD;font-size: 10vw;line-height: 11vw;text-align: right;white-space: nowrap;}
.entryBottomFlex p{color: #fff;font-size: 20px;max-width: 430px;}
.entryBottomFlex p span{color: #2DA700;}





.allForm {display: none;align-items: center;justify-content: center;padding: 24px;min-height: 100vh;position: relative;}
.allForm:after{content:'';background-color: rgba(0,0,0,0.2);position: absolute;width: 100%;height: 100%;top:0px;left:0px;z-index: -1;}

.errorField{color:#E00000;font-size: 20px;margin-top: 20px;display: flex;font-family: "Montserrat", sans-serif;font-weight: 500;align-items: center;gap:16px;}
.errorField:before{content:'';background: url('./img/error-outline.svg');width: 24px;height: 24px;background-size: cover;background-position: center;}















.allForm .form-container {
        background: rgba(255,255,255,0.6);
        padding: 40px 40px;    backdrop-filter: blur(10px);
        border-radius: 24px;
        width: 100%;
        max-width: 650px;
        box-shadow: 0 0 15px rgba(0,0,0,0.3);
    }
   .allForm  .progress {
        height: 16px;
        background: #F3F3F3;
        border-radius: 40px;
        margin-bottom: 64px;
    }
   .allForm  .progress-bar {
        height: 16px;
        background: #2DA700;
        width: 0%;
        border-radius: 40px;
        transition: width 0.3s;
    }
  .allForm   .form-step {
        display: none;
    }
  .allForm   .form-step.active {
        display: block;
    }

    .form-step h3{font-size: 40px;color: #222222;margin-bottom: 64px;}
.form-step label{font-size: 20px;color:#222222;font-family: "Montserrat", sans-serif;font-weight: 500;margin-bottom: 24px;font-weight: 500;display: block;}
.form-step label input{margin-top: 16px;font-family: "Montserrat", sans-serif;}
.form-step  input::placeholder{color:#CDCDCD;}
 .allForm    input:focus{outline:none;}
 /* .allForm    input,.allForm  select,.allForm  button {
        width: 100%;
        padding: 10px;
        margin: 8px 0;
        border: 1px solid #ccc;
        border-radius: 5px;
    } */
     .allForm    input{border: 1px solid #F3F3F3;border-radius: 8px;padding: 31px 16px;line-height: 24px;font-size: 20px;display: block;width: 100%;    box-shadow: 0px 1px 7px -3px #333;
    font-family: "Montserrat", sans-serif;font-weight: 500;}
   .allForm  button {
        background: #2DA700;
        color: #fff;font-size: 28px;padding:25px 80px;border:0px;border-radius: 8px;
        cursor: pointer;display: block;width: max-content;margin-top:48px;
    }
  .allForm   button:disabled {
        background: #ccc;
        cursor: not-allowed;
    }


.stepStyle{font-size: 20px;margin-bottom: 20px;}

.phoneField{background-image: url('./img/flag.svg');background-repeat: no-repeat;background-position: 16px center;padding-left: 56px!important;}
.radioField input{display: none;}
.radioField{display: block;margin-bottom: 24px;cursor: pointer;background-color: #fff;    box-shadow: 0px 1px 7px -3px #333;border: 1px solid #F3F3F3;
    border-radius: 8px;
    padding: 31px 16px;
    line-height: 24px;
    font-size: 20px;}

.radioField.active{border-color: #2DA700;}





.quiz.formSent .formNotic{display: flex;justify-content: center;align-items: center;}
.formNotic{padding:40px;min-height: 100vh;position: relative;display: none;}
.formNotic:after{content:'';background-color: rgba(0,0,0,0.6);position: absolute;width: 100%;height: 100%;top:0px;left:0px;z-index: -1;}

.formNoticWrapper{background-color: #fff;border-radius: 24px;padding:56px;text-align: center;max-width: 700px;}
.formNoticWrapper h3{color: #2DA700;font-size: 48px;margin-bottom: 32px;text-transform: uppercase;}
.formNoticWrapper p{color:#C9C9C9;font-size: 24px;font-family: "Montserrat", sans-serif;line-height: 28px;margin-bottom: 80px;}










@media(max-width:767px){
  .entryTop .hight,.entryBottom .hight{font-size: 56px;line-height: 70px;}
  .entryTop p,.entryBottomFlex p{font-size: 16px;}
  .entryFlex{padding:24px;}
  .entryBottomFlex p{min-width: 191px;position: relative;top:-30px;}
  .entryBottomFlex{gap: 10px;align-items: flex-end;}
.entryMiddle h3{font-size: 20px;}
.goForm{padding: 16px 50px;}
.entryMiddle h3{margin-bottom: 24px;}
.entryMiddle{margin-top: 40px;margin-bottom: 20px;}



.stepStyle{text-align: center;font-size: 16px;margin-bottom: 16px;}
.allForm .form-container{padding:40px 12px;}
.allForm .progress,.allForm .progress-bar{height: 10px;}
.allForm .progress{margin-bottom: 20px;}
.form-step h3{text-align: center;font-size: 24px;line-height: 28px;max-width: 300px;margin: 0 auto 48px;}
.form-step label{font-size: 16px;}
.allForm input{font-size: 16px;    padding: 27px 16px}
.allForm button{font-size: 24px;margin: 48px auto 0;padding: 18px 50px;}
.errorField{font-size: 16px;margin-top: 16px;}



.formNoticWrapper{padding:32px;}
.formNoticWrapper h3{font-size: 32px;margin-bottom: 16px;}
.formNoticWrapper p{font-size: 16px;margin-bottom: 32px;}
.formNoticWrapper img{max-width: 112px;}
.formNotic{padding:20px;}


}





@media(max-width: 550px){
.entryBottomFlex{display: block;}
.entryBottomFlex p{top:0px;max-width: 260px;}
.entryBottom{align-items: flex-start;}
.entryBottomFlex{width: 100%;}
.entryBottomFlex .hight{display: block;width: 100%;        margin-top: -24px;}
.entryTop .hight, .entryBottom .hight {
        font-size: 38px;
        line-height: 44px;
    }
    .entryTop .hight{margin-bottom: 10px;display: block;}
.entryBottom > .hight{display: block;
    text-align: center;
    width: 100%;}



}













/* / */