div.form__title{
    color: var(--color-black);
    font-size: .3em;
    font-style: normal;
    font-weight: 450;
    line-height: 150%;
    text-wrap: balance;
}
.form__form{
    padding-top: .6em;
}
.form__block{
    display: flex;
    flex-direction: column;
}
.form__block-input{
    row-gap: .5em;
}
.form__block-checkbox{
    gap: .39em;
    padding-top: .38em;
}
.form__block-btn{
    padding-top: .6em;
}
.form__item {
    display: flex;
    flex-direction: column;
}
.form__item input, .form__item textarea{
    width: 100%;
    color: var(--color-black);
    font-size: .18em;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: uppercase;
    padding: 0 0 .72em;
    margin: 0;
    border: 0;
    outline: 0;
    border-bottom: 1px solid var(--color-black);
}
.form__item textarea{resize: none; overflow: hidden}
.form__item *::placeholder{color: var(--color-gray-2); text-transform: uppercase}
.form__checkbox{
    display: flex;
}
.form__checkbox input{display: none}
.form__checkbox label{
    display: flex;
    gap: .1em;
}
.form__checkbox label .icon{
    width: .24em;
    height: .24em;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    border: 1px solid var(--color-black);
}
.form__checkbox label .icon svg{
    width: .14em;
    height: .1em;
    opacity: 0;
    transition: .3s linear;
}
.form__checkbox label .text {
    color: var(--color-black);
    font-size: .18em;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}
.form__checkbox input:checked + label .icon svg{opacity: 1;}
div.error-text{
    display: none;
    color: var(--error-color);
    font-size: .18em;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    cursor: default;
}
div.form__item.error input, .form__item.error textarea, .form__item.error *::placeholder, .form__checkbox.error{
    border-color: var(--error-color);
    color: var(--error-color);
}
.form__item.error .error-text, .form__checkbox.error .error-text{display: flex}
.form__allOk{
    padding: .5em 0;
    display: none;
}
.form__allOk .text{
    font-size: .25em;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    color: var(--color-black);
    text-wrap: balance;
}
.form.ok .form__allOk{display: block}
.form.ok .form__form{display: none}
@media (max-width: 1200px) {
    .form__form {padding-top: .4em;}
    .form__block-input {row-gap: .3em;}
    .form__block-checkbox {gap: .3em;}
    .form__block-btn {padding-top: .4em;}
}
@media (max-width: 800px) {
    .form {font-size: 1.2em;}
    .form__block-btn {
        align-items: center;
        align-content: center;
    }
}
@media (hover: hover) {
   .form__checkbox label{cursor: pointer; transition: .3s linear}
}