:root {
    --wow-berry: #8f164f;
    --wow-rose: #d5467f;
    --wow-plum: #321225;
    --wow-cream: #fff8f4;
    --wow-gold: #d6a85f;
}

body.wow-as-login-page,
body.login {
    background:
        radial-gradient(circle at 12% 14%, rgba(213, 70, 127, .18), transparent 32rem),
        linear-gradient(135deg, #321225 0%, #6f1645 46%, #fff8f4 46%, #fff8f4 100%);
    color: #321225;
    font-family: "Nunito Sans", system-ui, sans-serif;
    min-height: 100vh;
}

.wow-as-login-shell {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(20rem, .95fr);
    align-items: center;
    gap: clamp(2rem, 7vw, 7rem);
    width: min(68rem, calc(100% - 2rem));
    min-height: 100vh;
    margin: auto;
    padding: 2rem 0;
}

.wow-as-login-intro {
    color: white;
    max-width: 34rem;
}

.wow-as-login-logo {
    display: block;
    width: auto;
    height: 5rem;
    margin-bottom: 2rem;
    object-fit: contain;
}

.wow-as-login-eyebrow {
    margin: 0 0 .65rem;
    color: #f1cf94;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.wow-as-login-intro h1 {
    margin: 0;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(3rem, 7vw, 5.6rem);
    font-weight: 600;
    line-height: .92;
}

.wow-as-login-intro > p:not(.wow-as-login-eyebrow) {
    max-width: 31rem;
    font-size: 1.12rem;
    line-height: 1.7;
}

.wow-as-login-intro blockquote {
    margin: 2rem 0 0;
    padding-left: 1.15rem;
    border-left: 3px solid var(--wow-gold);
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: 1.35rem;
}

.wow-as-login-intro cite {
    display: block;
    margin-top: .35rem;
    color: #f1cf94;
    font-family: "Nunito Sans", system-ui, sans-serif;
    font-size: .85rem;
    font-style: normal;
}

.wow-as-login-card {
    width: min(100%, 29rem);
    justify-self: end;
    box-sizing: border-box;
    padding: clamp(1.6rem, 5vw, 3rem);
    border: 1px solid rgba(143, 22, 79, .13);
    border-radius: 1.5rem;
    background: rgba(255, 255, 255, .97);
    box-shadow: 0 1.8rem 5rem rgba(50, 18, 37, .2);
}

.wow-as-login-card h2 {
    margin: 0;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: 2.6rem;
}

.wow-as-login-card > div > p {
    margin: .2rem 0 1.5rem;
    color: #725867;
}

.wow-as-login-card form > label:not(.wow-as-remember) {
    display: block;
    margin: 1rem 0 .45rem;
    font-size: .9rem;
    font-weight: 800;
}

.wow-as-login-card input[type="text"],
.wow-as-login-card input[type="password"] {
    width: 100%;
    box-sizing: border-box;
    min-height: 3.15rem;
    padding: .75rem .9rem;
    border: 1px solid #d8c5ce;
    border-radius: .7rem;
    background: white;
    color: #321225;
    font: inherit;
}

.wow-as-login-card input:focus {
    outline: 3px solid rgba(213, 70, 127, .2);
    border-color: var(--wow-rose);
}

.wow-as-password-field {
    position: relative;
}

.wow-as-password-field input {
    padding-right: 4.5rem !important;
}

.wow-as-password-toggle {
    position: absolute;
    top: 50%;
    right: .45rem;
    padding: .35rem .55rem;
    transform: translateY(-50%);
    border: 0;
    background: transparent;
    color: var(--wow-berry);
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.wow-as-remember {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin: 1rem 0;
    color: #5e4654;
    font-size: .9rem;
}

.wow-as-login-submit {
    width: 100%;
    min-height: 3.2rem;
    border: 0;
    border-radius: .75rem;
    background: linear-gradient(120deg, var(--wow-berry), var(--wow-rose));
    color: white;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.wow-as-login-submit:hover {
    filter: brightness(1.07);
}

.wow-as-login-submit:disabled {
    cursor: wait;
    filter: saturate(.65);
    opacity: .78;
}

.wow-as-login-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: .75rem;
    margin-top: 1.25rem;
    font-size: .88rem;
}

.wow-as-login-links a,
body.login a {
    color: var(--wow-berry);
}

.wow-as-login-error {
    padding: .8rem .95rem;
    border-left: 4px solid #b42318;
    border-radius: .4rem;
    background: #fff1f0;
    color: #7a271a;
}

body.login #login {
    box-sizing: border-box;
    width: min(28rem, calc(100% - 2rem));
    padding-top: 7vh;
}

body.login #loginform,
body.login #lostpasswordform,
body.login #resetpassform {
    border: 0;
    border-radius: 1.25rem;
    box-shadow: 0 1.5rem 4rem rgba(50, 18, 37, .22);
}

body.login h1 a {
    width: 100%;
    background-image: none;
    color: white;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: 1.75rem;
    line-height: 1.2;
    text-indent: 0;
}

body.login .button-primary {
    border-color: var(--wow-berry);
    background: var(--wow-berry);
}

@media (max-width: 760px) {
    body.wow-as-login-page {
        background: linear-gradient(160deg, #321225 0, #74194a 33rem, #fff8f4 33rem);
    }

    .wow-as-login-shell {
        grid-template-columns: 1fr;
        align-content: center;
        gap: 2rem;
        padding: 3rem 0;
    }

    .wow-as-login-intro h1 {
        font-size: clamp(2.8rem, 13vw, 4.2rem);
    }

    .wow-as-login-card {
        justify-self: stretch;
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        transition: none !important;
    }
}