/* login-hero-v6 */
/* login-hero-v5 */
/* ==== login-v3 + hero (login-hero-v3 + login-hero-v4) — mock-faithful login, scoped; loaded last ==== */
.v2-login{grid-template-columns:1.08fr 1fr;background:#eef2f9}
.v2-login .lv3-panel{display:flex;flex-direction:column;justify-content:space-between;padding:56px 58px 30px;color:#fff;position:relative;overflow:hidden;
  background:linear-gradient(152deg,#153aa6 0%,#1d4ed8 42%,#2563eb 72%,#3b82f6 100%)}
/* photo layer: the asset is pre-composed (sky + curves + blended edges);
   anchor it bottom-right at its natural portrait aspect, soft-fade only the
   far top/left edges into the gradient. No painted rings - the image has
   its own curve work. */
.v2-login .lv3-panel::after{content:"";display:block;position:absolute;border-radius:0;right:0;bottom:0;z-index:0;pointer-events:none;
  height:86%;aspect-ratio:234/378;max-width:58%;
  background:url('../img/login-hero2.jpg?v=20261001_132433') right bottom/cover no-repeat;
  -webkit-mask-image:linear-gradient(to left, #000 78%, transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to left, #000 78%, transparent 100%), linear-gradient(to top, #000 80%, transparent 100%);
  mask-composite:intersect}
/* one subtle highlight circle top-left, nothing crossing the brand */
.v2-login .lv3-panel::before{content:"";position:absolute;inset:0;display:block;z-index:0;pointer-events:none;border-radius:0;
  background:radial-gradient(22% 26% at -5% -4%, rgba(255,255,255,.12) 0 62%, rgba(255,255,255,0) 65%)}
.v2-login .lv3-top{position:relative;z-index:2;max-width:560px}
.v2-login .lv3-brandrow{display:flex;align-items:center;gap:16px}
.v2-login .lv3-mark{width:62px;height:62px;border-radius:16px;background:#fff;color:#1d4ed8;display:flex;align-items:center;justify-content:center;font-size:27px;box-shadow:0 10px 26px rgba(10,25,80,.35);flex:none}
.v2-login .lv3-name{font-size:30px;font-weight:800;letter-spacing:-.5px;line-height:1.05;color:#fff}
.v2-login .lv3-name span{color:#8db4ff;font-weight:800}
.v2-login .lv3-tagline{font-size:14.5px;color:#bfd4ff;margin-top:2px}
.v2-login .lv3-dash{width:46px;height:5px;border-radius:3px;background:#8db4ff;margin:30px 0 22px}
.v2-login .lv3-head{font-size:clamp(30px,3.3vw,46px);font-weight:800;line-height:1.12;letter-spacing:-.5px;margin:0;color:#fff;text-shadow:0 2px 20px rgba(13,34,96,.45)}
.v2-login .lv3-head span{color:#7cb3ff}
.v2-login .lv3-para{font-size:15px;line-height:1.65;color:#e2ecff;margin:18px 0 26px;max-width:470px;text-shadow:0 1px 14px rgba(13,34,96,.5)}
.v2-login .lv3-feats{display:flex;flex-direction:column;gap:17px}
.v2-login .lv3-feat{display:flex;align-items:center;gap:15px}
.v2-login .lv3-fic{width:48px;height:48px;border-radius:50%;background:rgba(21,58,166,.45);border:1px solid rgba(255,255,255,.45);display:flex;align-items:center;justify-content:center;font-size:17px;color:#fff;flex:none;backdrop-filter:blur(4px)}
.v2-login .lv3-feat b{display:block;font-size:15.5px;color:#fff;font-weight:700;text-shadow:0 1px 12px rgba(13,34,96,.55)}
.v2-login .lv3-feat small{display:block;font-size:13px;color:#dbe7ff;margin-top:1px;text-shadow:0 1px 12px rgba(13,34,96,.55)}
.v2-login .lv3-foot{position:relative;z-index:2;display:flex;align-items:center;gap:22px;border-top:1px solid rgba(255,255,255,.35);padding-top:16px;margin-top:26px}
.v2-login .lv3-dots{display:flex;gap:7px;align-items:center}
.v2-login .lv3-dots i{display:block;width:9px;height:6px;border-radius:4px;background:rgba(255,255,255,.45)}
.v2-login .lv3-dots i.on{width:26px;background:#fff}
.v2-login .lv3-foottxt{font-size:12.5px;color:#e6eeff;letter-spacing:.02em;text-shadow:0 1px 10px rgba(13,34,96,.6)}
/* ---- right side ---- */
.v2-login .lv3-wrap{background:#eef2f9;padding:32px}
.v2-login .lv3-card{max-width:440px;background:#fff;border-radius:18px;box-shadow:0 22px 60px rgba(15,23,42,.10);padding:40px 42px}
.v2-login .lv3-title{font-size:29px;font-weight:800;color:#0f172a;letter-spacing:-.4px}
.v2-login .lv3-sub{font-size:15px;color:#64748b;margin-top:4px}
.v2-login .lv3-field{margin-top:18px}
.v2-login .lv3-field label{display:block;font-size:14px;font-weight:700;color:#0f172a;margin-bottom:7px}
.v2-login .lv3-input{display:flex;align-items:stretch;border:1.5px solid #dbe3ef;border-radius:12px;overflow:hidden;background:#fff;transition:border-color .15s, box-shadow .15s}
.v2-login .lv3-input:focus-within{border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.12)}
.v2-login .lv3-ic{width:52px;background:#f6f8fc;border-right:1.5px solid #e7ecf5;display:flex;align-items:center;justify-content:center;color:#93a3bd;font-size:14.5px;flex:none}
.v2-login .lv3-input input{flex:1;border:none;outline:none;padding:13px 14px;font-size:14.5px;color:#0f172a;background:transparent;min-width:0}
.v2-login .lv3-input input::placeholder{color:#9aa8bf}
.v2-login .lv3-eye{border:none;background:transparent;color:#93a3bd;padding:0 14px;cursor:pointer;font-size:14.5px}
.v2-login .lv3-eye:hover{color:#475569}
.v2-login .lv3-row{display:flex;align-items:center;justify-content:space-between;margin:16px 0 4px;gap:10px;flex-wrap:wrap}
.v2-login .lv3-remember{display:flex;align-items:center;gap:8px;font-size:14px;color:#334155;cursor:pointer;margin:0}
.v2-login .lv3-remember input{width:17px;height:17px;accent-color:#2563eb;cursor:pointer}
.v2-login .lv3-link{font-size:14px;font-weight:600;color:#2563eb;text-decoration:none}
.v2-login .lv3-link:hover{text-decoration:underline}
.v2-login .lv3-forgot-note{font-size:12.5px;color:#64748b;background:#f6f8fc;border:1px solid #e7ecf5;border-radius:9px;padding:8px 11px;margin-top:8px}
.v2-login .lv3-btn{width:100%;margin-top:16px;padding:13px;font-size:15px;font-weight:700;border-radius:12px;background:#2563eb;border:none;color:#fff;display:flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;transition:background .15s}
.v2-login .lv3-btn:hover{background:#1d4ed8}
.v2-login .lv3-btn:disabled{opacity:.65;cursor:default}
.v2-login .lv3-btn-light{width:100%;margin-top:10px;padding:12px;font-size:14px;border-radius:12px}
.v2-login .lv3-or{display:flex;align-items:center;gap:14px;margin-top:20px;color:#94a3b8;font-size:12px;font-weight:700;letter-spacing:.12em}
.v2-login .lv3-or::before,.v2-login .lv3-or::after{content:"";flex:1;height:1px;background:#e5eaf2}
.v2-login .lv3-mfaic{text-align:center;font-size:30px;color:#2563eb;margin-bottom:8px}
.v2-login .v2-form-error{background:#fee2e2;color:#b91c1c;border-radius:10px;padding:10px 12px;margin-top:14px;font-size:13px}
.v2-login .v2-form-error.hidden,.v2-login .hidden{display:none}
@media (max-width:920px){
  .v2-login{grid-template-columns:1fr;overflow:auto}
  .v2-login .lv3-panel{padding:34px 28px 22px;min-height:0}
  .v2-login .lv3-panel::after{display:none}
  .v2-login .lv3-head{font-size:28px}
  .v2-login .lv3-para{display:none}
  .v2-login .lv3-feats{display:none}
  .v2-login .lv3-card{padding:28px 24px}
}