:root{--ink:#0A0C17;--panel:#0F1526;--field:#0A0D1A;--line:#262E47;--gold:#D4AF37;--gold2:#E6C65C;--text:#F2F2F2;--mute:#A9AFC0;--red:#E5484D;--green:#3FB950}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--ink);color:var(--text);font:16px/1.55 Inter,system-ui,sans-serif}
.split{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);min-height:100vh}

.hero{display:flex;flex-direction:column;justify-content:space-between;padding:56px 64px;
  background:radial-gradient(ellipse at 20% 0%,rgba(212,175,55,.10),transparent 55%),
  repeating-linear-gradient(135deg,rgba(255,255,255,.025) 0 1px,transparent 1px 28px),var(--ink)}
.logo{display:inline-flex;align-items:center;gap:14px;color:var(--gold);text-decoration:none;font:700 24px "Playfair Display",Georgia,serif}
.logo svg{width:40px;height:40px}
.pitch{max-width:620px;padding:48px 0}
.eyebrow{margin:0 0 18px;font-size:13px;letter-spacing:.28em;text-transform:uppercase;color:var(--mute)}
.hero h1{margin:0 0 26px;font:700 clamp(34px,4.2vw,54px)/1.12 "Playfair Display",Georgia,serif}
.hero h1 em{font-style:normal;color:var(--gold)}
.lead{margin:0 0 40px;font-size:18px;color:var(--mute)}
.features{list-style:none;margin:0;padding:0;display:grid;gap:26px}
.features li{display:flex;gap:16px;align-items:flex-start}
.features svg{flex:none;width:26px;height:26px;margin-top:2px;color:var(--gold)}
.features strong{display:block;font-weight:600}
.features span{color:var(--mute);font-size:15px}
.copy{margin:0;color:var(--mute);font-size:13px}

.panel{display:flex;align-items:center;justify-content:center;padding:56px 40px;background:var(--panel)}
.form-box{width:100%;max-width:460px}
.form-box h2{margin:0 0 6px;font:700 34px "Playfair Display",Georgia,serif;color:var(--gold)}
.sub{margin:0 0 20px;color:var(--mute)}
.flash{margin:0 0 8px;padding:12px 16px;border-radius:6px;border:1px solid var(--line);font-size:15px}
.flash.error{border-color:var(--red);color:#FF8A8E;background:rgba(229,72,77,.08)}
.flash.warn{border-color:var(--gold);color:var(--gold2);background:rgba(212,175,55,.08)}
.flash.ok{border-color:var(--green);color:#7EE08B;background:rgba(63,185,80,.08)}

.field{display:block;margin-top:24px;font-size:14px;font-weight:500}
.field input{display:block;width:100%;margin-top:10px;padding:15px 16px;background:var(--field);border:1px solid var(--line);border-radius:6px;color:var(--text);font:16px Inter,system-ui,sans-serif}
.field input::placeholder{color:#5F6680}
.field input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}
.pw{position:relative;display:block}
.pw input{padding-right:76px}
.pw button{position:absolute;right:8px;bottom:8px;padding:8px 10px;background:none;border:0;border-radius:4px;color:var(--gold);font:600 14px Inter,system-ui,sans-serif;cursor:pointer}
.pw button:hover{color:var(--gold2)}
.pw button:focus-visible,.submit:focus-visible,.remember input:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}

.remember{display:flex;align-items:center;gap:10px;margin-top:22px;color:var(--mute);font-size:15px;cursor:pointer}
.remember input{width:18px;height:18px;margin:0;accent-color:var(--gold)}
.submit{display:block;width:100%;margin-top:28px;padding:16px;background:var(--gold);border:0;border-radius:6px;color:#0A0C17;font:700 17px Inter,system-ui,sans-serif;cursor:pointer}
.submit:hover{background:var(--gold2)}

.divider{display:flex;align-items:center;gap:14px;margin:34px 0 20px;color:#6C748E;font-size:12px;letter-spacing:.24em;text-transform:uppercase}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:var(--line)}
.secure{display:flex;align-items:center;gap:12px;margin:0;color:var(--mute);font-size:15px}
.secure svg{flex:none;width:18px;height:18px;color:var(--gold)}

@media(max-width:960px){
  .split{grid-template-columns:1fr}
  .hero{padding:28px 24px}
  .pitch{padding:28px 0 8px}
  .lead{margin-bottom:0}
  .features,.copy{display:none}
  .panel{padding:36px 24px 56px;align-items:flex-start}
}
