/* =============================================================
   inquiry.css — inquiry.html(1:1 문의하기, 로그인 없이 쓰는 공개 문의) 전용.
   페이지 셸(.nk-prog / .nk-prog-head)은 program.css, 입력창(.nk-input)·
   체크박스(.nk-checkbox)·동의 줄(.nk-agree)·버튼(.nk-btn)은 components.css 를
   그대로 쓴다 — 여기에는 **이 화면의 폼 배치**만 둔다.
   (같은 모양이 sellers.css 의 .nk-sell-form 에도 있다. 세 번째 화면이 생기면
    그때 components.css 로 올린다 — 지금 옮기면 판매원 명부까지 같이 손봐야 한다.)
   색·간격·타이포는 전부 css/variables.css 의 --nk-* 토큰.
   반응형: 데스크톱 우선, 768 / 375 두 브레이크포인트(f/CLAUDE.md 규칙).
   ============================================================= */

.nk-inq-card {
  width: 100%;
  max-width: 720px;
  padding: var(--nk-space-32);
  background: var(--nk-color-white);
  border: 1px solid var(--nk-color-gray-line);
  border-radius: var(--nk-radius-8);
}

.nk-inq-form {
  display: flex;
  flex-direction: column;
  gap: var(--nk-space-16);
  width: 100%;
}
.nk-inq-field {
  display: flex;
  flex-direction: column;
  gap: var(--nk-space-4);
}
.nk-inq-field__label {
  font: var(--nk-text-p14-m);
  color: var(--nk-color-black);
}
.nk-inq-field__hint {
  margin: 0;
  font: var(--nk-text-p13-r);
  color: var(--nk-color-gray-2);
}
.nk-inq-field__hint a {
  color: var(--nk-color-gray-2);
  text-decoration: underline;
}
/* 이름 · 연락처를 한 줄에 (768px 이하는 1열) */
.nk-inq-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: start;
  gap: var(--nk-space-16);
}

.nk-inq-agreebox {
  display: flex;
  flex-direction: column;
  gap: var(--nk-space-8);
  padding: var(--nk-space-16);
  background: var(--nk-color-bg);
  border-radius: var(--nk-radius-4);
}

.nk-inq-note {
  margin: 0;
  font: var(--nk-text-p14-r);
  color: var(--nk-color-gray-2);
}
.nk-inq-error {
  margin: 0;
  font: var(--nk-text-p14-r);
  color: var(--nk-color-red-1);
}
.nk-inq-actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--nk-space-8);
}

/* 접수 완료 안내 (폼을 숨기고 이 블록만 보여준다) */
.nk-inq-done {
  display: flex;
  flex-direction: column;
  gap: var(--nk-space-12);
  align-items: flex-start;
}

/* 봇 차단용 숨김 입력칸. [hidden] / display:none 으로 숨기면 일부 봇이
   "안 보이는 칸"으로 알아보고 건너뛴다 — 화면 밖으로 밀어내 둔다.
   사람은 Tab 으로도 닿지 않게 마크업에서 tabindex="-1" 을 준다. */
.nk-inq-hp {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

@media (max-width: 768px) {
  .nk-inq-card {
    max-width: 100%;
    padding: var(--nk-space-20);
  }
  .nk-inq-row {
    grid-template-columns: 1fr;
  }
  .nk-inq-actions > .nk-btn {
    width: 100%;
  }
}