/* Language-specific safeguards loaded after the main stylesheet. */
html body .resume-photo {
  margin-top: 32px !important;
}

html.lang-en body .resume-heading h2 {
  width: 310px !important;
  max-width: 100% !important;
  font-size: 50px !important;
  line-height: .9 !important;
  letter-spacing: -.065em !important;
  white-space: normal !important;
}

html.lang-en body .resume-education {
  grid-template-columns: 105px 84px 175px 116px 108px minmax(0, 1fr) !important;
  column-gap: 8px !important;
  padding-inline: 18px !important;
  font-size: 11px !important;
  line-height: 1.12 !important;
}

html.lang-en body .resume-education b {
  font-size: 15px !important;
  line-height: 1 !important;
}

html.lang-en body .resume-education span:last-child {
  min-width: 0 !important;
  white-space: normal !important;
}

html.lang-en body .contact .contact-primary > h2 {
  width: 940px !important;
  max-width: 940px !important;
  font-size: 68px !important;
  line-height: .98 !important;
  white-space: normal !important;
  overflow-wrap: normal !important;
}

/* Fade both hero figures into the dark page without revealing the green word. */
html body main#top .hero-characters::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 8 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 24% !important;
  pointer-events: none !important;
  background: linear-gradient(
    to bottom,
    rgba(14, 18, 15, 0) 0%,
    rgba(14, 18, 15, 0.16) 24%,
    rgba(14, 18, 15, 0.58) 62%,
    rgba(14, 18, 15, 0.94) 88%,
    #0e120f 100%
  ) !important;
  -webkit-mask-image: linear-gradient(
    to right,
    transparent 0%,
    rgba(0, 0, 0, .28) 2.5%,
    rgba(0, 0, 0, .72) 5.5%,
    #000 8%,
    #000 100%
  ) !important;
  mask-image: linear-gradient(
    to right,
    transparent 0%,
    rgba(0, 0, 0, .28) 2.5%,
    rgba(0, 0, 0, .72) 5.5%,
    #000 8%,
    #000 100%
  ) !important;
}

/* First work cover only: lift and crop the captured phone status bar. */
html body .project-grid .project:nth-child(1) > img {
  object-position: center top !important;
  transform: translateY(-16%) scale(1.2) !important;
  transform-origin: center top !important;
}
html body .project-grid .project:nth-child(1):hover > img {
  transform: translateY(-16%) scale(1.24) !important;
}