/* LOGIN */
.auth-page{overflow-x:hidden}
.auth-layout{
min-height:100vh;
display:grid;
grid-template-columns:minmax(420px,.95fr) minmax(520px,1.05fr)
}
.auth-brand-panel{
position:relative;
min-height:100vh;
display:flex;
flex-direction:column;
padding:46px 8%;
overflow:hidden;
background:
radial-gradient(circle at 82% 18%,rgba(103,222,213,.18),transparent 28%),
radial-gradient(circle at 10% 80%,rgba(255,255,255,.08),transparent 30%),
linear-gradient(145deg,var(--system-primary-dark),var(--system-primary));
color:var(--system-white)
}
.auth-brand-panel::before{
content:"";
position:absolute;
width:500px;height:500px;
right:-270px;bottom:-250px;
border-radius:50%;
border:85px solid rgba(255,255,255,.035)
}
.auth-brand-panel::after{
content:"";
position:absolute;
width:220px;height:220px;
left:-120px;top:34%;
border-radius:50%;
background:rgba(255,255,255,.03)
}
.auth-logo{position:relative;z-index:2;display:inline-flex;width:max-content;text-decoration:none}
.auth-logo img{width:170px;filter:brightness(0) invert(1)}
.auth-brand-content{position:relative;z-index:2;max-width:610px;margin:auto 0}
.auth-kicker{
display:inline-block;
margin-bottom:18px;
color:#83DDD7;
font-size:12px;
font-weight:700;
text-transform:uppercase;
letter-spacing:1.4px
}
.auth-brand-content h1{
max-width:590px;
margin-bottom:24px;
color:#fff;
font-size:clamp(2.7rem,5vw,4.6rem);
line-height:1.02;
letter-spacing:-2px
}
.auth-brand-content p{max-width:530px;color:#C4DCDD;font-size:16px;line-height:1.8}
.auth-brand-footer{position:relative;z-index:2;display:flex;align-items:center;gap:10px;margin-top:auto}
.auth-brand-footer span{color:#67D7D0;font-size:12px}
.auth-brand-footer p{color:#A9C9CB;font-size:11px}

.auth-form-area{
min-height:100vh;
display:flex;
align-items:center;
justify-content:center;
padding:60px 7%;
background:
radial-gradient(circle at 80% 20%,rgba(67,184,176,.09),transparent 28%),
linear-gradient(180deg,#fff,#F4FAFA)
}
.auth-card{width:100%;max-width:520px}
.auth-card-heading{margin-bottom:34px}
.auth-card-label{
display:inline-block;
margin-bottom:12px;
color:var(--system-primary);
font-size:11px;
font-weight:700;
text-transform:uppercase;
letter-spacing:1.2px
}
.auth-card-heading h2{margin-bottom:10px;font-size:clamp(2rem,4vw,3rem);line-height:1.1}
.auth-card-heading p{max-width:470px;color:var(--system-text-secondary);font-size:14px;line-height:1.7}

.auth-form{display:flex;flex-direction:column;gap:19px}
.form-field{display:flex;flex-direction:column;gap:7px}
.form-field label{font-size:13px;font-weight:650}
.form-field input{
width:100%;
min-height:50px;
padding:12px 14px;
border:1px solid #D5E3E4;
border-radius:11px;
background:rgba(255,255,255,.96);
color:var(--system-text);
outline:none;
transition:border-color var(--system-transition),box-shadow var(--system-transition)
}
.form-field input::placeholder{color:#98A2B3}
.form-field input:focus{
border-color:var(--system-primary-light);
box-shadow:0 0 0 4px rgba(67,184,176,.11)
}
.form-field input[aria-invalid="true"]{border-color:#B54747}
.password-label-row{display:flex;align-items:center;justify-content:space-between;gap:20px}
.forgot-link{color:var(--system-primary);text-decoration:none;font-size:11px;font-weight:600}
.forgot-link:hover{text-decoration:underline}
.password-field{position:relative}
.password-field input{padding-right:65px}
.password-toggle{
position:absolute;
top:50%;right:10px;
transform:translateY(-50%);
min-width:44px;min-height:34px;
cursor:pointer;
border-radius:8px;
background:transparent;
color:var(--system-primary);
font-size:11px;
font-weight:700
}
.password-toggle:hover{background:var(--system-mint)}
.field-error{min-height:16px;color:#B54747;font-size:10px}
.remember-option{width:max-content;display:flex;align-items:center;gap:9px;cursor:pointer;color:var(--system-text-secondary);font-size:12px}
.remember-option input{width:16px;height:16px;accent-color:var(--system-primary)}
.auth-message{padding:11px 13px;border-radius:9px;background:var(--system-mint);color:var(--system-primary-dark);font-size:11px}
.auth-message.erro{background:#FCECEC;color:#8A3434}
.auth-submit{
min-height:51px;
cursor:pointer;
border-radius:11px;
background:linear-gradient(135deg,var(--system-primary),#16858A);
color:#fff;
font-size:13px;
font-weight:700;
box-shadow:0 11px 26px rgba(11,93,104,.18);
transition:transform var(--system-transition),box-shadow var(--system-transition)
}
.auth-submit:hover{transform:translateY(-2px);box-shadow:0 15px 32px rgba(11,93,104,.24)}
.auth-demo-box{
display:flex;
align-items:center;
justify-content:space-between;
gap:20px;
margin-top:28px;
padding:18px;
border:1px solid var(--system-border);
border-radius:14px;
background:rgba(232,246,247,.55)
}
.auth-demo-box>div{max-width:285px}
.auth-demo-label{display:block;margin-bottom:5px;color:var(--system-primary);font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.8px}
.auth-demo-box strong{display:block;margin-bottom:5px;font-size:12px}
.auth-demo-box p{color:var(--system-text-secondary);font-size:10px;line-height:1.55}
.auth-demo-button{
flex-shrink:0;
cursor:pointer;
padding:10px 12px;
border:1px solid var(--system-primary);
border-radius:9px;
background:#fff;
color:var(--system-primary);
font-size:10px;
font-weight:700
}
.auth-demo-button:hover{background:var(--system-primary);color:#fff}
.back-site-link{display:inline-flex;margin-top:28px;color:var(--system-text-secondary);text-decoration:none;font-size:11px;font-weight:600}
.back-site-link:hover{color:var(--system-primary)}

@media(max-width:980px){
.auth-layout{grid-template-columns:1fr}
.auth-brand-panel{min-height:420px;padding:36px 7%}
.auth-brand-content{margin:70px 0}
.auth-form-area{min-height:auto;padding:70px 7%}
}
@media(max-width:620px){
.auth-brand-panel{min-height:360px;padding:28px 6%}
.auth-logo img{width:145px}
.auth-brand-content{margin:55px 0}
.auth-brand-content h1{letter-spacing:-1px}
.auth-form-area{padding:55px 6%}
.auth-demo-box{flex-direction:column;align-items:stretch}
.auth-demo-box>div{max-width:none}
.auth-demo-button{width:100%}
}