:root {
    --page-margin: 80px;
    --page-margin-m: 40px;
    --page-margin-s: 20px;
    --page-max-width: 1440px;
    --register-btn-radius: 24px;
    --register-btn-color: #2589FF;
    --register-btn-border: 2px solid #FFFFFF;
    --register-btn-font: 24px; 
    --register-btn-font-m: 16px; 
    --register-btn-padding: 24px 52px;
    --register-btn-padding-m: 16px 26.5px;
}

.main {
    overflow-x: hidden;
}

.content-wrap {
    max-width: var(--page-max-width);
    padding-left: var(--page-margin);
    padding-right: var(--page-margin);
    margin-left: auto;
    margin-right: auto;
}

.callbackform__message .register-btn,
.register-btn {
    --radius: var(--register-btn-radius);
    color: #fff;
    font-weight: 800;
    font-size: 24px;
    line-height: 120%;
    letter-spacing: 0px;
    vertical-align: middle;
    background-color: var(--register-btn-color);
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
    padding: 24px 52px;
    border: none;
    border-radius: var(--radius);
    cursor: pointer;
    transition: background-color 0.2s;
    text-decoration: none;
    position: relative;
    border: var(--register-btn-border);
}

.register-btn.transparent {
    border: 2px solid #FFFFFF;
    background-color: transparent;
}

.register-btn:active {
    background-color: #1a6de2;
    transition: none;
}

@media screen and (hover:hover) {
    .callbackform__message .register-btn:hover,
    .register-btn:hover {
        background-color: #1a6de2;
    }
}

.register-btn:disabled {
    background-color: #e2e2e2;
    cursor: not-allowed;
}

.gradient-border::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 2.23px;
    background: linear-gradient(
        162.62deg, #FFFFFF 12.36%,
        rgba(255, 255, 255, 0.6) 32.02%,
        rgba(255, 255, 255, 0) 38.89%,
        rgba(255, 255, 255, 0) 51.76%,
        rgba(255, 255, 255, 0.6) 58.23%,
        rgba(255, 255, 255, 0.8) 77.89%
    );

    mask:
        linear-gradient(#000 0 0) content-box,
        linear-gradient(#000 0 0);
    mask-composite: exclude;
    border-radius: var(--radius);
    pointer-events: none;
}

@media screen and (max-width: 1280px) {
    :root {
        --page-margin: var(--page-margin-m);
    }
}

@media screen and (max-width: 1024px) {
    :root {
        --page-margin: var(--page-margin-s);
    }

    .register-btn {
        font-size: var(--register-btn-font-m);
        padding: var(--register-btn-padding-m);
    }
}

@media screen and (max-width: 1024px) {
    .register-btn {
        justify-content: center;
    }
}

@media screen and (max-width: 680px) {
    .register-btn {
        --radius: 16px;
        font-size: 16px;
        padding: 16px 26px;
    }
}