/* ------------------------------------------------------------------ *\
	V3 single blog article (templates/single-article-v3.php).
	Only the bits the shared base.css article shell doesn't already cover:
	- the hero crop/radius for the featured image,
	- prose rhythm for the normalized post body (.article-body), since the body
	  is free-flowing post content rather than discrete builder .text-blocks.
	Loaded only on the single view (app_enqueue_v3_page('single')), so these
	selectors never reach the Carbon-builder article (/encore/).
\* ------------------------------------------------------------------ */

.main-content .image-block img {
	aspect-ratio: 673 / 379;
	object-fit: cover;
	border-radius: 8px;
}

/* Normalized post body — inherits .main-content h*/p typography from base.css,
   here we only set the vertical rhythm and the list/link/emphasis treatment. */
.main-content .article-body > *:first-child {
	margin-top: 0;
}

.main-content .article-body p {
	margin-bottom: 24px;
}

.main-content .article-body p:last-child {
	margin-bottom: 0;
}

.main-content .article-body h2,
.main-content .article-body h3 {
	margin-top: 56px;
}

.main-content .article-body ul,
.main-content .article-body ol {
	margin: 0 0 24px;
	padding-left: 1.4em;
}

.main-content .article-body li {
	color: var(--bva-black-pure);
	font-family: Geist;
	font-size: 18px;
	font-weight: 300;
	line-height: 132%;
	margin-bottom: 10px;
}

.main-content .article-body li::marker {
	color: var(--bva-canelle-400);
}

.main-content .article-body a {
	color: var(--bva-canelle-400);
	text-decoration: underline;
	text-underline-offset: 2px;
	overflow-wrap: anywhere; /* long source URLs must not overflow the column */
}

.main-content .article-body strong,
.main-content .article-body b {
	font-weight: 600;
	color: var(--bva-black);
}

.main-content .article-body em,
.main-content .article-body i {
	font-style: italic;
}

@media (max-width: 835px) {
	.main-content .article-body p {
		margin-bottom: 18px;
	}

	.main-content .article-body h2,
	.main-content .article-body h3 {
		margin-top: 40px;
	}
}

@media (max-width: 560px) {
	.main-content .article-body li {
		font-size: 15px;
		margin-bottom: 8px;
	}
}