/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css*/
html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
    box-sizing: border-box;
    font-size: var(--main-font-size)
}

.lpeCElement {
    width: 100%
}

body {
    margin: 0;
    padding-top: 80px;
    color: var(--main-color);
    overflow: hidden;
    font: 1rem"Noto Sans",sans-serif
}

a {
    background-color: transparent;
    color: inherit;
    text-decoration: none
}

button,mktoField,optgroup,select,textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button,mktoField {
    overflow: visible
}

button,select {
    text-transform: none
}

[type=button],[type=reset],[type=submit],button {
    -webkit-appearance: button
}

[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner {
    border-style: none;
    padding: 0
}

[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring {
    outline: 1px dotted ButtonText
}

fieldset {
    padding: 0;
    border: 0
}

textarea {
    overflow: auto
}

[type=checkbox],[type=radio] {
    box-sizing: border-box;
    padding: 0
}

[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button {
    height: auto
}

.grecaptcha-badge,[hidden],legend {
    display: none
}

@font-face {
    font-display:swap;font-family:"Noto Sans";font-style:normal;font-weight:400;src:url(../fonts/noto-sans-v36-latin-regular.woff2)format("woff2"),url(../fonts/noto-sans-v36-latin-regular.woff)format("woff"),url(../fonts/noto-sans-v36-latin-regular.ttf)format("truetype")
}

@font-face {
    font-display:swap;font-family:"Noto Sans";font-style:normal;font-weight:500;src:url(../fonts/noto-sans-v36-latin-500.woff2)format("woff2"),url(../fonts/noto-sans-v36-latin-500.woff)format("woff"),url(../fonts/noto-sans-v36-latin-500.ttf)format("truetype")
}

:root {
    --container-max-width: 1792px;
    --container-paddings: 50px;
    --main-color: #3c3f4a;
    --secondary-color: #73778A;
    --btn-orange-default: #F08621;
    --btn-orange-hover: #D96B03;
    --btn-orange-active: #D1823B;
    --btn-grey-default: #F4F5F9;
    --btn-grey-hover: #E7E8EE;
    --btn-grey-active: #D4D6DD;
    --white: #fff;
    --border-color: #DDDFE0;
    --main-gap: 52px;
    --hero-gap: 40px;
    --main-font-size: 22px;
    --main-line-height: 36px;
    --safe-margin-bg: 40px;
    --safe-margin-sm: 20px;
    --block-margin: 16px
}

*,::after,::before {
    box-sizing: inherit
}

img {
    max-width: 100%
}

.hide {
    display: none
}

.mktoButton-reset {
    display: inline-block;
    border: 0;
    padding: 0;
    background-color: transparent;
    cursor: pointer
}

.mktoButton {
    color: var(--white);
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 1;
    border-radius: 8px;
    border: 1px solid var(--btn-orange-default);
    background: var(--btn-orange-default);
    padding: 21px 24px
}

.mktoButton:hover {
    background: var(--btn-orange-hover)
}

.mktoButton:focus-visible {
    border: 1px solid var(--btn-orange-active);
    background: var(--btn-orange-default)
}

.mktoButton:active {
    background: var(--btn-orange-active)
}

.form {
    display: flex;
    flex-direction: column;
    margin-top: 20px;
    margin-bottom: 16px;
    width: 100%!important
}

.form__inputs {
    display: grid;
    grid-template-rows: 1fr 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    column-gap: 40px;
    row-gap: 44px;
    height: 100%;
    border: 0;
    margin: 0 0 6px
}

.legend {
    display: none
}

.form__inputs .mktoFormRow:nth-child(2) {
    grid-row-start: 1;
    grid-column-start: 1;
    grid-row-end: 2;
    grid-column-end: 2
}

.form__inputs .mktoFormRow:nth-child(3) {
    grid-row-start: 1;
    grid-column-start: 2;
    grid-row-end: 2;
    grid-column-end: 3
}

.form__inputs .mktoFormRow:nth-child(4) {
    grid-row-start: 2;
    grid-column-start: 1;
    grid-row-end: 3;
    grid-column-end: 2
}

.form__inputs .mktoFormRow:nth-child(5) {
    grid-row-start: 2;
    grid-column-start: 2;
    grid-row-end: 3;
    grid-column-end: 3
}

.form__inputs .mktoFormRow:nth-child(6) {
    grid-row-start: 3;
    grid-column-start: 1;
    grid-row-end: 4;
    grid-column-end: 2
}

.form__inputs .mktoFormRow:nth-child(7) {
    grid-row-start: 3;
    grid-column-start: 2;
    grid-row-end: 4;
    grid-column-end: 3
}

.form__inputs .mktoFormRow:nth-child(8) {
    grid-row-start: 4;
    grid-column-start: 1;
    grid-row-end: 5;
    grid-column-end: 2
}

.form__inputs .mktoFormRow:nth-child(9) {
    grid-row-start: 4;
    grid-column-start: 2;
    grid-row-end: 5;
    grid-column-end: 3
}

.form__inputs .mktoFormRow:nth-child(10) {
    grid-row-start: 5;
    grid-column-start: 1;
    grid-row-end: 6;
    grid-column-end: 3
}

.mktoFormRow {
    position: relative;
    width: 100%;
    text-align: left
}

.mktoField,.mktoLabel {
    font-size: 14px;
    color: var(--secondary-color)
}

.selectric-mktoField .label {
    font-size: 14px;
    position: relative;
    top:1px;
}

.mktoLabel {
    position: absolute;
    top: -34px;
    font-weight: 400;
    line-height: 36px
}

.mktoField {
    -webkit-appearance: none;
    width: 100%;
    letter-spacing: 0;
    border-radius: 4px;
    border: 1px solid var(--border-color);
    background: var(--white);
    padding: 7px 0 7px 16px;
    height: 32px;
    outline: 0
}

.mktoField::placeholder {
    color: var(--secondary-color);
    line-height: 16px;
    font: 400 14px/16px"Noto Sans",sans-serif
}

.mktoField:hover {
    border: 1px solid #a9acba;
    color: #3c3f4a
}

.mktoField:hover::placeholder, .mktoInvalid.mktoField:hover::placeholder {
    color: #3c3f4a
}

.mktoValid,.mktoValid:hover {
    border: 1px solid #dddfe0;
    color: var(--main-color)
}

.mktoValid:hover {
    border: 1px solid #a9acba
}

.mktoField:focus-visible {
    border: 1px solid var(--btn-orange-default);
    color: var(--secondary-color)
}

.mktoField:focus-visible::placeholder,.mktoInvalid.mktoField:focus-visible::placeholder {
    color: var(--secondary-color)
}

select.mktoField {
    padding: 6px 10px 6px 17px
}

.form__option {
    padding: 0;
    min-height: 0;
    line-height: 16px
}

.form__section--text {
    max-width: 100%;
    width: 100%
}

.form__text-area {
    width: 100%;
    height: 32px;
    padding-right: 0;
    resize: none;
    overflow: hidden
}

.form__operational-system {
    align-self: start;
    margin-bottom: 32px
}

.form__operational-system--name {
    display: block;
    color: var(--secondary-color);
    font: 400 14px/36px"Noto Sans",sans-serif
}

.form__container {
    display: flex;
    flex-wrap: wrap;
    gap: 16px
}

.form__system {
    display: flex;
    align-items: center;
    position: relative;
    padding: 10px 12px 12px 46px;
    color: var(--secondary-color);
    width: 145px;
    border-radius: 4px;
    border: 1px solid var(--border-color);
    background: var(--white);
    cursor: pointer;
    font: 400 14px/16px"Noto Sans",sans-serif
}

.form__system:hover {
    border: 1px solid var(--btn-orange-default)
}

.form__select {
    position: absolute;
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
    background-position: center;
    left: 12px
}

.form__success--mobile {
    font-size: 10px;
    font-weight: 500;
    line-height: 14px;
    color: #73778a;
}

.form__success--desktop {
    font-size: 14px;
    font-weight: 500;
    line-height: 14px;
    color: #73778a;
}

.form__select--windows {
    background-image: url(../images/windows.svg)
}

.form__select--mac {
    background-image: url(../images/mac.svg)
}

.mktoButtonRow {
    text-align: center;
    position: relative
}

.mktoButton--success {
    position: absolute;
    display: none;
    content: "";
    bottom: 0;
    left: 50%;
    transform: translate(-50%);
    width: 60px;
    height: 60px;
    background-image: url(../images/btn-success.svg);
    background-position: center center;
    background-repeat: no-repeat
}

.mktoButtonRow.clicked .mktoButton--success {
    display: block
}

.link {
    text-decoration: underline
}

.privacy-policy {
    display: block;
    text-align: center;
    color: var(--secondary-color);
    font-size: 14px;
    font-weight: 500;
    line-height: 14px
}

.form__system--chosen {
    border: 1px solid var(--btn-orange-default);
    color: var(--main-color)
}

.mktoField:active {
    border: 1px solid var(--btn-orange-default);
    color: var(--main-color)
}

.mktoField:active::placeholder,.mktoInvalid.mktoField:active::placeholder {
    color: var(--main-color)
}

.mktoInvalid {
    border: 1px solid #DE3E26;
    color: #DE3E26
}

.mktoInvalid.mktoField::placeholder {
    color: red
}

.mktoInvalid.mktoField:active::placeholder {
    color: var(--main-color)
}

.mktoError {
    display: none!important
}

.link:active,.link:hover,.mktoValid .mktoField::placeholder,.mktoValid:hover .mktoField::placeholder {
    color: var(--main-color)
}

.form__btn--success {
    position: relative;
    display: block;
    content: '';
    bottom: 0;
    left: 50%;
    transform: translate(-50%);
    width: 60px;
    height: 60px;
    background-image: url('../images/btn-success.svg');
    background-position: center center;
    background-repeat: no-repeat;
}

@media (max-width:650px) {
    .mktoButton {
        color: var(--white);
        border-radius: 8px;
        border: 1px solid var(--btn-orange-default);
        background: var(--btn-orange-default);
        align-self: center;
        line-height: 24px;
        padding: 17px 19px;
        font: 500 20px "Noto Sans"
    }

    .form__success--desktop {
        font-size: 12px;
    }

    .privacy-policy {
        font-size: 12px;
    }

    .form__inputs {
        display: grid;
        grid-template-rows: 1fr 1fr 1fr 1fr 1fr;
        grid-template-columns: 1fr 1fr;
        height: 100%;
        border: 0;
        column-gap: 32px;
        row-gap: 40px;
        margin: 0 0 21px
    }

    .form__operational-system--name {
        display: block;
        color: var(--secondary-color);
        text-align: left;
        margin-bottom: 7px;
        font: 400 14px/36px"Noto Sans",sans-serif
    }

    .form__system {
        width: 135px;
        padding-left: 48px;
        padding-top: 12px
    }

    .form__operational-system {
        align-self: start;
        margin-bottom: 20px
    }

    .mktoButton-reset {
        display: inline-block;
        border: 0;
        padding: 0;
        background-color: transparent;
        cursor: pointer
    }

    .mktoButton:hover {
        background: var(--btn-orange-hover)
    }

    .mktoButton:focus-visible {
        border: 1px solid var(--btn-orange-active);
        background: var(--btn-orange-default)
    }

    .mktoButton:active {
        background: var(--btn-orange-active)
    }

    .form {
        display: flex;
        flex-direction: column;
        margin-bottom: 16px
    }

    .mktoLabel {
        position: absolute;
        color: var(--secondary-color);
        font-size: 14px;
        font-weight: 400;
        line-height: 36px;
        top: -19px
    }

    .form__option {
        padding: 0;
        min-height: 0;
        line-height: 16px
    }

    .form__section--text {
        max-width: 100%;
        width: 100%
    }

    .form__text-area {
        width: 100%;
        height: 32px;
        padding-right: 0;
        resize: none;
        overflow: hidden
    }

    .form__container {
        display: flex;
        flex-wrap: wrap;
        gap: 16px
    }

    .mktoButtonRow {
        text-align: center;
        position: relative
    }

    .mktoButtonRow.clicked .mktoButton--success {
        display: block
    }

    .form__policy {
        display: block;
        text-align: center;
        color: var(--secondary-color);
        font-size: 12px;
        font-weight: 500;
        line-height: 14px
    }

    .form__operational-system--name,.selectric-mktoField .label, .form__system,.mktoField,.mktoField::placeholder,.mktoLabel {
        font-size: 12px;
        line-height: 16px
    }

    .selectric-mktoField .label {
        top:0px;
    }


}
@media (max-width:540px) {
    .mktoButton {
        font-size: 20px;
        line-height: 24px
    }

    .form__inputs .mktoFormRow:nth-child(2) {
        grid-row-start: 1;
        grid-column-start: 1;
        grid-row-end: 2;
        grid-column-end: 3
    }

    .form__inputs .mktoFormRow:nth-child(3) {
        grid-row-start: 2;
        grid-column-start: 1;
        grid-row-end: 3;
        grid-column-end: 3
    }

    .form__inputs .mktoFormRow:nth-child(4) {
        grid-row-start: 3;
        grid-column-start: 1;
        grid-row-end: 4;
        grid-column-end: 3
    }

    .form__inputs .mktoFormRow:nth-child(5) {
        grid-row-start: 4;
        grid-column-start: 1;
        grid-row-end: 5;
        grid-column-end: 3
    }

    .form__inputs .mktoFormRow:nth-child(6) {
        grid-row-start: 5;
        grid-column-start: 1;
        grid-row-end: 6;
        grid-column-end: 3
    }

    .form__inputs .mktoFormRow:nth-child(7) {
        grid-row-start: 6;
        grid-column-start: 1;
        grid-row-end: 7;
        grid-column-end: 3
    }

    .form__inputs .mktoFormRow:nth-child(8) {
        grid-row-start: 7;
        grid-column-start: 1;
        grid-row-end: 8;
        grid-column-end: 3
    }

    .form__inputs .mktoFormRow:nth-child(9) {
        grid-row-start: 8;
        grid-column-start: 1;
        grid-row-end: 9;
        grid-column-end: 3
    }

    .form__inputs .mktoFormRow:nth-child(10) {
        grid-row-start: 9;
        grid-column-start: 1;
        grid-row-end: 10;
        grid-column-end: 3
    }
}
@media (max-width:450px) {
    .form__section {
        max-width: 304px
    }

    .form__policy {
        font-size: 10px;
        line-height: 14px
    }

    .form__operational-system {
        margin-bottom: 24px
    }
}