, so their own inner container is the only constraint. But on RESOURCE / DETAIL pages the Page Builder sections are nested one level deeper — inside the page template's OWN

— which re-applies the container and re-clips the background. Rather than chase every nesting depth, break each Page Builder section out to the full viewport width directly. Both and .page carry overflow-x:hidden, so 100vw produces NO horizontal scrollbar. Content stays centered because every section re-applies its own inner .section__inner (container). Scope: LIVE site only. In Page Builder edit mode carries .kentico-page-builder; excluded so the editor canvas is untouched. ═══════════════════════════════════════════════════ */ /* The selector matches only the

wrappers slotted inside a blue-composition (i.e. Page Builder sections). Plain controller-page

s and the outer _Layout wrapper are NOT inside a [slot="content"], so they keep their normal container width. */ body:not(.kentico-page-builder) main [slot="content"] > section { /* Full-bleed: span the full viewport regardless of nesting depth. */ width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); /* Contain the section's own vertical margins (a `padded-flush-bottom` block's trailing heading margin would otherwise escape the section, leaving the background short and a white strip before the next section). flow-root makes the background cover the full content height and lets neighbouring section backgrounds meet — matching K13. */ display: flow-root; } /* ── Only the OUTERMOST composition section may full-bleed ──────────── The full-bleed rule above matches ANY [slot="content"] > section, but compositions nest: a top-level section can contain a grid whose columns (.g__c) each wrap their content in their OWN blue-composition (slot="content" > section), and the location hero wraps its CTAs the same way. Those INNER sections must stay inside their column/hero — if they full-bleed to 100vw they overlap into a single band (e.g. the "Learn more…" 3-column media blocks collapse onto each other; the hero CTAs stretch across the hero image). K13 has no such override, so nested content keeps its normal width. Reset the two nested cases: 1. a composition section nested inside another composition section (grid-column media blocks, and any composition-in-composition); 2. a composition section inside .hero (hero CTAs — these sit at the top composition level, so case 1 alone does not catch them); 3. a composition section inside a GRID COLUMN (.g__c). Case 1 only catches a composition nested in another *composition* section, but the two-column page templates (ResourceDetail DisplayStyle "2", LocationDetails) put the grid in the RAZOR TEMPLATE — the columns are plain `

` inside the template's own

, with an EditableArea per column. The composition sections inside those columns have no composition-section ancestor, so the base rule blew each column to 100vw and the two columns stacked on top of each other — e.g. /methods-of-capturing-the-record, where the left copy/accordion column and the right download form overlapped. Nothing is lost by resetting: a column-scoped section is never the page-level background band the full-bleed rule exists for (verified on /locations/bronx-161st-street — all 7 such sections carry neither a background image nor a fill class). All selectors are more specific than the base rule and come later in the cascade, so they win. */ body:not(.kentico-page-builder) main [slot="content"] > section [slot="content"] > section, body:not(.kentico-page-builder) main .hero [slot="content"] > section, body:not(.kentico-page-builder) main .g__c [slot="content"] > section { width: auto; margin-left: 0; margin-right: 0; display: block; } /* ── Vertical breathing room for background bands (K13 parity) ──────── K13 gives sections that carry a background (image or fill color) clear top/bottom padding, so the heading isn't tight against the band edge. The content blocks alone (composition--padded-sm = 2rem, and padded-flush-* which zeroes one side) leave the band too tight in XbyK. Add padding on the background element itself: • inline background on the

→ pad the

• fill color on the blue-composition → pad the blue-composition (its ::before background box grows with the padding) Tune the 2rem value to taste; it stacks on top of the inner block padding. */ /*body:not(.kentico-page-builder) main [slot="content"] > section[style*="background"], body:not(.kentico-page-builder) main blue-composition[class*="composition--fill"] { padding-top: 0rem; padding-bottom: 0rem; }*/