/* Default page content (template-parts/sections/content.php): the title and editor content
   of pages without a design of their own, in one readable column under the header.
   The section's top padding (.sec) already clears the header that overlaps it. */
/* The header is see-through for the dark homepage hero; over a white page it would turn gray,
   so pages with this section give it a solid background. Loads after header.css, so it wins. */
.px .top {
	background: var(--ink);
}

.px .s-content__wrap {
	max-width: 780px;
}

.px .s-content__title {
	font-size: 54px;
	line-height: 1.02;
	letter-spacing: -0.045em;
	font-weight: 800;
	margin-bottom: 32px;
}

.px .s-content__entry + .s-content__entry {
	margin-top: 48px;
}

.px .s-content__entry--summary + .s-content__entry--summary {
	padding-top: 40px;
	border-top: 1px solid #e6e6e6;
}

.px .s-content__entry-title {
	font-size: 30px;
	line-height: 1.15;
	letter-spacing: -0.03em;
	font-weight: 700;
	margin: 0 0 12px;
}

.px .s-content__entry-title a {
	text-decoration: none;
}

.px .s-content__entry-title a:hover {
	text-decoration: underline;
}

/* What the page editor produces: paragraphs, headings, lists, links, images, quotes. */
.px .s-content__body {
	font-size: 18px;
	line-height: 1.7;
	color: #333;
}

.px .s-content__body > * + * {
	margin-top: 1.1em;
}

.px .s-content__body h2 {
	font-size: 34px;
	line-height: 1.1;
	letter-spacing: -0.03em;
	margin-top: 1.6em;
}

.px .s-content__body h3 {
	font-size: 24px;
	line-height: 1.2;
	letter-spacing: -0.02em;
	margin-top: 1.4em;
}

.px .s-content__body ul {
	list-style: disc;
	padding-left: 1.4em;
}

.px .s-content__body ol {
	list-style: decimal;
	padding-left: 1.4em;
}

.px .s-content__body li + li {
	margin-top: 0.4em;
}

.px .s-content__body a {
	color: #111;
	text-decoration: underline;
	text-decoration-color: var(--acc);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

.px .s-content__body img {
	height: auto;
	border-radius: 14px;
}

.px .s-content__body blockquote {
	padding-left: 20px;
	border-left: 3px solid var(--acc);
	color: #555;
}

@media (max-width: 960px) {
	/* .sec padding shrinks to 84 px here, less than the 72 px header plus breathing room. */
	.px .s-content {
		padding-top: 120px;
	}

	.px .s-content__title {
		font-size: 38px;
	}
}

@media (max-width: 760px) {
	/* The phone header is 64 px tall and overlaps the top of the section. */
	.px .s-content {
		padding-top: 104px;
	}

	.px .s-content__title {
		font-size: 32px;
	}

	.px .s-content__body {
		font-size: 17px;
	}
}