/* 후기·전후사진·리얼셀카 상세 — medical-item-detail.css 를 깔고 그 위에 얹는다 */

.story-head {
  margin: 0 0 28px;
}

.story-head h1 {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.4;
  color: #222;
  margin: 0 0 14px;
  word-break: keep-all;
}

.story-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.story-chip {
  display: inline-block;
  padding: 5px 12px;
  border-radius: 14px;
  background: #f3efe9;
  color: #8a6644;
  font-size: 13px;
  font-weight: 600;
}

.story-chip.sub {
  background: #eef0f6;
  color: #5a6172;
}

.story-date {
  margin-left: auto;
  font-size: 13px;
  color: #999;
}

/* 본문 이미지가 넘치지 않게 — 후기 본문은 에디터로 작성돼 폭이 제각각이다 */
.story-detail .section-body img {
  /* 본문 이미지 원본이 전부 1080px 이라 그 이상 늘리면 흐려진다 */
  max-width: min(100%, 1080px);
  height: auto;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 768px) {
  .story-head h1 {
    font-size: 21px;
  }

  .story-date {
    margin-left: 0;
    width: 100%;
  }
}

/* 이 후기의 시술 — 시술 상세로 가는 칩 */
.story-item-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.story-item-chip { display: inline-block; padding: 7px 14px; border: 1px solid #d6c9bb;
  border-radius: 16px; background: #fff; color: #333; text-decoration: none; font-size: 14px; }
.story-item-chip:hover { background: #f6f1ea; }