/*
Small one-off helpers.

The audit of the 5 existing pages found the same components re-declared
with slightly different spacing/width on almost every page (.bsw-lead had
three different bottom margins, .bsw-h2 had two different bottom margins,
several "centered narrow block" sections used five different max-widths).
That drift is exactly what full per-page <style> blocks produce over time.
These utilities exist so a page-specific tweak is one class (or one inline
custom property), not a new rule in a new <style> block.
*/

.bsw-mt-0{margin-top:0}
.bsw-mt-sm{margin-top:16px}
.bsw-mt-md{margin-top:24px}
.bsw-mt-lg{margin-top:40px}

.bsw-mb-0{margin-bottom:0}
.bsw-mb-sm{margin-bottom:16px}
.bsw-mb-md{margin-bottom:24px}
.bsw-mb-lg{margin-bottom:40px}
.bsw-mb-xl{margin-bottom:60px}

.bsw-center{text-align:center}
.bsw-left{text-align:left}
.bsw-red-text{color:var(--bsw-red)}

/* Usage: <div class="bsw-max" style="--bsw-max:900px"> — avoids inventing
   a new .bsw-*-grid/.bsw-*-card just to change a max-width. */
.bsw-max{max-width:var(--bsw-max,760px);margin-left:auto;margin-right:auto}