/* ==========================================================================
   layout.css -- the page skeleton
   --------------------------------------------------------------------------
   The whole page is one column: a full-bleed hero, a centred text block, and a
   full-bleed footer. No grid or flex framework is warranted for four elements.

   The centred column is `min(100%, --measure)` wide with `--gutter` of padding
   on each side. That single rule reproduces the original's content width at
   every viewport (1012px at desktop, 685px at tablet, 335px at phone), so both
   the info block and the footer text inherit it rather than restating it.

   The padding lives on the *container* and never on the text elements, so the
   text boxes themselves measure exactly --col wide -- which is what the parity
   harness compares against.
   ========================================================================== */

.info,
.footer__inner {
  max-width: var(--measure);
  margin-inline: auto;
  padding-inline: var(--gutter);
}