.auth-body{
  min-height:100vh; margin:0;
  background:
    radial-gradient(circle at 20% 10%, rgba(30,78,163,.18) 0%, transparent 50%),
    radial-gradient(circle at 80% 80%, rgba(255,216,74,.18) 0%, transparent 50%),
    linear-gradient(180deg,#eaf2ff,#f8fbff);
  display:flex; align-items:center; justify-content:center;
  padding: 30px 16px;
}
.auth-shell{
  width:100%; max-width:1080px;
  display:grid; grid-template-columns: 1.05fr 1fr; gap:30px;
  position:relative;
}
.auth-back{
  position:absolute; top:-12px; left:0;
  color:var(--ink-700); font-weight:600; font-size:14px;
  display:inline-flex; align-items:center; gap:6px;
}

.auth-card{
  background:#fff; border-radius:var(--radius-lg); box-shadow:var(--shadow-md);
  padding:40px; border:1px solid var(--border);
}
.auth-card.wide { grid-column: 1/-1; max-width:760px; margin:0 auto; }
.auth-brand{ text-align:center; margin-bottom:28px;}
.auth-brand img{ width:90px; margin:0 auto 12px; filter:drop-shadow(0 12px 24px rgba(15,58,122,.25));}
.auth-brand h1{ font-size:24px; margin-bottom:6px;}
.auth-brand p{ color:var(--ink-500); margin:0; font-size:14px;}

.auth-form .field { margin-bottom:14px;}
.hint{ font-size:11px; color:var(--ink-500); display:block; margin-top:4px;}

.auth-divider{
  display:flex; align-items:center; gap:14px; margin:20px 0;
  color:var(--ink-300); font-size:12px; font-weight:600; text-transform:uppercase;
}
.auth-divider::before,.auth-divider::after{
  content:""; flex:1; height:1px; background:var(--border);
}
.auth-actions { display:flex; flex-direction:column; gap:8px;}

.auth-foot{ font-size:12px; color:var(--ink-500); text-align:center; margin-top:20px;}
.auth-foot a{ color:var(--blue-700);}

/* SIDE BENEFITS */
.auth-side{ display:flex; align-items:center;}
.benefits{
  background: linear-gradient(135deg, var(--blue-800), var(--blue-700)); color:#fff;
  border-radius:var(--radius-lg); padding:34px; box-shadow:var(--shadow-md); width:100%;
}
.benefits h2{ color:#fff; margin-bottom:20px; font-size:24px;}
.benefits h2 em{ color:var(--gold); font-style:normal;}
.benefits ul{ list-style:none; padding:0; margin:0;}
.benefits li{ padding:10px 0; color:#cfe6ff; font-size:14px;}
.benefits li i{ color:var(--gold); width:24px; margin-right:8px;}
.benefits li strong{ color:#fff; display:block;}

/* GRID 2 cols */
.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.grid-2 .full{ grid-column:1/-1;}

@media(max-width: 880px){
  .auth-shell{ grid-template-columns:1fr; }
  .auth-side{ display:none; }
  .auth-card{ padding:28px; }
  .grid-2 { grid-template-columns:1fr;}
}