/* 업무 진단(checkup) — 여섯 문장 자가 점검. 색·치수는 public.css 토큰만 쓴다.
   넓은 화면: 왼쪽에 여섯 문장, 오른쪽에 결과. 960px 아래로는 한 줄로 쌓는다. */
.checkup>.p-note { max-width: 680px; }
.checkup-form fieldset { margin: 0; padding: 0; border: 0; }
.checkup-form legend { padding: 0; }
.checkup-items { display: grid; gap: var(--p-s2); margin-block-start: var(--p-s5); }
.checkup-item { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: var(--p-s4); align-items: start; padding: var(--p-s4) var(--p-s5); background: var(--p-white); border: 1px solid var(--p-line); border-radius: var(--p-radius); cursor: pointer; transition: border-color .15s ease, background-color .15s ease; }
.checkup-item:hover, .checkup-item:focus-within { border-color: var(--p-control); }
.checkup-item.is-checked { border-color: var(--p-blue); background: var(--p-soft); }
.checkup-item input { width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--p-blue); }
.checkup-item span { line-height: 1.6; }
.checkup-result { padding: var(--p-s6); background: var(--p-soft); border: 1px solid var(--p-line); border-radius: var(--p-radius); }
/* 결과 안내는 스크립트가 살아 있을 때만 사실이다 — 꺼져 있으면 문장만 읽고 메일로 보낸다(noscript 안내). */
.checkup-result [data-result-hint] { display: none; }
.checkup.is-live .checkup-result [data-result-hint] { display: block; }
.checkup-result [data-result-title] { margin-block-start: var(--p-s3); }
.checkup-result [data-result-body] { margin-block-start: var(--p-s4); max-width: 640px; }
.checkup-result ul { display: grid; gap: var(--p-s2); margin-block-start: var(--p-s5); padding-inline-start: 1.1em; color: var(--p-muted); }
.checkup-result__actions { display: flex; flex-wrap: wrap; gap: var(--p-s4); margin-block-start: var(--p-s6); }
.checkup-result [data-result-body-wrap] > .p-small { margin-block-start: var(--p-s5); }
.checkup-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 400px); align-items: start; column-gap: var(--p-s7); }
.checkup-form { max-width: 660px; }
@media (max-width: 960px) {
  .checkup { max-width: 860px; }
  .checkup-grid { display: block; }
  .checkup-form { max-width: none; }
  .checkup-result { margin-block-start: var(--p-s7); }
}
@media (max-width: 560px) { .checkup-item { padding: var(--p-s4); } .checkup-result { padding: var(--p-s5); } }