/* ============================================================================
   welcome.css — 응시 첫 화면(브랜드 히어로 · 등록 폼 · 응시자군 선택 · 확인)
   ============================================================================ */

.welcome-outer{width:var(--ap-content);margin:0 auto;padding:var(--ap-s4)}

/* ── 히어로 ───────────────────────────────────────────────────────────── */
.welcome-hero{
  position:relative;overflow:hidden;
  margin-bottom:var(--ap-s4);padding:var(--ap-s7) var(--ap-s6) var(--ap-s6);
  border-radius:var(--ap-r-2xl);
  background:linear-gradient(135deg,var(--ap-blue) 0%,var(--ap-indigo) 100%);
  color:#fff;box-shadow:var(--ap-shadow);
}
.welcome-hero::after{
  content:'';position:absolute;right:-40px;bottom:-56px;
  width:200px;height:200px;border-radius:50%;background:rgba(255,255,255,.07);
}
.welcome-brand{display:flex;align-items:center;gap:var(--ap-s2);margin-bottom:var(--ap-s4)}
.welcome-dot{width:8px;height:8px;flex-shrink:0;border-radius:50%;background:rgba(255,255,255,.85)}
.welcome-brand-txt{font-size:var(--ap-t-callout);font-weight:600;letter-spacing:-.009em;color:#fff}
.welcome-brand-txt em{font-style:normal;font-weight:400;color:rgba(255,255,255,.7)}
.welcome-title{
  margin-bottom:var(--ap-s3);
  font-size:clamp(28px,7vw,40px);line-height:1.1;letter-spacing:-.025em;
  font-weight:700;color:#fff;
}
.welcome-sub{
  margin-bottom:var(--ap-s5);max-width:52ch;
  font-size:var(--ap-t-subhead);line-height:1.6;color:rgba(255,255,255,.85);
}
.welcome-pills{display:flex;flex-wrap:wrap;gap:var(--ap-s2)}
.welcome-pill{
  padding:6px 13px;border-radius:var(--ap-r-pill);white-space:nowrap;
  background:rgba(255,255,255,.16);color:#fff;
  font-size:var(--ap-t-caption);font-weight:600;
}

/* ── 등록 폼 카드 ─────────────────────────────────────────────────────── */
.welcome-form-card{
  padding:var(--ap-s6) var(--ap-s5);
  background:var(--ap-surface);border:1px solid var(--ap-separator-soft);
  border-radius:var(--ap-r-xl);box-shadow:var(--ap-shadow-xs);
}
.welcome-form-title{
  margin-bottom:var(--ap-s1);
  font-size:var(--ap-t-title3);line-height:var(--ap-t-title3-lh);letter-spacing:var(--ap-t-title3-ls);
  font-weight:700;color:var(--ap-label);
}
.welcome-form-sub{margin-bottom:var(--ap-s5);font-size:var(--ap-t-footnote);color:var(--ap-label-3)}
.welcome-notice{
  margin-bottom:var(--ap-s5);padding:12px 14px;border-radius:var(--ap-r-md);
  background:var(--ap-fill);
  font-size:var(--ap-t-caption);line-height:1.6;color:var(--ap-label-3);
}
.welcome-notice-txt{
  margin-top:var(--ap-s3);text-align:center;
  font-size:var(--ap-t-caption2);line-height:1.5;color:var(--ap-label-4);
}

/* ── 시작 버튼 ────────────────────────────────────────────────────────── */
.welcome-start-btn{
  display:block;width:100%;margin-top:var(--ap-s3);
  min-height:52px;padding:16px;border:none;border-radius:var(--ap-r-pill);
  background:var(--ap-blue);color:#fff;
  font-family:inherit;font-size:var(--ap-t-headline);font-weight:600;letter-spacing:-.012em;
  cursor:pointer;
  transition:background var(--ap-dur-1) var(--ap-ease),transform var(--ap-dur-1) var(--ap-ease-out);
}
.welcome-start-btn:hover{background:var(--ap-blue-hover)}
.welcome-start-btn:active{background:var(--ap-blue-active);transform:scale(.98)}
.welcome-start-btn:disabled{opacity:.4;cursor:not-allowed;transform:none}

/* ── 응시자군 선택 (주니어 / 성인) ────────────────────────────────────── */
.aud-section{margin-bottom:0}
.aud-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--ap-s3);margin-top:var(--ap-s3)}
.aud-btn{
  position:relative;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--ap-s2);
  min-height:112px;padding:20px 10px 18px;text-align:center;
  background:var(--ap-surface);border:1px solid var(--ap-separator);border-radius:var(--ap-r-lg);
  font-family:inherit;cursor:pointer;
  transition:background var(--ap-dur-1) var(--ap-ease),border-color var(--ap-dur-1) var(--ap-ease),
             box-shadow var(--ap-dur-1) var(--ap-ease),transform var(--ap-dur-1) var(--ap-ease-out);
}
.aud-btn:hover{background:var(--ap-fill);border-color:var(--ap-gray-3)}
.aud-btn:active{transform:scale(.98)}
.aud-btn.aud-sel{
  background:var(--ap-blue-tint);border-color:var(--ap-blue);
  box-shadow:inset 0 0 0 1px var(--ap-blue);
}
.aud-avatar{
  width:44px;height:44px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:var(--ap-t-caption);font-weight:700;color:#fff;
  transition:transform var(--ap-dur-2) var(--ap-ease-out);
}
.aud-av-j{background:linear-gradient(135deg,var(--ap-green-solid),var(--ap-green))}
.aud-av-a{background:linear-gradient(135deg,var(--ap-indigo-light),var(--ap-indigo))}
.aud-btn.aud-sel .aud-avatar{transform:scale(1.08)}
.aud-name{font-size:var(--ap-t-subhead);font-weight:600;color:var(--ap-label)}
.aud-age{font-size:var(--ap-t-caption);color:var(--ap-label-3)}
.aud-btn.aud-sel .aud-name,.aud-btn.aud-sel .aud-age{color:var(--ap-blue-text)}
.aud-btn.aud-sel::after{
  content:'\2713';position:absolute;top:9px;right:9px;
  width:19px;height:19px;border-radius:50%;
  background:var(--ap-blue);color:#fff;
  font-size:10px;font-weight:700;line-height:19px;text-align:center;
}

/* ── 확인 단계 ────────────────────────────────────────────────────────── */
.welcome-confirm-banner{
  display:flex;align-items:flex-start;gap:var(--ap-s3);
  margin-bottom:var(--ap-s4);padding:14px;border-radius:var(--ap-r-md);
  background:var(--ap-blue-tint);
}
.wcb-icon{flex-shrink:0;font-size:20px}
.wcb-txt{font-size:var(--ap-t-footnote);line-height:1.6;color:var(--ap-blue-text)}
.confirm-rows{margin-bottom:var(--ap-s4)}
.confirm-row{
  display:flex;align-items:center;justify-content:space-between;gap:var(--ap-s3);
  padding:12px 0;border-bottom:1px solid var(--ap-separator-soft);
}
.confirm-row:last-child{border-bottom:none}
.confirm-label{
  font-size:var(--ap-t-caption);font-weight:600;
  letter-spacing:.05em;text-transform:uppercase;color:var(--ap-label-3);
}
.confirm-val{font-size:var(--ap-t-subhead);font-weight:600;color:var(--ap-label)}

@media (max-width:480px){
  .welcome-hero{padding:var(--ap-s6) var(--ap-s5) var(--ap-s5)}
  .aud-row{grid-template-columns:1fr}
}