@layer reset {
    ve-content-area {
        display: contents;
    }

    ve-content-element:not(.ve-hidden) {
        display: block;
    }
}

.content-grid > ve-content-area > * {
    grid-column: content;
}

.content-grid > ve-content-area > .breakout {
    grid-column: breakout;
}

.content-grid > ve-content-area > .full-width {
    grid-column: full-width;
}
:where(.flow, .flow-relaxed, .flow-text-elements, .flow-text-elements-small)
    > ve-content-area
    > ve-content-element
    + ve-content-element,
:where(.flow, .flow-relaxed, .flow-text-elements, .flow-text-elements-small)
    > *
    + ve-content-area
    > ve-content-element:first-child {
    margin-block-start: var(--flow-space, var(--space-text-elements));
}

main > ve-content-area > ve-content-element + ve-content-element,
main > * + ve-content-area > ve-content-element:first-child {
    margin-block-start: var(--space-3xl);
}

.section-container > ve-content-area > ve-content-element + ve-content-element,
.section-container > * + ve-content-area > ve-content-element:first-child {
    margin-block-start: var(--space-2xl);
}