/* Anchored to the text block so the meta row always sits on solid red (AA), whatever the title length. */
.card-post__body::before {
	content: "";
	position: absolute;
	inset: -150px -40px -30px;
	z-index: -1;
	background: linear-gradient(transparent, var(--wp--preset--color--red) 150px);
	transition: top 0.15s ease-in-out;
}
/* Live only tints on hover: a short rise plus a light red wash keeps the photo visible. */
.card-post::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -10;
	background-color: var(--wp--preset--color--red);
	opacity: 0;
	transition: opacity 0.15s ease-in-out;
}
.card-post:is(:hover, :focus-visible)::after {
	opacity: 0.2;
}
.card-post:is(:hover, :focus-visible) .card-post__body::before {
	top: -190px;
}
.card-post:focus-visible {
	outline: 3px solid var(--wp--preset--color--yellow);
	outline-offset: 3px;
}

.navigation.pagination {
	margin-top: var(--wp--preset--spacing--section);
}
.pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	font-size: var(--wp--preset--font-size--body);
}
.pagination .page-numbers {
	padding: 0 10px;
	color: var(--wp--preset--color--black);
	text-decoration: none;
}
.pagination a.page-numbers:hover {
	text-decoration: underline;
}
.pagination .page-numbers.current {
	background-color: var(--wp--preset--color--black);
	color: var(--wp--preset--color--yellow);
}

/* Legacy post bodies had no `.content` class: tight paragraphs, body line-height. */
.single-post .site-content :is(p, li) {
	line-height: 1.7;
}
.single-post :is(.site-content, .wp-block-group) > :is(p, ul, ol) {
	margin-block: 0;
}
.single-post .site-content li {
	margin-top: 0;
}
/* Live: red post links (`.kiekkolaser-content a`); pages override it to black with `.content a`. */
.single-post .site-content :is(p, li, td, figcaption) a {
	color: var(--wp--preset--color--red);
}
.single-post .site-content > :first-child {
	margin-top: var(--wp--preset--spacing--section) !important;
}
.single-post .site-content > :last-child {
	margin-bottom: var(--wp--preset--spacing--section) !important;
}

/* Below 768 live post bodies and featured images take the full content width. */
@media (max-width: 767.98px) {
	.single-post .site-content {
		--prose-inset: 0px;
	}
}