/* =========================================================
   남춘천 센트레빌 전시품목 (84A / 84E)
   - 모든 클래스는 exh- 접두사로 기존 사이트 스타일과 충돌 방지
   ========================================================= */
.exh-wrap {
  --exh-accent: #9F8562;
  --exh-ink: #1a1a1a;
  --exh-sub: #8a8a8a;
  --exh-line: #e2e2e2;
  --exh-pin-bg: rgba(26, 26, 26, .82);
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
  box-sizing: border-box;
  color: var(--exh-ink);
  text-align: left;
}
.exh-wrap *,
.exh-wrap *::before,
.exh-wrap *::after { box-sizing: border-box; }

/* 2열 그리드 (좁은 화면에서 1열) */
.exh-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 56px 32px;
}
@media (max-width: 860px) {
  .exh-grid { grid-template-columns: minmax(0, 1fr); gap: 44px; }
}

/* 섹션 제목 */
.exh-card { margin: 0; min-width: 0; }
.exh-title {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin: 0 0 14px;
  padding: 0 0 12px;
  border-bottom: 1px solid var(--exh-ink);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -.02em;
}
.exh-type {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .08em;
  color: var(--exh-sub);
}

/* 이미지 + 번호 원 : 위치/크기 모두 이미지 기준 % → 어떤 화면에서도 동일 비율 */
.exh-figure {
  position: relative;
  container-type: inline-size;
  overflow: hidden;
  background: #f2f2f2;
}
.exh-figure img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  max-width: none;
  margin: 0;
}
.exh-pin {
  position: absolute;
  z-index: 1;
  width: 4.5%;
  min-width: 20px;
  aspect-ratio: 1 / 1;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1.5px solid #fff;
  border-radius: 50%;
  background: var(--exh-pin-bg);
  color: #fff;
  font-size: clamp(10px, 2.3cqw, 15px);
  font-weight: 600;
  line-height: 1;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .3);
  cursor: pointer;
  outline: none;
  transition: background-color .2s, transform .2s, box-shadow .2s;
}
.exh-pin.is-active {
  z-index: 2;
  background: var(--exh-accent);
  transform: translate(-50%, -50%) scale(1.25);
  box-shadow: 0 0 0 4px rgba(159, 133, 98, .35), 0 2px 8px rgba(0, 0, 0, .35);
}

/* 전시품목 목록 */
.exh-list {
  list-style: none;
  margin: 16px 0 0;
  padding: 0;
}
.exh-list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  padding: 10px 8px;
  border-bottom: 1px solid var(--exh-line);
  font-size: 15px;
  line-height: 1.55;
  color: #444;
  cursor: pointer;
  outline: none;
  transition: color .2s, background-color .2s;
}
.exh-num {
  flex: none;
  width: 22px;
  height: 22px;
  margin-top: 1px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--exh-ink);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  transition: background-color .2s;
}
.exh-list li.is-active {
  color: var(--exh-accent);
  background: rgba(159, 133, 98, .08);
  font-weight: 500;
}
.exh-list li.is-active .exh-num { background: var(--exh-accent); }

@media (max-width: 480px) {
  .exh-title { font-size: 16px; }
  .exh-list li { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .exh-pin, .exh-list li, .exh-num { transition: none; }
}
