Rhythm

Layout

Vertical rhythm for any container: apply .rhythm and its children get consistent margin-block-start spacing with no per-element classes, heavier before headings and around block-level elements (tables, blockquotes, figures — the tags this cascades to are declared once in _standard-00-variables.scss, not here). .flex > * is zeroed out automatically so rhythm margins never stack with flex gap.

Name	Description
`.rhythm`	The container class. Sets `display: flow-root` so child margins cannot collapse out of it.
`.no-rhythm`	Zeroes `margin-block-start` on every descendant — a subtree-wide rhythm opt-out.
`--gap-multiplicator`	Rhythm multiplier factor for block-level spacing and heading exceptions.
`.flex`	> * Zeroes `margin-block-start` for flex children so margins do not stack with flex gap.

Turn any container into a rhythm block

<article class="rhythm">
  <h2>Heading</h2>
  <p>Spaced automatically — no margin utility classes needed.</p>
</article>

Live

Heading

Spaced automatically — no margin utility classes needed.

All classes

Other

Class	Declares
`.no-rhythm *`	`margin-block-start: 0`