/**
 * Styles for woo-sil7en/post-card — editorial, cover-forward.
 *
 * Sibling of product-card: the article cover is the hero (16:9, generous
 * rounding, soft lift + zoom on hover), a gold category chip floats over it, a
 * clean display title, a muted dek, and an "autor · fecha · N min" meta line.
 * All values from design tokens; every motion is compositor-only (transform/
 * opacity) and gated by prefers-reduced-motion — reused verbatim from the
 * product-card vocabulary.
 *
 * @package woo-sil7en-blocks-content
 * @since   0.1.0
 */

.woo-sil7en-post-card {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--xs, 0.75rem);
	background: transparent;
	border: 0;
	width: 100%;
	height: 100%;
}

/* ---- Media: the cover (16:9, cover-forward) ---- */
.woo-sil7en-post-card__media {
	position: relative;
	display: block;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	border-radius: var(--wp--custom--radius--xl, 0.25rem);
	background: var(--wp--preset--color--surface, #f6f5f3);
	border: 1px solid var(--wp--preset--color--border, #e6e3de);
	box-shadow: none;
	transition:
		transform var(--wp--custom--motion--duration--base, 250ms) var(--wp--custom--motion--ease--soft, ease),
		box-shadow var(--wp--custom--motion--duration--base, 250ms) var(--wp--custom--motion--ease--soft, ease);
}

.woo-sil7en-post-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform var(--wp--custom--motion--duration--slow, 500ms) var(--wp--custom--motion--ease--soft, ease);
}

.woo-sil7en-post-card:hover .woo-sil7en-post-card__media {
	transform: translateY(-3px);
	box-shadow: var(--wp--custom--shadow--md, 0 6px 18px rgb(20 18 14 / 0.07));
}

.woo-sil7en-post-card:hover .woo-sil7en-post-card__media img {
	transform: scale(1.05);
}

/* Cover-less posts: a quiet surface panel with a centred book glyph — never a
   broken image. Reuses the editorial surface tone. */
.woo-sil7en-post-card__placeholder {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--wp--preset--color--muted, #9a958c);
}

.woo-sil7en-post-card__placeholder-icon {
	width: 2.5rem;
	height: 2.5rem;
	opacity: 0.5;
}

/* ---- Podcast badge: floats over the cover for podcast-category posts ---- */
.woo-sil7en-post-card__badge {
	position: absolute;
	inset-block-start: 0.6rem;
	inset-inline-start: 0.6rem;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.25rem 0.6rem;
	background: var(--wp--preset--color--primary, #531099);
	color: var(--wp--preset--color--primary-ink, #fff);
	font-family: var(--wp--preset--font-family--sans, sans-serif);
	font-size: var(--wp--preset--font-size--xs, 0.8125rem);
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0.03em;
	border-radius: var(--wp--custom--radius--pill, 999px);
	box-shadow: var(--wp--custom--shadow--sm, 0 2px 8px rgb(20 18 14 / 0.18));
}

.woo-sil7en-post-card__badge-glyph {
	font-size: 0.7em;
	line-height: 1;
}

/* ---- Category chip: gold seal over the cover ---- */
.woo-sil7en-post-card__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
}

.woo-sil7en-post-card__chip {
	display: inline-flex;
	align-items: center;
	padding: 0.2rem 0.65rem;
	background: var(--wp--preset--color--accent, #ffc800);
	color: var(--wp--preset--color--accent-ink, #1a0800);
	font-family: var(--wp--preset--font-family--sans, sans-serif);
	font-size: var(--wp--preset--font-size--xs, 0.8125rem);
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	text-decoration: none;
	border-radius: var(--wp--custom--radius--pill, 999px);
	transition: filter var(--wp--custom--motion--duration--fast, 150ms) ease;
}

.woo-sil7en-post-card__chip:hover,
.woo-sil7en-post-card__chip:focus-visible {
	filter: brightness(0.94);
}

/* ---- Body ---- */
.woo-sil7en-post-card__body {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--3xs, 0.4rem);
	flex: 1;
	padding-inline: 0.125rem;
}

.woo-sil7en-post-card__title {
	font-family: var(--wp--preset--font-family--display, "Lora", Georgia, serif);
	font-size: var(--wp--preset--font-size--md, 1.125rem);
	font-weight: 500;
	letter-spacing: -0.01em;
	line-height: 1.25;
	margin: 0;
	text-wrap: pretty;
}

.woo-sil7en-post-card__title a {
	color: var(--wp--preset--color--contrast, #1c140d);
	text-decoration: none;
}

.woo-sil7en-post-card__title a:hover,
.woo-sil7en-post-card__title a:focus-visible {
	color: var(--wp--preset--color--primary, #531099);
}

.woo-sil7en-post-card__dek {
	font-size: var(--wp--preset--font-size--sm, 0.9375rem);
	color: var(--wp--preset--color--muted, #6b6157);
	line-height: 1.6;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ---- Meta: autor · fecha · N min ---- */
.woo-sil7en-post-card__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.35rem 0.85rem;
	margin-block-start: auto;
	padding-block-start: 0.35rem;
	font-family: var(--wp--preset--font-family--sans, sans-serif);
	font-size: var(--wp--preset--font-size--xs, 0.8125rem);
	color: var(--wp--preset--color--muted, #6f6b64);
}

.woo-sil7en-post-card__meta-item {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	white-space: nowrap;
}

.woo-sil7en-post-card__meta-icon {
	width: 0.95em;
	height: 0.95em;
	flex: none;
	opacity: 0.8;
}

.woo-sil7en-post-card__date {
	font-variant-numeric: tabular-nums;
}

.woo-sil7en-post-card__author-link {
	color: inherit;
	text-decoration: none;
	transition: color var(--wp--custom--motion--duration--fast, 150ms) ease;
}

.woo-sil7en-post-card__author-link:hover,
.woo-sil7en-post-card__author-link:focus-visible {
	color: var(--wp--preset--color--primary, #531099);
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

/* ============================================================
   LEAD variant — the page-one focal article (mirrors product-card
   bento .is-featured): larger cover, display-scale title, 3-line dek.
   ============================================================ */
.woo-sil7en-post-card.is-lead .woo-sil7en-post-card__title {
	font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.25rem);
	line-height: 1.12;
}

.woo-sil7en-post-card.is-lead .woo-sil7en-post-card__dek {
	font-size: var(--wp--preset--font-size--md, 1.0625rem);
	-webkit-line-clamp: 3;
	max-width: 60ch;
}

.woo-sil7en-post-card.is-lead .woo-sil7en-post-card__chip {
	font-size: var(--wp--preset--font-size--sm, 0.9375rem);
	padding: 0.25rem 0.8rem;
}

.woo-sil7en-post-card.is-lead .woo-sil7en-post-card__meta {
	font-size: var(--wp--preset--font-size--sm, 0.875rem);
}

@media (prefers-reduced-motion: reduce) {
	.woo-sil7en-post-card__media,
	.woo-sil7en-post-card__media img,
	.woo-sil7en-post-card__chip {
		transition: none;
	}
	.woo-sil7en-post-card:hover .woo-sil7en-post-card__media,
	.woo-sil7en-post-card:hover .woo-sil7en-post-card__media img {
		transform: none;
	}
}
