*{box-sizing:border-box}
:root{--navy:#13233f;--gold:#d9b75a;--white:#fff}
html,body{height:100%;margin:0}
body{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#0b1323;color:#fff;overflow:auto}
.background-wrap{position:fixed;inset:0;z-index:0;background:#0b1323}
.slideshow,.slide,.bg-video,.overlay{position:absolute;inset:0;width:100%;height:100%}
.slide{opacity:0;background-size:cover;background-position:center;transform:scale(1.03);transition:opacity 1.8s ease,transform 8s ease}
.slide.active{opacity:1;transform:scale(1.08)}
.bg-video{object-fit:cover}
.overlay{background:linear-gradient(90deg,rgba(5,12,25,.7),rgba(5,12,25,.55),rgba(5,12,25,.7))}
.page-shell{position:relative;z-index:2;min-height:100%;padding:28px;display:grid;grid-template-rows:1fr auto}
.welcome-grid{align-self:center;justify-self:center;display:grid;grid-template-columns:minmax(340px,520px) minmax(280px,360px);gap:24px;align-items:stretch;width:min(920px,calc(100vw - 40px))}
.login-card,.registration-card{border:1px solid rgba(255,255,255,.16);background:rgba(12,23,43,.72);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-radius:28px;box-shadow:0 24px 70px rgba(0,0,0,.32)}
.login-card{padding:38px 34px;text-align:center}
.registration-card{padding:32px 28px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}
.logo-area{display:flex;justify-content:center;align-items:center;margin-bottom:14px}
.logo-image{max-width:150px;max-height:110px;width:auto;height:auto;object-fit:contain;display:block}
.brand-mark{width:64px;height:64px;border-radius:16px;background:var(--gold);color:var(--navy);display:grid;place-items:center;font-weight:900;font-size:20px}
.brand-name{font-size:20px;font-weight:800}
.brand-subtitle{font-size:13px;opacity:.72;margin-top:3px}
.content{margin-top:32px}
.eyebrow{text-transform:uppercase;letter-spacing:.14em;color:var(--gold);font-weight:800;font-size:12px}
h1{font-size:clamp(36px,5vw,56px);line-height:1.06;margin:10px 0 16px}
.login-card p{font-size:18px;line-height:1.6;color:rgba(255,255,255,.82);margin:0 auto 28px;max-width:430px}
.login-button,.register-button{display:inline-flex;align-items:center;justify-content:center;padding:14px 22px;border-radius:12px;background:var(--gold);color:var(--navy);text-decoration:none;font-weight:900;transition:transform .18s ease,box-shadow .18s ease}
.login-button{min-width:240px}
.login-button:hover,.register-button:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(217,183,90,.28)}
.hint{margin-top:16px;font-size:12px;color:rgba(255,255,255,.58)}
.registration-icon{font-size:32px}
.registration-card h2{margin:10px 0 8px;font-size:26px}
.registration-card p{margin:0 0 18px;color:rgba(255,255,255,.75);line-height:1.5}
.registration-qr{width:190px;height:190px;background:#fff;border-radius:16px;padding:10px;display:block}
.qr-link{display:block}
.scan-label{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--gold);font-weight:800;margin:10px 0 16px}
.register-button{width:100%}
footer{justify-self:center;padding-top:20px;font-size:12px;color:rgba(255,255,255,.58)}
@media(max-width:850px){
 .welcome-grid{grid-template-columns:1fr;max-width:540px}
 .registration-card{padding:28px}
}
@media(max-width:700px){
 .page-shell{padding:18px}
 .login-card{padding:28px 22px}
 .logo-image{max-width:125px;max-height:90px}
 h1{font-size:38px}
 .registration-qr{width:175px;height:175px}
}