:root{--bg-page:#04111f!important;--card-bg:rgba(245,251,255,.98)!important;--accent:#0d8cd7!important;--accent-2:#19c9ff!important;--text-main:#07192a!important;--text-muted:#607487!important}
body{background:linear-gradient(180deg,#04111f,#061a2e 56%,#04111f)!important;padding:0!important;align-items:stretch!important;position:relative;overflow-x:hidden}
body::before,body::after{content:"";position:fixed;top:0;height:100vh;background-size:cover;background-repeat:no-repeat;z-index:-3;filter:saturate(.92) brightness(.72)}
body::before{left:0;width:58%;background-image:url('../img/brand/hero-landmark.png');background-position:center;-webkit-mask-image:linear-gradient(to right,#000 0%,#000 72%,transparent 100%);mask-image:linear-gradient(to right,#000 0%,#000 72%,transparent 100%)}
body::after{right:0;width:58%;background-image:url('../img/brand/hero-office.webp');background-position:center;-webkit-mask-image:linear-gradient(to left,#000 0%,#000 72%,transparent 100%);mask-image:linear-gradient(to left,#000 0%,#000 72%,transparent 100%)}
.shell{max-width:1180px!important;margin:auto!important;align-self:center!important;background:linear-gradient(145deg,rgba(4,28,48,.78),rgba(3,19,34,.86))!important;border:1px solid rgba(65,195,255,.28)!important;box-shadow:0 28px 80px rgba(0,0,0,.42)!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);padding:1.2rem!important;gap:1.1rem!important;position:relative}
.shell::before{content:"";position:fixed;inset:0;z-index:-2;background:linear-gradient(180deg,rgba(3,20,36,.2),rgba(3,21,38,.54) 55%,#06182b 100%),radial-gradient(circle at 50% 0,rgba(28,154,220,.25),transparent 45%)}
.left-card{border-radius:20px!important;padding:1.6rem 1.8rem!important;box-shadow:0 18px 52px rgba(0,0,0,.22),inset 0 0 0 1px rgba(255,255,255,.5)!important}
.right-card{border-radius:20px!important;background:linear-gradient(145deg,rgba(5,35,59,.96),rgba(3,20,35,.98))!important;border:1px solid rgba(68,197,255,.42)!important;box-shadow:0 18px 52px rgba(0,0,0,.27),inset 0 0 26px rgba(23,164,220,.05)!important}
.brand-mark{width:54px!important;height:54px!important;border-radius:14px!important;background:rgba(255,255,255,.96)!important;box-shadow:0 0 24px rgba(23,179,238,.25)!important;padding:3px}.brand-mark img{width:100%;height:100%;object-fit:contain}.brand-title{letter-spacing:.08em!important;font-size:.92rem!important;color:#07192a!important}.brand-sub{color:#688096!important}
h2{font-size:1.52rem!important}h2 span{color:#078fd6!important}.lead{line-height:1.65!important}
input[type="text"],input[type="password"]{border-radius:12px!important;padding:.72rem .82rem!important;border:1px solid rgba(107,139,165,.5)!important;background:#fff!important}input[type="text"]:focus,input[type="password"]:focus{border-color:#17aee8!important;box-shadow:0 0 0 3px rgba(23,174,232,.13)!important}
.btn-primary{border-radius:12px!important;background:linear-gradient(135deg,#0d79d0,#18bdea)!important;color:#fff!important;box-shadow:0 13px 30px rgba(11,126,196,.28)!important}.btn-passkey{border-radius:12px!important;background:#061a2e!important;border-color:rgba(50,184,241,.55)!important;color:#ecfaff!important}.btn-passkey:hover{background:#0a2946!important}.small-text a{color:#078fd6!important;font-weight:600}.error-msg{border-radius:10px!important}
.right-badge{background:linear-gradient(145deg,#0c76ce,#16bfe9)!important}.right-title{font-size:1rem!important}.right-desc{color:#a9bdcd!important}.right-list{color:#e9f8ff!important}.right-timeline{border-top-color:rgba(87,188,234,.32)!important}.footer{color:#90a8ba!important}
@media(max-width:900px){body{padding:1rem!important}.shell{margin:1rem auto!important}.right-card{order:2}.footer{order:3}}@media(max-width:640px){body{padding:.65rem!important}.shell{padding:.7rem!important}.left-card,.right-card{padding:1.25rem!important}.brand-mark{width:46px!important;height:46px!important}body::before{width:100%;opacity:.64}body::after{width:100%;opacity:.28}}
