/*
 * Shared spacing helpers.
 * Theme.json remains the source of truth for spacing presets.
 * These utilities provide a small, explicit CSS layer for patterns and blocks.
 */
.section-spacing-vertical {
  margin-block: 0;
  padding-block: var(--wp--preset--spacing--block-vertical-padding);
}

.section-spacing-horizontal {
  padding-inline: var(--wp--preset--spacing--block-horizontal-padding);
}

/*
 * WordPress applies the global blockGap as margin-block-start to direct
 * children in flow layouts, including patterns inserted in post content.
 * Pattern outer sections must opt out so spacing only comes from the
 * section spacing utilities above.
 */
.wp-site-blocks > .wp-block-post-content,
.wp-block-post-content > .section-spacing-vertical,
.entry-content > .section-spacing-vertical,
.is-layout-flow > .section-spacing-vertical {
  margin-block-start: 0;
  margin-block-end: 0;
}

.flow-xs > * + * {
  margin-block-start: var(--wp--preset--spacing--12);
}

.flow-sm > * + * {
  margin-block-start: var(--wp--preset--spacing--16);
}

.flow-md > * + * {
  margin-block-start: var(--wp--preset--spacing--24);
}

.flow-lg > * + * {
  margin-block-start: var(--wp--preset--spacing--40);
}

.heading-hero > .wp-block-kolossal-heading-hero,
.heading-hero .flow-sm > .wp-block-kolossal-heading-hero,
.heading-hero .wp-block-kolossal-heading-hero {
  margin-block-start: 0;
}

.heading-hero > .wp-block-kolossal-heading-hero + .heading-hero__heading,
.heading-hero .flow-sm > .wp-block-kolossal-heading-hero + .heading-hero__heading {
  margin-block-start: var(--wp--custom--spacing--heading-hero-eyebrow-bottom);
}

.heading-hero .heading-hero__heading + .wp-block-kolossal-heading-hero {
  margin-block-start: var(--wp--custom--spacing--heading-hero-heading-bottom);
}