.login-body{min-height:100svh;padding:clamp(24px,5.7vw,96px);background:radial-gradient(ellipse at center,#f3f5f9,#fdfdfd)}
.login-wrap{width:min(1488px,100%);min-height:750px;grid-template-columns:50.8% 49.2%;border-radius:20px;box-shadow:0 20px 55px #16386616}
.brand-panel{padding:44px 54px;color:#0b3a7e;background:url('login-print-bg.webp') center/cover no-repeat}
.brand-center{top:calc(49% - 100px);transform:translate(-50%,-50%);width:94%}
.brand-center .company-logo-frame{display:inline-grid;place-items:center;width:240px;height:100px;padding:0}
.brand-center .company-logo-frame img{display:block;width:100%;height:100%;object-fit:contain}
.brand-center h1{font-size:40px;line-height:1.4;margin:18px 0 4px;font-weight:700;letter-spacing:.2px}
.brand-center h1{color:#082c63}
.brand-center p{font-size:21px;color:#35598f;margin:0}
.benefits{bottom:44px;left:9%;right:9%;align-items:center;justify-content:space-between;gap:20px;font-size:14px;white-space:nowrap}
.benefits span{display:flex;align-items:center;gap:11px}
.benefits{padding:14px 26px;border-radius:14px;background:#ffffffb8;backdrop-filter:blur(6px);box-shadow:0 6px 20px #0b3a7e1a;color:#0b3a7e;font-weight:600}
.benefits span+span{border-left:1px solid #a9c0de;padding-left:28px}
.login-icon{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.benefits .login-icon{width:29px;height:29px}
.login-panel{padding:64px 11.1%}
.login-panel form{width:100%;max-width:560px;transform:translateY(20px)}
.login-panel h2{font-size:46px;line-height:1.4;letter-spacing:-1px;color:#082c63;font-weight:700;margin:0 0 4px}
.login-panel form>p{font-size:21px;line-height:1.6;color:#8796b3;margin:0 0 34px;white-space:nowrap}
.login-panel label{font-size:17px;margin:20px 0 6px;color:#082b62;font-weight:600}
.login-field{position:relative;color:#4c6590}
.login-field>.login-icon{position:absolute;left:20px;top:50%;transform:translateY(-50%);pointer-events:none}
.login-panel .login-field input{height:64px;margin:0;padding:14px 56px 14px 62px;background:#f0f4fa;border:1px solid #d9e2f0;border-radius:13px;color:#142440;font-size:18px;outline:none}
.login-panel .login-field input:focus{border-color:#276fce;box-shadow:0 0 0 3px #2475dd18}
.login-panel input::placeholder{color:#98a5ba;font-size:16px}
.password-toggle{position:absolute;right:12px;top:10px;display:grid;place-items:center;width:44px;height:44px;border:0;background:transparent;color:#8798b6;cursor:pointer;border-radius:8px}
.login-options{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:22px 0 26px;font-size:17px}
.login-options .remember{display:flex;align-items:center;gap:11px;margin:0;font-weight:400;cursor:pointer}
.login-panel .remember input{width:25px;height:25px;margin:0;padding:0;accent-color:#1675ff;cursor:pointer}
.forgot-password{border:0;background:none;padding:0;color:#0968ff;cursor:pointer;font:inherit}
.login-panel .primary{height:64px;margin:0;border-radius:13px;background:linear-gradient(180deg,#0b4188,#062b61);font-size:21px;box-shadow:0 10px 24px #0b40851a;display:flex;align-items:center;justify-content:center;gap:16px}
.login-panel .primary:hover{background:linear-gradient(180deg,#124f9a,#073574)}
.login-body button:focus-visible,.login-body input:focus-visible{outline:3px solid #5da4ff;outline-offset:3px}
.login-panel .alert{margin:15px 0;font-size:14px}
.recovery-dialog{padding:30px;color:#173c78;line-height:1.8}.recovery-dialog p{margin:16px 0 24px}.recovery-dialog button{border:0;border-radius:8px;padding:10px 25px;background:#0b4188;color:#fff;cursor:pointer}
@media(min-width:1700px){.login-wrap{min-height:800px}}
@media(max-width:1250px){.login-body{padding:36px}.login-wrap{min-height:680px}.login-panel{padding:42px 8%}.login-panel h2{font-size:36px}.login-panel form>p{font-size:16px}.brand-panel{padding:36px}.brand-center h1{font-size:30px}.brand-center p{font-size:17px}.benefits{left:6%;right:6%;gap:10px;font-size:11px}.benefits span{gap:6px}.benefits span+span{padding-left:12px}.benefits .login-icon{width:24px}}
@media(max-width:760px){.login-body{padding:20px 16px}.login-wrap{grid-template-columns:1fr;min-height:0;border-radius:18px;max-width:560px}.brand-panel{min-height:310px;padding:23px;background-size:cover;background-position:center 58%}.brand-tag{display:block;font-size:8px;letter-spacing:3px}.brand-center{top:57%}.brand-center .company-logo-frame{width:154px;height:65px}.brand-center h1{font-size:27px;margin-top:7px}.brand-center p{font-size:15px}.benefits{display:none}.login-panel{padding:32px 26px 38px}.login-panel form{transform:none}.login-panel h2{font-size:32px}.login-panel form>p{font-size:14px;white-space:normal;margin-bottom:24px}.login-panel label,.login-options{font-size:15px}.login-panel .login-field input{height:58px;font-size:16px}.password-toggle{top:7px}.login-panel .primary{height:58px;font-size:18px}}
@media(min-width:1251px){.brand-center .company-logo-frame{width:260px;height:110px}.brand-center h1{margin-top:0;font-size:42px}.login-panel form{transform:translateY(36px)}.login-panel h2{font-size:48px}}
/* Desktop: fit the card inside one screen (no vertical scroll) */
@media(min-width:761px){.login-body{--lp:clamp(16px,4vh,48px);padding:var(--lp) clamp(24px,4vw,72px)}.login-wrap{height:calc(100svh - 2*var(--lp));min-height:560px;max-height:880px}.brand-panel{background-size:cover}.login-panel{padding-top:32px;padding-bottom:32px}.login-panel form{transform:none}}
@media(min-width:761px) and (max-height:820px){.brand-center .company-logo-frame{width:210px;height:88px}.brand-center h1{font-size:36px}.brand-center p{font-size:18px}.benefits{bottom:28px}.login-panel h2{font-size:40px}.login-panel form>p{font-size:18px;margin-bottom:22px}.login-panel label{font-size:16px;margin:14px 0 6px}.login-panel .login-field input{height:54px;font-size:17px}.password-toggle{top:5px}.login-options{margin:16px 0 20px;font-size:16px}.login-panel .primary{height:56px;font-size:19px}}
