.login-page-body {
    background: #f7fafd;
    color: #173e67;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.login-page {
    display: flex;
    flex: 1 0 auto;
    flex-direction: column;
}

.login-page__logo-wrap {
    align-items: center;
    display: flex;
    justify-content: center;
    padding: 3.75rem 1rem 0;
}

.login-page__logo-link {
    display: inline-flex;
}

.login-page__logo {
    display: block;
    height: auto;
    width: min(12.5rem, 42vw);
}

.login-page__content {
    display: flex;
    flex: 1 0 auto;
    justify-content: center;
    padding: 3.5rem 1rem 5rem;
}

.login-page__card {
    align-self: start;
    max-width: 37.875rem;
    width: 100%;
}

.login-page__card .form-ui {
    gap: 3rem;
}

.login-page__card .form-ui__section-content {
    gap: 1.9375rem;
}

.login-page__submit {
    width: 100%;
}

@media (min-width: 48rem) {
    .login-page__logo-wrap {
        padding: 3.75rem 1.5rem 0;
    }

    .login-page__content {
        padding: 3.5rem 1.5rem 5rem;
    }
}

@media (min-width: 80rem) {
    .login-page__logo-wrap {
        padding: 3.75rem 3rem 0;
    }

    .login-page__content {
        padding: 3.5rem 3rem 4rem;
    }

    .login-page__card {
        padding: 3rem;
    }
}