*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Inter',system-ui,sans-serif;color:#1F2B38;min-height:100vh;
  background:linear-gradient(150deg,#2C3E50 0%,#0052A6 55%,#0066CC 100%);
  display:flex;align-items:center;justify-content:center;padding:40px 20px}
.tarjeta{background:#fff;border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,.22);
  width:100%;max-width:430px;padding:44px 40px 34px}
.marca{text-align:center;margin-bottom:30px}
.marca-logo-grande{display:block;max-width:250px;max-height:82px;width:auto;height:auto;margin:0 auto 14px}
.marca-sub{font-size:13px;color:#64707C;margin-top:3px}
.error-caja{background:#EBF3FB;border-left:4px solid #0052A6;color:#004A94;border-radius:8px;
  padding:13px 15px;font-size:13.5px;margin-bottom:20px;line-height:1.55}
.campo{display:flex;flex-direction:column;margin-bottom:18px}
.campo label{font-size:13px;font-weight:600;color:#455565;margin-bottom:7px}
.campo input{padding:13px 14px;border:1px solid #DDE0E3;border-radius:8px;
  font-family:'Inter',sans-serif;font-size:15px;color:#1F2B38}
.campo input:focus{outline:none;border-color:#0066CC;box-shadow:0 0 0 3px rgba(0,102,204,.14)}
.btn-entrar{width:100%;background:#0066CC;color:#fff;border:none;
  padding:15px;border-radius:9px;font-family:'Poppins',sans-serif;font-size:16px;font-weight:600;
  cursor:pointer;margin-top:8px;box-shadow:0 5px 16px rgba(44,62,80,.30);transition:all .25s}
.btn-entrar:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,102,204,.34)}
.nota-cliente{margin-top:24px;padding-top:20px;border-top:1px solid #F0F1F3;
  font-size:12px;color:#64707C;line-height:1.65;text-align:center}
.nota-cliente b{color:#6C7A87}
@media(max-width:480px){.tarjeta{padding:34px 24px 28px}}