/**
 * Legal/policy page content-column alignment.
 * ------------------------------------------------------------------
 * Shared by all three policy pages (Terms of Use, Privacy Policy,
 * Cancellation & Refund Policy) — the SAME .legal-content class,
 * applied identically to all three, replacing the old
 * <div class="container narrow ...> wrapper markup entirely.
 *
 * WHY THIS FILE EXISTS RATHER THAN LOADING style.css:
 * assets/css/style.css does define a `.container` rule and an
 * `.article .narrow` rule with values that would have produced this
 * same result — but none of the three policy pages ever loaded
 * style.css (each called render_head() with only a title argument,
 * so the optional $extraHead parameter, and therefore any
 * stylesheet link, was never added). That's the actual, verified
 * reason earlier attempts using those two classes had no visible
 * effect: the rules were never present in the page's CSS at all, not
 * merely overridden.
 *
 * Simply adding style.css back here was deliberately avoided: it
 * also carries an unrelated legacy header/nav design whose
 * `.nav-links` rule collides by class name with the real shared
 * header these pages already use via render_header() — the exact
 * bug already found and fixed on the Travel Footprint page. Loading
 * the whole file here would reintroduce that same bug on all three
 * legal pages. This file instead defines exactly one, explicit,
 * self-contained wrapper class, carrying no legacy header/nav rules
 * at all.
 */

/**
 * .legal-content — a single, explicit, self-contained wrapper used
 * directly in place of the old "container narrow" pair of classes on
 * all three policy pages. Deliberately does not depend on two
 * separate rules combining (one setting width, another capping it
 * with max-width) — every value needed for centering is set directly
 * here, on one class, so there is nothing left to trace across
 * multiple selectors or worry about cascade/specificity between them.
 */
.legal-content {
  width: 100%;
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

@media (max-width: 640px) {
  .legal-content {
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
  }
}