/* Login page refresh */
.auth-hero{
    position:relative;
    padding:120px 0 90px;
    overflow:hidden;
    background:linear-gradient(135deg, rgba(31,122,224,0.06), rgba(18,184,134,0.06)),
              radial-gradient(circle at 15% 20%, rgba(31,122,224,0.08), transparent 35%),
              radial-gradient(circle at 80% 0%, rgba(18,184,134,0.08), transparent 32%);
}

.glow{ position:absolute; filter:blur(90px); opacity:0.6; z-index:0; }
.glow-1{ width:320px; height:320px; background:rgba(31,122,224,0.25); top:10%; left:4%; }
.glow-2{ width:280px; height:280px; background:rgba(18,184,134,0.25); bottom:6%; right:4%; }

.auth-layout{
    position:relative;
    width:min(1100px, 92vw);
    margin:0 auto;
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));
    gap:28px;
    align-items:center;
    z-index:1;
}

.auth-copy{
    background:linear-gradient(135deg, rgba(31,122,224,0.08), rgba(18,184,134,0.05));
    border:1px solid var(--border);
    border-radius:18px;
    padding:24px;
    box-shadow:var(--shadow);
    backdrop-filter:blur(6px);
}
.auth-copy h1{ margin:8px 0 12px; font-size:34px; line-height:1.2; color:var(--text); }
.auth-copy .lede{ color:var(--muted); margin-bottom:14px; max-width:520px; }
.perk-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:12px; }
.perk{ background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:12px; display:flex; gap:12px; align-items:flex-start; box-shadow:0 12px 30px rgba(15,23,42,0.08); }
.perk h4{ margin:0 0 4px; color:var(--text); }
.perk p{ margin:0; color:var(--muted); }
.icon-circle{ width:38px; height:38px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; background:rgba(31,122,224,0.1); color:var(--primary); }

.auth-card{ background:var(--surface); border:1px solid var(--border); border-radius:18px; padding:24px; box-shadow:var(--shadow); }
.auth-card h2{ text-align:center; margin:0 0 14px; }
.auth-form .input{ display:flex; flex-direction:column; gap:6px; margin-bottom:14px; }
.auth-form label{ font-weight:700; color:var(--muted); }
.auth-form input{ padding:12px 14px; border:1px solid var(--border); border-radius:12px; background:#f9fbff; color:var(--text); transition:border-color 0.2s ease, box-shadow 0.2s ease; }
.auth-form input:focus{ outline:none; border-color:var(--primary); box-shadow:0 0 0 4px rgba(31,122,224,0.12); }
.note{ font-size:12px; color:var(--muted); }
.form-meta{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.checkbox{ display:inline-flex; align-items:center; gap:8px; color:var(--muted); font-size:14px; }
.checkbox input{ width:16px; height:16px; accent-color:var(--primary); }
.fp{ color:var(--primary); font-weight:600; }
.fp:hover{ text-decoration:underline; }
.actions{ display:flex; flex-direction:column; gap:10px; }
.social-btn{ background:rgba(255,255,255,0.9); border:1px solid var(--border); box-shadow:0 10px 26px rgba(15,23,42,0.08); }
.social-btn i{ margin-right:8px; color:#ea4335; }
.alt{ text-align:center; color:var(--muted); margin-top:8px; }
.alt a{ color:var(--primary); font-weight:700; }

@media (max-width:720px){
    .auth-hero{ padding:100px 0 70px; }
    .auth-copy h1{ font-size:30px; }
    .form-meta{ flex-direction:column; align-items:flex-start; }
}