/*
 * Article body: every element the editor can produce.
 * Selectors use :is(.entry-content, .editor-styles-wrapper) so the block
 * editor shows posts exactly as they appear on the site.
 */

:is(.entry-content, .editor-styles-wrapper) {
	color: var(--text-body);
	font-family: var(--font);
	font-size: 18.5px;
	line-height: 1.75;
}
.editor-styles-wrapper { background: var(--bg); }

:is(.entry-content, .editor-styles-wrapper) > * { margin-top: 0; margin-bottom: 24px; }
:is(.entry-content, .editor-styles-wrapper) > :last-child { margin-bottom: 0; }

:is(.entry-content, .editor-styles-wrapper) :is(strong, b) { color: var(--text); font-weight: 700; }

:is(.entry-content, .editor-styles-wrapper) a {
	color: var(--accent);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

:is(.entry-content, .editor-styles-wrapper) :is(h2, h3, h4, h5, h6) { color: var(--text); font-weight: 700; }
:is(.entry-content, .editor-styles-wrapper) h2 { margin: 44px 0 16px; font-size: 30px; line-height: 1.15; letter-spacing: -.03em; }
:is(.entry-content, .editor-styles-wrapper) h3 { margin: 36px 0 12px; font-size: 24px; line-height: 1.2; letter-spacing: -.025em; }
:is(.entry-content, .editor-styles-wrapper) :is(h4, h5, h6) {
	margin: 28px 0 10px;
	color: var(--accent);
	font-size: 12px;
	letter-spacing: .14em;
	line-height: 1.4;
	text-transform: uppercase;
}

:is(.entry-content, .editor-styles-wrapper) :is(ul, ol) { padding-left: 26px; line-height: 1.7; }
:is(.entry-content, .editor-styles-wrapper) li { margin-bottom: 8px; }
:is(.entry-content, .editor-styles-wrapper) li::marker { color: var(--accent); }
:is(.entry-content, .editor-styles-wrapper) li > :is(ul, ol) { margin-top: 8px; }

:is(.entry-content, .editor-styles-wrapper) blockquote,
:is(.entry-content, .editor-styles-wrapper) .wp-block-quote {
	margin: 36px 0;
	padding: 4px 0 4px 24px;
	border-left: 3px solid var(--accent);
	color: var(--text);
	font-size: 24px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: -.02em;
}
:is(.entry-content, .editor-styles-wrapper) blockquote p { margin: 0 0 12px; }
:is(.entry-content, .editor-styles-wrapper) blockquote p:last-of-type { margin-bottom: 0; }
:is(.entry-content, .editor-styles-wrapper) blockquote cite {
	display: block;
	margin-top: 12px;
	color: var(--text-muted);
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
	letter-spacing: 0;
}
:is(.entry-content, .editor-styles-wrapper) .wp-block-pullquote { border: 0; padding: 0; text-align: left; }

:is(.entry-content, .editor-styles-wrapper) :is(figure, .wp-block-image) { margin: 32px 0; }
:is(.entry-content, .editor-styles-wrapper) img { border-radius: var(--card-radius); }
:is(.entry-content, .editor-styles-wrapper) :is(figcaption, .wp-caption-text, .wp-element-caption) {
	margin-top: 10px;
	color: var(--text-muted);
	font-size: 13px;
	line-height: 1.5;
	text-align: left;
}
.entry-content .wp-caption { max-width: 100%; }

/* "No alignment" images at least 480px wide fill the column (see inc/Full_Width_Images.php). */
.entry-content img.is-full-width { width: 100%; height: auto; }
.entry-content .is-full-width.wp-caption,
.entry-content .is-full-width.wp-block-image { width: auto; }

:is(.entry-content, .editor-styles-wrapper) code,
:is(.entry-content, .editor-styles-wrapper) kbd {
	padding: 2px 6px;
	border: 1px solid var(--hairline);
	border-radius: 6px;
	background: var(--surface);
	font-family: var(--font-mono);
	font-size: .88em;
}
:is(.entry-content, .editor-styles-wrapper) pre {
	margin: 28px 0;
	padding: 18px 20px;
	overflow-x: auto;
	border: 1px solid var(--hairline);
	border-radius: 12px;
	background: var(--surface);
	color: var(--text-body);
	font-family: var(--font-mono);
	font-size: 14px;
	line-height: 1.6;
}
:is(.entry-content, .editor-styles-wrapper) pre code { padding: 0; border: 0; background: none; font-size: inherit; }

/* Tables scroll sideways on small screens instead of shrinking. */
:is(.entry-content, .editor-styles-wrapper) .wp-block-table { margin: 28px 0; overflow-x: auto; }
.entry-content > table { display: block; max-width: 100%; overflow-x: auto; }
:is(.entry-content, .editor-styles-wrapper) table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15.5px;
	line-height: 1.5;
}
:is(.entry-content, .editor-styles-wrapper) th {
	padding: 10px 14px;
	border: 0;
	border-bottom: 2px solid var(--text);
	color: var(--text-muted);
	font-size: 12px;
	letter-spacing: .12em;
	text-align: left;
	text-transform: uppercase;
	white-space: nowrap;
}
:is(.entry-content, .editor-styles-wrapper) td { padding: 12px 14px; border: 0; border-bottom: 1px solid var(--hairline); }
:is(.entry-content, .editor-styles-wrapper) .wp-block-table thead { border-bottom: 0; }

/* Video embeds: 16:9, rounded like images. */
:is(.entry-content, .editor-styles-wrapper) .wp-block-embed { margin: 32px 0; }
:is(.entry-content, .editor-styles-wrapper) .wp-block-embed__wrapper { overflow: hidden; border-radius: var(--card-radius); }
.entry-content > iframe,
.entry-content p > iframe,
.entry-content video {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	border: 0;
	border-radius: var(--card-radius);
}

:is(.entry-content, .editor-styles-wrapper) hr,
:is(.entry-content, .editor-styles-wrapper) .wp-block-separator {
	margin: 40px 0;
	border: 0;
	border-top: 1px solid var(--hairline);
	opacity: 1;
}

:is(.entry-content, .editor-styles-wrapper) .wp-block-button__link {
	padding: 12px 26px;
	border-radius: var(--radius-pill);
	background: var(--accent);
	color: var(--on-accent);
	font-weight: 700;
	text-decoration: none;
}

.entry-content .alignleft { float: left; margin: 6px 24px 16px 0; max-width: 50%; }
.entry-content .alignright { float: right; margin: 6px 0 16px 24px; max-width: 50%; }
.entry-content .aligncenter { margin-inline: auto; }
.entry-content::after { content: ""; display: table; clear: both; }

@media (hover: hover) {
	.entry-content a:hover { text-decoration-thickness: 2px; }
}