/* A1 BRAIN — Auth / Onboarding · Design System v1 */
:root{
  --bg:#07080C;--bg-2:#0B0D14;--surface:#10131C;--surface-2:#161A26;
  --border:rgba(255,255,255,.09);--border-strong:rgba(255,255,255,.16);
  --text:#F4F6FB;--text-dim:#AEB4C2;--text-mute:#6E7688;
  --brand:#7C5CFF;--brand-2:#4F46E5;--accent:#34E1D4;--brand-soft:rgba(124,92,255,.14);
  --grad:linear-gradient(120deg,#7C5CFF,#4F46E5 45%,#34E1D4 110%);
  --grad-text:linear-gradient(100deg,#C6BCFF,#8B7BFF 40%,#46E5D6);
  --ok:#34D399;--font:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --r:14px;--ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--font);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}

.split{display:grid;grid-template-columns:1.05fr 1fr;min-height:100vh}
/* Panel izquierdo (marca) */
.brandside{position:relative;padding:48px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;
  background:radial-gradient(circle at 20% 15%,rgba(124,92,255,.22),transparent 45%),radial-gradient(circle at 80% 80%,rgba(52,225,212,.12),transparent 45%),var(--bg-2);border-right:1px solid var(--border)}
.brandside::after{content:"";position:absolute;width:520px;height:520px;border-radius:50%;right:-160px;top:-120px;background:var(--grad);filter:blur(120px);opacity:.35}
.brand{display:flex;align-items:center;gap:11px;font-weight:700;font-size:19px;position:relative;z-index:1}
.brand .logo{width:32px;height:32px;border-radius:9px;background:var(--grad);position:relative;box-shadow:0 0 24px rgba(124,92,255,.6)}
.brand .logo::after{content:"";position:absolute;inset:6px;border-radius:5px;background:var(--bg-2);opacity:.3}
.bs-mid{position:relative;z-index:1;max-width:440px}
.bs-mid h2{font-size:34px;letter-spacing:-.02em;line-height:1.12;margin-bottom:18px}
.bs-mid p{color:var(--text-dim);font-size:16px}
.bs-feats{list-style:none;margin-top:28px;display:flex;flex-direction:column;gap:14px}
.bs-feats li{display:flex;gap:12px;align-items:center;font-size:15px;color:var(--text-dim)}
.bs-feats .ck{width:24px;height:24px;border-radius:7px;background:var(--brand-soft);border:1px solid var(--border-strong);display:grid;place-items:center;color:var(--accent);font-weight:700;font-size:13px}
.bs-quote{position:relative;z-index:1;border-top:1px solid var(--border);padding-top:22px;color:var(--text-dim);font-size:14px}

/* Panel derecho (form) */
.formside{display:flex;align-items:center;justify-content:center;padding:40px}
.card{width:100%;max-width:440px}
.steps{display:flex;gap:8px;margin-bottom:26px}
.steps .s{flex:1;height:5px;border-radius:99px;background:var(--surface-2)}
.steps .s.on{background:var(--grad)}
.eyebrow{font-size:13px;color:var(--text-mute);font-weight:600;letter-spacing:.02em}
h1.title{font-size:27px;letter-spacing:-.02em;margin:6px 0 4px}
.sub{color:var(--text-dim);font-size:14.5px;margin-bottom:24px}
.field{margin-bottom:15px}
.field label{display:block;font-size:13px;color:var(--text-dim);margin-bottom:7px;font-weight:500}
.field input,.field select{width:100%;padding:12px 14px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text);font-family:inherit;font-size:14.5px;outline:none;transition:.15s}
.field input:focus,.field select:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%236E7688'%3E%3Cpath d='M6 8L1 3h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.btn{width:100%;padding:13px;border:none;border-radius:12px;background:var(--grad);color:#fff;font-weight:600;font-size:15px;cursor:pointer;box-shadow:0 8px 26px -8px rgba(124,92,255,.6);transition:.2s var(--ease);margin-top:8px}
.btn:hover{transform:translateY(-2px)}
.btn.ghost{background:var(--surface);border:1px solid var(--border-strong);color:var(--text);box-shadow:none}
.row-btns{display:flex;gap:10px}.row-btns .btn{margin-top:0}
.alt{text-align:center;font-size:14px;color:var(--text-mute);margin-top:20px}
.alt a{color:var(--brand);font-weight:600}
.divider{display:flex;align-items:center;gap:12px;color:var(--text-mute);font-size:13px;margin:18px 0}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:var(--border)}
.oauth{display:flex;gap:10px}
.oauth .btn.ghost{margin-top:0}

/* Planes */
.plans{display:flex;flex-direction:column;gap:11px;margin-bottom:8px}
.plan{border:1px solid var(--border);border-radius:14px;padding:15px 16px;cursor:pointer;display:flex;align-items:center;gap:14px;transition:.15s}
.plan:hover{border-color:var(--border-strong)}
.plan.sel{border-color:transparent;background:linear-gradient(180deg,rgba(124,92,255,.12),var(--bg-2));box-shadow:0 0 0 1px var(--brand)}
.plan .radio{width:20px;height:20px;border-radius:50%;border:2px solid var(--border-strong);flex-shrink:0;display:grid;place-items:center}
.plan.sel .radio{border-color:var(--brand)}
.plan.sel .radio::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--grad)}
.plan .info{flex:1}.plan .info b{font-size:15px}.plan .info span{display:block;font-size:12.5px;color:var(--text-mute)}
.plan .price{font-weight:700;font-size:16px}

/* Success */
.done{text-align:center}
.done .check{width:72px;height:72px;border-radius:50%;background:var(--brand-soft);border:1px solid var(--border-strong);display:grid;place-items:center;font-size:34px;color:var(--accent);margin:0 auto 22px;box-shadow:0 0 40px rgba(52,225,212,.3)}

@media(max-width:900px){.split{grid-template-columns:1fr}.brandside{display:none}}