/* 프로세스 탭: 라디오 + 라벨만으로 이미지 전환 (JS 없음) */
.test-process .proc-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.test-process .process-image .proc-img {
  display: none;
  width: 100%;
  height: auto;
  border-radius: 12px;
}

#proc-0:checked ~ .test-process-content .process-image .proc-img-0,
#proc-1:checked ~ .test-process-content .process-image .proc-img-1,
#proc-2:checked ~ .test-process-content .process-image .proc-img-2,
#proc-3:checked ~ .test-process-content .process-image .proc-img-3 {
  display: block;
}

#proc-0:checked ~ .test-process-content .process-list label[for="proc-0"] .process-bar,
#proc-1:checked ~ .test-process-content .process-list label[for="proc-1"] .process-bar,
#proc-2:checked ~ .test-process-content .process-list label[for="proc-2"] .process-bar,
#proc-3:checked ~ .test-process-content .process-list label[for="proc-3"] .process-bar {
  background: #3b82f6;
}

#proc-0:checked ~ .test-process-content .process-list label[for="proc-0"] .process-text .process-title,
#proc-1:checked ~ .test-process-content .process-list label[for="proc-1"] .process-text .process-title,
#proc-2:checked ~ .test-process-content .process-list label[for="proc-2"] .process-text .process-title,
#proc-3:checked ~ .test-process-content .process-list label[for="proc-3"] .process-text .process-title {
  color: #1f2937;
}

#proc-0:checked ~ .test-process-content .process-list label[for="proc-0"] .process-text .process-desc,
#proc-1:checked ~ .test-process-content .process-list label[for="proc-1"] .process-text .process-desc,
#proc-2:checked ~ .test-process-content .process-list label[for="proc-2"] .process-text .process-desc,
#proc-3:checked ~ .test-process-content .process-list label[for="proc-3"] .process-text .process-desc {
  color: #6b7280;
}
