.auth-page{
    padding-top:42px;
}

.auth-wrap{
    display:grid;
    grid-template-columns:1fr 460px;
    gap:28px;
    align-items:start;
}

.auth-wrap-register{
    grid-template-columns:1fr minmax(0, 620px);
}

.auth-info{
    background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
    border:1px solid rgba(255,255,255,.08);
    border-radius:24px;
    padding:28px;
    box-shadow:var(--shadow-sm);
}

.auth-info h1{
    font-size:clamp(2rem, 4vw, 2.8rem);
    margin-bottom:10px;
}

.auth-info p{
    color:var(--muted);
    line-height:1.7;
}

.auth-points{
    margin-top:18px;
    display:grid;
    gap:12px;
}

.auth-point{
    padding:12px 14px;
    border-radius:14px;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.08);
    color:#fff;
    font-weight:700;
}

.auth-card{
    background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
    border:1px solid rgba(255,255,255,.08);
    border-radius:24px;
    padding:26px;
    box-shadow:var(--shadow-md);
}

.auth-card h2{
    font-size:1.45rem;
    margin-bottom:6px;
}

.auth-card > p{
    margin-bottom:18px;
}

.auth-form{
    display:grid;
    gap:14px;
}

.form-group{
    display:grid;
    gap:8px;
}

.form-group label{
    font-size:.95rem;
    font-weight:700;
    color:#fff;
}

.form-group input,
.form-group textarea{
    width:100%;
    padding:12px 14px;
    border-radius:14px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.04);
    color:#fff;
    outline:none;
}

.form-group input::placeholder,
.form-group textarea::placeholder{
    color:#94a3b8;
}

.form-group input:focus,
.form-group textarea:focus{
    border-color:rgba(34,197,94,.28);
    box-shadow:0 0 0 4px rgba(34,197,94,.10);
}

.form-group textarea{
    min-height:110px;
    resize:vertical;
}

.form-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
}

.auth-submit{
    width:100%;
    margin-top:4px;
}

.auth-extra{
    margin-top:16px;
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    align-items:center;
}

.auth-extra a{
    color:#4ade80;
    font-weight:800;
}

.auth-extra a:hover{
    color:#86efac;
}

@media (max-width:980px){
    .auth-wrap,
    .auth-wrap-register{
        grid-template-columns:1fr;
    }
}

@media (max-width:640px){
    .form-grid{
        grid-template-columns:1fr;
    }

    .auth-card,
    .auth-info{
        padding:20px;
    }
}