body{min-height:100svh;display:grid;place-items:center;padding:40px;position:relative;isolation:isolate;background:var(--navy)}
.login-shell{width:min(1120px,100%);display:grid;grid-template-columns:1.04fr 1fr;min-height:700px;border:1px solid #ffffff24;border-radius:8px;overflow:hidden;box-shadow:0 24px 70px #0a1f3b14}
.login-story{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;padding:42px 48px 30px;color:#fff;background:var(--navy)}
.login-story:after{content:'';position:absolute;z-index:-1;width:620px;height:620px;right:-370px;bottom:-360px;border:1px solid #6cdbce25;border-radius:50%;box-shadow:0 0 0 50px #9bbcff0d,0 0 0 110px #9bbcff08}
.login-brand{display:grid;place-items:center;width:86px;height:76px;border-radius:8px;background:#fff;box-shadow:0 8px 30px #06122226}
.login-brand img{width:60px;height:54px;object-fit:contain}
.login-story-copy{margin:auto 0;padding:40px 0 36px}
.login-eyebrow{display:flex;align-items:center;gap:9px;font-size:10px;line-height:1.6;font-weight:700;letter-spacing:1.7px;color:#97e6d8}
.login-eyebrow i{width:6px;height:6px;border-radius:50%;background:#28a79f;box-shadow:0 0 0 4px #28a79f20}
.login-story h2{font-size:52px;line-height:1.09;letter-spacing:-2.3px;margin:20px 0}
.login-story h2 em{color:var(--mint);white-space:normal}
.login-story-copy>p{font-size:15px;line-height:1.8;color:#b8ccd9;max-width:350px}
.login-card{position:relative;margin-top:36px;width:260px;transform:rotate(-5deg);border-radius:12px;overflow:hidden;box-shadow:0 18px 30px #020b193d;border:1px solid #84cbd424}
.login-card>img{width:100%;height:auto}
.login-card>span{position:absolute;left:8%;bottom:14%;font-size:6px;letter-spacing:1.2px;color:#cee3f1}
.login-card strong{display:block;font-size:9px;letter-spacing:.1px;margin-top:6px;font-weight:500;color:#fff}
.login-signature{display:flex;align-items:center;gap:10px;font-size:10px;line-height:1.6;color:#a8c3d0}
.login-signature>span{font-size:23px;font-weight:300;color:#6ad9c6}
.login-access{display:flex;flex-direction:column;background:#fff;padding:38px 52px 30px}
.login-back{align-self:flex-end;display:flex;align-items:center;gap:10px;font-size:12px;line-height:24px;color:#6e7e8b}
.login-back:hover,.login-bottom a:hover{color:var(--teal)}
.login-form-area{margin:auto 0;padding:50px 0 55px}
.login-access .login-eyebrow{color:#1d5d7b;font-size:9px;letter-spacing:1.8px}
.login-access h1{font-size:42px;line-height:1.14;letter-spacing:-1.6px;margin:16px 0;color:var(--navy)}
.login-intro{font-size:14px;line-height:1.7;color:#71808c}
.login-fields{margin-top:34px}
.login-fields label{display:block;font-size:12px;font-weight:600;margin:20px 0 9px;color:#334d63}
.login-input{position:relative}
.login-input svg{position:absolute;left:16px;top:17px;width:20px;height:20px;color:#8da8b3}
.login-input input{display:block;width:100%;height:54px;padding:0 16px 0 48px;border:1px solid #dce6ea;border-radius:8px;background:#f9fbfc;font:14px Arial,Helvetica,sans-serif;color:#617783;opacity:1;-webkit-text-fill-color:#617783}
.login-input input::placeholder{color:#8b9ca5;opacity:1;-webkit-text-fill-color:#8b9ca5}
.login-submit{display:flex;align-items:center;justify-content:space-between;gap:15px;width:100%;min-height:54px;padding:15px 20px;border-radius:8px;background:var(--mint);color:var(--navy);font-size:13px;font-weight:700;margin-top:26px;cursor:default;opacity:1}
.login-submit span{font-size:23px;font-weight:400}
.login-availability{display:flex;align-items:center;justify-content:center;gap:7px;color:#6c7e88;font-size:10px;line-height:1.7;margin-top:16px}
.login-availability>span{width:5px;height:5px;border-radius:50%;background:#339c92;flex-shrink:0}
.login-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-top:22px;border-top:1px solid #e9eef0;font-size:10px;color:#80919c}
.login-bottom>span{font-size:8px;letter-spacing:1.3px}.login-bottom a{color:#345c70;display:flex;align-items:center;gap:8px;min-height:24px}
@media(max-width:1050px){body{padding:28px}.login-story{padding:34px}.login-access{padding:34px}.login-story h2{font-size:43px}.login-access h1{font-size:38px}}
@media(max-width:760px){body{padding:20px}.login-shell{grid-template-columns:1fr;min-height:0;border-radius:8px;max-width:520px}.login-story{padding:26px 28px}.login-brand{width:66px;height:60px;border-radius:8px}.login-brand img{width:46px;height:42px}.login-story-copy{padding:26px 0 8px}.login-story h2{font-size:38px;letter-spacing:-1.6px;margin:13px 0}.login-story-copy>p{font-size:13px;line-height:1.7}.login-story-copy .login-eyebrow{font-size:8px}.login-card,.login-signature{display:none}.login-access{padding:24px 28px}.login-form-area{padding:28px 0 32px}.login-access h1{font-size:34px}.login-intro{font-size:13px}.login-fields{margin-top:26px}.login-back{font-size:11px}.login-bottom{gap:10px}}
@media(max-width:360px){body{padding:12px}.login-story,.login-access{padding-left:22px;padding-right:22px}.login-availability{font-size:9px}.login-story h2{font-size:34px}}

body:before,.login-story:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(6,22,47,.88),rgba(6,22,47,.25)),url('fundo-azul.png') center/cover;opacity:.8;pointer-events:none}
body:before{position:fixed}

/* Decorative circles retain their shape independently of component corners. */
body:after{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 100% 0%,transparent 0 240px,#9bbcff0d 241px 310px,transparent 311px 364px,#9bbcff09 365px 420px,transparent 421px),radial-gradient(circle at 0% 100%,transparent 0 170px,#9bbcff0a 171px 225px,transparent 226px 275px,#9bbcff08 276px 330px,transparent 331px)}
@media(max-width:760px){body:after{opacity:.65}}
.login-input input:focus{outline:2px solid var(--teal);outline-offset:2px;border-color:var(--teal);background:#fff}
.login-submit{cursor:pointer}
.login-submit:hover{background:#75e6da}
