/* ═══ 시작하기 ═════════════════════════════════════════════════ */
.steps-head { margin-bottom: 34px; }
.steps-head h2 { font-size: clamp(26px, 3.2vw, 42px); }
.steps { display: grid; grid-template-columns: repeat(3, 1fr);
  border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; background: var(--raise); }
@media (max-width: 820px) { .steps { grid-template-columns: 1fr; } }
.step { padding: 28px 26px; border-right: 1px solid var(--line); display: grid; gap: 9px; align-content: start; }
.step:last-child { border-right: 0; }
@media (max-width: 820px) {
  .step { border-right: 0; border-bottom: 1px solid var(--line); }
  .step:last-child { border-bottom: 0; }
}
.step-ic { color: var(--accent); }
.step h3 { font-size: 17.5px; font-weight: 700; letter-spacing: -.03em; }
.step p { font-size: 14px; color: var(--muted); line-height: 1.62; }

/* ═══ FAQ ══════════════════════════════════════════════════════ */
.faq-head { margin-bottom: 30px; }
.faq-head h2 { font-size: clamp(26px, 3.2vw, 42px); }
.faq { display: grid; gap: 0; border-top: 1px solid var(--line); }
.qa { border-bottom: 1px solid var(--line); }
.qa-q {
  width: 100%; background: transparent; border: 0; cursor: pointer;
  display: flex; align-items: center; gap: 16px; text-align: left;
  padding: 21px 4px; font-size: 16.5px; font-weight: 700; color: var(--ink);
  letter-spacing: -.02em; transition: color .18s var(--ease);
}
.qa-q:hover { color: var(--accent); }
.qa-q svg { margin-left: auto; flex: 0 0 auto; color: var(--faint); transition: transform .3s var(--ease); }
.qa[open] .qa-q svg { transform: rotate(45deg); color: var(--accent); }
.qa-a { max-height: 0; overflow: hidden; opacity: 0;
  transition: max-height .34s var(--ease), opacity .24s var(--ease), padding-bottom .34s var(--ease); }
.qa[open] .qa-a { max-height: 260px; opacity: 1; padding-bottom: 22px; }
.qa-a p { font-size: 15.5px; color: var(--muted); max-width: 62ch; line-height: 1.7; }

/* ── 모바일 대응 ── */
@media (max-width: 480px) {
  .steps-head h2 { font-size: clamp(20px, 6vw, 26px); }
  .step h3 { font-size: 16px; }
  .step p { font-size: 14px; }
  .faq-head h2 { font-size: clamp(20px, 6vw, 26px); }
  .qa-q { font-size: 14px; padding: 12px 14px; }
  .qa-a p { font-size: 13.5px; }
}