/*
 * Blog index grid (templates/home.html) — same bordered-card idiom as the
 * Work grid (assets/css/portfolio.css), without a screenshot: two columns,
 * date/title/excerpt, whole card clickable via the stretched title link.
 *
 * Equal-height cards: rather than grid-auto-rows:1fr (which can size a track
 * smaller than its content and make cards overlap), each card reserves a fixed
 * slot for the title and excerpt, so every card is the same height by content.
 */

.jjd-blog-grid .wp-block-post-template {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 28px;
	list-style: none;
	margin: 0;
	padding: 0;
}

@media (max-width: 700px) {
	.jjd-blog-grid .wp-block-post-template {
		grid-template-columns: 1fr !important;
	}
}

.jjd-blog-grid .wp-block-post {
	position: relative;         /* anchor for the stretched title link */
	margin: 0;                  /* cancel WordPress's is-layout-flow sibling margin */
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 16px;
	padding: 28px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
.jjd-blog-grid .wp-block-post:hover {
	border-color: var(--wp--preset--color--field-border);
	box-shadow: 0 12px 28px rgba(15, 23, 42, 0.1);
	transform: translateY(-3px);
}
.jjd-blog-grid .wp-block-post:has(a:focus-visible) {
	outline: 2px solid var(--wp--preset--color--accent-blue);
	outline-offset: 2px;
}

.jjd-blog-grid .wp-block-post-date {
	font-size: 0.8125rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: var(--wp--preset--color--accent-cyan-text);
}

.jjd-blog-grid .wp-block-post-title {
	margin: 0;
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.35;
	color: var(--wp--preset--color--heading);
	min-height: calc(1.35em * 2);   /* reserve two lines so short titles don't shrink the card */
}
.jjd-blog-grid .wp-block-post-title a {
	color: inherit;
	text-decoration: none;
}
.jjd-blog-grid .wp-block-post-title a::after {
	content: "";
	position: absolute;
	inset: 0;
}
.jjd-blog-grid .wp-block-post:hover .wp-block-post-title a { color: var(--wp--preset--color--accent-blue); }
.jjd-blog-grid .wp-block-post-title a:focus { outline: none; }

.jjd-blog-grid .wp-block-post-excerpt { margin: 0; }
.jjd-blog-grid .wp-block-post-excerpt p {
	margin: 0;
	font-size: 0.9375rem;
	line-height: 1.6;
	color: var(--wp--preset--color--body-text);
	/* Fixed three-line slot: clamp long excerpts, reserve space for short ones. */
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	overflow: hidden;
	min-height: calc(1.6em * 3);
}
.jjd-blog-grid .wp-block-post-excerpt__more-text { display: none; }

@media (prefers-reduced-motion: reduce) {
	.jjd-blog-grid .wp-block-post { transition: none; }
	.jjd-blog-grid .wp-block-post:hover { transform: none; }
}