/* Shared foundation for hybrid block-authored topic pages.
 * Section and component variations live under src-site/. */

.nl-topic-page,
.editor-styles-wrapper {
	--nl-topic-accent: var(--nl-page-primary, var(--wp--preset--color--ember-tint, #bf7c61));
	--nl-topic-cream: var(--wp--preset--color--cream, var(--secondary-color, #fffaf1));
	--nl-topic-ink: var(--wp--preset--color--midnight, var(--midnight-color, #2c3a43));
}

.nl-topic-page {
	background: var(--nl-topic-cream);
	color: var(--nl-topic-ink);
	overflow: clip;
}

.nl-topic-page .wp-block-columns,
.nl-topic-page .wp-block-image {
	margin-block: 0;
}

.nl-topic-page .wp-block-image img {
	display: block;
	height: auto;
	width: 100%;
}

/* The highlight is a registered RichText format and must not depend on a
 * page-builder utility class being present on a parent block. */
.nl-topic-page .nl-accent,
.editor-styles-wrapper .nl-accent {
	display: inline;
	position: relative;
	z-index: 0;
}

.nl-topic-page .nl-accent::before,
.editor-styles-wrapper .nl-accent::before {
	background-color: var(--wp--preset--color--sunlight, var(--sunlight-color, #f5b23c));
	clip-path: polygon(1% 12%, 99% 0, 100% 90%, 2% 100%);
	content: "";
	height: 0.68em;
	left: -0.04em;
	position: absolute;
	right: -0.04em;
	top: 0.55em;
	transform: scaleX(1);
	width: auto;
	z-index: -1;
}