.btn-primary {
    background-color: #1e6c72;
    border-color: #1e6c72;
}

.btn-primary:hover {
    background-color: #17a0ab;
    border-color: #17a0ab;
}

html, body { min-height: 100%; }
body { margin: 0; color: #172033; background: #f4f7f9; }
.login-shell { display: grid; min-height: 100vh; grid-template-columns: minmax(380px, 46%) 1fr; }
.login-brand { position: relative; align-items: center; padding: clamp(50px, 8vw, 110px); overflow: hidden; color: #fff; background: linear-gradient(145deg, #102f34, #0f766e); }
.login-brand::after { position: absolute; right: -170px; bottom: -170px; width: 480px; height: 480px; content: ""; border: 72px solid rgba(255,255,255,.05); border-radius: 50%; }
.login-brand > div { position: relative; z-index: 1; max-width: 560px; }
.login-brand-icon { display: grid; width: 82px; height: 82px; margin-bottom: 32px; place-items: center; background: transparent; }
.login-brand-icon img, .login-logo img { width: 100%; height: 100%; object-fit: contain; }
.login-logo-horizontal { display: block; width: 188px; height: 62px; object-fit: contain; object-position: left center; }
.login-kicker { margin-bottom: 10px !important; color: #8bd4cc; font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.login-brand h1 { margin-bottom: 20px; color: #fff; font-size: clamp(34px, 4vw, 54px); font-weight: 600; line-height: 1.12; }
.login-brand p { max-width: 520px; color: #d5e8e9; font-size: 16px; line-height: 1.7; }
.login-form-panel { display: flex; align-items: center; justify-content: center; padding: 32px; }
.login-card { width: 100%; max-width: 440px; padding: 36px; background: #fff; border: 1px solid #e4e7ec; border-radius: 16px; box-shadow: 0 18px 45px rgba(16,24,40,.08); }
.login-heading { display: flex; align-items: center; gap: 12px; padding-bottom: 24px; margin-bottom: 28px; border-bottom: 1px solid #e4e7ec; }
.login-logo { display: grid; width: 42px; height: 42px; place-items: center; color: #fff; background: #0f766e; border-radius: 11px; }
.login-heading > div { display: flex; flex-direction: column; line-height: 1.15; }
.login-heading strong { letter-spacing: .12em; }
.login-heading small { margin-top: 4px; color: #667085; font-size: 10px; text-transform: uppercase; }
.login-card h2 { margin-bottom: 6px; font-size: 26px; font-weight: 600; }
.login-card label { color: #344054; font-size: 13px; font-weight: 600; }
.login-card .form-control { min-height: 48px; border-color: #d0d5dd; border-radius: 9px; font-size: 14px; }
.login-card .form-control:focus { border-color: #0f766e; box-shadow: 0 0 0 3px rgba(15,118,110,.13); }
.login-card .btn-primary { min-height: 48px; background: #0f766e; border-color: #0f766e; border-radius: 9px; font-size: 15px; }
.login-card .btn-primary:hover { background: #115e59; border-color: #115e59; }
.login-card a { color: #0f766e; }
@media (max-width: 991.98px) {
    .login-shell { display: block; }
    .login-form-panel { min-height: 100vh; }
}
@media (max-width: 575.98px) {
    .login-form-panel { padding: 18px; }
    .login-card { padding: 26px 22px; }
}