/* ============================================================
   Onboarding funnel re-skin (register.html), P1 chrome.
   Every rule scoped under body.reg-v3 so it can never touch the
   dashboard (which also carries body.v2-app). Class-additive:
   overrides existing chrome classes; no id/name is changed, so
   localStorage resume + validation lookups are untouched.
   Loaded LAST → wins on order for equal specificity.
   ============================================================ */

/* ---- Header band: keep the gradient, calmer proportions ---- */
body.reg-v3 .reg-header { padding: 24px 24px 40px; }
body.reg-v3 .reg-brand-mark {
  border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,.18);
}
body.reg-v3 .reg-subtitle {
  font-family: 'Montserrat', sans-serif; font-size: 10.5px; font-weight: 600;
  letter-spacing: 1.5px; text-transform: uppercase; color: rgba(255,255,255,.55);
}

/* ---- Progress: warm gold-light instead of harsh #ffcc00 ---- */
body.reg-v3 .reg-step-labels .progress-label {
  font-family: 'Montserrat', sans-serif; font-size: 9.5px; font-weight: 600;
  letter-spacing: 1px; text-transform: uppercase; color: rgba(255,255,255,.4);
}
body.reg-v3 .reg-step-labels .progress-label.active,
body.reg-v3 .reg-step-labels .progress-label.completed { color: #d4bfa3; }
body.reg-v3 .reg-progress-fill { background: #d4bfa3 !important; }
body.reg-v3 .reg-progress-track { background: rgba(255,255,255,.14) !important; }

/* ---- Path cards: v2 card language (radius 12, soft shadow, no hard border) ---- */
body.reg-v3 .nf-card {
  border: 1px solid #eef0f5; border-radius: 12px;
  box-shadow: 0 4px 24px rgba(0,0,0,.06); padding: 28px 28px 24px;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
body.reg-v3 .nf-card:hover {
  transform: translateY(-2px); box-shadow: 0 12px 32px rgba(20,32,59,.12);
  border-color: #d5def5;
}
body.reg-v3 .nf-badge { border-radius: 999px; }

/* ---- Buttons: v2 tokens (radius 8, gentle lift) ---- */
body.reg-v3 .btn-next,
body.reg-v3 .btn-submit {
  border-radius: 8px; padding: 13px 26px; font-weight: 600; letter-spacing: .8px;
  box-shadow: 0 1px 2px rgba(20,32,59,.14);
}
body.reg-v3 .btn-next:hover,
body.reg-v3 .btn-submit:hover {
  transform: translateY(-1px); box-shadow: 0 6px 18px rgba(20,32,59,.2);
}
body.reg-v3 .btn-back { border-radius: 8px; padding: 12px 22px; font-weight: 600; letter-spacing: .8px; }

/* ---- Inputs: v2 tokens (radius 8) ---- */
body.reg-v3 .field input,
body.reg-v3 .field select,
body.reg-v3 .field textarea {
  border-radius: 8px; border-color: #d7dbe3; padding: 12px 14px;
}
body.reg-v3 .field input:focus,
body.reg-v3 .field select:focus,
body.reg-v3 .field textarea:focus {
  border-color: #233985; box-shadow: 0 0 0 3px rgba(35,57,133,.12);
}

/* ---- Form step cards: soften into the v2 card language ---- */
body.reg-v3 .form-step { border-radius: 12px; }
body.reg-v3 .field-help { color: #7a7a7a; }

/* ---- Info boxes (precheck etc.) already v2-ish; nudge radius ---- */
body.reg-v3 .nf-precheck { border-radius: 12px; }

/* ---- P2: onboarding-leg reassurance line (only rendered in nf-onboarding) ---- */
body.reg-v3.nf-onboarding .nf-onb-reassure {
  margin: 10px 0 0; font-family: 'Roboto', sans-serif; font-size: 12.5px;
  color: rgba(255,255,255,.72); max-width: 560px; line-height: 1.5;
}

/* ---- Beat 2: onboarding submit-success overlay ---- */
body.reg-v3 .ob-success {
  position: fixed; inset: 0; z-index: 4000; background: #eef0f4;
  display: flex; align-items: flex-start; justify-content: center;
  padding: 48px 16px; overflow-y: auto;
}
body.reg-v3 .ob-card { width: 100%; max-width: 560px; background: #fff; border-radius: 16px; box-shadow: 0 16px 48px rgba(20,32,59,.18); overflow: hidden; }
body.reg-v3 .ob-band { height: 6px; display: flex; }
body.reg-v3 .ob-band i { flex: 1; }
body.reg-v3 .ob-band i:nth-child(1) { background: #000; }
body.reg-v3 .ob-band i:nth-child(2) { background: #dd0000; }
body.reg-v3 .ob-band i:nth-child(3) { background: #ffcc00; }
body.reg-v3 .ob-body { padding: 40px 44px 44px; text-align: center; }
body.reg-v3 .ob-mark { width: 56px; height: 56px; border-radius: 14px; background: #dcfce7; color: #166534; display: flex; align-items: center; justify-content: center; margin: 0 auto 20px; }
body.reg-v3 .ob-body h2 { font-family: 'Marcellus', serif; font-weight: 400; font-size: 26px; color: var(--primary, #233985); margin: 0 0 10px; }
body.reg-v3 .ob-lead { font-size: 14.5px; color: #5a6172; line-height: 1.6; max-width: 460px; margin: 0 auto 22px; }
body.reg-v3 .ob-steps { display: flex; flex-direction: column; text-align: left; max-width: 440px; margin: 0 auto 24px; }
body.reg-v3 .ob-step { display: flex; gap: 14px; padding: 12px 0; }
body.reg-v3 .ob-step .dot { width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0; display: flex; align-items: center; justify-content: center; font-family: 'Roboto Mono', monospace; font-size: 12px; font-weight: 600; background: #eef2fb; color: var(--primary, #233985); }
body.reg-v3 .ob-step .st { font-size: 14px; font-weight: 500; color: #262626; }
body.reg-v3 .ob-step .ss { font-size: 12.5px; color: #7a7a7a; margin-top: 2px; }
body.reg-v3 .ob-cta { display: inline-block; font-family: 'Montserrat', sans-serif; font-size: 11px; font-weight: 600; letter-spacing: .8px; text-transform: uppercase; padding: 13px 26px; border-radius: 8px; background: var(--primary, #233985); color: #fff !important; text-decoration: none; box-shadow: 0 1px 2px rgba(20,32,59,.14); }
body.reg-v3 .ob-cta:hover { background: var(--primary-dark, #14203b); }
