/*
 * Pages still on header.php (Work, Contact, cases, Career and the rest) carry
 * the Figma header bar now. On desktop they already line up with About, the
 * page the Figma templates render with legacy sections; on a phone the old
 * layout cleared the old, taller header, so the heading sat 70px lower and
 * larger than About's. These rules put it where About has it.
 */
@media (max-width: 767.98px) {
  /* The bar is 70px tall here (figma-home.css, --fh-header-h). */
  .body { margin-top: 70px; }

  /* About: the page heading 40px under the bar. */
  .body > .section-page:first-child { margin-top: 40px; }

  /* A case keeps its own top padding; this lands its title at the same height. */
  .body > .section-page.section-project:first-child { margin-top: 4px; }

  /* About's phone heading: the section-title style the Figma pages use. */
  .body > .section-page:first-child h1:not(.h2) {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 400;
    font-size: 22px;
    line-height: 26px;
    letter-spacing: -1.1px;
    text-transform: uppercase;
  }
}