.login{min-height:100vh;min-height:100svh;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
.login-brand{background:var(--laranja);padding:56px;display:flex;flex-direction:column;justify-content:flex-end;gap:16px;position:relative;overflow:hidden}
.login-logo{position:absolute;top:44px;left:56px;height:30px}
/* a ilustração ocupa o espaço que sobra na coluna, sem empurrar o texto para fora da tela */
.login-art{display:block;flex:1 1 0;min-height:140px;width:100%;max-width:820px;object-fit:contain;object-position:center;margin:56px auto 8px;align-self:center}
.login-brand h1{font-size:clamp(30px,calc(5.7vw - 13px),56px);line-height:.98;letter-spacing:-.02em;font-weight:600;margin:0;white-space:nowrap}
.login-card{display:flex;align-items:center;justify-content:center;padding:32px 16px}
.login-card form{width:100%;max-width:380px;background:var(--creme-claro);border:1px solid var(--areia);border-radius:var(--r-md);padding:32px}
.login-card h2{font-size:28px;font-weight:600;margin:0 0 22px;letter-spacing:-.01em}
.login-card .btn{width:100%;margin-top:4px;padding:13px}
.login-help{font-size:12.5px;color:var(--cinza);margin:16px 0 0}
@media (max-width:820px){
  .login{grid-template-columns:1fr}
  .login-brand{padding:96px 24px 32px;min-height:auto}
  .login-logo{left:24px;top:32px}
  .login-art{flex:none;width:100%;max-width:440px;height:auto;min-height:0;margin:0 auto 4px;object-position:center}
  .login-brand h1{font-size:clamp(26px,8.4vw,38px)}
}
[hidden]{display:none!important}
#mfa-form .login-help:first-of-type{margin-bottom:16px}
