/*
 * One public typography contract, loaded after every page stylesheet.
 * Admin styles are served by a separate layout and never load this file.
 */
.page-hero-title,
#main-content h1:not(.gc-sr-only) {
  font-family: var(--font-display);
  font-size: var(--gc-page-title-size);
  font-weight: 800;
  line-height: 1;
  letter-spacing: .045em;
  text-transform: uppercase;
}

#main-content h2:not(.article-share__heading) {
  font-family: var(--font-display);
  font-size: var(--gc-section-title-size);
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: .05em;
  text-transform: uppercase;
}

/* Ordinary copy follows the former live site's .gc-body rule everywhere. */
#main-content p:not(.gc-label):not(.gc-meta):not([class$="-kicker"]):not([class*="-kicker "]):not(.article-author__label):not(.article-share__status):not(.sidebar-card-label):not(.related-heading-label) {
  font-family: var(--font-body);
  font-size: var(--gc-body-size);
  font-weight: 400;
  line-height: var(--gc-body-leading);
}

/*
 * Shared 1216px editorial grid. The page hero already uses this exact inner
 * width (1280px including 2rem padding on either side). These page families
 * previously used a 1280px content width in addition to that padding, which
 * shifted their content 32px to the left on wide screens.
 */
.pv-inner,
.pkg-inner,
.ef-inner,
.pf-inner,
.fw-inner {
  width: min(100% - 4rem, 1216px);
  margin-inline: auto;
}

@media (max-width: 620px) {
  .pv-inner,
  .pkg-inner,
  .ef-inner,
  .pf-inner,
  .fw-inner {
    width: min(100% - 2.5rem, 1216px);
  }
}