@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap");
:root{--navy:#102a43;--blue:#176b87;--blue-dark:#0d536c;--mint:#dff3ee;--text:#2a3b48;--muted:#74828c;--line:#dce6e7;--white:#fff;--danger:#b42318}
*{box-sizing:border-box}body{min-height:100vh;margin:0;display:grid;place-items:center;padding:32px;color:var(--text);background:radial-gradient(circle at 12% 12%,#48a78e33,transparent 27%),radial-gradient(circle at 90% 85%,#176b872b,transparent 26%),linear-gradient(135deg,#eff8f5,#eef4f8);font-family:"Manrope",Arial,sans-serif}button,input{font:inherit}
.login-card{width:min(980px,100%);min-height:590px;display:grid;grid-template-columns:42% 58%;overflow:hidden;border:1px solid #ffffffbf;border-radius:28px;background:#ffffffed;box-shadow:0 28px 80px #1a414d2e}
.profile-side{display:flex;align-items:center;justify-content:center;padding:42px 32px;background:linear-gradient(150deg,#103a4c,#176b87)}.photo-block{width:min(100%,310px);text-align:center}.photo-frame{width:100%;aspect-ratio:4/5;overflow:hidden;border:7px solid #fffffff2;border-radius:22px;background:#dce8e7;box-shadow:0 18px 42px #00000047}.photo-frame img{width:100%;height:100%;object-fit:cover;object-position:center 25%}.login-logo{width:132px;height:55px;margin:20px auto 8px;padding:4px;border-radius:10px;background:#fff;object-fit:contain}.tagline{margin:0;color:#ffffffba;font-size:13px;line-height:1.65}
.form-side{display:grid;place-items:center;padding:54px clamp(40px,6vw,78px)}.form-wrap{width:min(100%,420px)}.eyebrow{margin:0 0 10px;color:var(--blue);font-size:12px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}h1{margin:0;color:var(--navy);font-size:clamp(30px,4vw,42px);line-height:1.14;letter-spacing:-.04em}.intro{margin:13px 0 26px;color:var(--muted);font-size:14px;line-height:1.7}.alert{margin-bottom:18px;padding:12px 15px;border:1px solid #f5c2c0;border-radius:10px;color:var(--danger);background:#fff1f0;font-size:13px}.field{margin-bottom:19px}.field>label{display:block;margin-bottom:8px;color:var(--navy);font-size:13px;font-weight:700}.field input{width:100%;height:54px;padding:0 16px;border:1px solid var(--line);border-radius:13px;outline:none;color:var(--navy);background:#fbfcfc}.field input:focus{border-color:var(--blue);background:#fff;box-shadow:0 0 0 4px #176b871c}.password-wrap{position:relative}.password-wrap input{padding-right:52px}.password-toggle{position:absolute;top:50%;right:8px;width:38px;height:38px;border:0;border-radius:9px;background:transparent;cursor:pointer;transform:translateY(-50%)}.password-toggle:hover{background:var(--mint)}.remember{display:flex;align-items:center;gap:8px;margin:0 0 23px;font-size:12px}.remember input{width:16px;height:16px;accent-color:var(--blue)}.login-button{width:100%;height:55px;border:0;border-radius:13px;color:#fff;background:linear-gradient(135deg,var(--blue),var(--blue-dark));font-weight:800;box-shadow:0 13px 28px #0e536d3b;cursor:pointer}.login-button:hover{transform:translateY(-1px)}.back-home{display:block;margin-top:22px;color:var(--blue);font-size:12px;font-weight:700;text-align:center;text-decoration:none}
@media(max-width:760px){body{padding:18px}.login-card{grid-template-columns:1fr;border-radius:22px}.profile-side{padding:27px 24px}.photo-block{width:170px}.photo-frame{aspect-ratio:1;border-width:5px;border-radius:50%}.tagline{display:none}.login-logo{margin-top:14px}.form-side{padding:38px 26px 32px}}