body{height:auto;overflow:initial}
body ::-moz-selection{color:var(--color-white);background:#ff17b0}
body ::selection{color:var(--color-white);background:#ff17b0}
body ::-moz-selection{color:var(--color-white);background:#ff17b0}
.color-gradient::-moz-selection{background:transparent}
.color-gradient::selection{background:transparent}
/*-------------------------------------------------------------------------------------------------------------------------------*/
/* FORM ELEMENTS */
/*-------------------------------------------------------------------------------------------------------------------------------*/
input,textarea,select{border-radius:0;background:none;border:none;margin:0;width:100%;padding:0}
textarea{display:block;resize:none;overflow:auto}
.input-field{font-size:clamp(20px, 2vw, 28px);position:relative;font-weight:300}
.input{transition:0.3s;text-overflow:ellipsis;padding:var(--gap-xs) var(--gap-s);color:var(--color-black);width:100%;background:rgba(255, 255, 255, 0.29);border-radius:9px;letter-spacing:-0.015em}
.input-field .input::-moz-placeholder{color:#ffffff}
.input-field .input:-ms-input-placeholder{color:#ffffff}
.input-field .input::placeholder{color:#ffffff}
.value > .input,.input:focus{background:var(--color-white)}
.input:focus::-moz-placeholder{color:var(--color-black)}
.input:focus:-ms-input-placeholder{color:var(--color-black)}
.input:focus::placeholder{color:var(--color-black)}
textarea.input{padding-top:1.4em}
.invalid > .input-field__placeholder,.invalid .input{color:var(--color-red);border-color:var(--color-red)}
.input:focus{border-color:var(--color-black) !important}
.radio-button{display:inline-block;position:relative}
.checkbox{position:relative;display:block;cursor:pointer;font-size:clamp(16px, 1.8vw, 22px);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;padding-left:calc(30px + var(--gap-s))}
.checkbox input{display:none}
.checkbox__box{position:relative;display:inline-flex;width:30px;height:30px;border-radius:50%;background:var(--color-white);flex-shrink:0;position:absolute;top:0.65em;left:0;transform:translateY(-50%)}
.checkbox__box::before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);width:20px;height:20px;border-radius:50%;background:radial-gradient(
    113.64% 113.64% at 91.81% 150%,
    #6321e8 0%,
    #ff17b0 100%
  );transition:0.3s;opacity:0}
.checkbox > input:checked ~ .checkbox__box::before{opacity:1}
.checkbox__label a{font-weight:500}
.input-button{display:flex}
.input-button .input{margin-bottom:0;width:100%}
.input-button .btn{flex-shrink:0}
.form-group{margin-bottom:calc(var(--gap-s) * -1)}
.form-group > *{margin-bottom:var(--gap-s)}
.form-group + .form-group{margin-top:var(--gap-l)}
.contact-form,form{display:block;width:100%}
.form-group button{font-size:45px;height:65px;padding:var(--gap-xs) var(--gap-l);margin:0 auto}
@media (max-width: 767px){
.form-group button{font-size:24px;height:45px;padding:var(--gap-xs) var(--gap-xl)}
.checkbox{padding-left:var(--gap-s)}
.checkbox__box{width:15px;height:15px}
.checkbox__box::before{width:11px;height:11px}
}
/* select */
.custom-select{position:relative;z-index:2;color:var(--color-black);width:100%;letter-spacing:-0.015em}
.custom-select select{display:none}
.select-selected{padding:var(--gap-xs) var(--gap-s);background:rgba(255, 255, 255, 0.29);border-radius:9px;position:relative;color:var(--color-white)}
.value .select-selected{background:var(--color-white);color:var(--color-black)}
/*style the arrow inside the select element:*/
.select-selected:after{position:absolute;content:"";top:50%;right:var(--gap-s);width:30px;height:17px;background:url(../img/icons/arrow-down_green.svg) no-repeat;background-size:100%;transform:translate(0, -50%) scale(1, 1);transition:0.5s}
/*point the arrow upwards when the select box is open (active):*/
.select-selected.select-arrow-active:after{transform:translate(0, -50%) scale(1, -1)}
/*style the items (options), including the selected item:*/
.select-items div,.select-selected{cursor:pointer}
.select-items div{padding:var(--gap-xxs) var(--gap-s)}
/*style items (options):*/
.select-items{position:absolute;top:100%;left:0;right:0;z-index:99;overflow:auto;max-height:400px;border-radius:9px;transition:0.5s;background:var(--color-white)}
/*hide the items when the select box is closed:*/
.select-hide{top:calc(100% + 20px);opacity:0;visibility:hidden}
.select-items div:hover,.same-as-selected{background-color:rgba(0, 0, 0, 0.1)}
@media (min-width: 992px) and (hover: hover){
.input:hover{border-color:var(--color-black)}
}
@media (max-width: 767px){
.form-group > .row{margin-bottom:0}
.form-group > .row > *{margin-bottom:var(--gap-s)}
.input{padding-bottom:5px}
}
/* TODO */
.todo__list{counter-reset:number;gap:var(--gap-m)}
.todo__number{position:relative}
.todo__number img{width:100%;filter:drop-shadow(0px 4px 34px rgba(255, 23, 176, 0.6))}
.todo__number::after{content:counter(number);counter-increment:number;position:absolute;left:42%;top:45%;font-size:84px;transform:translate(-50%, -50%)}
.todo__item{display:grid;grid-template-columns:70px auto;align-items:center;gap:var(--gap-m);max-width:450px}
@media (max-width: 991px){
.todo__list{justify-content:center}
.todo__image{grid-row:2}
}
@media (max-width: 767px){
.todo__number::after{font-weight:bold;font-size:44px}
.todo__item{grid-template-columns:40px auto}
}
/* END TODO */
/* INSTRUCTIONS */
.instructions__image{margin-top:calc(var(--gap-l) * -1)}
.instructions__list{padding-bottom:var(--gap-l)}
.instructions__item{display:grid;grid-template-columns:80px auto;gap:var(--gap-m);max-width:430px;justify-self:flex-end;align-items:center;width:100%}
.instructions__icon{position:relative;z-index:1}
.instructions__icon > img{position:absolute;left:55%;top:50%;transform:translate(-50%, -50%);width:100%;z-index:-1;filter:drop-shadow(0px 4px 34px rgba(255, 23, 176, 0.6))}
.instructions__text{max-width:430px;justify-self:center}
@media (max-width: 991px){
.instructions__item{justify-self:center}
.instructions__image{display:none}
.instructions__list{padding-bottom:0}
}
@media (max-width: 767px){
.instructions__item{grid-template-columns:55px auto}
.instructions__item .btn_main{height:31px;font-size:16px}
}
/* END INSTRUCTIONS */
/* QUESTIONARY */
.questionary__form{max-width:500px}
@media (max-width: 991px){
.questionary__form{justify-self:center}
}
/* END QUESTIONARY */
/* ACCORDION */
.accordion-item{padding:var(--gap-s) var(--gap-xl);border-bottom:solid 1px var(--color-white)}
.accordion-item:first-child{padding-top:0}
.accordion-title{display:grid;grid-template-columns:auto 40px;gap:var(--gap-s);align-items:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer}
.accordion__btn{transition:0.5s;transform:scale(1, 1)}
.accordion-title.active .accordion__btn{transform:scale(1, -1)}
.accordion-inner{padding-top:var(--gap-s)}
.accordion-title.active .hover-gradient::before,.accordion-title.active .hover-gradient span{opacity:1}
@media (max-width: 1199px){
.accordion-item{padding:var(--gap-s) var(--gap-l)}
}
@media (max-width: 767px){
.accordion-title{grid-template-columns:auto 30px}
.accordion-item{padding:var(--gap-s) 0}
}
/* END ACCORDION */