/* prose.css — long-form body text for the legal pages.
   Scoped to .gnt-prose so bare h2/p/ul rules never leak into the built sections. */

.gnt-prose {
	max-width: 46rem;
	font-size: var(--text-body-lg);
	line-height: var(--text-body-lg-lh);
}

.gnt-prose > * + * { margin-top: var(--space-6); }

.gnt-prose h2 {
	margin-top: var(--space-12);
	font-size: var(--text-h3);
	line-height: var(--text-h3-lh);
	font-weight: var(--font-weight-semibold);
}

.gnt-prose h3 {
	margin-top: var(--space-8);
	font-size: 1.25rem;
	line-height: 1.75rem;
}

.gnt-prose > :first-child { margin-top: 0; }

.gnt-prose ul,
.gnt-prose ol { padding-left: var(--space-6); }

.gnt-prose li + li { margin-top: var(--space-2); }

.gnt-prose a { color: var(--color-text-body); }

/* --lead is one step up the existing type scale, for a block that has to carry a page
   rather than support it. --text-lead is the token the page heroes are already set in;
   no new size is introduced. The h3 has to move with it — .gnt-prose h3 is a flat
   1.25rem, which at a 1.25rem body would leave the subheading and the body identical. */
.gnt-prose--lead {
	font-size: var(--text-lead);
	line-height: var(--text-lead-lh);
}

.gnt-prose--lead h3 {
	font-size: var(--text-h3);
	line-height: var(--text-h3-lh);
}

/* Editorial note blocks. These mark text that needs a decision or a lawyer before
   launch — deliberately conspicuous, and they should not survive to production. */
.gnt-prose__note {
	padding: var(--space-5) var(--space-6);
	background-color: var(--color-state-notice-bg);
	border-left: 4px solid var(--color-state-notice);
	font-size: var(--text-body);
	line-height: var(--text-body-lh);
}

.gnt-prose__note strong { font-weight: var(--font-weight-medium); }

@media (max-width: 767px) {
	.gnt-prose h2 { font-size: 1.5rem; line-height: 2rem; }
}

/* In the builder a legal page is several .gnt-prose fields with editor notes between
   them, rather than one field with the notes baked in — those have to stay editor-only,
   see inc/editor-notes.php, because staging is publicly readable. Stacked fields and
   notes therefore need the same rhythm the > * + * rule above gives inside one field.
   Same token, so a note that IS a direct child of a field is unaffected. */
.gnt-prose + .gnt-prose,
.gnt-prose__note {
	margin-top: var(--space-6);
}