/* ============================================================
   Omega Design — Blog cards + fade & zoom scroll reveal
   The blog page and post archives (templates/home.html, index.html,
   category.html, archive.html), scoped to their .omega-post-cards
   Query Loop so other post lists (landing patterns, sidebars) are
   untouched. Loaded by includes/core/hooks.php; reveal logic in
   assets/js/blog-cards.js.
   ============================================================ */

/* ---- Grid ---- */
.omega-post-cards .wp-block-post-template {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 28px;
	list-style: none;
	margin: 0;
	padding: 0;
}

/* ---- Card ---- */
.omega-post-cards .wp-block-post {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--page-background);
	border-radius: 16px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	margin: 0;
	box-shadow: 0 2px 4px -2px var(--wp--preset--color--page-background);
	transition:
		opacity 0.6s ease,
		transform 0.6s cubic-bezier(0.2, 0.7, 0.3, 1),
		border-color 0.3s ease,
		box-shadow 0.3s ease;
}

/* Reveal start state - only once blog-cards.js is running (it adds
   .is-reveal-ready), so the cards never stay hidden without JS. */
.omega-post-cards.is-reveal-ready .wp-block-post {
	opacity: 0;
	transform: translateY(24px) scale(0.94);
	will-change: transform, opacity;
}

.omega-post-cards.is-reveal-ready .wp-block-post.is-revealed {
	opacity: 1;
	transform: translateY(0) scale(1);
}

.omega-post-cards .wp-block-post:hover,
.omega-post-cards.is-reveal-ready .wp-block-post.is-revealed:hover {
	background: var(--wp--preset--color--page-background);
	transform: translateY(-6px);
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 10px 20px -10px color-mix(in srgb, var(--wp--preset--color--primary) 47%, transparent);
}

/* ---- Featured image ---- */
.omega-post-cards .wp-block-post .wp-block-post-featured-image {
	margin: 0;
	overflow: hidden;
	aspect-ratio: 16 / 10;
}

.omega-post-cards .wp-block-post .wp-block-post-featured-image a {
	display: block;
	height: 100%;
}

.omega-post-cards .wp-block-post .wp-block-post-featured-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.omega-post-cards .wp-block-post:hover .wp-block-post-featured-image img {
	transform: scale(1.06);
}

/* ---- Text ---- */
.omega-post-cards .wp-block-post .wp-block-post-title {
	font-size: 1.15rem;
	line-height: 1.35;
	font-weight: 650;
	letter-spacing: -0.01em;
	margin: 20px 22px 0;
}

.omega-post-cards .wp-block-post .wp-block-post-title a {
	color: var(--wp--preset--color--heading);
	text-decoration: none;
	transition: color 0.2s ease;
}

.omega-post-cards .wp-block-post .wp-block-post-title a:hover {
	color: var(--wp--preset--color--heading);
}

.omega-post-cards .wp-block-post .wp-block-post-excerpt {
	flex: 1; /* pushes the date to the bottom on uneven cards */
	margin: 10px 22px 0;
}

.omega-post-cards .wp-block-post .wp-block-post-excerpt__excerpt {
	font-size: 0.9rem;
	line-height: 1.6;
	color: var(--wp--preset--color--body-text);
	margin: 0;
}

.omega-post-cards .wp-block-post .wp-block-post-date {
	margin: 16px 22px 22px;
	font-size: 0.8rem;
	color: var(--wp--preset--color--body-text);
}

.omega-post-cards .wp-block-query-pagination {
	margin-top: 32px;
}

/* ---- Phones: one column with a slightly smaller minimum ---- */
@media (max-width: 600px) {
	.omega-post-cards .wp-block-post-template {
		grid-template-columns: 1fr;
		gap: 20px;
	}
}

/* ---- Accessibility ---- */
@media (prefers-reduced-motion: reduce) {
	.omega-post-cards .wp-block-post,
	.omega-post-cards.is-reveal-ready .wp-block-post {
		opacity: 1 !important;
		transform: none !important;
		transition: border-color 0.3s ease, box-shadow 0.3s ease;
	}
}
