/* ROIZER V4 — RV4-018B
   Reprodução controlada do mockup aprovado.
*/
:root{
  --navy:#020b18;
  --navy-2:#06162a;
  --blue:#087ef5;
  --cyan:#06b4ef;
  --ink:#071426;
  --muted:#6f7d93;
  --line:#cdd6e3;
  --panel:#f7f9fd;
  --danger:#b42318;
  --success:#067647;
}
*{box-sizing:border-box}
html,body{margin:0;min-width:320px;min-height:100%;background:var(--navy)}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);-webkit-font-smoothing:antialiased}
button,input{font:inherit}
button{border:0}
a{text-decoration:none}
.login-screen{
  min-height:100vh;
  display:grid;
  grid-template-columns:minmax(0,61.9%) minmax(480px,38.1%);
  grid-template-rows:minmax(0,1fr) 112px;
  background:#020b18;
  overflow:hidden;
}
.approved-hero{
  grid-column:1;
  grid-row:1;
  min-width:0;
  min-height:0;
  background-image:url("/images/auth/hero-approved.webp");
  background-repeat:no-repeat;
  background-position:left top;
  background-size:100% 100%;
}
.mobile-brand{display:none}
.login-panel{
  grid-column:2;
  grid-row:1;
  position:relative;
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:62px 6.4vw 80px 0;
  background:
    radial-gradient(circle at 28% 35%,rgba(12,75,143,.18),transparent 36%),
    linear-gradient(180deg,#020b18 0%,#061329 100%);
}
.panel-tools{
  position:absolute;
  top:19px;
  right:24px;
  display:flex;
  gap:14px;
}
.tool-button,.language-button{
  height:38px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:999px;
  color:#fff;
  background:#0a172a;
  opacity:1;
}
.tool-button{width:42px;display:grid;place-items:center}
.tool-button img{width:21px;height:21px}
.language-button{display:flex;align-items:center;gap:9px;padding:0 15px;font-weight:750}
.language-button img{width:20px;height:20px}
.tool-button:disabled,.language-button:disabled{cursor:default}
.login-card{
  width:min(100%,486px);
  min-height:768px;
  padding:45px 46px 34px;
  border:1px solid rgba(196,204,216,.95);
  border-radius:30px;
  background:linear-gradient(155deg,#fff 0%,#fbfcff 72%,#f4f6fa 100%);
  box-shadow:0 35px 80px rgba(0,0,0,.34);
}
.login-card__header{margin-bottom:30px}
.eyebrow{
  margin:0 0 9px;
  color:#049bf1;
  font-size:11px;
  font-weight:900;
  letter-spacing:.19em;
}
.login-card h1{
  margin:0;
  font-size:31px;
  line-height:1.1;
  letter-spacing:-.04em;
}
.login-card__header>p:last-child{
  margin:12px 0 0;
  color:#6c7890;
  font-size:14px;
}
.login-form{display:grid;gap:21px}
.field{display:grid;gap:8px}
.field label{font-size:13px;font-weight:800}
.field-label-row{display:flex;align-items:center;justify-content:space-between;gap:16px}
.field-label-row a{color:#004ff0;font-size:12px;font-weight:800}
.field input{
  width:100%;
  height:44px;
  padding:0 14px;
  border:1px solid #cdd5e1;
  border-radius:11px;
  outline:none;
  color:#10213a;
  background:#fff;
  box-shadow:inset 0 1px 2px rgba(16,24,40,.03);
}
.field input::placeholder{color:#9aa6b8}
.field input:focus{border-color:#1687f7;box-shadow:0 0 0 3px rgba(22,135,247,.12)}
.password-wrap{position:relative}
.password-wrap input{padding-right:92px}
.show-password{
  position:absolute;
  top:50%;
  right:8px;
  transform:translateY(-50%);
  padding:7px 10px;
  border-radius:8px;
  color:#0755ce;
  background:#edf2ff;
  font-size:11px;
  font-weight:800;
  cursor:pointer;
}
.recaptcha-shell{
  min-height:74px;
  display:flex;
  align-items:center;
  overflow:hidden;
}
.primary-submit{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:48px;
  border-radius:10px;
  color:#fff;
  background:linear-gradient(100deg,#145cf2,#08aeea);
  box-shadow:0 12px 24px rgba(28,100,225,.2);
  font-size:16px;
  font-weight:800;
  cursor:pointer;
}
.primary-submit:disabled{opacity:.72;cursor:wait}
.button-loading{display:inline-flex;align-items:center;gap:8px}
.button-loading[hidden],
.button-label[hidden]{
    display:none !important;
}
.button-loading[hidden],.button-label[hidden]{display:none}
.spinner{width:17px;height:17px;border:2px solid rgba(255,255,255,.38);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}
.divider{
  display:flex;
  align-items:center;
  gap:11px;
  margin:24px 0;
  color:#66768d;
  font-size:12px;
}
.divider:before,.divider:after{height:1px;flex:1;content:"";background:#d0d8e4}
.oauth-buttons{display:grid;gap:10px}
.oauth{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  height:48px;
  border:1px solid #ccd5e2;
  border-radius:10px;
  font-size:15px;
  font-weight:500;
  text-decoration:none;
}
.oauth img{width:23px;height:23px}
.oauth.google{color:#111;background:#fff}
.oauth.apple{color:#fff;background:#000}
.oauth:disabled{opacity:1;cursor:not-allowed}
.card-footer{
  display:flex;
  justify-content:center;
  gap:5px;
  margin-top:26px;
  padding-top:26px;
  border-top:1px solid #d6dde7;
  color:#64738b;
  font-size:13px;
}
.card-footer a{color:#0052eb;font-weight:800}
.form-message{
  margin:-10px 0 17px;
  padding:11px 13px;
  border-radius:9px;
  font-size:13px;
}
.form-message.is-error{border:1px solid #fecdca;color:var(--danger);background:#fff3f2}
.form-message.is-success{border:1px solid #abefc6;color:var(--success);background:#ecfdf3}
.support-pill{
  position:absolute;
  right:10px;
  bottom:17px;
  display:flex;
  align-items:center;
  gap:12px;
  min-width:264px;
  padding:13px 20px;
  border-radius:999px;
  color:#fff;
  background:linear-gradient(100deg,#2154dc,#1767ef);
  box-shadow:0 16px 35px rgba(0,0,0,.25);
}
.support-pill:hover{text-decoration:none}
.bot-face{font-size:33px}
.support-pill span:last-child{display:grid;gap:1px}
.support-pill strong{font-size:14px}
.support-pill small{font-size:12px}
.bottom-benefits{
  grid-column:1/-1;
  grid-row:2;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  align-items:center;
  padding:0 7vw;
  color:#c8d4e4;
  background:linear-gradient(90deg,#031126,#061a34 48%,#04132a);
  border-top:1px solid rgba(255,255,255,.025);
}
.bottom-benefits div{
  min-height:70px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  border-right:1px solid rgba(255,255,255,.08);
}
.bottom-benefits div:last-child{border-right:0}
.bottom-benefits span{font-size:31px;color:#2e78ff}
.bottom-benefits p{margin:0;font-size:16px;line-height:1.45}
@keyframes spin{to{transform:rotate(360deg)}}
@media (max-width:1240px){
  .login-screen{grid-template-columns:minmax(0,58%) minmax(450px,42%)}
  .login-panel{padding-right:24px;padding-left:24px}
  .login-card{min-height:auto}
  .bottom-benefits{padding:0 3vw}
}
@media (max-width:980px){
  .login-screen{display:block;overflow:visible;background:#061329}
  .approved-hero{
    height:min(70vw,620px);
    background-size:cover;
    background-position:left top;
  }
  .login-panel{min-height:auto;padding:50px 20px 110px}
  .panel-tools{top:16px;right:18px}
  .login-card{width:min(100%,520px)}
  .support-pill{right:50%;transform:translateX(50%);bottom:24px}
  .bottom-benefits{display:grid;grid-template-columns:repeat(2,1fr);padding:22px 14px}
  .bottom-benefits div{border-right:0;border-bottom:1px solid rgba(255,255,255,.07)}
  .bottom-benefits div:nth-last-child(-n+2){border-bottom:0}
}
@media (max-width:620px){
  .approved-hero{
    height:340px;
    background-position:51% top;
    background-size:auto 100%;
  }
  .login-panel{padding:72px 12px 115px}
  .login-card{padding:30px 18px 25px;border-radius:23px}
  .login-card h1{font-size:28px}
  .recaptcha-shell{transform:scale(.9);transform-origin:left center;width:111%}
  .card-footer{flex-wrap:wrap}
  .bottom-benefits{grid-template-columns:1fr;padding:15px}
  .bottom-benefits div{justify-content:flex-start;padding:12px 24px;border-bottom:1px solid rgba(255,255,255,.07)}
  .bottom-benefits div:nth-last-child(-n+2){border-bottom:1px solid rgba(255,255,255,.07)}
  .bottom-benefits div:last-child{border-bottom:0}
  .support-pill{min-width:246px}
}
@media (max-width:360px){
  .recaptcha-shell{transform:scale(.82);width:122%}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}