/*
 * PlayPop blog archive, single post, Gutenberg content typography, and
 * Rank Math FAQ block visual integration. Scoped to blog templates only
 * (home.php, single.php) — never loaded on WooCommerce/product pages.
 */

/* ---------- Archive ---------- */

.playpop-blog-archive {
	padding-block: var(--playpop-space-2xl) var(--playpop-space-2xl);
}

.playpop-blog-archive__header {
	margin-block-end: var(--playpop-space-2xl);
	text-align: center;
	max-width: 36rem;
	margin-inline: auto;
}

.playpop-blog-archive__eyebrow,
.playpop-single-post__eyebrow {
	color: var(--playpop-color-primary-dark);
	font-weight: 700;
	font-size: var(--playpop-font-size-small);
	letter-spacing: 0.02em;
	margin-block-end: var(--playpop-space-xs);
}

.playpop-blog-archive__header h1 {
	font-size: var(--playpop-font-size-h1);
	margin-block-end: var(--playpop-space-sm);
}

.playpop-blog-archive__header p {
	color: var(--playpop-color-text-secondary);
}

.playpop-blog-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--playpop-space-xl);
}

.playpop-blog-card {
	display: flex;
	flex-direction: column;
	background: var(--playpop-color-surface);
	border: 1px solid var(--playpop-color-border);
	border-radius: var(--playpop-radius-large);
	box-shadow: var(--playpop-shadow-card);
	overflow: hidden;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.playpop-blog-card:hover {
	box-shadow: var(--playpop-shadow-elevated);
	transform: translateY(-0.125rem);
}

.playpop-blog-card__media {
	display: block;
	aspect-ratio: 16 / 10;
	background: var(--playpop-green-soft);
}

.playpop-blog-card__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.playpop-blog-card__placeholder {
	display: block;
	width: 100%;
	height: 100%;
}

.playpop-blog-card__body {
	display: flex;
	flex-direction: column;
	gap: var(--playpop-space-xs);
	padding: var(--playpop-space-lg);
	flex: 1;
}

.playpop-blog-card__date {
	font-size: var(--playpop-font-size-caption);
	color: var(--playpop-color-text-secondary);
}

.playpop-blog-card__title {
	font-size: var(--playpop-font-size-h3);
	margin: 0;
	line-height: var(--playpop-line-height-heading);
}

.playpop-blog-card__title a {
	color: var(--playpop-color-text-primary);
	text-decoration: none;
}

.playpop-blog-card__excerpt {
	color: var(--playpop-color-text-secondary);
	flex: 1;
}

.playpop-blog-card__link {
	color: var(--playpop-color-primary-dark);
	font-weight: 700;
	text-decoration: none;
	margin-block-start: auto;
}

.playpop-blog-pagination {
	margin-block-start: var(--playpop-space-2xl);
	display: flex;
	justify-content: center;
	gap: var(--playpop-space-sm);
}

.playpop-blog-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.25rem;
	height: 2.25rem;
	padding-inline: var(--playpop-space-sm);
	border: 1px solid var(--playpop-color-border);
	border-radius: var(--playpop-radius-medium);
	text-decoration: none;
	color: var(--playpop-color-text-primary);
}

.playpop-blog-pagination .page-numbers.current {
	background: var(--playpop-color-primary);
	color: #fff;
	border-color: var(--playpop-color-primary);
}

.playpop-blog-empty {
	text-align: center;
	color: var(--playpop-color-text-secondary);
	padding-block: var(--playpop-space-2xl);
}

@media (max-width: 63.99rem) {
	.playpop-blog-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 47.99rem) {
	.playpop-blog-grid {
		grid-template-columns: 1fr;
	}
}

/* ---------- Single post ---------- */

.playpop-single-post {
	max-width: 44rem;
	margin-inline: auto;
	padding-block: var(--playpop-space-lg) var(--playpop-space-2xl);
}

/* Breadcrumb sits directly above the header; keep it quiet and small. */
.playpop-single-post > .playpop-breadcrumb {
	margin-block-end: var(--playpop-space-md);
	font-size: var(--playpop-font-size-caption);
	opacity: 0.85;
}

.playpop-single-post__header {
	margin-block: var(--playpop-space-lg) var(--playpop-space-xl);
	text-align: center;
}

.playpop-single-post__eyebrow {
	display: inline-block;
	color: var(--playpop-color-primary-dark);
	background: var(--playpop-green-soft);
	border-radius: var(--playpop-radius-pill);
	padding: 0.2rem 0.9rem;
	font-weight: 700;
	font-size: var(--playpop-font-size-caption);
	letter-spacing: 0.02em;
	margin-block-end: var(--playpop-space-md);
}

.playpop-single-post__header h1 {
	font-size: var(--playpop-font-size-h1);
	line-height: 1.25;
	font-weight: 800;
	letter-spacing: -0.01em;
	margin-block-end: var(--playpop-space-sm);
}

.playpop-single-post__date {
	display: inline-block;
	color: var(--playpop-color-text-secondary);
	font-size: var(--playpop-font-size-caption);
	margin-block-start: var(--playpop-space-xs);
}

.playpop-single-post__thumbnail {
	margin-block-end: var(--playpop-space-xl);
	border-radius: var(--playpop-radius-large);
	overflow: hidden;
	box-shadow: var(--playpop-shadow-elevated);
	border: 1px solid rgb(23 34 28 / 5%);
}

.playpop-single-post__thumbnail img {
	width: 100%;
	height: auto;
	max-height: 26rem;
	object-fit: cover;
	display: block;
}

@media (max-width: 47.99rem) {
	.playpop-single-post__header {
		margin-block: var(--playpop-space-md) var(--playpop-space-lg);
	}

	.playpop-single-post__thumbnail {
		border-radius: var(--playpop-radius-medium);
	}

	.playpop-single-post__thumbnail img {
		max-height: 14rem;
	}
}

/* ---------- Gutenberg content typography ---------- */

.playpop-single-post__content {
	font-size: var(--playpop-font-size-body);
	line-height: var(--playpop-line-height-body);
	color: var(--playpop-color-text-primary);
}

.playpop-single-post__content > * {
	margin-block: var(--playpop-space-lg);
}

.playpop-single-post__content h2,
.playpop-single-post__content h3,
.playpop-single-post__content h4 {
	line-height: var(--playpop-line-height-heading);
	margin-block: var(--playpop-space-2xl) var(--playpop-space-md);
	font-weight: 700;
}

.playpop-single-post__content h2 {
	font-size: var(--playpop-font-size-h2);
}

.playpop-single-post__content h3 {
	font-size: var(--playpop-font-size-h3);
}

.playpop-single-post__content h4 {
	font-size: 1.125rem;
}

.playpop-single-post__content p {
	margin-block: var(--playpop-space-md);
}

.playpop-single-post__content ul,
.playpop-single-post__content ol {
	padding-inline-start: var(--playpop-space-xl);
}

.playpop-single-post__content li {
	margin-block-end: var(--playpop-space-xs);
}

.playpop-single-post__content li::marker {
	color: var(--playpop-color-primary-dark);
}

/* Images / figures / captions / alignment */

.playpop-single-post__content img {
	max-width: 100%;
	height: auto;
	display: block;
	border-radius: var(--playpop-radius-medium);
}

.playpop-single-post__content figure {
	max-width: 100%;
	margin-block: var(--playpop-space-xl);
}

.playpop-single-post__content figure.alignleft {
	float: inline-start;
	margin-inline-end: var(--playpop-space-lg);
	max-width: 50%;
}

.playpop-single-post__content figure.alignright {
	float: inline-end;
	margin-inline-start: var(--playpop-space-lg);
	max-width: 50%;
}

.playpop-single-post__content figure.aligncenter {
	margin-inline: auto;
	text-align: center;
}

.playpop-single-post__content figure.alignfull,
.playpop-single-post__content figure.alignwide {
	max-width: 100%;
}

.playpop-single-post__content figcaption {
	font-size: var(--playpop-font-size-caption);
	color: var(--playpop-color-text-secondary);
	text-align: center;
	margin-block-start: var(--playpop-space-xs);
}

/* Gallery */

.playpop-single-post__content .wp-block-gallery {
	display: flex;
	flex-wrap: wrap;
	gap: var(--playpop-space-md);
}

.playpop-single-post__content .wp-block-gallery figure {
	margin: 0;
	flex: 1 1 calc(33.333% - var(--playpop-space-md));
}

@media (max-width: 47.99rem) {
	.playpop-single-post__content .wp-block-gallery figure {
		flex: 1 1 calc(50% - var(--playpop-space-md));
	}
}

/* Video / iframe / embed — responsive, contained, no page overflow. */

.playpop-single-post__content video,
.playpop-single-post__content iframe {
	max-width: 100%;
	border-radius: var(--playpop-radius-medium);
}

.playpop-single-post__content .wp-block-embed__wrapper,
.playpop-single-post__content .wp-block-video {
	position: relative;
	overflow: hidden;
	border-radius: var(--playpop-radius-medium);
}

.playpop-single-post__content .wp-block-embed__wrapper {
	aspect-ratio: 16 / 9;
}

.playpop-single-post__content .wp-block-embed__wrapper iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

/* Blockquote */

.playpop-single-post__content blockquote {
	border-inline-start: 0.25rem solid var(--playpop-color-primary);
	padding-inline-start: var(--playpop-space-lg);
	color: var(--playpop-color-text-secondary);
	font-style: normal;
	font-size: 1.05em;
}

.playpop-single-post__content blockquote p:last-child {
	margin-block-end: 0;
}

/* Tables — RTL, zebra rows, mobile-safe horizontal scroll */

.playpop-single-post__content .wp-block-table {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.playpop-single-post__content table {
	width: 100%;
	border-collapse: collapse;
	direction: rtl;
	border-radius: var(--playpop-radius-medium);
	overflow: hidden;
}

.playpop-single-post__content table th,
.playpop-single-post__content table td {
	border: 1px solid var(--playpop-color-border);
	padding: var(--playpop-space-sm) var(--playpop-space-md);
	text-align: right;
	white-space: normal;
}

.playpop-single-post__content table th {
	background: var(--playpop-green-soft);
	font-weight: 700;
}

.playpop-single-post__content table tbody tr:nth-child(even) {
	background: color-mix(in srgb, var(--playpop-green-soft) 35%, transparent);
}

/* Links / buttons */

.playpop-single-post__content a {
	color: var(--playpop-color-primary-dark);
	text-decoration: underline;
	text-decoration-thickness: 0.06em;
}

.playpop-single-post__content .wp-block-button__link,
.playpop-single-post__content .wp-block-file__button {
	display: inline-block;
	background: var(--playpop-color-primary);
	color: #fff;
	border-radius: var(--playpop-radius-pill);
	padding: 0.6rem 1.5rem;
	text-decoration: none;
	font-weight: 700;
}

.playpop-single-post__content .wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent;
	color: var(--playpop-color-primary-dark);
	border: 1.5px solid var(--playpop-color-primary);
}

/* Separator */

.playpop-single-post__content hr {
	border: none;
	border-top: 1px solid var(--playpop-color-border);
	margin-block: var(--playpop-space-2xl);
}

/* Code */

.playpop-single-post__content code {
	background: var(--playpop-background);
	border: 1px solid var(--playpop-color-border);
	border-radius: var(--playpop-radius-small);
	padding: 0.1em 0.4em;
	font-size: 0.9em;
	direction: ltr;
	unicode-bidi: embed;
}

.playpop-single-post__content pre {
	background: var(--playpop-text);
	color: #eef4ee;
	border-radius: var(--playpop-radius-medium);
	padding: var(--playpop-space-md);
	overflow-x: auto;
	direction: ltr;
	text-align: left;
}

.playpop-single-post__content pre code {
	background: none;
	border: none;
	padding: 0;
	color: inherit;
}

/* ---------- Rank Math Gutenberg FAQ block accordion ---------- */
/* CSS-first integration on top of Rank Math's own generated markup —
 * `.rank-math-block > .rank-math-list > .rank-math-list-item`. No schema
 * or plugin file is touched; a small scoped JS toggles the `is-open`
 * class (see assets/js/rank-math-faq.js) because the source markup has
 * no native interactive element (no <details>/<summary>) to hook into. */

.playpop-single-post__content .rank-math-block {
	background: var(--playpop-color-surface);
	border: 1px solid var(--playpop-color-border);
	border-radius: var(--playpop-radius-large);
	padding: var(--playpop-space-sm);
	box-shadow: var(--playpop-shadow-card);
}

.playpop-single-post__content .rank-math-list {
	display: flex;
	flex-direction: column;
	gap: var(--playpop-space-sm);
}

.playpop-single-post__content .rank-math-list-item {
	border: 1px solid var(--playpop-color-border);
	border-radius: var(--playpop-radius-medium);
	background: var(--playpop-background);
	overflow: hidden;
}

.playpop-single-post__content .rank-math-question {
	margin: 0;
	padding: var(--playpop-space-md) var(--playpop-space-lg);
	font-weight: 700;
	font-size: 1rem;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--playpop-space-md);
	user-select: none;
}

.playpop-single-post__content .rank-math-question::after {
	content: "+";
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.5rem;
	height: 1.5rem;
	border-radius: 50%;
	background: var(--playpop-green-soft);
	color: var(--playpop-color-primary-dark);
	font-size: 1.1rem;
	line-height: 1;
	transition: transform 0.2s ease;
}

.playpop-single-post__content .rank-math-list-item.is-open .rank-math-question::after {
	content: "\2212";
	transform: rotate(180deg);
}

.playpop-single-post__content .rank-math-answer {
	color: var(--playpop-color-text-secondary);
	padding-inline: var(--playpop-space-lg);
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.25s ease, padding-block 0.25s ease;
	padding-block: 0;
}

.playpop-single-post__content .rank-math-list-item.is-open .rank-math-answer {
	padding-block: 0 var(--playpop-space-md);
	max-height: 60rem;
}

.playpop-single-post__content .rank-math-answer p:first-child {
	margin-block-start: 0;
}

.playpop-single-post__content .rank-math-answer p:last-child {
	margin-block-end: 0;
}

.playpop-single-post__content .rank-math-question:focus-visible {
	outline: 2px solid var(--playpop-color-focus);
	outline-offset: -2px;
}

/* ---------- Adjacent post navigation ---------- */

.playpop-single-post__adjacent {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--playpop-space-md);
	margin-block: var(--playpop-space-2xl);
}

.playpop-single-post__adjacent-link {
	display: flex;
	flex-direction: column;
	gap: var(--playpop-space-xs);
	padding: var(--playpop-space-md);
	border: 1px solid var(--playpop-color-border);
	border-radius: var(--playpop-radius-medium);
	text-decoration: none;
	color: var(--playpop-color-text-primary);
	transition: border-color 0.15s ease;
}

.playpop-single-post__adjacent-link:hover {
	border-color: var(--playpop-color-primary);
}

.playpop-single-post__adjacent-link--next {
	text-align: left;
}

.playpop-single-post__adjacent-label {
	font-size: var(--playpop-font-size-caption);
	color: var(--playpop-color-text-secondary);
}

.playpop-single-post__adjacent-title {
	font-weight: 700;
}

@media (max-width: 47.99rem) {
	.playpop-single-post__adjacent {
		grid-template-columns: 1fr;
	}
}

/* ---------- Comments ---------- */

.playpop-single-post__comments {
	margin-block-start: var(--playpop-space-2xl);
	background: var(--playpop-background);
	border-radius: var(--playpop-radius-large);
	padding: var(--playpop-space-lg);
}

.playpop-comments {
	margin-block-start: 0;
	padding-block-start: 0;
	border-top: none;
}

.playpop-comments__title {
	font-size: var(--playpop-font-size-h3);
	margin-block-end: var(--playpop-space-lg);
	font-weight: 800;
}

.playpop-comments__list,
.playpop-comments__list ul.children {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--playpop-space-md);
}

.playpop-comments__list ul.children {
	margin-inline-start: var(--playpop-space-xl);
	margin-block-start: var(--playpop-space-md);
	border-inline-start: 2px solid var(--playpop-color-border);
	padding-inline-start: var(--playpop-space-lg);
}

.playpop-comments__list .comment-body {
	background: var(--playpop-color-surface);
	border: 1px solid rgb(23 34 28 / 6%);
	border-radius: var(--playpop-radius-medium);
	padding: var(--playpop-space-md);
	box-shadow: var(--playpop-shadow-card);
}

.playpop-comments__list .comment-author .avatar {
	width: 2.25rem;
	height: 2.25rem;
	border-radius: 50%;
	vertical-align: middle;
	margin-inline-end: var(--playpop-space-sm);
}

.playpop-comments__list .comment-author .fn {
	font-weight: 700;
	font-style: normal;
}

.playpop-comments__list .comment-metadata {
	font-size: var(--playpop-font-size-caption);
	color: var(--playpop-color-text-secondary);
	margin-block: var(--playpop-space-xs);
}

.playpop-comments__list .comment-metadata a {
	color: inherit;
	text-decoration: none;
}

.playpop-comments__list .comment-content p {
	margin-block: var(--playpop-space-xs);
}

.playpop-comments__list .reply {
	margin-block-start: var(--playpop-space-sm);
}

.playpop-comments__list .comment-reply-link {
	font-size: var(--playpop-font-size-small);
	font-weight: 700;
	color: var(--playpop-color-primary-dark);
	text-decoration: none;
}

/* Comment form */

.playpop-comments #respond {
	margin-block-start: var(--playpop-space-xl);
	padding-block-start: var(--playpop-space-xl);
	border-top: 1px solid var(--playpop-color-border);
}

.playpop-comments .comment-reply-title {
	font-size: var(--playpop-font-size-h3);
	font-weight: 800;
	margin-block-end: var(--playpop-space-md);
}

.playpop-comment-form {
	margin-block-start: var(--playpop-space-md);
	display: flex;
	flex-direction: column;
	gap: var(--playpop-space-md);
	font-family: var(--playpop-font-family-base);
}

.playpop-comment-form label {
	display: block;
	margin-block-end: var(--playpop-space-xs);
	font-weight: 700;
}

.playpop-comment-form input[type="text"],
.playpop-comment-form input[type="email"],
.playpop-comment-form input[type="url"],
.playpop-comment-form textarea {
	width: 100%;
	height: 2.75rem;
	padding: 0.65rem var(--playpop-space-md);
	border: 1px solid var(--playpop-color-border);
	border-radius: var(--playpop-radius-medium);
	font-family: inherit;
	font-size: var(--playpop-font-size-body);
	color: var(--playpop-color-text-primary);
}

.playpop-comment-form textarea {
	height: auto;
	min-height: 8rem;
	resize: vertical;
}

.playpop-comment-form input:focus,
.playpop-comment-form textarea:focus {
	outline: 2px solid var(--playpop-color-focus);
	outline-offset: 1px;
	border-color: var(--playpop-color-focus);
}

.playpop-comment-form .form-submit input[type="submit"] {
	font-family: inherit;
	background: var(--playpop-color-primary);
	color: #fff;
	border: none;
	border-radius: var(--playpop-radius-pill);
	padding: 0.65rem 1.75rem;
	font-size: var(--playpop-font-size-body);
	font-weight: 700;
	cursor: pointer;
	transition: background 0.15s ease;
}

.playpop-comment-form .form-submit input[type="submit"]:hover {
	background: var(--playpop-color-primary-dark);
}

.playpop-comment-form .form-submit input[type="submit"]:focus-visible {
	outline: 2px solid var(--playpop-color-focus);
	outline-offset: 2px;
}

/* ---------- Single-post editorial polish ----------
 * Kept at the end so it can safely refine WordPress/Gutenberg defaults.
 * Every selector is isolated by the native `body.single-post` class.
 */

body.single-post .playpop-single-post {
	width: min(100%, 50rem);
	max-width: 50rem;
	padding-block: clamp(1.25rem, 3vw, 2rem) clamp(2.5rem, 5vw, 4rem);
}

body.single-post .playpop-single-post > .playpop-breadcrumb {
	margin-block-end: clamp(1rem, 2vw, 1.4rem);
	font-size: .82rem;
	line-height: 1.7;
	opacity: .78;
}

body.single-post .playpop-single-post__header {
	margin-block: 0 clamp(1.4rem, 3vw, 2.1rem);
	text-align: start;
}

body.single-post .playpop-single-post__eyebrow {
	margin: 0 0 .75rem;
	padding: .22rem .8rem;
	font-size: .78rem;
	font-weight: 750;
	letter-spacing: 0;
}

body.single-post .playpop-single-post__header h1 {
	max-width: 46rem;
	margin: 0;
	font-size: clamp(2rem, 4.2vw, 3.15rem);
	font-weight: 850;
	line-height: 1.35;
	letter-spacing: -.015em;
}

body.single-post .playpop-single-post__date {
	display: block;
	margin-block-start: .75rem;
	font-size: .84rem;
	line-height: 1.7;
}

body.single-post .playpop-single-post__thumbnail {
	margin-block: 0 clamp(1.75rem, 4vw, 2.75rem);
	overflow: hidden;
	border: 1px solid rgb(23 34 28 / 7%);
	border-radius: clamp(.875rem, 2vw, 1.1rem);
	box-shadow: 0 .75rem 2.1rem rgb(23 34 28 / 9%);
}

body.single-post .playpop-single-post__thumbnail img {
	display: block;
	width: 100%;
	height: auto;
	max-height: none;
	object-fit: contain;
}

body.single-post .playpop-single-post__content {
	min-width: 0;
	color: var(--playpop-color-text-primary);
	font-size: clamp(1rem, .25vw + .95rem, 1.075rem);
	line-height: 2;
	overflow-wrap: anywhere;
}

body.single-post .playpop-single-post__content > :first-child { margin-block-start: 0; }
body.single-post .playpop-single-post__content > :last-child { margin-block-end: 0; }

body.single-post .playpop-single-post__content p {
	margin-block: 0 1.25rem;
}

body.single-post .playpop-single-post__content :is(h2, h3, h4) {
	color: var(--playpop-color-text-primary);
	font-weight: 800;
	line-height: 1.55;
	text-wrap: balance;
}

body.single-post .playpop-single-post__content h2 {
	margin-block: clamp(2.6rem, 6vw, 3.75rem) .9rem;
	font-size: clamp(1.55rem, 3vw, 2rem);
}

body.single-post .playpop-single-post__content h2::before {
	content: "";
	display: inline-block;
	width: .28rem;
	height: .95em;
	margin-inline-end: .55rem;
	vertical-align: -.08em;
	background: var(--playpop-color-primary);
	border-radius: var(--playpop-radius-pill);
}

body.single-post .playpop-single-post__content h3 {
	margin-block: clamp(2rem, 4.5vw, 2.8rem) .75rem;
	font-size: clamp(1.3rem, 2.3vw, 1.6rem);
}

body.single-post .playpop-single-post__content h4 {
	margin-block: 1.75rem .65rem;
	font-size: clamp(1.1rem, 1.8vw, 1.25rem);
}

body.single-post .playpop-single-post__content :is(ul, ol) {
	margin-block: 1.1rem 1.5rem;
	padding-inline-start: 1.6rem;
}

body.single-post .playpop-single-post__content li {
	margin-block-end: .55rem;
	padding-inline-start: .25rem;
}

body.single-post .playpop-single-post__content li::marker {
	color: var(--playpop-color-primary-dark);
	font-weight: 800;
}

body.single-post .playpop-single-post__content figure {
	max-width: 100%;
	margin-block: clamp(1.6rem, 4vw, 2.4rem);
}

body.single-post .playpop-single-post__content img {
	max-width: 100%;
	height: auto;
	border-radius: clamp(.65rem, 1.5vw, .9rem);
}

body.single-post .playpop-single-post__content figcaption,
body.single-post .playpop-single-post__content .wp-element-caption {
	margin-block-start: .55rem;
	color: var(--playpop-color-text-secondary);
	font-size: .85rem;
	line-height: 1.75;
	text-align: center;
}

body.single-post .playpop-single-post__content .wp-block-gallery {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: .8rem;
}

body.single-post .playpop-single-post__content .wp-block-gallery figure {
	width: 100% !important;
	margin: 0;
}

body.single-post .playpop-single-post__content .wp-block-gallery :is(img, figure.wp-block-image img) {
	width: 100%;
	height: auto !important;
	aspect-ratio: auto !important;
	object-fit: contain !important;
}

body.single-post .playpop-single-post__content blockquote {
	margin-block: 2rem;
	padding: 1rem 1.25rem;
	color: var(--playpop-color-text-primary);
	background: color-mix(in srgb, var(--playpop-green-soft) 58%, #fff);
	border: 0;
	border-inline-start: .25rem solid var(--playpop-color-primary);
	border-radius: var(--playpop-radius-medium);
}

/* Both Gutenberg-wrapped and raw HTML tables remain inside the text column. */
body.single-post .playpop-single-post__content .wp-block-table,
body.single-post .playpop-single-post__content > table {
	display: block;
	width: 100%;
	max-width: 100%;
	margin-block: 2rem;
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	-webkit-overflow-scrolling: touch;
	border: 1px solid var(--playpop-color-border);
	border-radius: var(--playpop-radius-medium);
	scrollbar-width: thin;
}

body.single-post .playpop-single-post__content .wp-block-table table { margin: 0; border: 0; }

body.single-post .playpop-single-post__content table {
	width: 100%;
	min-width: 38rem;
	font-size: .96rem;
	line-height: 1.75;
	border-collapse: collapse;
	direction: rtl;
}

body.single-post .playpop-single-post__content > table {
	min-width: 0;
}

body.single-post .playpop-single-post__content > table :is(th, td) {
	min-width: 8.5rem;
	white-space: nowrap;
}

body.single-post .playpop-single-post__content table :is(th, td) {
	padding: .8rem .9rem;
	text-align: start;
	vertical-align: middle;
	white-space: normal;
	border: 1px solid var(--playpop-color-border);
}

body.single-post .playpop-single-post__content table th {
	color: var(--playpop-color-text-primary);
	background: color-mix(in srgb, var(--playpop-green-soft) 72%, #fff);
	font-weight: 750;
}

body.single-post .playpop-single-post__content table tbody tr:nth-child(even) {
	background: color-mix(in srgb, var(--playpop-green-soft) 24%, #fff);
}

body.single-post .playpop-single-post__content a:not(.wp-block-button__link):not(.wp-block-file__button) {
	color: var(--playpop-color-primary-dark);
	text-decoration-color: rgb(46 125 50 / 32%);
	text-decoration-thickness: .07em;
	text-underline-offset: .18em;
}

body.single-post .playpop-single-post__content a:not(.wp-block-button__link):not(.wp-block-file__button):hover {
	text-decoration-color: currentColor;
}

body.single-post .playpop-single-post__content a:focus-visible {
	outline: 2px solid var(--playpop-color-focus);
	outline-offset: .2rem;
	border-radius: .2rem;
}

body.single-post .playpop-single-post__content :is(.wp-block-button__link, .wp-block-file__button) {
	padding: .65rem 1.35rem;
	font-family: inherit;
	font-weight: 750;
	background: var(--playpop-color-primary);
	border-radius: var(--playpop-radius-medium);
	transition: background 150ms ease, transform 150ms ease;
}

body.single-post .playpop-single-post__content :is(.wp-block-button__link, .wp-block-file__button):hover {
	color: #fff;
	background: var(--playpop-color-primary-dark);
	transform: translateY(-1px);
}

body.single-post .playpop-single-post__content :is(video, iframe) {
	display: block;
	width: 100%;
	max-width: 100%;
	border: 0;
	border-radius: var(--playpop-radius-medium);
}

body.single-post .playpop-single-post__content video { height: auto; }
body.single-post .playpop-single-post__content > iframe { height: auto; aspect-ratio: 16 / 9; margin-block: 2rem; }

body.single-post .playpop-single-post__content :is(.wp-block-embed, .wp-block-video) {
	width: 100%;
	max-width: 100%;
	margin-block: 2rem;
	overflow: hidden;
	border-radius: var(--playpop-radius-medium);
}

body.single-post .playpop-single-post__content .wp-block-embed__wrapper {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
}

body.single-post .playpop-single-post__content .wp-block-embed__wrapper iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

body.single-post .playpop-single-post__content .rank-math-block {
	margin-block: clamp(2.25rem, 5vw, 3.25rem);
	padding: .6rem;
	background: color-mix(in srgb, var(--playpop-green-soft) 35%, #fff);
	border: 1px solid var(--playpop-color-border);
	border-radius: var(--playpop-radius-large);
	box-shadow: 0 .5rem 1.5rem rgb(23 34 28 / 5%);
}

body.single-post .playpop-single-post__content .rank-math-list { gap: .6rem; }
body.single-post .playpop-single-post__content .rank-math-list-item { background: #fff; }

body.single-post .playpop-single-post__content .rank-math-question {
	min-height: 3.5rem;
	padding: .85rem 1rem;
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.75;
}

body.single-post .playpop-single-post__content .rank-math-question::after {
	width: 1.75rem;
	height: 1.75rem;
	font-size: 1.2rem;
	transition: transform 180ms ease, background 180ms ease;
}

body.single-post .playpop-single-post__content .rank-math-list-item.is-open .rank-math-question::after {
	background: var(--playpop-color-primary);
	color: #fff;
}

body.single-post .playpop-single-post__content .rank-math-answer {
	padding-inline: 1rem 3.35rem;
	line-height: 1.95;
	transition: max-height 220ms ease, padding-block 220ms ease;
}

body.single-post .playpop-single-post__content .rank-math-list-item.is-open .rank-math-answer {
	padding-block: 0 .9rem;
}

body.single-post .playpop-single-post__content .rank-math-question:focus-visible {
	outline: 3px solid rgb(46 125 50 / 20%);
	outline-offset: -3px;
}

body.single-post .playpop-single-post__adjacent {
	margin-block: clamp(2.5rem, 6vw, 4rem);
}

body.single-post .playpop-single-post__comments {
	margin-block: clamp(2.75rem, 6vw, 4.25rem) 0;
	padding: clamp(1rem, 3vw, 1.75rem);
	background: color-mix(in srgb, var(--playpop-green-soft) 28%, var(--playpop-background));
	border-block-start: 1px solid var(--playpop-color-border);
	border-radius: var(--playpop-radius-large);
}

body.single-post .playpop-comments__title,
body.single-post .playpop-comments .comment-reply-title {
	margin: 0 0 1.25rem;
	font-size: clamp(1.25rem, 2.4vw, 1.55rem);
	font-weight: 800;
}

body.single-post .playpop-comments__list,
body.single-post .playpop-comments__list ul.children { gap: .85rem; }

body.single-post .playpop-comments__list ul.children {
	margin-block-start: .85rem;
	margin-inline-start: 1.25rem;
	padding-inline-start: 1rem;
	border-inline-start: 2px solid color-mix(in srgb, var(--playpop-color-primary) 25%, transparent);
}

body.single-post .playpop-comments__list .comment-body {
	padding: 1rem;
	background: #fff;
	border: 1px solid var(--playpop-color-border);
	border-radius: var(--playpop-radius-medium);
	box-shadow: 0 .3rem 1rem rgb(23 34 28 / 4%);
}

body.single-post .playpop-comments__list .comment-author .avatar {
	width: 2.5rem;
	height: 2.5rem;
	object-fit: cover;
}

body.single-post .playpop-comments__list .comment-content { margin-block-start: .65rem; line-height: 1.9; }
body.single-post .playpop-comments__list .comment-reply-link { display: inline-flex; padding: .22rem .65rem; background: var(--playpop-green-soft); border-radius: var(--playpop-radius-pill); }

body.single-post .playpop-comments #respond {
	margin-block-start: 1.75rem;
	padding: 1.5rem;
	background: #fff;
	border: 1px solid var(--playpop-color-border);
	border-radius: var(--playpop-radius-large);
}

body.single-post .playpop-comment-form,
body.single-post .playpop-comment-form :is(input, textarea, button) { font-family: inherit; }

body.single-post .playpop-comment-form { gap: 1rem; margin-block-start: 0; }
body.single-post .playpop-comment-form p { margin: 0; }
body.single-post .playpop-comment-form label { margin-block-end: .45rem; font-size: .92rem; font-weight: 650; }

body.single-post .playpop-comment-form :is(input[type="text"], input[type="email"], input[type="url"], textarea) {
	width: 100%;
	min-height: 3rem;
	padding: .7rem .9rem;
	font-family: inherit;
	font-size: 1rem;
	background: #fff;
	border: 1px solid var(--playpop-color-border);
	border-radius: .7rem;
	transition: border-color 150ms ease, box-shadow 150ms ease;
}

body.single-post .playpop-comment-form textarea { min-height: 10rem; resize: vertical; }

body.single-post .playpop-comment-form :is(input, textarea):focus {
	border-color: var(--playpop-color-primary);
	box-shadow: 0 0 0 3px rgb(46 125 50 / 13%);
	outline: 2px solid transparent;
}

body.single-post .playpop-comment-form .form-submit input[type="submit"] {
	min-height: 2.85rem;
	padding: .65rem 1.4rem;
	font-family: inherit;
	background: var(--playpop-color-primary);
	border-radius: var(--playpop-radius-medium);
}

body.single-post .playpop-comment-form .form-submit input[type="submit"]:hover { background: var(--playpop-color-primary-dark); }

@media (max-width: 47.99rem) {
	body.single-post .playpop-single-post {
		width: 100%;
		padding-inline: clamp(1rem, 4.5vw, 1.25rem);
		padding-block-start: 1rem;
	}

	body.single-post .playpop-single-post__header h1 { font-size: clamp(1.75rem, 8vw, 2.25rem); }
	body.single-post .playpop-single-post__thumbnail { margin-block-end: 1.75rem; border-radius: .8rem; }
	body.single-post .playpop-single-post__content { font-size: 1rem; line-height: 1.95; }
	body.single-post .playpop-single-post__content .wp-block-gallery { grid-template-columns: minmax(0, 1fr); }
	body.single-post .playpop-single-post__content table { min-width: 34rem; }
	body.single-post .playpop-single-post__content .rank-math-question { align-items: flex-start; gap: .65rem; padding: .8rem; }
	body.single-post .playpop-single-post__content .rank-math-answer { padding-inline: .8rem 2.9rem; }
	body.single-post .playpop-single-post__adjacent { gap: .75rem; margin-block: 2.25rem; }
	body.single-post .playpop-single-post__comments { margin-inline: -.25rem; padding: .85rem; }
	body.single-post .playpop-comments__list ul.children { margin-inline-start: .45rem; padding-inline-start: .6rem; }
	body.single-post .playpop-comments #respond { padding: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
	body.single-post .playpop-single-post__content .rank-math-answer,
	body.single-post .playpop-single-post__content .rank-math-question::after,
	body.single-post .playpop-single-post__content :is(.wp-block-button__link, .wp-block-file__button) { transition-duration: .01ms; }
}