/* 문의하기(INQUIRY-01) 전용 스타일
   공통 토큰·프리미티브(.container/.btn/.badge)는 common.css 에서 로드됨 */

/* 본문 래퍼: 내용이 짧아도 푸터가 화면 바닥에 붙도록 세로 플렉스로 채운다 */
body { display: flex; flex-direction: column; min-height: 100vh; }
.inquiry-main { flex: 1 0 auto; padding: 46px 0 72px; background: var(--surface-2); }
.site-footer { flex-shrink: 0; }
.iq-inner { max-width: 980px; }
.container.iq-inner { margin: 0 auto; }

/* 페이지 헤드 */
.iq-head { margin-bottom: 22px; }
.iq-title {
  font-size: 30px; font-weight: 800;
  letter-spacing: -.03em; color: var(--ink);
}
.iq-lead { margin-top: 8px; font-size: 14px; color: var(--muted); }

/* 안내 + 폼 2단 */
.iq-grid {
  display: grid; grid-template-columns: .8fr 1.2fr; gap: 20px;
  align-items: start;
}

/* 안내 패널 */
.iq-guide {
  background: #fff;
  border: 1px solid var(--card-line);
  border-radius: var(--radius);
  padding: 22px;
  display: flex; flex-direction: column; gap: 20px;
}
.iq-guide-row { display: flex; gap: 12px; }
.iq-guide-icon {
  flex: 0 0 auto;
  width: 38px; height: 38px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 10px;
  background: var(--brand-icon-bg); color: var(--brand);
}
.iq-guide-icon svg { width: 19px; height: 19px; }
.iq-guide-copy strong { display: block; font-size: 13.5px; font-weight: 800; color: var(--text); }
.iq-guide-copy p { margin-top: 4px; font-size: 12.5px; line-height: 1.6; color: var(--muted-2); }
.iq-guide-copy a { color: var(--brand); font-weight: 700; }
.iq-guide-copy a:hover { text-decoration: underline; }

/* 작성 폼 카드 */
.iq-form-card {
  background: #fff;
  border: 1px solid var(--card-line);
  border-radius: var(--radius);
  padding: 26px 28px;
}
.iq-label {
  display: block;
  font-size: 13px; font-weight: 700; color: var(--text);
  margin-bottom: 8px;
}
.iq-input + .iq-label { margin-top: 18px; }
.iq-input, .iq-textarea {
  width: 100%;
  border: 1px solid var(--line); border-radius: 10px;
  background: #fff;
  font-family: inherit; font-size: 14px; color: var(--text);
}
.iq-input { height: 44px; padding: 0 14px; }
.iq-textarea { padding: 12px 14px; line-height: 1.6; resize: vertical; min-height: 160px; }
.iq-input:focus, .iq-textarea:focus { outline: none; border-color: var(--brand); }
.iq-input::placeholder, .iq-textarea::placeholder { color: var(--faint); }
.iq-form-foot {
  margin-top: 18px;
  display: flex; align-items: center; gap: 14px;
}
.iq-form-msg { flex: 1 1 auto; font-size: 12.5px; min-height: 1em; }
.iq-form-msg.is-ok { color: var(--ok); }
.iq-form-msg.is-error { color: var(--danger); }
#iq-submit { height: 44px; padding: 0 26px; font-size: 14px; }

/* 비로그인 유도 */
.iq-login { text-align: center; padding: 44px 24px; }
.iq-login-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 52px; height: 52px; border-radius: 14px;
  background: var(--brand-icon-bg); color: var(--brand);
}
.iq-login-icon svg { width: 26px; height: 26px; }
.iq-login-title { margin-top: 14px; font-size: 16px; font-weight: 800; color: var(--ink); }
.iq-login-sub { margin-top: 6px; font-size: 13px; color: var(--muted); }
.iq-login .btn { margin-top: 18px; height: 44px; padding: 0 24px; font-size: 14px; }

/* 내 문의 내역 보기 링크 (회원 영역의 내 문의 내역으로 이동) */
.iq-history-link {
  display: inline-block;
  margin-top: 16px;
  font-size: 13px; font-weight: 700; color: var(--brand);
}
.iq-history-link:hover { text-decoration: underline; }

/* 푸터 (랜딩과 동일 패턴) */
.site-footer { border-top: 1px solid var(--line); background: #fff; }
.footer-inner {
  display: flex; align-items: center; flex-wrap: wrap; gap: 16px 28px;
  padding: 34px 24px;
}
.footer-brand { display: inline-flex; align-items: center; gap: 10px; }
.footer-nav { display: flex; gap: 22px; font-size: 13px; font-weight: 600; color: var(--text-soft); }
.footer-nav a:hover { color: var(--brand); }
.footer-copy { margin-left: auto; font-size: 12.5px; color: var(--faint); }

/* 반응형 · 태블릿 */
@media (max-width: 860px) {
  .iq-grid { grid-template-columns: 1fr; }
  .iq-side { order: 2; }
  .iq-form-card { order: 1; }
}
@media (max-width: 720px) {
  .inquiry-main { padding: 30px 0 56px; }
  .iq-title { font-size: 24px; }
  .iq-form-card { padding: 22px 18px; }
}

/* 반응형 · 모바일 (1열 · 햄버거) */
@media (max-width: 640px) {
  .iq-form-foot { flex-direction: column; align-items: stretch; }
  #iq-submit { width: 100%; }
  .footer-inner { flex-direction: column; align-items: flex-start; }
  .footer-copy { margin-left: 0; }
}
