/* Section Flow — native ACSS, restored 25 October 2026.
   Central location: Studio > Stylesheets > Section Flow.
   Standard Page's .bg-section-flow covers every page using that template.
   .etch-canvas-body gives the same preview while editing page content alone.
   Match named native treatments, including no-fill sections and single-section wrappers.
   Colours are never reassigned. Content-section spacing is unchanged.
   Conditional sections must be omitted from markup (showSection); display:none does not
   change CSS sibling order. data-section-flow="off" excludes both section boundaries.
   A section's ::before is reserved for the divider. Heroes retain their own decoration. */

  /* Page background / no fill */
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]):not(.bg--ultra-light, .bg--light, .bg--dark, .bg--ultra-dark, .surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary) + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]):not(.bg--ultra-light, .bg--light, .bg--dark, .bg--ultra-dark, .surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]):not(.bg--ultra-light, .bg--light, .bg--dark, .bg--ultra-dark, .surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]):not(.bg--ultra-light, .bg--light, .bg--dark, .bg--ultra-dark, .surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]):not(.bg--ultra-light, .bg--light, .bg--dark, .bg--ultra-dark, .surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary) + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]):not(.bg--ultra-light, .bg--light, .bg--dark, .bg--ultra-dark, .surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]):not(.bg--ultra-light, .bg--light, .bg--dark, .bg--ultra-dark, .surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]):not(.bg--ultra-light, .bg--light, .bg--dark, .bg--ultra-dark, .surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]):not(.bg--ultra-light, .bg--light, .bg--dark, .bg--ultra-dark, .surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]):not(.bg--ultra-light, .bg--light, .bg--dark, .bg--ultra-dark, .surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),

  /* bg--ultra-light */
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary) + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary) + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),

  /* bg--light */
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary) + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary) + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),

  /* bg--dark */
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary) + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary) + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),

  /* bg--ultra-dark */
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary) + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary) + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-dark:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary),

  /* surface-panel */
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-panel + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-panel,
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-panel:only-child) + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-panel,
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-panel + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-panel:only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-panel,
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-panel:only-child) + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-panel:only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-panel,

  /* surface-primary */
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-primary + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-primary,
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-primary:only-child) + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-primary,
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-primary + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-primary:only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-primary,
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-primary:only-child) + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-primary:only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-primary,

  /* surface-secondary */
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-secondary + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-secondary,
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-secondary:only-child) + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-secondary,
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-secondary + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-secondary:only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-secondary,
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-secondary:only-child) + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-secondary:only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-secondary,

  /* surface-tertiary */
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-tertiary + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-tertiary,
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-tertiary:only-child) + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-tertiary,
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-tertiary + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-tertiary:only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-tertiary,
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-tertiary:only-child) + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-tertiary:only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).surface-tertiary,

  /* bg-soft-primary */
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-primary + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-primary,
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-primary:only-child) + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-primary,
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-primary + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-primary:only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-primary,
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-primary:only-child) + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-primary:only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-primary,

  /* bg-soft-secondary */
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-secondary + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-secondary,
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-secondary:only-child) + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-secondary,
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-secondary + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-secondary:only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-secondary,
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-secondary:only-child) + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-secondary:only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-secondary,

  /* bg-soft-tertiary */
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-tertiary + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-tertiary,
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-tertiary:only-child) + section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-tertiary,
  :where(.bg-section-flow, .etch-canvas-body) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-tertiary + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-tertiary:only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-tertiary,
  :where(.bg-section-flow, .etch-canvas-body) > div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-tertiary:only-child) + div:not([data-section-flow="off"], [hidden]):has(> section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-tertiary:only-child) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg-soft-tertiary {
  position: relative;

  &::before {
    content: "";
    position: absolute;
    inset-block-start: 0;
    inset-inline: 0;
    margin-inline: auto;
    inline-size: min(var(--content-width), calc(100% - var(--gutter) * 2));
    border-block-start: 1px solid color-mix(in srgb, var(--relative-heading-color, var(--heading-color)) 10%, transparent);
    pointer-events: none;
  }
}

/* Matching neutral hero boundary: retain hero spacing and decoration, reduce only
   the following section's top padding by 25%. The filtered second-child selector
   ignores the template's nonvisual .bg-site-behaviour controller elements. */
:where(.bg-section-flow, .etch-canvas-body) > section.bg-hero:not([data-section-flow="off"], [hidden], .bg-hero--image-background):not(.bg--ultra-light, .bg--light, .bg--dark, .bg--ultra-dark, .surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):nth-child(1 of :is(section, div:has(> section:only-child))) ~ section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]):not(.bg--ultra-light, .bg--light, .bg--dark, .bg--ultra-dark, .surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):nth-child(2 of :is(section, div:has(> section:only-child))),
:where(.bg-section-flow, .etch-canvas-body) > section.bg-hero:not([data-section-flow="off"], [hidden], .bg-hero--image-background):not(.bg--ultra-light, .bg--light, .bg--dark, .bg--ultra-dark, .surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):nth-child(1 of :is(section, div:has(> section:only-child))) ~ div:not([data-section-flow="off"], [hidden]):nth-child(2 of :is(section, div:has(> section:only-child))) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]):not(.bg--ultra-light, .bg--light, .bg--dark, .bg--ultra-dark, .surface-panel, .surface-primary, .surface-secondary, .surface-tertiary, .bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child,
:where(.bg-section-flow, .etch-canvas-body) > section.bg-hero:not([data-section-flow="off"], [hidden], .bg-hero--image-background).bg--ultra-light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):nth-child(1 of :is(section, div:has(> section:only-child))) ~ section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):nth-child(2 of :is(section, div:has(> section:only-child))),
:where(.bg-section-flow, .etch-canvas-body) > section.bg-hero:not([data-section-flow="off"], [hidden], .bg-hero--image-background).bg--ultra-light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):nth-child(1 of :is(section, div:has(> section:only-child))) ~ div:not([data-section-flow="off"], [hidden]):nth-child(2 of :is(section, div:has(> section:only-child))) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--ultra-light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child,
:where(.bg-section-flow, .etch-canvas-body) > section.bg-hero:not([data-section-flow="off"], [hidden], .bg-hero--image-background).bg--light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):nth-child(1 of :is(section, div:has(> section:only-child))) ~ section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):nth-child(2 of :is(section, div:has(> section:only-child))),
:where(.bg-section-flow, .etch-canvas-body) > section.bg-hero:not([data-section-flow="off"], [hidden], .bg-hero--image-background).bg--light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):nth-child(1 of :is(section, div:has(> section:only-child))) ~ div:not([data-section-flow="off"], [hidden]):nth-child(2 of :is(section, div:has(> section:only-child))) > section:not(.bg-hero, .bg-hero-01, [data-section-flow="off"], [hidden]).bg--light:not(.surface-panel, .surface-primary, .surface-secondary, .surface-tertiary):not(.bg-soft-primary, .bg-soft-secondary, .bg-soft-tertiary):only-child {
  padding-block-start: calc(var(--section-padding-block) * .75);
}
