/* Branded client login (slug: login) — split-screen, self-contained (no global chrome). */
*{ margin:0; padding:0; box-sizing:border-box; }
.op-login-body{ font-family:'Manrope',system-ui,sans-serif; background:#06211f; color:#F4F2EC; -webkit-font-smoothing:antialiased; cursor:auto; }

.op-login2{ display:grid; grid-template-columns:1.04fr 0.96fr; min-height:100vh; min-height:100svh; }

/* ---------- LEFT: brand showcase ---------- */
.ol-aside{ position:relative; display:flex; flex-direction:column; padding:46px 54px; background-size:cover; background-position:center; overflow:hidden; }
.ol-brand{ display:inline-flex; align-items:center; gap:12px; text-decoration:none; color:#F4F2EC; margin-bottom:auto; }
.ol-brand .ic{ width:34px; height:34px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18); border-radius:10px; padding:6px; }
.ol-brand .nm{ font-weight:700; letter-spacing:0.24em; font-size:16px; }

.ol-aside-in{ max-width:480px; }
.ol-head{ font-family:'Fraunces',Georgia,serif; font-weight:400; font-size:clamp(34px,3.6vw,52px); line-height:1.08; letter-spacing:-0.015em; }
.ol-head .ol-i{ font-style:italic; color:#f2c57c; }
.ol-sub{ font-size:16px; line-height:1.6; color:#cfe0db; margin-top:18px; max-width:420px; }
.ol-checks{ list-style:none; margin-top:26px; display:flex; flex-direction:column; gap:13px; }
.ol-checks li{ display:flex; align-items:center; gap:12px; font-size:14.5px; color:#e7efec; }
.ol-checks .ck{ flex:0 0 auto; width:22px; height:22px; border-radius:50%; background:rgba(226,163,60,.18); border:1px solid rgba(226,163,60,.55); color:#f2c57c; display:flex; align-items:center; justify-content:center; font-size:12px; }
.ol-kicker{ margin-top:34px; font-family:'Space Mono',monospace; font-size:11px; letter-spacing:0.24em; text-transform:uppercase; color:#E2A33C; }

/* ---------- RIGHT: form ---------- */
.ol-form-wrap{ display:flex; align-items:center; justify-content:center; padding:48px 40px; background:radial-gradient(95% 75% at 88% 4%,rgba(16,86,80,.5),transparent 58%),linear-gradient(165deg,#0a322e,#06211f); }
.ol-form-card{ width:100%; max-width:392px; animation:ol-rise .55s cubic-bezier(.2,.7,.2,1); }
@keyframes ol-rise{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }

.ol-form-card h1{ font-family:'Fraunces',Georgia,serif; font-weight:400; font-size:38px; letter-spacing:-0.01em; }
.ol-welcome{ font-size:15px; color:#9fb6b0; line-height:1.55; margin:8px 0 30px; }

.op-login-msg{ font-size:13.5px; padding:12px 14px; border-radius:10px; margin-bottom:20px; }
.op-login-msg.bad{ background:rgba(216,90,48,0.16); border:1px solid rgba(216,90,48,0.4); color:#f0a88c; }
.op-login-msg.ok{ background:rgba(29,158,117,0.16); border:1px solid rgba(29,158,117,0.4); color:#8fe0c1; }

.lf{ margin-bottom:18px; }
.lf label{ display:block; font-family:'Space Mono',monospace; font-size:10px; letter-spacing:0.12em; text-transform:uppercase; color:#7fa49c; margin-bottom:9px; }
.lf input{ width:100%; background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.14); border-radius:11px; padding:14px 15px; font-family:'Manrope',sans-serif; font-size:15px; color:#F4F2EC; outline:none; transition:border-color .2s, background .2s, box-shadow .2s; }
.lf input::placeholder{ color:#5f7a73; }
.lf input:focus{ border-color:#E2A33C; background:rgba(255,255,255,0.06); box-shadow:0 0 0 3px rgba(226,163,60,.16); }

.lf-pass{ position:relative; }
.lf-pass input{ padding-right:48px; }
.lf-eye{ position:absolute; top:50%; right:8px; transform:translateY(-50%); width:34px; height:34px; display:flex; align-items:center; justify-content:center; background:transparent; border:none; border-radius:8px; color:#7fa49c; cursor:pointer; transition:color .2s, background .2s; }
.lf-eye:hover{ color:#F4F2EC; background:rgba(255,255,255,.05); }
.lf-eye.on{ color:#E2A33C; }

.lf-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin:4px 0 24px; font-size:13px; }
.lf-rem{ display:flex; align-items:center; gap:8px; color:#9fb6b0; cursor:pointer; }
.lf-rem input{ width:auto; accent-color:#E2A33C; }
.lf-row > a{ color:#E2A33C; text-decoration:none; }
.lf-row > a:hover{ text-decoration:underline; }

.op-login-btn{ width:100%; background:linear-gradient(95deg,#f2c57c,#E2A33C); color:#2a1c12; border:none; border-radius:12px; padding:16px; font-family:'Manrope',sans-serif; font-weight:700; font-size:15px; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:9px; transition:transform .2s, box-shadow .2s; box-shadow:0 16px 36px -12px rgba(226,163,60,0.55); }
.op-login-btn span{ transition:transform .2s; }
.op-login-btn:hover{ transform:translateY(-2px); box-shadow:0 22px 44px -14px rgba(226,163,60,0.6); }
.op-login-btn:hover span{ transform:translateX(4px); }

.ol-foot{ margin-top:28px; padding-top:24px; border-top:1px solid rgba(255,255,255,0.08); }
.ol-foot-cta{ font-size:14px; color:#9fb6b0; }
.ol-foot-cta a{ color:#E2A33C; text-decoration:none; font-weight:700; }
.ol-foot-cta a:hover{ text-decoration:underline; }
.ol-back{ display:inline-block; margin-top:16px; font-family:'Space Mono',monospace; font-size:11px; letter-spacing:0.05em; color:#6f8d86; text-decoration:none; }
.ol-back:hover{ color:#E2A33C; }

/* ---------- responsive ---------- */
@media(max-width:880px){
	.op-login2{ grid-template-columns:1fr; }
	.ol-aside{ min-height:230px; padding:30px 30px 34px; }
	.ol-aside-in{ max-width:none; }
	.ol-head{ font-size:30px; }
	.ol-sub, .ol-checks{ display:none; }
	.ol-kicker{ margin-top:18px; }
	.ol-form-wrap{ padding:40px 26px 56px; }
}
@media(max-width:420px){
	.ol-form-card h1{ font-size:32px; }
	.ol-aside{ min-height:190px; }
}