.article {
	margin-inline: auto;
	max-width: 50rem;
	.figcaption {
		font-size: var(--f-size-s);
	}
}

.article__header, .article__body {

	display: grid;
		grid-template-columns: minmax(.8rem, 1fr) minmax(auto, 68ch) minmax(.8rem, 1fr);
		grid-template-areas:
		". content ."
		". wide ."
		"scenic scenic scenic";
		> * {
			grid-column: content;
		}

		> .wide {
			grid-column: wide;
		}

		> .scenic {
			grid-column: scenic;
		}
		> .article__featured-image {
			display: contents;
			.wp-post-image {
				grid-column: scenic;
			}
			.figcaption {
				grid-column: content;
			}
		}

	@media (min-width: 1000px) {

		grid-template-columns:  minmax(.8rem, 1fr)  4rem  minmax(auto, 68ch)  4rem  minmax(.8rem, 1fr) ;
		grid-template-areas: 
		". . content . ."
		". wide wide wide ."
		"scenic scenic scenic scenic scenic";

	}

}

.article__topic {
	color: var(--c-secondary);
	display: inline-block;
	font-size: var(--f-size-s);
	font-variant-caps: all-small-caps;
	letter-spacing: .01em;
}

.main-title {
	margin-block: .125lh 1lh;
}

.article__summary {
	font-size: var(--f-size-l);
	line-height: 1.4;
	margin-bottom: .75lh;
}

.article__meta {
	color: var(--c-secondary);
	font-size: var(--f-size-xs);
	margin-bottom: .75lh;
	text-align: right;
}

.article__body {

	margin-top: .75lh;

	.has-text-align-left { text-align: left; }
	.has-text-align-center { text-align: center; }
	.has-text-align-right { text-align: right; }

	> *:not(:last-child) {
		margin-bottom: .75lh;
	}

	> .paragraph,
	> .list {
		font-family: "serif-font", serif;
		font-size: var(--f-size-m);
		font-variant-numeric: oldstyle-nums;
		hyphens: auto;
		-webkit-hyphenate-limit-before: 3;
		-webkit-hyphenate-limit-after: 3;
		hyphenate-limit-chars: 8 3 3;
	}

/*	.heading,
	.subheading {
		color: var(--c-prominent);
		font-size: var(--f-size-xl);
		font-weight: var(--f-weight-xb);
		line-height: 1.2;
		margin-block: .75lh .375lh;
		text-wrap: balance;
	}

	.subheading {
		font-size: var(--f-size-l);
		margin-block: .5lh .25lh;
	}*/

	.list {
		counter-reset: item;
	}

	.list	.entry {
		display: block;
	}

	.list	.entry:not(:last-child) {
		margin-bottom: .25lh;
	}

	.list	.entry:before {
		color: var(--c-accent);
		display: inline-block;
		font-family: "sans-font", sans-serif;
		font-variant-numeric: tabular-nums;
		font-weight: var(--f-weight-mb);
		line-height: 1lh;
		min-width: 1lh;
	}

	.list	.entry > .list {
		margin-top: .25lh;
	}

	.list.ordered .entry {
		counter-increment: item;
	}

	.list.ordered .entry:before {
		content: counter(item);
	}

	.list.ordered .ordered .entry:before {
		content: counters(item, ".", decimal);
		min-width: 1.5lh;
	}

	.list.unordered > .entry:before {
		content: "•";	/* › » → ‣ */
	}

	.list.unordered .unordered > .entry:before {
		content: "-";
	}

	@media (min-width: 1000px) { /* changing lists outside of body */

		.list .entry:before {
			margin-inline: -1.5lh .5lh;
			text-align: right;
		}

		.list	.list .entry {
			margin-left: .7lh;
		}

		.list.ordered .ordered .entry {
			margin-left: 1.5lh;
		}

		.list.ordered	.ordered .entry:before {
			margin-inline: -1.5lh 0;
			text-align: left;
		}

	}

}

.wp-post-image {
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.wp-block-table {

	overflow: auto hidden;
	scrollbar-width: none;

	table {
		border-top: 1px solid var(--c-secondary);
		font-variant-numeric: tabular-nums;
		line-height: 1.3;
		width: 100%;
	}	

	thead {
		font-weight: var(--f-weight-bd);
	}

	th, td {
		background-color: var(--c-canvas);
		padding-top: .5em;
		padding-bottom: .5em;
	}

	th:not(:last-child), td:not(:last-child) {
		padding-right: .75em;
	}

	tr {
		border-bottom: 1px solid var(--c-secondary);
	}

	tr > :first-child, .figcaption {
		position: sticky;
		left: 0;
		z-index: 1;
	}

	::-webkit-scrollbar {
		display: none;
	}

}

.wp-block-media-text {
	background: var(--c-canvas-subtle);
	font-size: var(--f-size-s);
	grid-column: scenic;
	padding-block: .75lh;
	padding-inline: .8rem;
	.figure {
		margin-top: .25lh;
	}
	@media (min-width: 600px) {
		display: grid;
		gap: .75lh;
		grid-column: content;
		.wp-block-media-text__media [class^="wp-image"] {
			aspect-ratio: 1 / 1;
			object-fit: cover;
		}
	}
}
