.snw-full-width-main {
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
	overflow-x: clip;
}

.snw-full-width-content {
	--snw-canvas: 1600px;
	--snw-gutter: clamp(24px, 4vw, 76px);
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	margin: 0;
	padding: clamp(48px, 8vw, 130px) var(--snw-gutter) clamp(64px, 8vw, 130px);
}

/* Title and normal top-level page blocks share the wide canvas. */
.snw-full-width-content > :where(:not(.alignfull)) {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--snw-canvas);
	margin-left: auto;
	margin-right: auto;
}

.snw-page-title {
	margin-top: 0;
	margin-bottom: clamp(32px, 4vw, 64px);
}

/* Let explicitly full-width blocks reach the viewport edges. */
.snw-full-width-content > .alignfull {
	box-sizing: border-box;
	width: calc(100% + (2 * var(--snw-gutter)));
	max-width: none;
	margin-left: calc(-1 * var(--snw-gutter));
	margin-right: calc(-1 * var(--snw-gutter));
}

.snw-full-width-content > .alignwide {
	max-width: var(--snw-canvas);
}

.snw-full-width-content img,
.snw-full-width-content video,
.snw-full-width-content iframe,
.snw-full-width-content canvas,
.snw-full-width-content svg {
	max-width: 100%;
}

.snw-full-width-content :where(pre, .wp-block-table) {
	max-width: 100%;
	overflow-x: auto;
}

@media (max-width: 782px) {
	.snw-full-width-content {
		--snw-gutter: 20px;
		padding-top: 48px;
		padding-bottom: 64px;
	}

	.snw-page-title {
		margin-bottom: 32px;
	}
}

.editor-styles-wrapper .snw-full-width-content {
	width: 100%;
	max-width: none;
}
