:root{
  --navy-bg:#0D1A28;--navy:#1E2B3C;--navy-2:#263446;--strip:#2C3A4A;
  --orange:#FF4D00;--orange-hover:#e64500;--dark-grey:#4A5568;--mid-grey:#718096;
  --border:#E2E8F0;--bg-light:#F3F4F6;--white:#FFFFFF;--link:#3B6CB7;
  --ok-bg:#D4EDDA;--ok-tx:#155724;--err-bg:#FDE8E8;--err-tx:#7B1C1C;
  --font:system-ui,-apple-system,'Segoe UI',Helvetica,Arial,sans-serif;
  --r-sm:4px;--r-md:6px;--r-lg:8px;--r-xl:12px;
  --sh-card:0 8px 32px rgba(30,43,60,.15);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:var(--font);color:var(--navy);background:var(--navy-bg);-webkit-font-smoothing:antialiased;display:flex;flex-direction:column;min-height:100%}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}

/* ── TOP STRIP ── */
.topstrip{background:var(--strip);color:rgba(255,255,255,.65);font-size:12px;flex-shrink:0}
.topstrip .in{max-width:1280px;margin:0 auto;padding:0 24px;display:flex;align-items:center;gap:18px;height:34px;flex-wrap:wrap}
.topstrip a{color:rgba(255,255,255,.75);display:inline-flex;align-items:center;gap:5px}
.topstrip a:hover{color:#fff}
.topstrip .sep{margin-left:auto;color:rgba(255,255,255,.55)}
.topstrip .sep strong{color:rgba(255,255,255,.85)}
.tp-ico{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2}

/* ── MAIN SPLIT ── */
.split{flex:1;display:grid;grid-template-columns:1.05fr .95fr;min-height:0}

/* LEFT — ring bg + hero + login box */
.left{position:relative;overflow:hidden;background:var(--navy-bg);color:#fff;display:flex;flex-direction:column;justify-content:center;padding:56px 60px}
.left-bg{position:absolute;inset:0;background:var(--navy-bg);z-index:0}
.left-veil{display:none}
.left-in{position:relative;z-index:2;max-width:560px}
.hero-logo{width:250px;max-width:70vw;margin-bottom:20px}
.hero-tagline{font-size:16px;color:rgba(255,255,255,.82);margin-bottom:22px}
.hero-tagline em{color:var(--orange);font-style:italic;font-weight:700}
.hero-h1{font-size:34px;line-height:1.18;font-weight:700;margin-bottom:16px}
.hero-h1 .accent{color:var(--orange)}
.hero-sub{font-size:15px;color:rgba(255,255,255,.7);max-width:480px;margin-bottom:30px}

/* existing-clients login box (matches attachment) */
.existing-box{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:var(--r-xl);padding:22px;max-width:480px}
.existing-box .eb-label{font-size:12px;text-transform:uppercase;letter-spacing:.09em;color:rgba(255,255,255,.6);margin-bottom:13px;font-weight:700}
.eb-note{font-size:13px;color:rgba(255,255,255,.55);margin-top:14px}
.eb-note a{color:#fff;text-decoration:underline}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-size:15px;font-weight:600;
  padding:14px 26px;border-radius:var(--r-md);cursor:pointer;border:1.5px solid transparent;transition:all .16s;white-space:nowrap;width:100%}
.btn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2.2}
.btn-primary{background:var(--orange);color:#fff;border-color:var(--orange)}
.btn-primary:hover{background:var(--orange-hover);border-color:var(--orange-hover)}

/* RIGHT — form panel */
.right{background:var(--navy);color:#fff;display:flex;flex-direction:column;justify-content:center;padding:56px 60px;position:relative;overflow:hidden}
.right::before{content:'';position:absolute;right:-110px;top:-110px;width:320px;height:320px;border-radius:50%;border:38px solid rgba(255,77,0,.09)}
.right::after{content:'';position:absolute;left:-70px;bottom:-110px;width:260px;height:260px;border-radius:50%;border:30px solid rgba(255,255,255,.04)}
.form-card{position:relative;z-index:2;background:var(--white);color:var(--navy);border-radius:var(--r-xl);box-shadow:var(--sh-card);padding:32px 30px;max-width:460px;width:100%;margin:0 auto}
.form-card h3{font-size:20px;font-weight:700;margin-bottom:4px}
.form-card .fc-sub{font-size:13px;color:var(--mid-grey);margin-bottom:22px}
.field{margin-bottom:15px}
.field label{display:block;font-size:12px;font-weight:600;color:var(--dark-grey);margin-bottom:5px}
.field input{width:100%;height:42px;border:.5px solid var(--border);border-radius:var(--r-sm);background:var(--bg-light);
  padding:0 12px;font-size:14px;color:var(--navy);transition:border-color .15s,box-shadow .15s,background .15s}
.field input::placeholder{color:#a9b2bd}
.field input:focus{outline:none;border-color:var(--orange);background:#fff;box-shadow:0 0 0 3px rgba(255,77,0,.1)}
.field.invalid input{border-color:var(--err-tx);background:#fff}
.field .err{display:none;font-size:11px;color:var(--err-tx);margin-top:4px}
.field.invalid .err{display:block}
.form-note{font-size:11px;color:var(--mid-grey);margin-top:12px;text-align:center;line-height:1.5}
.form-success{display:none;background:var(--ok-bg);color:var(--ok-tx);border-radius:var(--r-md);padding:16px;font-size:14px;text-align:center;font-weight:600;line-height:1.5}
.form-success.show{display:block}

/* ── SLIM FOOTER ── */
.footer{flex-shrink:0;background:var(--navy-bg);color:rgba(255,255,255,.55);font-size:12px;border-top:1px solid rgba(255,255,255,.08)}
.footer .in{max-width:1280px;margin:0 auto;padding:14px 24px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.footer .fword{display:flex;align-items:center;gap:7px}
.footer .fring{width:18px;height:18px;border-radius:50%;border:2px solid var(--orange);position:relative}
.footer .fring::after{content:'';position:absolute;inset:3px;border-radius:50%;border:1.5px solid rgba(255,255,255,.4)}
.footer .fw1{font-size:13px;font-weight:300;letter-spacing:.12em;color:#fff}
.footer .fw2{font-size:12px;font-style:italic;font-weight:700;background:var(--orange);padding:0 7px;border-radius:3px;color:#fff}
.footer a{color:rgba(255,255,255,.7)}
.footer a:hover{color:#fff}
.footer .fsep{margin-left:auto;color:rgba(255,255,255,.4)}
.footer .fdiv{color:rgba(255,255,255,.25)}

/* ── RESPONSIVE ── */
@media(max-width:900px){
  .split{grid-template-columns:1fr}
  .left,.right{padding:48px 32px}
  .left{min-height:auto}
  .hero-h1{font-size:30px}
}
@media(max-width:520px){
  .left,.right{padding:38px 22px}
  .hero-h1{font-size:26px}
  .topstrip .sep{display:none}
  .footer .fsep{margin-left:0}
}