/* ==========================================================================
   かなさホーム — コラムのカード（template-parts/kanasa/column-card.php。Figma c-kanasa-column-card 55:1300）
   - クリーム地・角丸 28px。写真（384×260。SP 335×188）→ カテゴリの札（薄い緑）・日付 → 題名（Kanasa/PC/H4 20px 緑）
   - 横に並べたときに高さをそろえる（親のグリッドで伸ばし、カードは height: 100%）
   ========================================================================== */

.c-kanasa-column-card {
	height: 100%;
}

.c-kanasa-column-card__link {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	color: inherit;
	text-decoration: none;
	background: var(--kanasa-bg-canvas);
	border-radius: var(--kanasa-radius-card);
}

.c-kanasa-column-card__photo {
	overflow: hidden;
	aspect-ratio: 384 / 260;
	background: var(--kanasa-bg-green-soft);
}

.c-kanasa-column-card__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s;
}

.c-kanasa-column-card__body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 10px; /* Figma の値（トークンにない） */
	padding: var(--space-lg) 28px var(--space-xl);
}

.c-kanasa-column-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-xs) var(--space-sm);
	align-items: center;
}

.c-kanasa-column-card__tag {
	padding: 2px var(--space-sm);
	font: var(--text-kanasa-body-s);
	letter-spacing: var(--ls-kanasa);
	color: var(--kanasa-text-green);
	background: var(--kanasa-bg-green-soft);
	border-radius: var(--radius-full);
}

.c-kanasa-column-card__date {
	font: var(--text-kanasa-body-s);
	letter-spacing: var(--ls-kanasa);
	color: var(--kanasa-text-secondary);
}

.c-kanasa-column-card__title {
	font: var(--text-kanasa-h4);
	letter-spacing: var(--ls-kanasa);
	color: var(--kanasa-text-green);
}

@media (hover: hover) {
	.c-kanasa-column-card__link:hover .c-kanasa-column-card__img {
		transform: scale(1.04);
	}

	.c-kanasa-column-card__link:hover .c-kanasa-column-card__title {
		text-decoration: underline;
		text-underline-offset: 5px;
	}
}

@media (max-width: 767px) {
	.c-kanasa-column-card__photo {
		aspect-ratio: 335 / 188;
	}

	.c-kanasa-column-card__body {
		padding: 20px 20px var(--space-xl);
	}
}