:root { --ink:#213145; --muted:#748294; --brand:#2b6388; --brand2:#173c58; --line:#dbe3ea; }
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body { font-family: "DM Sans", sans-serif; color: var(--ink); background: #f4f6f7; }
.login-shell { min-height: 100vh; display: flex; overflow: hidden; }
.showcase { position: relative; flex: 1 1 58%; min-height: 100vh; overflow: hidden; color: #fff; background: linear-gradient(145deg,#173a54,#2e7398); }
.showcase::before { content:""; position:absolute; inset:0; opacity:.18; background-image:radial-gradient(circle at 1px 1px,#fff 1px,transparent 0); background-size:26px 26px; }
.showcase-glow { position:absolute; width:600px; height:600px; left:-230px; bottom:-290px; border:85px solid rgba(255,255,255,.07); border-radius:50%; }
.showcase-copy { position:relative; z-index:3; width:min(620px,78%); margin:8vh auto 0; }
.showcase-kicker { display:inline-flex; padding:7px 11px; border:1px solid rgba(255,255,255,.28); border-radius:999px; color:#cfe8f5; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.showcase h1 { margin:18px 0 13px; font-family:"Playfair Display",serif; font-size:clamp(36px,5vw,64px); line-height:1.02; }
.showcase p { max-width:560px; margin:0; color:#d4e6ef; font-size:16px; line-height:1.65; }
.marquee { position:absolute; z-index:2; inset:auto 0 4vh; transform:rotate(-4deg) scale(1.08); }
.marquee-row { display:flex; width:max-content; gap:13px; margin:13px 0; animation:slide var(--duration) linear infinite; }
.marquee-row.reverse { animation-name:slide-reverse; }
.marquee-tile { width:135px; height:92px; overflow:hidden; border:1px solid rgba(255,255,255,.28); border-radius:16px; background:#fff; box-shadow:0 12px 28px rgba(0,0,0,.16); }
.marquee-tile img { width:100%; height:100%; object-fit:contain; }
@keyframes slide { to { transform:translateX(-50%); } }
@keyframes slide-reverse { from { transform:translateX(-50%); } to { transform:translateX(0); } }
.auth-panel { position:relative; flex:0 0 42%; min-width:390px; display:grid; place-items:center; padding:42px; background:linear-gradient(160deg,#f8fafb,#e9f1f5); }
.auth-panel::before { content:""; position:absolute; width:330px; height:330px; right:-150px; top:-150px; border:55px solid rgba(43,99,136,.06); border-radius:50%; }
.auth-card { position:relative; z-index:2; width:min(410px,100%); padding:34px; border:1px solid rgba(255,255,255,.85); border-radius:25px; background:rgba(255,255,255,.82); box-shadow:0 30px 80px rgba(27,58,80,.15); backdrop-filter:blur(18px); }
.login-brand { display:flex; align-items:center; gap:11px; margin-bottom:38px; }
.login-brand-mark { width:42px; height:42px; display:grid; place-items:center; border-radius:13px; background:linear-gradient(145deg,var(--brand),var(--brand2)); color:#fff; font-family:"Playfair Display",serif; font-size:25px; font-weight:800; }
img.login-brand-mark { object-fit:contain; background:#fff; }
.login-brand strong,.login-brand small { display:block; }
.login-brand strong { font-size:16px; }
.login-brand small { margin-top:2px; color:var(--muted); font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.auth-heading>span { color:var(--brand); font-size:10px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.auth-heading h2 { margin:8px 0 7px; font-family:"Playfair Display",serif; font-size:29px; }
.auth-heading p { margin:0 0 25px; color:var(--muted); }
form label:not(.remember) { display:block; margin:15px 0 7px; font-size:12px; font-weight:700; }
form input[type=email],form input[type=password] { width:100%; height:47px; padding:0 13px; border:1px solid #cbd7df; border-radius:11px; background:#fff; color:var(--ink); outline:0; }
form input:focus { border-color:var(--brand); box-shadow:0 0 0 3px rgba(43,99,136,.12); }
.remember { display:flex; align-items:center; gap:8px; margin:16px 0; color:var(--muted); font-size:11px; cursor:pointer; }
form button { width:100%; height:48px; border:0; border-radius:11px; color:#fff; background:linear-gradient(135deg,var(--brand),var(--brand2)); font-weight:700; cursor:pointer; box-shadow:0 10px 24px rgba(36,83,115,.24); }
.login-error { margin:0 0 10px; padding:11px 12px; border:1px solid #efc4c7; border-radius:10px; color:#9e2931; background:#fff1f2; font-size:12px; }
.login-success { margin:0 0 10px; padding:11px 12px; border:1px solid #b9dfca; border-radius:10px; color:#17613d; background:#effaf4; font-size:12px; }
.setup-note { margin:20px 0 0; color:var(--muted); font-size:10px; text-align:center; }
.setup-note a { color:var(--brand); }
@media(max-width:860px){.showcase{display:none}.auth-panel{min-width:0;flex:1;padding:22px}.auth-card{padding:28px}.login-shell{background:linear-gradient(145deg,#173a54,#2e7398)}}