/**
 * Content Factory articles — layout helpers (typography via wp-block-heading in blog-page.css).
 */

/* ACF blocks use nested .section__row; reset service-page row spacing */
body.single-post .scfa-blog-rows > .section__row {
	padding-top: 0;
}

@media (min-width: 48rem) {
	body.single-post .scfa-blog-rows > .section__row {
		padding-top: 0;
	}
}

/* Images — same as wp-block-image */
body.single-post .scfa-blog-rows .blog-block-image {
	margin: 0;
	padding: 0;
	margin-top: 2.5em;
	font-size: 1em;
}

body.single-post .scfa-blog-rows .blog-block-image img {
	border-radius: 1em;
	width: 100%;
	height: auto;
	max-height: 31.75em;
	object-fit: cover;
	object-position: center;
}

body.single-post .scfa-blog-rows .section__row_flex .section__img img {
	border-radius: 1em;
	width: 100%;
	height: auto;
	max-height: 31.75em;
	object-fit: cover;
}

/* TL;DR block */
body.single-post .scfa-blog-rows > .section__row.blog-tldr {
	margin-top: 1.5em;
	padding: 1.25em 1.5em;
	border-radius: 1em;
	background: #f4f6fa;
}

body.single-post .scfa-blog-rows > .section__row.blog-tldr .section__text > h2.wp-block-heading {
	margin-top: 0;
}

body.single-post .scfa-blog-rows .blog-tldr__teaser p {
	margin-top: 0;
}

body.single-post .scfa-blog-rows .blog-tldr__details {
	overflow: hidden;
	max-height: 0;
	opacity: 0;
	transition: max-height 0.45s ease, opacity 0.35s ease, margin-top 0.35s ease;
}

body.single-post .scfa-blog-rows .blog-tldr__details.is-open {
	max-height: 3000px;
	opacity: 1;
	margin-top: 1em;
}

body.single-post .scfa-blog-rows .blog-tldr__toggle {
	display: inline-block;
	margin-top: 1em;
	cursor: pointer;
	text-align: left;
}

body.single-post .scfa-blog-rows .blog-tldr__toggle.snakeline {
	width: max-content;
}

/* Lists: use blog-page single-post styles, not legacy .blog-content ul>li */
body.single-post .scfa-blog-rows .section__text ul > li,
body.single-post .scfa-blog-rows .section__text ol > li {
	font-size: 18px;
	font-weight: 300;
	line-height: 160%;
	margin-bottom: 0;
}

body.single-post .scfa-blog-rows .section__text ul > li:after {
	display: none;
}

@media (max-width: 768px) {
	body.single-post .scfa-blog-rows .section__text ul > li,
	body.single-post .scfa-blog-rows .section__text ol > li {
		font-size: 16px;
	}
}