/* =========================================================
   LOGIN PREMIUM V6.0.3
   ========================================================= */

.login-screen{
    margin:0;
    min-height:100vh;
    background:#07110b;
    color:#fff;
}

.login-bg{
    min-height:100vh;
    position:relative;
    overflow:hidden;
    display:grid;
    place-items:center;
    padding:28px;
    background:
        radial-gradient(
            circle at 15% 20%,
            rgba(20,134,73,.22),
            transparent 34%
        ),
        radial-gradient(
            circle at 85% 80%,
            rgba(242,140,24,.16),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            #07110b 0%,
            #0d1a12 50%,
            #07110b 100%
        );
}

.login-orb{
    position:absolute;
    border-radius:999px;
    filter:blur(1px);
    opacity:.45;
}

.login-orb-one{
    width:280px;
    height:280px;
    background:rgba(20,134,73,.22);
    left:-100px;
    top:-80px;
}

.login-orb-two{
    width:240px;
    height:240px;
    background:rgba(242,140,24,.18);
    right:-80px;
    bottom:-90px;
}

.login-layout{
    width:min(1050px,100%);
    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:0;
    position:relative;
    z-index:2;
    border:1px solid rgba(255,255,255,.08);
    border-radius:28px;
    overflow:hidden;
    box-shadow:
        0 35px 90px rgba(0,0,0,.38);
    background:rgba(255,255,255,.02);
    backdrop-filter:blur(8px);
}

.login-brand-panel{
    min-height:620px;
    padding:58px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    background:
        linear-gradient(
            180deg,
            rgba(12,31,20,.82),
            rgba(7,17,11,.94)
        );
    border-right:1px solid rgba(255,255,255,.08);
}

.login-brand-badge{
    width:72px;
    height:72px;
    border-radius:20px;
    display:grid;
    place-items:center;
    background:var(--orange);
    color:#17120b;
    font-size:28px;
    font-weight:900;
    box-shadow:
        0 18px 40px rgba(242,140,24,.24);
    margin-bottom:28px;
}

.login-brand-panel .eyebrow{
    margin-bottom:12px;
}

.login-brand-panel h1{
    margin:0;
    font-size:clamp(48px,6vw,78px);
    line-height:.92;
    letter-spacing:-.04em;
}

.login-brand-panel h1 span{
    display:block;
    color:var(--orange);
}

.login-lead{
    max-width:520px;
    font-size:20px;
    color:#c8d3cc;
    margin:24px 0 30px;
}

.login-brand-line{
    width:72px;
    height:4px;
    border-radius:999px;
    background:var(--orange);
    margin-bottom:28px;
}

.login-brand-footer{
    display:grid;
    gap:5px;
}

.login-brand-footer strong{
    letter-spacing:.08em;
}

.login-brand-footer span{
    color:#82958a;
    font-size:14px;
}

.login-card{
    margin:0;
    border:0;
    border-radius:0;
    box-shadow:none;
    min-height:620px;
    padding:54px;
    background:#fff;
    color:var(--ink);
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.login-card-head{
    margin-bottom:24px;
}

.login-kicker{
    display:block;
    color:var(--orange);
    font-size:12px;
    font-weight:900;
    letter-spacing:.14em;
    margin-bottom:10px;
}

.login-card h2{
    font-size:38px;
    margin:0 0 7px;
}

.login-card-head p{
    margin:0;
    color:var(--muted);
}

.login-form{
    gap:12px;
}

.input-wrap{
    position:relative;
}

.input-wrap input{
    padding-left:46px;
    height:52px;
    background:#f9fbfa;
    border:1px solid #d8e0da;
}

.input-icon{
    position:absolute;
    left:16px;
    top:50%;
    transform:translateY(-50%);
    color:#839187;
    font-size:14px;
    pointer-events:none;
}

.login-submit{
    width:100%;
    min-height:52px;
    margin-top:10px;
    background:var(--orange);
    color:#1d1408;
    font-size:15px;
    border-radius:12px;
}

.login-submit:hover{
    transform:translateY(-1px);
    box-shadow:
        0 12px 26px rgba(242,140,24,.2);
}

.login-security{
    display:flex;
    align-items:flex-start;
    gap:10px;
    padding:14px;
    margin-top:20px;
    border-radius:12px;
    background:#f4f7f5;
    color:var(--muted);
    font-size:13px;
}

.login-security p{
    margin:0;
}

.login-public-link{
    text-align:center;
    margin-top:18px;
}

.login-public-link a{
    font-weight:700;
    color:var(--green);
}

@media(max-width:850px){

    .login-bg{
        padding:18px;
    }

    .login-layout{
        grid-template-columns:1fr;
        max-width:520px;
    }

    .login-brand-panel{
        min-height:auto;
        padding:34px 28px;
    }

    .login-brand-panel h1{
        font-size:46px;
    }

    .login-lead{
        font-size:16px;
        margin-bottom:20px;
    }

    .login-card{
        min-height:auto;
        padding:34px 28px;
    }
}

@media(max-width:480px){

    .login-bg{
        padding:0;
        align-items:stretch;
    }

    .login-layout{
        border-radius:0;
        min-height:100vh;
    }

    .login-brand-panel{
        padding:34px 22px 28px;
    }

    .login-brand-badge{
        width:56px;
        height:56px;
        font-size:22px;
        border-radius:16px;
        margin-bottom:20px;
    }

    .login-brand-panel h1{
        font-size:40px;
    }

    .login-lead{
        font-size:15px;
    }

    .login-card{
        padding:30px 22px 38px;
    }

    .login-card h2{
        font-size:32px;
    }
}