/*
 * base/typography.css — element-level type rules that theme.json cannot set.
 *
 * theme.json already handles the global font family, size, line height, heading
 * styles and link colours. Only add rules here for things it has no field for:
 * balanced headings, list/table/quote details, first-child margin collapsing.
 */

/*
 * Eyebrow — the small uppercase label above a headline.
 *
 * Figma calls this "Typography/Eyebrow": 16px/16px, weight 700, +2px tracking,
 * uppercase, body sans. It is not a heading element, so theme.json has no
 * element slot for it; it is applied as a class to whatever tag the section
 * needs (usually a <p> above an h2).
 *
 * The +2px tracking is expressed as 0.125em so it scales if the size ever
 * changes — 2px at the 16px design size.
 */
.fcs-eyebrow {
	font-family: var( --wp--preset--font-family--body );
	font-size: var( --wp--preset--font-size--medium );
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.125em;
	text-transform: uppercase;
	margin-block: 0;
}

/* Keep headline line breaks tidy without hand-inserted <br>. */
h1,
h2,
h3 {
	text-wrap: balance;
}

p,
li {
	text-wrap: pretty;
}

/* Long words (URLs, German-length compounds) should not overflow a column. */
h1,
h2,
h3,
h4,
h5,
h6,
p {
	overflow-wrap: break-word;
}

/* Editor content lists — core sets no padding, which looks unindented. */
.wp-block-post-content :where( ul, ol ):not( [class*="wp-block-" ] ) {
	padding-inline-start: 1.5em;
}

blockquote {
	border-inline-start: 3px solid var( --wp--preset--color--accent );
	padding-inline-start: 1.25rem;
	font-style: italic;
}