/**
 * Blog post — 2026 skin (patterns/single-post.php, templates/single.html).
 *
 * The hero follows the inner-page hero (.pw-page-hero): breadcrumbs, tags and
 * the title beside the featured image as a rounded card. The article sits in a
 * content card (white, deep navy in dark mode); "Keep reading" reuses the
 * search result cards (.pw-search-results). Loaded on single posts only.
 */

/* -------------------------------------------------------------------------
 * Hero
 * ---------------------------------------------------------------------- */
.pw-post-hero {
	margin-block-end: 0;

	& .wp-block-the-framework-breadcrumbs {
		color: var(--wp--preset--color--text-secondary);
		font-size: var(--wp--preset--font-size--small);
		font-weight: 600;
	}

	& .wp-block-post-title {
		margin: 0;
		color: var(--wp--preset--color--text-primary);
		font-weight: 800;
		line-height: 1.12;
		text-wrap: balance;

		@media (max-width: 781px) {
			font-size: var(--wp--preset--font-size--headline-3) !important;
		}
	}
}

.pw-post-hero__image {
	margin: 0;
	overflow: hidden;
	border: 1px solid light-dark(transparent, rgb(233 228 222 / 0.22));
	border-radius: var(--wp--custom--radius--xl);
	box-shadow: light-dark(0 18px 40px rgb(12 31 107 / 0.16), none);

	& img {
		display: block;
	}
}

/* No featured image: the title stands alone, as wide as the article. */
.pw-post-hero:not(:has(.pw-post-hero__image img)) {
	& > .pw-post-hero__media {
		display: none;
	}
}

/* Date · reading time */
.pw-post-meta {
	color: var(--wp--preset--color--text-secondary);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;

	& > * {
		margin: 0;
	}

	& > * + *::before {
		content: "·";
		margin-inline-end: var(--wp--preset--spacing--xs);
	}
}

/* -------------------------------------------------------------------------
 * Article card
 * ---------------------------------------------------------------------- */
/* As wide as page content (theme contentSize), like the sections on inner pages. */
.pw-post-article {
	box-sizing: border-box;

	@media (max-width: 781px) {
		padding: var(--wp--preset--spacing--xl) var(--wp--preset--spacing--lg) !important;
	}
}

.pw-post-article .wp-block-post-content {
	color: var(--wp--preset--color--text-secondary);
	font-size: var(--wp--preset--font-size--body-l);
	line-height: 1.65;

	@media (max-width: 781px) {
		font-size: 1.0625rem;
	}

	& > :first-child {
		margin-block-start: 0;
	}

	& > :last-child {
		margin-block-end: 0;
	}

	& :is(h2, h3, h4) {
		color: var(--wp--preset--color--text-primary);
		font-weight: 800;
		line-height: 1.2;
		scroll-margin-top: calc(var(--wp--custom--header--height) + var(--wp--preset--spacing--lg));
	}

	& h2 {
		margin-block: var(--wp--preset--spacing--xxl) var(--wp--preset--spacing--sm);
		font-size: var(--wp--preset--font-size--headline-4);
	}

	& h3 {
		margin-block: var(--wp--preset--spacing--xl) var(--wp--preset--spacing--xs);
		font-size: var(--wp--preset--font-size--headline-6);
	}

	& strong {
		color: var(--wp--preset--color--text-primary);
	}

	& a:not(.wp-element-button) {
		color: var(--wp--preset--color--brand-green-bold);
		font-weight: 600;
		text-underline-offset: 3px;
	}

	& :is(ul, ol):not([class*="is-style-"]) {
		padding-inline-start: 1.25em;

		& li + li {
			margin-block-start: 0.4em;
		}

		& li::marker {
			color: var(--wp--preset--color--brand-green-bold);
			font-weight: 800;
		}
	}

	& :is(.wp-block-image, figure.wp-block-embed) {
		margin-block: var(--wp--preset--spacing--xl);

		& img,
		& iframe {
			border-radius: var(--wp--custom--radius--lg);
		}

		& figcaption {
			color: var(--wp--preset--color--text-muted);
			font-size: var(--wp--preset--font-size--small);
			text-align: center;
		}
	}

	& .wp-block-quote {
		margin-inline: 0;
		padding: var(--wp--preset--spacing--md) var(--wp--preset--spacing--lg);
		border: 0;
		border-inline-start: 4px solid var(--wp--preset--color--brand-green);
		border-radius: 0 var(--wp--custom--radius--md) var(--wp--custom--radius--md) 0;
		background-color: var(--wp--preset--color--surface);
		color: var(--wp--preset--color--text-primary);
		font-weight: 600;
	}

	& hr.wp-block-separator {
		margin-block: var(--wp--preset--spacing--xxl);
		border-color: var(--wp--preset--color--border-subtle);
	}
}

/* -------------------------------------------------------------------------
 * Keep reading — hidden when there is no other post
 * ---------------------------------------------------------------------- */
.pw-related {
	& h2 {
		margin: 0;
		line-height: 1.12;
	}

	& .pw-arrow-link {
		margin: 0;
		font-weight: 700;
	}

	& .wp-block-post-title {
		margin: 0;
	}

	@media (max-width: 781px) {
		& h2 {
			font-size: var(--wp--preset--font-size--headline-4) !important;
		}
	}
}

.pw-related:not(:has(.wp-block-post)) {
	display: none;
}