/* ── STEPS BAR ── */
.steps-bar {
  position:relative; z-index:10;
  display:flex; align-items:center; justify-content:center;
  padding:0 52px 40px;
  gap:0;
}
.step { display:flex; flex-direction:column; align-items:center; gap:7px; }
.step-num {
  width:38px; height:38px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:13px; font-weight:700; letter-spacing:1px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.35);
  transition:all .4s;
}
.step.active .step-num, .step.done .step-num {
  background:linear-gradient(135deg,var(--c1),var(--c2));
  border-color:transparent; color:white;
  box-shadow:0 0 16px rgba(75,214,255,.35);
}
.step-label { font-family:'Rajdhani',sans-serif; font-size:10px; letter-spacing:3px; text-transform:uppercase; color:rgba(255,255,255,.3); transition:color .4s; }
.step.active .step-label, .step.done .step-label { color:var(--c1); }
.step-line { flex:1; height:1px; background:rgba(255,255,255,.1); max-width:80px; margin:0 8px; margin-bottom:20px; transition:background .4s; }
.step-line.done { background:linear-gradient(90deg,var(--c1),var(--c2)); }

/* ── FORM CONTAINER ── */
.form-container { position:relative; z-index:10; max-width:780px; margin:0 auto; padding:0 20px 80px; }
.form-step { display:none; animation:fadeIn .5s ease both; }
.form-step.active { display:block; }

/* ── STEP 1: Discord ── */
.discord-box {
  display:grid; grid-template-columns:1fr auto; gap:32px; align-items:center;
  background:rgba(75,214,255,.04);
  border:1px solid rgba(75,214,255,.12);
  border-radius:12px; padding:28px;
}
.discord-title { font-size:13px; font-weight:600; letter-spacing:2px; margin-bottom:14px; color:rgba(255,255,255,.7); }
.discord-list { list-style:none; display:flex; flex-direction:column; gap:8px; }
.discord-list li { font-family:'Rajdhani',sans-serif; font-size:14px; color:rgba(255,255,255,.5); letter-spacing:1px; }

.connected-box {
  display:flex; align-items:center; gap:20px;
  background:rgba(0,255,136,.05);
  border:1px solid rgba(0,255,136,.2);
  border-radius:12px; padding:24px;
}
.connected-avatar {
  width:56px; height:56px; border-radius:50%;
  background:linear-gradient(135deg,var(--c1),var(--c2));
  display:flex; align-items:center; justify-content:center;
  font-size:22px; font-weight:700; flex-shrink:0;
  overflow:hidden;
}
.connected-avatar img { width:100%; height:100%; object-fit:cover; }
.connected-name { font-size:16px; font-weight:700; letter-spacing:2px; margin-bottom:3px; }
.connected-tag { font-family:'Rajdhani',sans-serif; font-size:13px; color:rgba(255,255,255,.4); letter-spacing:1px; }
.connected-badge { display:inline-block; margin-top:6px; padding:3px 12px; border-radius:20px; background:rgba(0,255,136,.15); border:1px solid rgba(0,255,136,.3); font-size:10px; letter-spacing:2px; color:#00ff88; }

/* ── RECAP ── */
.recap-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:24px; }
.recap-item { background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.07); border-radius:10px; padding:16px 20px; }
.recap-label { font-size:9px; letter-spacing:3px; text-transform:uppercase; color:rgba(255,255,255,.3); margin-bottom:6px; }
.recap-value { font-family:'Rajdhani',sans-serif; font-size:14px; color:rgba(255,255,255,.8); letter-spacing:1px; }
.recap-item.full { grid-column:1/-1; }

.terms-box {
  background:rgba(255,208,0,.04); border:1px solid rgba(255,208,0,.15);
  border-radius:10px; padding:20px; margin-bottom:8px;
}

/* ── SUCCESS ── */
.success-card { text-align:center; padding:60px 50px; }
.success-icon { font-size:64px; margin-bottom:20px; animation:bounce .6s ease; }
@keyframes bounce { 0%{transform:scale(0)} 70%{transform:scale(1.15)} 100%{transform:scale(1)} }
.success-title { font-size:32px; font-weight:900; letter-spacing:3px; margin-bottom:14px; }
.success-desc { font-family:'Rajdhani',sans-serif; font-size:15px; color:rgba(255,255,255,.5); letter-spacing:1px; line-height:1.7; margin-bottom:18px; }
.success-ref { font-family:'Rajdhani',sans-serif; font-size:13px; color:rgba(255,255,255,.4); letter-spacing:2px; }

@keyframes fadeIn { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:translateY(0)} }
