/**
 * Shared reading scale
 *
 * Headings, navigation, labels and button text retain their component-specific
 * scale. This layer is only for the readable copy repeated across sections,
 * summaries and information cards.
 */
:root {
	--ms-font-size-body: 16px;
	--ms-font-size-section-copy: 16px;
	--ms-line-height-section-copy: 1.55;
}

#page #content p:not(.ms-single-post__content *),
#page #content li:not(.ms-single-post__content *),
#page #content .ms-section-copy,
#page #content [class*="section"][class*="desc"],
#page #content [class*="section"][class*="description"],
#page #content [class*="section"][class*="text"],
#page #content [class*="card"][class*="desc"],
#page #content [class*="card"][class*="description"],
#page #content [class*="card"][class*="text"],
#page #content [class*="feature"][class*="desc"],
#page #content [class*="feature"][class*="description"],
#page #content [class*="feature"][class*="text"],
#page #content [class*="content"][class*="summary"],
#page #content [class*="content"][class*="excerpt"],
#page #content [class*="intro"][class*="text"] {
	font-size: var(--ms-font-size-section-copy) !important;
	line-height: var(--ms-line-height-section-copy) !important;
}

/* The roadmap's final milestone has a longer label. Give every desktop
 * milestone the same wider reading area so it remains a balanced two-line
 * card at the shared 16px body scale. */
@media (min-width: 768px) {
	#page #content .ms-roadmap-card-box {
		padding-left: 6px !important;
		padding-right: 6px !important;
	}

	#page #content .ms-roadmap-card-text {
		font-size: var(--ms-font-size-section-copy) !important;
		letter-spacing: -0.01em;
		word-spacing: -0.35px;
	}
}

@media (max-width: 767px) {
	:root {
		--ms-font-size-body: 13px;
		--ms-font-size-section-copy: 13px;
		--ms-line-height-section-copy: 1.5;
	}
}
