/*
 * Stories & News (Prompt 07, RMHN Stories.dc.html): Blocksy blog listing + single post, restyled.
 * Loaded on the posts page, the Stories/News/Updates archives and single posts.
 */

/* ---------------------------------------------------------------- listing: pills + featured */
.rmhn-pill-nav ul {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 24px;
	padding: 0;
	list-style: none;
}

.rmhn-pill-nav a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 20px;
	border: 1px solid var(--rmhn-border);
	border-radius: 999px;
	background: var(--rmhn-white);
	font-weight: 600;
	color: var(--rmhn-ink);
	text-decoration: none;
}

.rmhn-pill-nav a:hover {
	border-color: var(--rmhn-ink);
}

.rmhn-pill-nav a[aria-current="page"] {
	background: var(--rmhn-red);
	border-color: var(--rmhn-red);
	color: var(--rmhn-white);
}

.rmhn-feature--listing {
	margin-bottom: 24px;
}

@media (min-width: 690px) {
	.rmhn-pill-nav ul {
		margin-bottom: 40px;
	}

	.rmhn-feature--listing {
		margin-bottom: 48px;
	}
}

/* ---------------------------------------------------------------- listing: cards */
[data-archive] .entry-card.rmhn-entry--story,
[data-archive] .entry-card.rmhn-entry--news {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

[data-archive] .entry-card:is(.rmhn-entry--story, .rmhn-entry--news) > :not(.ct-media-container) {
	margin: 0;
}

/* News/Updates: Blocksy's boundless photo, flush to the card edges. */
[data-archive] .entry-card.rmhn-entry--news > .ct-media-container {
	margin-bottom: 8px;
}

/* Stories: 24px radius, photo inset 12px with its own radius. */
[data-archive] .entry-card.rmhn-entry--story {
	--card-inner-spacing: 12px;
	border-radius: 24px;
	padding-bottom: 24px;
}

[data-archive] .entry-card.rmhn-entry--story > .ct-media-container {
	width: 100%;
	margin: 0 0 8px;
	border-radius: 14px;
	overflow: hidden;
}

[data-archive] .entry-card.rmhn-entry--story > :not(.ct-media-container) {
	margin-inline: 12px;
}

/* Category tag: blush for Stories, sand for News/Updates. */
[data-archive] .entry-card :is(.entry-meta[data-id="meta_1"], .entry-meta:first-of-type) a {
	display: inline-flex;
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--rmhn-sand);
	font: 600 13px/1.3 var(--rmhn-font-body);
	color: var(--rmhn-ink);
	text-transform: none;
	letter-spacing: 0;
}

[data-archive] .entry-card.rmhn-entry--story :is(.entry-meta[data-id="meta_1"], .entry-meta:first-of-type) a {
	background: var(--rmhn-blush);
	color: var(--rmhn-red-hover);
}

[data-archive] .entry-card .entry-title {
	font-size: 22px;
	line-height: 1.25;
}

[data-archive] .entry-card .entry-excerpt {
	flex: 1;
	font-size: 17px;
	color: var(--rmhn-muted);
}

[data-archive] .entry-card .entry-meta[data-id="meta_2"] {
	font-size: 15px;
	color: var(--rmhn-muted);
	text-transform: none;
}

/* ---------------------------------------------------------------- pagination (numbered only) */
.ct-pagination[data-pagination="simple"] {
	gap: 10px;
}

.ct-pagination .page-numbers {
	min-width: 48px;
	min-height: 48px;
	border: 1px solid var(--rmhn-border);
	border-radius: 12px;
	background: var(--rmhn-white);
	font-weight: 600;
	color: var(--rmhn-ink);
}

.ct-pagination .page-numbers.current {
	background: var(--rmhn-red);
	border-color: var(--rmhn-red);
	color: var(--rmhn-white);
}

/* ---------------------------------------------------------------- single post */
.single-post .hero-section .entry-meta[data-id="meta_1"] a,
.single-post .hero-section .entry-meta:first-child a {
	display: inline-flex;
	padding: 4px 12px;
	border-radius: 999px;
	background: var(--rmhn-blush);
	font: 600 14px/1.3 var(--rmhn-font-body);
	color: var(--rmhn-red-hover);
	text-transform: none;
	letter-spacing: 0;
}

.single-post .hero-section .entry-meta {
	text-transform: none;
	font-size: 15px;
	color: var(--rmhn-muted);
}

.single-post .ct-featured-image img,
.single-post .ct-featured-image .ct-media-container {
	border-radius: var(--rmhn-radius-photo);
}

.single-post .entry-content {
	font-size: 18px;
}

@media (min-width: 1000px) {
	.single-post .entry-content {
		font-size: 19px;
	}
}

.single-post .entry-content img {
	border-radius: var(--rmhn-radius-photo);
}

.single-post .entry-content .wp-caption-text,
.single-post .entry-content figcaption {
	margin-top: 8px;
	font-size: 15px;
	color: var(--rmhn-muted);
}

/* Pull quote: 3px red rule and one faint loop (the page's single motif use). */
.single-post .entry-content blockquote {
	position: relative;
	margin: 40px 0;
	padding: 8px 0 8px 32px;
	border: 0;
	border-inline-start: 3px solid var(--rmhn-red);
	background: none;
	font: 600 22px/1.4 var(--rmhn-font-heading);
	color: var(--rmhn-ink);
}

.single-post .entry-content blockquote::after {
	content: "";
	position: absolute;
	top: -18px;
	right: 0;
	width: 84px;
	height: 28px;
	background: var(--rmhn-red);
	opacity: 0.12;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 40' fill='none' stroke='black' stroke-width='3'%3E%3Ccircle cx='40' cy='20' r='17'/%3E%3Ccircle cx='80' cy='20' r='17'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 40' fill='none' stroke='black' stroke-width='3'%3E%3Ccircle cx='40' cy='20' r='17'/%3E%3Ccircle cx='80' cy='20' r='17'/%3E%3C/svg%3E") center / contain no-repeat;
}

.single-post .entry-content blockquote p {
	margin: 0;
}

.single-post .entry-content blockquote p::before {
	content: "\201C";
}

.single-post .entry-content blockquote p::after {
	content: "\201D";
}

/* After the content: note, share, donate box. */
.rmhn-post-after {
	display: grid;
	gap: 24px;
	width: calc(100% - 2 * var(--rmhn-gutter));
	max-width: var(--theme-narrow-container-max-width, 680px);
	margin: 40px auto 0;
}

.rmhn-note--plain {
	display: block;
	padding: 16px 20px;
	font-size: 16px;
}

.rmhn-share {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 16px;
	padding-top: 24px;
	border-top: 1px solid var(--rmhn-border);
}

.rmhn-share__label {
	font-weight: 600;
}

.rmhn-share ul {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.rmhn-share a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border: 1px solid var(--rmhn-border);
	border-radius: 50%;
	color: var(--rmhn-ink);
}

.rmhn-share a:hover {
	border-color: var(--rmhn-ink);
}

.rmhn-post-donate h2 {
	margin: 0 0 8px;
	font-size: 22px;
}

.rmhn-post-donate p {
	margin: 0 0 20px;
	color: var(--rmhn-muted);
}

/* Blocksy related posts on sand. */
.single-post .ct-related-posts-container .ct-related-posts {
	--grid-columns-gap: 24px;
}

.single-post .ct-related-posts article {
	overflow: hidden;
	background: var(--rmhn-white);
	border-radius: var(--rmhn-radius-card);
}

.single-post .ct-related-posts .related-entry-title {
	padding: 0 20px 20px;
	font-size: 19px;
}

.single-post .ct-related-posts .entry-meta {
	padding: 16px 20px 8px;
}

.single-post .ct-related-posts .ct-module-title {
	font-size: 38px;
}

@media (max-width: 689.98px) {
	.single-post .ct-related-posts .ct-module-title {
		font-size: 26px;
	}
}
