/* Libro — wizard de registro (7 pasos): fondo de marca, stepper, medidor de clave,
   OTP y selector de plan. Página standalone (no usa el layout del panel). */
:root { --brand-3: #2547C9; --brand-accent: #4B6BFF; }

/* Mismo degradado de los correos (hero de marca). */
body {
  background: linear-gradient(135deg, #05070F 0%, #0E1E4A 46%, #2547C9 100%);
  background-attachment: fixed;
  min-height: 100vh;
}
.reg-card { max-width: 600px; width: 100%; border: 0; overflow: hidden; }
.reg-brandbar { height: 6px; background: linear-gradient(90deg, #05070F 0%, #1E3A8A 55%, #4B6BFF 100%); }

/* Stepper */
.reg-steps { display: flex; justify-content: space-between; }
.reg-step { flex: 1; text-align: center; position: relative; }
.reg-step:not(:first-child)::before {
  content: ''; position: absolute; top: 17px; left: -50%; width: 100%; height: 2px;
  background: #E4E6EF; z-index: 0;
}
.reg-step.done::before, .reg-step.active::before { background: var(--brand-3); }
.reg-step .dot {
  position: relative; z-index: 1; width: 36px; height: 36px; border-radius: 50%; margin: 0 auto 6px;
  display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px;
  background: #E4E6EF; color: #7E8299; transition: .2s;
}
.reg-step.active .dot { background: var(--brand-3); color: #fff; box-shadow: 0 0 0 4px rgba(37,71,201,.15); }
.reg-step.done  .dot { background: var(--brand-3); color: #fff; }
.reg-step .lbl { font-size: 11px; font-weight: 600; color: #A1A5B7; }
.reg-step.active .lbl { color: var(--brand-3); }
.reg-step.done  .lbl { color: #3F4254; }

/* Botones / enlaces de marca */
.btn-brand { background: var(--brand-3); border-color: var(--brand-3); color: #fff; }
.btn-brand:hover, .btn-brand:focus { background: #1E3AAE; border-color: #1E3AAE; color: #fff; }
.text-brand, a.text-brand { color: var(--brand-3) !important; }

/* Medidor de fuerza de contraseña */
.pwd-meter { display: flex; gap: 6px; margin-top: 8px; }
.pwd-meter span { flex: 1; height: 5px; border-radius: 3px; background: #E4E6EF; transition: .2s; }
.pwd-label { font-size: 12px; font-weight: 600; min-height: 16px; }

/* Código OTP */
.otp-input { letter-spacing: 10px; font-weight: 700; }

/* Selector de plan (paso 7) */
.reg-plan { transition: .15s; }
.reg-plan:hover { border-color: #C4CDE0; }
.reg-plan-radio { width: 18px; height: 18px; border-radius: 50%; border: 2px solid #C4CDE0; display: inline-block; flex: 0 0 auto; }
.reg-plan-sel { border-color: var(--brand-3) !important; box-shadow: 0 0 0 3px rgba(37,71,201,.12); background: #F4F6FE; }
.reg-plan-sel .reg-plan-radio { border-color: var(--brand-3); background: radial-gradient(circle, var(--brand-3) 0 6px, #fff 6px 9px); }