/*
 * SweetCutePets shared page layout. ONE rule that every SweetCutePets component that is a whole page's worth of content (the Free Tools, the Pet Life
 * hub) uses to take the width a public page should have, whatever the theme's container is set to (a "Narrow" page layout, a reading column, a
 * constrained block-theme layout). It centres the component on the page, at most `--scp-wide-max` wide (72rem by default) and never wider than the
 * screen less a gutter, so a narrow layout cannot squeeze a grid into a column and no screen scrolls sideways.
 * The margin and width are !important on purpose: themes set a narrow column's margins with !important too (WordPress's own constrained layout does).
 * It is not used for text content: an article keeps the theme's reading column.
 */
.scp-wide.scp-wide { /* the class twice: it must outrank a constrained layout's own `margin-inline: auto !important`, whatever order the styles load in */
  --scp-wide-w: min(var(--scp-wide-max, 72rem), calc(100vw - 2rem));
  box-sizing: border-box;
  width: var(--scp-wide-w) !important;
  max-width: none !important;
  margin-left: calc(50% - var(--scp-wide-w) / 2) !important;
  margin-right: 0 !important;
}