@charset "UTF-8";
/* ▣ 기본 카드 레이아웃 */
.card {
  display: inline-flex;
  justify-content: stretch;
  align-items: center;
  flex-direction: column;
  width: 350px;
  max-width: calc(100% - 20px - 20px);
  margin: 20px;
  background: var(--background);
  border-radius: var(--rounded);
  overflow: hidden;
  box-shadow: var(--shadow);
  vertical-align: top;
}

.card[data-style=small] {
  width: 250px;
}

/* ▣ 카드 내부 텍스트 래퍼 */
.card-text {
  display: inline-flex;
  justify-content: flex-start;
  align-items: stretch !important; /* ✔ 텍스트가 전체 가로폭 사용 */
  flex-direction: column;
  gap: 20px;
  max-width: 100%;
  padding: 20px;
}

.card-text > * {
  margin: 0 !important;
}

.card-title {
  font-family: var(--heading);
  font-weight: var(--semi-bold);
}

.card-subtitle {
  margin-top: -10px !important;
  font-style: italic;
}

/* ▣ 썸네일 이미지 영역 */
.card {
  display: flex;
  align-items: center;
}

.card-media {
  width: 110px;
  aspect-ratio: 3/4;
  flex: 0 0 110px;
  overflow: hidden;
  border-radius: 8px;
}

.card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  max-height: none !important;
  max-width: none !important;
}

/* ▣ 텍스트 본문 */
.card-body {
  flex: 1 1 auto;
  min-width: 0;
}

/* ▣ 자연스러운 줄바꿈 + 단어 깨짐 방지 */
.card-body,
.card-text {
  word-break: keep-all;
  overflow-wrap: break-word;
  white-space: normal;
}

/* ▣ 기본 텍스트 왼쪽 정렬 */
.card-body,
.card-text,
.card-text p,
.card-text li {
  text-align: left !important;
}

/* ▣ 리스트(li) 줄바꿈 문제 해결 */
.card-text li {
  display: list-item !important;
  white-space: normal !important;
  word-break: keep-all !important;
  width: 100% !important; /* ✔ flex 영향 제거 */
}

/* ⭐ 가장 중요한 부분: p 안 justify 제거 */
.card-text p {
  text-align: left !important; /* ✔ 단어 간 간격 벌어짐 완전 차단 */
  white-space: normal !important;
  word-break: keep-all !important;
}

/*# sourceMappingURL=card.css.map */