/* Diseño corporativo MACOBSA para la pantalla de ingreso.
   Solo estilos visuales: no modifica formulario ni lógica de autenticación. */
.login-body{
  --mc-blue:#3360f5;
  --mc-navy:#13385b;
  --mc-blue-dark:#2449c9;
  background:
    radial-gradient(circle at 12% 10%,rgba(51,96,245,.18),transparent 42%),
    radial-gradient(circle at 90% 95%,rgba(19,56,91,.16),transparent 40%),
    #eef2f9;
  font-family:'Segoe UI',Calibri,Arial,sans-serif;
}
.login-shell{
  width:min(1000px,100%);
  min-height:560px;
  border-radius:26px;
  box-shadow:0 30px 90px rgba(19,56,91,.22);
}
.login-brand{
  background:linear-gradient(155deg,var(--mc-navy) 0%,#163f6b 55%,var(--mc-blue) 130%);
  padding:56px 50px;
}
.login-brand:before{
  content:'';position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:34px 34px;
  pointer-events:none;
}
.login-brand:after{
  border-color:rgba(51,96,245,.35);
  box-shadow:0 0 0 35px rgba(51,96,245,.06),0 0 0 70px rgba(51,96,245,.04);
}
.login-brand>*{position:relative;z-index:1}
.login-brand .brand-mark{
  width:62px;height:62px;border-radius:0;background:none;box-shadow:none;margin-bottom:22px;
}
.login-brand .brand-mark svg{width:100%;height:100%;display:block;filter:drop-shadow(0 10px 18px rgba(0,0,0,.25))}
.login-brand .eyebrow{color:#9fb6ff;letter-spacing:.18em}
.login-brand h1{font-size:40px;color:#fff}
.login-brand>p:not(.eyebrow){color:#c9d6ea;font-size:14px;max-width:340px}
.login-points{gap:12px;margin-top:42px}
.login-points span{
  display:flex;align-items:center;gap:10px;
  color:#dbe5f5;font-size:11px;letter-spacing:.06em;
}
.login-points span:before{
  content:'';width:8px;height:8px;border-radius:2px;background:var(--mc-blue);
  box-shadow:0 0 0 4px rgba(51,96,245,.22);flex:0 0 auto;
}
.login-card{padding:60px 48px;position:relative;align-self:stretch;display:flex;flex-direction:column;justify-content:center}
.login-card:before{
  content:'';position:absolute;top:0;left:48px;right:48px;height:4px;
  border-radius:0 0 4px 4px;
  background:linear-gradient(90deg,var(--mc-navy),var(--mc-blue));
}
.login-card .eyebrow{color:var(--mc-blue)}
.login-card h2{color:var(--mc-navy);font:800 28px 'Segoe UI',Calibri,Arial,sans-serif;letter-spacing:-.02em}
.login-card label{color:var(--mc-navy)}
.login-card input{
  border:1px solid #cdd8ea;border-radius:10px;min-height:46px;font-size:14px;
  transition:border-color .15s,box-shadow .15s;
}
.login-card input:focus{
  outline:none;border-color:var(--mc-blue);box-shadow:0 0 0 4px rgba(51,96,245,.14);
}
.login-card .button.primary{
  min-height:48px;margin-top:14px;border-radius:10px;font-size:13px;letter-spacing:.02em;
  background:linear-gradient(90deg,var(--mc-blue),var(--mc-blue-dark));
  box-shadow:0 10px 22px rgba(51,96,245,.28);
}
.login-card .button.primary:hover{background:var(--mc-navy);box-shadow:0 10px 22px rgba(19,56,91,.28)}
.login-foot{color:#7d8ba3}
@media(max-width:760px){
  .login-brand{padding:30px 26px}
  .login-brand h1{font-size:28px}
  .login-brand .brand-mark{width:44px;height:44px;margin-bottom:12px}
  .login-card{padding:34px 24px 38px}
  .login-card:before{left:24px;right:24px}
}