/* ==========================================================================
   MODULE: components/post-card (.wzs-post-grid + .wzs-magazine-card)
   썸네일+제목+발췌 카드와 그리드. post_type 상관없이 재사용:
   매거진 목록, 히어로 "무역 노하우" 인기글, 자료실 인기 자료/전체 자료.
   페이지 전용이 아니라 상시 로드되는 컴포넌트로 분리(inc/enqueue.php).
   ========================================================================== */

.wzs-post-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--wzs-space-4);
}

.wzs-magazine-card {
	display: flex;
	flex-direction: column;
	background: var(--wzs-white);
	border: 1px solid var(--wzs-border);
	border-radius: var(--wzs-radius-lg);
	overflow: hidden;
	transition: transform var(--wzs-duration-base) var(--wzs-ease), box-shadow var(--wzs-duration-base) var(--wzs-ease);
}

.wzs-magazine-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--wzs-shadow-md);
}

/* 카드 링크는 클래스가 없는 순수 <a>라, 글 본문(.wzs-article) 안(글 하단 "다른 글 보기")에
   놓이면 typography.css의 .wzs-article a { color: blue; text-decoration: underline }가
   그대로 새어 들어온다 — 명시도를 맞춰 확실히 끈다. */
.wzs-magazine-card a {
	color: inherit;
	text-decoration: none;
}

.wzs-magazine-card-thumb {
	aspect-ratio: 4 / 3;
	overflow: hidden;
}

.wzs-magazine-card-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* 대표이미지가 아직 없는 글(특히 새로 만든 자료 글)을 위한 중립 플레이스홀더 */
.wzs-magazine-card-thumb--placeholder {
	background: linear-gradient(135deg, var(--wzs-bg-alt) 0%, var(--wzs-border) 100%);
}

.wzs-magazine-card-body {
	padding: var(--wzs-space-4);
	display: flex;
	flex-direction: column;
	gap: var(--wzs-space-2);
}

.wzs-magazine-card-title {
	font-size: var(--wzs-fs-lg);
	font-weight: 700;
}

.wzs-magazine-card-excerpt {
	font-size: var(--wzs-fs-sm);
	color: var(--wzs-ink-soft);
	line-height: var(--wzs-lh-article);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

@media (max-width: 900px) {
	.wzs-post-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 560px) {
	.wzs-post-grid {
		grid-template-columns: 1fr;
	}
}
