.vrl-content-ruler {
	position: absolute;
	top: 0;
	left: var(--wp--style--root--padding-left, 0px);
	right: var(--wp--style--root--padding-right, 0px);
	height: 0;
	max-width: var(--wp--style--global--content-size, 800px);
	margin-inline: auto;
	visibility: hidden;
	pointer-events: none;
}

.vrl-align-content-wide > .vrl-content-ruler {
	max-width: var(--wp--style--global--wide-size, 1412px);
}

/* Cap the whole Row's content to the theme boundary before it splits into
   Sections, the same way a contained row does it — instead of insetting each
   Section's content separately, which only ever aligns one shared edge and
   leaves the other to drift with however wide that Section happens to be.
   The explicit width:100% matters specifically for a Flex-mode Row: .vrl-row__inner
   is then a flex item of .vrl-row's column flex container, and a flex item with
   cross-axis auto margins but no definite width doesn't stretch to fill - it
   shrink-to-fits its own content instead (per the flexbox spec, auto margins take
   priority over stretch alignment). Without width:100%, this rule silently only
   "worked" when a Row's own content happened to be wide enough on its own to reach
   the cap; sparser content (e.g. a short header/nav) rendered narrower instead of
   at the intended theme/wide boundary. Grid-mode Rows were never affected, since
   .vrl-row__inner there isn't a flex item of a column flex container. */
.vrl-align-content-theme > .vrl-row__inner {
	width: 100%;
	max-width: var(--wp--style--global--content-size, 800px);
	margin-left: auto;
	margin-right: auto;
}

.vrl-align-content-wide > .vrl-row__inner {
	width: 100%;
	max-width: var(--wp--style--global--wide-size, 1412px);
	margin-left: auto;
	margin-right: auto;
}

.vrl-section-content {
	box-sizing: border-box;
	min-width: 0;
	padding-left: var(--vrl-content-left, 0px);
	padding-right: var(--vrl-content-right, 0px);
}

.vrl-section-content > :first-child {
	margin-block-start: 0;
}

.vrl-section-content > :last-child {
	margin-block-end: 0;
}

.vrl-section-content > .wp-block-separator:not(.alignleft):not(.alignright):not(.aligncenter):not([style*="margin"]) {
	margin-left: var(--vrl-sep-left) !important;
	margin-right: var(--vrl-sep-right) !important;
}
