/* Amer about — shared structure for every design (only design 1 ships at
 * launch). Every measured size, colour and breakpoint lives in the design's
 * own -1.css (design variants convention, conventions.md); this file holds
 * only what any about design's centred column would share.
 *
 * The template's block is a Bootstrap `.container > .row.justify-content-
 * center > .col-lg-10`: the row cancels the container's 15px gutters with a
 * -15px margin on each side and the column gives them back as padding, so
 * the column's own width is a percentage of the FULL container width (1440
 * at 1440px), not of the padded box. Reproduced here with the same two
 * numbers instead of a percentage of our own content box, which is not a
 * constant (1170/1410 = 82.98% at 1440, 823/994 = 82.83% at 1024 — the
 * template is 83.3333% of the row at both). --amer-gutter is the theme's
 * copy of the template's 15px (core.css).
 */
.amer-about__row {
  display: flex;
  justify-content: center;
  margin-inline: calc(var(--amer-gutter, 15px) * -1);
}
.amer-about__col {
  flex: 0 0 auto;
  inline-size: 100%;
  min-inline-size: 0;
  padding-inline: var(--amer-gutter, 15px);
}
.amer-about__eyebrow,
.amer-about__title,
.amer-about__text { margin-block: 0; }
/* The template always ends this block with the button, so its statement keeps
   its 40px bottom margin there. With no button (or no statement) the last
   element would leave that gap inside the section's own padding, so it is
   dropped: an empty state with no dead band under it.
   The section class is repeated so this reads (0,3,0): written as
   `.amer-about__col > :last-child` it ties with `.amer-about--d1
   .amer-about__title` (0,2,0) and loses to it on order, because the design
   sheet is linked after this one — a title with no button measured 40px of
   dead band under it, not 0. Specificity, not !important. */
.amer-about .amer-about__col > :last-child { margin-block-end: 0; }