body.tpa-login-page{min-height:100vh;background:linear-gradient(135deg,#f7fafc 0%,#edf4f7 58%,#f8fafb 100%);overflow-x:hidden}
.login-main{min-height:100vh;display:flex;justify-content:center;align-items:center;padding:24px}
.login-stage{width:min(1120px,100%);min-height:816px;display:grid;grid-template-columns:554px minmax(0,1fr);gap:14px;align-items:stretch}
.login-brand-panel{position:relative;min-height:816px;border-radius:12px;overflow:hidden;box-shadow:0 14px 34px rgba(17,24,39,.12);background:#111820}
.login-brand-panel img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center top}
/* The approved brand artwork still contains the legacy phone/email footer. Hide it without altering the source artwork. */
.login-brand-panel:after{content:"";position:absolute;left:0;right:0;bottom:0;height:58px;background:#111820;z-index:2;pointer-events:none}
.login-mobile-hero{display:none}
.login-card{min-height:816px;background:#fff;border:1px solid #e1e7ed;border-radius:12px;box-shadow:0 14px 34px rgba(17,24,39,.08);padding:38px 34px 22px;display:flex;flex-direction:column;min-width:0}
.login-card__header{display:block;margin-bottom:25px}
.login-card__header h1{font-size:31px;line-height:36px;margin:0;color:#121827;letter-spacing:-.02em}
.login-card__header p{margin:9px 0 0;font-size:15px;line-height:21px;color:#66728a;white-space:normal}
.login-env{height:32px;display:inline-flex;align-items:center;gap:8px;padding:0 12px;border-radius:6px;background:#e6f7ef;color:#137a57;font-size:13px;font-weight:700;white-space:nowrap}
.login-env i{display:block;width:7px;height:7px;border-radius:50%;background:#14a36b}
.login-form{display:grid;gap:16px}
.login-form__meta{display:flex;align-items:center;justify-content:space-between;margin-top:0}
.login-form__meta a{font-size:14px;font-weight:700;text-decoration:none;color:#0969ef}
.login-form__meta a:hover{text-decoration:underline}
.tpa-btn--login{width:100%;margin-top:2px}
.login-otp{width:100%;margin-top:-5px}
.login-security-note{min-height:24px;display:flex;align-items:center;justify-content:center;gap:9px;color:#8290a5;font-size:11.5px;line-height:16px;margin-top:-4px;text-align:center}
.login-security-note .tpa-icon{width:17px;height:17px;color:#8392a7;stroke-width:2;flex:0 0 auto}
#login-alert[aria-hidden="true"]{display:none}
#login-alert[aria-hidden="false"]{display:flex}
.login-office-directory{margin-top:auto;padding-top:18px;border-top:1px solid #dce3eb;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
.login-office{min-width:0;display:grid;grid-template-columns:28px minmax(0,1fr);gap:8px;padding:0 12px;color:#172033;text-decoration:none;border-left:1px solid #e4e9ef}
.login-office:first-child{border-left:0;padding-left:0}
.login-office:last-child{padding-right:0}
.login-office:focus-visible{outline:3px solid rgba(37,99,235,.22);outline-offset:4px;border-radius:6px}
.login-office__icon{display:grid;place-items:center;width:26px;height:26px;border-radius:7px;background:#eef5ff;color:#2372d4;margin-top:1px}
.login-office__icon .tpa-icon{width:16px;height:16px}
.login-office__copy{display:grid;gap:3px;min-width:0}
.login-office__copy strong{font-size:12px;line-height:16px;color:#172033}
.login-office__copy span{font-size:10.5px;line-height:14px;color:#69778c;overflow-wrap:anywhere}
.login-office__copy em{font-style:normal;font-size:10.5px;line-height:14px;font-weight:700;color:#0969ef;margin-top:2px}
.login-office:hover .login-office__copy em{text-decoration:underline}
.login-card__footer{margin-top:16px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:11px;color:#75829a}
.login-card__footer a{font-weight:700;color:#0969ef;text-decoration:none}
.login-card__footer a:hover{text-decoration:underline}

@media (max-width:1180px) and (min-width:981px){
  .login-main{padding:20px}
  .login-stage{grid-template-columns:minmax(480px,540px) minmax(420px,1fr)}
  .login-card{padding-left:30px;padding-right:30px}
  .login-office{padding-left:9px;padding-right:9px;grid-template-columns:24px minmax(0,1fr);gap:6px}
  .login-office__icon{width:23px;height:23px}
  .login-office__copy span{font-size:10px;line-height:13px}
}

@media (max-width:980px){
  .login-main{min-height:100vh;padding:24px;align-items:flex-start;background:#eef4f7}
  .login-stage{display:flex;flex-direction:column;width:100%;max-width:530px;min-height:0;gap:0}
  .login-brand-panel,.login-office-directory{display:none}
  .login-mobile-hero{display:block;height:208px;position:relative;overflow:hidden;background:#111820 url('../img/showroom.webp') center 64%/cover no-repeat;color:#fff;padding:18px 20px 22px;border-radius:14px 14px 0 0}
  .login-mobile-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,12,16,.24),rgba(8,12,16,.60) 72%,rgba(8,12,16,.80))}
  .login-mobile-hero__overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,10,14,.72),transparent 66%)}
  .login-mobile-hero__logo{position:relative;z-index:1;width:178px;height:77px;object-fit:contain;object-position:left center;display:block}
  .login-env--hero{position:absolute;z-index:2;right:18px;top:20px;height:29px;font-size:12px;padding:0 10px}
  .login-mobile-hero__copy{position:absolute;left:20px;bottom:20px;z-index:1;display:grid;gap:5px;text-shadow:0 1px 2px rgba(0,0,0,.45)}
  .login-mobile-hero__copy strong{font-size:20px;line-height:24px}
  .login-mobile-hero__copy span{font-size:12px;line-height:17px;color:#f0f2f4}
  .login-card{height:auto;min-height:690px;border-radius:0 0 14px 14px;padding:26px 28px 20px;box-shadow:0 12px 30px rgba(17,24,39,.08)}
  .login-card__header{margin-bottom:20px}
  .login-card__header h1{font-size:28px;line-height:32px}
  .login-card__header p{font-size:13px;line-height:18px;margin-top:5px}
  .login-card__footer{padding-top:15px;margin-top:auto;border-top:1px solid #dce3eb;font-size:11px;min-height:39px}
}

@media (max-width:760px){
  :root{--tpa-control-h:44px;--tpa-button-h:48px}
  body.tpa-login-page{background:#10161b;min-height:100svh}
  .login-main{min-height:100svh;padding:0;background:#10161b;align-items:stretch}
  .login-stage{width:100%;max-width:none;min-height:100svh;background:#fff}
  .login-mobile-hero{height:208px;border-radius:0;padding:18px 20px 22px}
  .login-card{flex:1;min-height:0;border:0;border-radius:18px 18px 0 0;margin-top:-1px;padding:22px max(20px,env(safe-area-inset-right)) calc(18px + env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));box-shadow:none;position:relative;z-index:3}
  .login-card__header{margin-bottom:19px}
  .login-card__header h1{font-size:27px;line-height:31px}
  .login-card__header p{font-size:13px;line-height:18px;margin-top:4px;color:#66718a}
  .login-form{gap:14px}
  .tpa-field{gap:6px}
  .tpa-field label{font-size:14px;line-height:18px}
  .tpa-control>.tpa-icon:first-child{left:14px;width:19px;height:19px}
  .tpa-control--icon input,.tpa-control--icon select{padding-left:44px;font-size:14px}
  .password-toggle{right:5px;width:36px;height:36px}
  .password-toggle .tpa-icon{width:20px;height:20px}
  .tpa-check{font-size:13px;gap:8px}
  .tpa-check__box{width:20px;height:20px}
  .login-form__meta a{font-size:13px}
  .tpa-btn{font-size:15px}
  .tpa-btn--login{margin-top:0}
  .login-otp{margin-top:-3px}
  .login-security-note{font-size:11px;margin-top:-2px}
  .login-security-note .tpa-icon{width:16px;height:16px}
  .tpa-alert{min-height:44px;padding:10px 12px;font-size:12px}
  .tpa-alert .tpa-icon{width:21px;height:21px}
  .login-card__footer{padding-top:15px;margin-top:16px;font-size:11px;gap:12px;min-height:39px}
}

@media (max-width:360px){
  .login-card{padding-left:16px;padding-right:16px}
  .login-form__meta{gap:8px}
  .login-card__footer{align-items:flex-start;flex-direction:column;gap:5px}
}
