/* ============ Signup page ============ */

.header-inner{justify-content:space-between;}
.signup-back{white-space:nowrap;}

/* Join hero (no photo — dark intro like the rest of the site's top) */
.join-hero{
  min-height:auto;
  height:auto;
  padding:110px 0 40px;
  background:var(--black);
  background-image:radial-gradient(circle at 50% 0%, rgba(201,162,75,.14), transparent 60%);
}
.join-hero-content{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}
.join-hero h1{margin-bottom:14px;}
.join-hero .hero-subtitle{
  max-width:480px;
  font-size:clamp(14px, 1.6vw, 16px);
  margin:0;
}

/* Form section */
.signup-section{padding-top:40px;}
.container-narrow{max-width:560px;margin:0 auto;padding:0 24px;}

.signup-card{
  background:var(--gray-100);
  border-radius:14px;
  padding:44px 36px;
  box-shadow:0 24px 60px rgba(0,0,0,.08);
}

/* Form fields */
.field-group{margin-bottom:26px;}
.field-group label{
  display:block;
  font-size:14px;
  font-weight:600;
  color:var(--gray-900);
  margin-bottom:10px;
}
.toggle-group{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.toggle-option{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:15px 12px;
  border-radius:999px;
  border:1px solid var(--gray-200);
  background:var(--white);
  color:var(--gray-900);
  font-family:inherit;
  font-size:14.5px;
  font-weight:600;
  cursor:pointer;
  transition:border-color .2s ease, background .2s ease, color .2s ease;
}
.toggle-option i{color:var(--gray-400);transition:color .2s ease;}
.toggle-option:hover{border-color:var(--gold);}
.toggle-option.selected{
  background:var(--black);
  border-color:var(--black);
  color:var(--white);
}
.toggle-option.selected i{color:var(--gold);}

.btn-block{width:100%;}

.form-disclaimer{
  text-align:center;
  font-size:12.5px;
  color:var(--gray-600);
  margin:24px 0 0;
  line-height:1.6;
}

.signup-footer{padding-top:0;}

/* ============ Responsive ============ */
@media (max-width:640px){
  .signup-card{padding:32px 22px;}
}