:root {
    --wp-auth-navy: #041e2a;
    --wp-auth-navy-soft: #062f3f;
    --wp-auth-teal: #004e5f;
    --wp-auth-text: #f4fbff;
    --wp-auth-text-muted: rgba(226, 244, 250, .7);
    --wp-auth-border: rgba(183, 233, 249, .14);
    --wp-auth-radius: 1.6rem
}

html, body.wp-auth-body {
    min-height: 100%
}

body.wp-auth-body {
    margin: 0;
    overflow-x: hidden;
    background: var(--surface-ground)
}

.wp-auth-shell {
    display: grid;
    grid-template-columns:minmax(34rem, 1.05fr) minmax(30rem, .95fr);
    height: 100vh
}

.wp-auth-brand-panel {
    position: relative;
    isolation: isolate;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    overflow: hidden;
    height: 100vh;
    padding: clamp(2rem, 4vw, 4.5rem);
    color: var(--wp-auth-text);
    background: radial-gradient(circle at 16% 18%, color-mix(in srgb, var(--primary-color) 26%, transparent), transparent 34%), radial-gradient(circle at 90% 80%, color-mix(in srgb, var(--wp-auth-teal) 60%, transparent), transparent 38%), linear-gradient(145deg, var(--wp-auth-navy-soft), var(--wp-auth-navy))
}

.wp-auth-brand-panel__ambient {
    position: absolute;
    z-index: -2;
    border-radius: 50%;
    filter: blur(80px);
    pointer-events: none
}

.wp-auth-brand-panel__ambient--one {
    top: -8rem;
    left: -8rem;
    width: 26rem;
    height: 26rem;
    background: color-mix(in srgb, var(--primary-color) 26%, transparent)
}

.wp-auth-brand-panel__ambient--two {
    right: -10rem;
    bottom: -12rem;
    width: 30rem;
    height: 30rem;
    background: color-mix(in srgb, var(--wp-auth-teal) 42%, transparent)
}

.wp-auth-brand-panel__grid {
    position: absolute;
    z-index: -1;
    inset: 0;
    opacity: .18;
    background-image: linear-gradient(rgba(255, 255, 255, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px);
    background-size: 52px 52px;
    mask-image: linear-gradient(to bottom, black, transparent 92%)
}

.wp-auth-brand-panel__top, .wp-auth-brand-panel__footer {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem
}

.wp-auth-brand-link {
    display: inline-flex
}

.wp-auth-brand-logo {
    display: block;
    width: auto;
    max-width: 11rem;
    height: 3.1rem;
    object-fit: contain
}

.wp-auth-back-link {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .65rem .85rem;
    border: 1px solid var(--wp-auth-border);
    border-radius: .8rem;
    color: var(--wp-auth-text-muted);
    background: rgba(255, 255, 255, .04);
    font-size: .78rem;
    font-weight: 750;
    text-decoration: none!important;
    backdrop-filter: blur(12px);
    transition: .18s ease
}

.wp-auth-back-link:hover {
    color: var(--wp-auth-text);
    background: rgba(255, 255, 255, .07);
    transform: translateY(-1px)
}

.wp-auth-brand-panel__content {
    position: relative;
    z-index: 2;
    max-width: 42rem;
    margin-block: auto;
    padding-block: 2rem
}

.wp-auth-kicker {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    padding: .5rem .75rem;
    border: 1px solid var(--wp-auth-border);
    border-radius: 999px;
    color: var(--wp-auth-text-muted);
    background: rgba(255, 255, 255, .045);
    font-size: .74rem;
    font-weight: 850;
    letter-spacing: .05em;
    text-transform: uppercase
}

.wp-auth-kicker i {
    color: var(--primary-color)
}

.wp-auth-brand-panel__content h1 {
    margin: 1.5rem 0 0;
    font-size: clamp(3.2rem, 4vw, 4.7rem);
    font-weight: 800;
    line-height: .98;
    letter-spacing: -.055em
}

.wp-auth-brand-panel__content h1 span {
    display: block;
    color: transparent;
    background: linear-gradient(100deg, var(--primary-300, var(--primary-color)), var(--primary-color), #b8f1ff);
    background-clip: text;
    -webkit-background-clip: text
}

.wp-auth-brand-panel__content > p {
    max-width: 38rem;
    margin: 1.4rem 0 0;
    color: var(--wp-auth-text-muted);
    font-size: 1.04rem;
    line-height: 1.72
}

.wp-auth-benefits {
    display: grid;
    gap: .8rem;
    margin-top: 2rem
}

.wp-auth-benefits > div {
    display: flex;
    align-items: center;
    gap: .8rem;
    max-width: 34rem;
    padding: .8rem .9rem;
    border: 1px solid rgba(185, 233, 248, .1);
    border-radius: 1rem;
    background: rgba(255, 255, 255, .035);
    backdrop-filter: blur(12px)
}

.wp-auth-benefits > div > span {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 2.45rem;
    height: 2.45rem;
    border-radius: .8rem;
    color: var(--wp-auth-navy);
    background: var(--primary-300, var(--primary-color))
}

.wp-auth-benefits strong, .wp-auth-benefits small {
    display: block
}

.wp-auth-benefits strong {
    font-size: .82rem
}

.wp-auth-benefits small {
    margin-top: .18rem;
    color: var(--wp-auth-text-muted);
    font-size: .68rem
}

.wp-auth-floating-card {
    position: absolute;
    z-index: 4;
    display: flex;
    align-items: center;
    gap: .75rem;
    min-width: 13rem;
    padding: .85rem 1rem;
    border: 1px solid var(--wp-auth-border);
    border-radius: 1rem;
    color: var(--wp-auth-text);
    background: rgba(5, 29, 40, .72);
    box-shadow: 0 18px 44px rgba(0, 10, 18, .28);
    backdrop-filter: blur(16px);
    animation: wp-auth-float 5.6s ease-in-out infinite
}

.wp-auth-floating-card__icon {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 2.35rem;
    height: 2.35rem;
    border-radius: .8rem;
    color: var(--wp-auth-navy);
    background: var(--primary-300, var(--primary-color))
}

.wp-auth-floating-card strong, .wp-auth-floating-card small {
    display: block
}

.wp-auth-floating-card strong {
    font-size: .78rem
}

.wp-auth-floating-card small {
    margin-top: .16rem;
    color: var(--wp-auth-text-muted);
    font-size: .65rem
}

.wp-auth-floating-card--request {
    right: 4%;
    top: 27%
}

.wp-auth-floating-card--schedule {
    right: 9%;
    bottom: 17%;
    animation-delay: -2.5s
}

.wp-auth-brand-panel__footer {
    color: rgba(226, 244, 250, .42);
    font-size: .7rem
}

@keyframes wp-auth-float {
    0%, 100% {
        transform: translateY(0)
    }
    50% {
        transform: translateY(-7px)
    }
}

.wp-auth-form-panel {
    position: relative;
    display: grid;
    align-content: center;
    height: 100vh;
    padding: clamp(2rem, 5vw, 5rem);
    background: radial-gradient(circle at 85% 10%, color-mix(in srgb, var(--primary-color) 8%, transparent), transparent 30%), var(--surface-ground)
}

.wp-auth-form-panel__actions {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem
}

.wp-auth-language-button.ui-button {
    border-radius: .8rem
}

.wp-auth-language-panel {
    min-width: 12rem
}

.wp-auth-language-option.ui-button {
    width: 100%;
    justify-content: flex-start
}

.wp-auth-card {
    width: min(100%, 31rem);
    margin-inline: auto;
    padding: clamp(1.5rem, 3vw, 2.5rem);
    border: 1px solid color-mix(in srgb, var(--surface-border) 72%, var(--primary-color));
    border-radius: var(--wp-auth-radius);
    background: color-mix(in srgb, var(--surface-card) 97%, var(--primary-color));
    box-shadow: var(--app-card-shadow-hover, 0 24px 64px rgba(0, 0, 0, .12))
}

.wp-auth-card__mobile-logo {
    display: none;
    margin-bottom: 1.5rem
}

.wp-auth-card__mobile-logo img {
    width: auto;
    max-width: 10rem;
    height: 2.8rem;
    object-fit: contain
}

.wp-auth-card__header {
    margin-bottom: 1.7rem!important;
}

.wp-auth-card__eyebrow {
    display: block;
    color: var(--primary-color);
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .075em;
    text-transform: uppercase
}

.wp-auth-card__header h2 {
    margin: .4rem 0 0;
    color: var(--text-color);
    font-size: clamp(2.2rem, 4vw, 3.2rem);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.045em
}

.wp-auth-card__header p {
    margin: .8rem 0 0;
    color: var(--text-color-secondary);
    line-height: 1.6
}

.wp-auth-google {
    display: flex;
    justify-content: center;
    min-height: 2.75rem
}

.wp-auth-google .g_id_signin, .wp-auth-google .g_id_signin > div {
    width: 100% !important
}

.wp-auth-separator {
    display: flex;
    align-items: center;
    gap: .8rem;
    margin: 1.15rem 0;
    color: var(--text-color-secondary);
    font-size: .72rem
}

.wp-auth-separator:before, .wp-auth-separator:after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--surface-border)
}

.wp-auth-password-toggle.ui-button {
    justify-content: center;
    width: 100%;
    min-height: 2.85rem;
    border-radius: .85rem
}

.wp-auth-password-panel {
    display: grid;
    grid-template-rows:0fr;
    gap: 0;
    opacity: 0;
    transition: grid-template-rows .28s cubic-bezier(.2, .7, .2, 1), opacity .22s ease, margin-top .22s ease
}

.wp-auth-password-panel.is-open {
    grid-template-rows:1fr;
    gap: .9rem;
    margin-top: 1rem;
    opacity: 1
}

.wp-auth-field {
    min-height: 0;
    overflow: hidden
}

.wp-auth-field label {
    display: block;
    margin-bottom: .4rem;
    color: var(--text-color);
    font-size: .75rem;
    font-weight: 750
}

.wp-auth-input-wrapper {
    display: block;
    width: 100%;
    padding: 0.2rem;
}

.wp-auth-input-wrapper > i {
    z-index: 2;
    color: var(--text-color-secondary);
    left: 1rem !important;
}

.wp-auth-input-wrapper .ui-inputfield {
    width: 100%;
    min-height: 3rem;
    padding-left: 3rem;
    border-radius: .85rem
}


.wp-auth-options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1.15rem
}

.wp-auth-remember {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    color: var(--text-color-secondary);
    font-size: .78rem;
    cursor: pointer
}

.wp-auth-forgot-link {
    color: var(--primary-color);
    font-size: .78rem;
    font-weight: 750;
    text-decoration: none!important
}

.wp-auth-create-account {
    display: flex;
    justify-content: center;
    gap: .35rem;
    margin-top: 1.5rem;
    padding-top: 1.2rem;
    border-top: 1px solid var(--surface-border);
    color: var(--text-color-secondary);
    font-size: .78rem
}

.wp-auth-create-account a {
    color: var(--primary-color);
    font-weight: 800;
    text-decoration: none!important
}

.wp-auth-mobile-footer {
    display: flex;
    justify-content: center;
    gap: 1rem;
    margin-top: 1.3rem;
    color: var(--text-color-secondary);
    font-size: .68rem
}

.wp-auth-mobile-footer a {
    color: inherit;
    text-decoration: none!important
}

@media (max-width: 1100px) {
    .wp-auth-shell {
        grid-template-columns:minmax(28rem, .9fr) minmax(28rem, 1.1fr)
    }

    .wp-auth-floating-card {
        display: none
    }
}

@media (max-width: 850px) {
    .wp-auth-shell {
        display: block
    }

    .wp-auth-brand-panel {
        display: none
    }

    .wp-auth-form-panel {
        height: 100vh;
        padding: 5.5rem 1rem 2rem
    }

    .wp-auth-card__mobile-logo {
        display: block;
        text-align: center
    }

    .wp-auth-form-panel__actions {
        top: 1rem;
        right: 1rem
    }
}

@media (max-width: 520px) {
    .wp-auth-card {
        padding: 1.3rem;
        border-radius: 1.25rem
    }

    .wp-auth-options {
        align-items: flex-start;
        flex-direction: column
    }

    .wp-auth-create-account {
        flex-wrap: wrap;
        text-align: center
    }
}

@media (prefers-reduced-motion: reduce) {
    .wp-auth-floating-card {
        animation: none !important
    }

    .wp-auth-password-panel, .wp-auth-back-link {
        transition: none !important
    }
}

.wp-auth-back-link {
    font-size: .78rem !important;
}

.wp-auth-forgot-link {
    font-size: .78rem !important;
}

.wp-auth-create-account,
.wp-auth-create-account a {
    font-size: .78rem !important;
}

.wp-auth-mobile-footer,
.wp-auth-mobile-footer a {
    font-size: .68rem !important;
}