/* Scale the existing design-system proportions on large desktop displays.
   rem-based dimensions preserve the original layout below 1600px. */
@media screen and (min-width: 1600px) {
  html:has(body:not(.portfolio-home)) {
    font-size: clamp(16px, calc(8px + .625vw), 40px);
  }
  body:not(.portfolio-home) > .wrap,
  body:not(.portfolio-home) > header.wrap,
  body:not(.portfolio-home) > footer.wrap {
    width: calc(100% - 8vw);
    max-width: none;
  }
  body.about-page > .wrap, body.resume-page > .wrap {
    width: calc(100% - 8vw);
    max-width: 90rem;
  }
  .project-content {
    --wrap: min(100%, 124rem);
    --gutter: 4vw;
  }
  .project-content .hero .sub, .project-content .lede {
    max-width: 65ch;
  }
}