/* =========================================================
   회원가입 페이지 전용 (fam4report)

   ★자사몰 `signup.css` 에서 **가입할 원(店) 다중 선택 목록**(`.signup-store-*`)을
     가져오지 않았다 — 이 사이트에 원 개념이 없다(계획 §D-2 · §E-1).
   ========================================================= */

/* 가입 카드는 폼 영역이 약간 더 넓다(입력칸이 5개라 세로가 길다). */
.signup-card.auth-card { grid-template-columns: 1fr 1.05fr; max-width: 920px; }

/* 좌측 히어로의 단계 목록 — `<ol>` 이라 순서가 마크업에도 들어 있다. */
.auth-hero-steps { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.85rem; }
.auth-hero-steps li { display: flex; align-items: flex-start; gap: 0.7rem; font-size: 0.9rem; line-height: 1.5; opacity: 0.95; }
.auth-hero-steps .num { width: 26px; height: 26px; border-radius: 50%; background: var(--accent); color: #4A2A00; display: flex; align-items: center; justify-content: center; font-size: 0.78rem; font-weight: 800; flex-shrink: 0; }

/* 폼 묶음 간격 — ★묶음 **사이**는 라벨↔입력 간격(--label-gap 10.5px)보다 넓어야
   「라벨과 입력이 한 덩어리」로 읽힌다(근접성). 1rem = 17.5px. */
.signup-form .form-group { margin-bottom: 1rem; }

/* 약관 안내 */
.terms-line { background: var(--bg); border-radius: var(--radius-sm); padding: 0.8rem 0.95rem; font-size: 0.78rem; color: var(--muted); margin: 1rem 0 0; line-height: 1.6; }
.terms-line a { color: var(--brand); text-decoration: none; font-weight: 700; }
.terms-line a:hover { text-decoration: underline; }

@media (max-width: 768px) {
    /* auth.css 의 1단 전환(.auth-card)을 .signup-card.auth-card(특정도 2)가 덮어쓰므로
       같은 특정도로 다시 정의한다. */
    .signup-card.auth-card { grid-template-columns: 1fr; }
    .auth-hero-steps li { font-size: 0.85rem; }
}