.careers-body {
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  background: var(--black);
}

.careers-main {
  width: min(100%, 1440px);
  min-height: calc(100svh - 128px);
  margin: 0 auto;
  padding: 190px 3.2vw 110px;
  display: grid;
  grid-template-columns: 1fr minmax(320px, 520px);
  grid-template-rows: auto 1fr;
  column-gap: 8vw;
  border-inline: 1px solid rgba(255, 255, 255, .08);
}

.careers-kicker {
  grid-column: 1 / -1;
  padding-bottom: 28px;
  border-bottom: 1px solid var(--line);
  color: #858581;
  font: 500 9px var(--mono);
  letter-spacing: .18em;
}

.careers-main h1 {
  align-self: end;
  padding-top: 86px;
  font-size: clamp(78px, 10vw, 154px);
  line-height: .76;
  letter-spacing: -.09em;
}

.careers-copy {
  align-self: end;
  padding-top: 86px;
}

.careers-copy p {
  max-width: 500px;
  margin-bottom: 22px;
  color: #9a9a96;
  font: 300 12px/1.85 var(--mono);
}

.careers-copy p:first-child {
  color: #f2f2ed;
  font-size: 15px;
}

.careers-email {
  width: fit-content;
  margin-top: 32px;
  padding-bottom: 8px;
  display: flex;
  gap: 18px;
  align-items: center;
  border-bottom: 1px solid #777772;
  color: #fff;
  font: 400 13px var(--mono);
  transition: border-color .3s, gap .4s var(--ease);
}

.careers-email:hover {
  gap: 26px;
  border-color: #fff;
}

@media (max-width: 800px) {
  .careers-main {
    padding-inline: 24px;
    grid-template-columns: 1fr;
  }

  .careers-main h1,
  .careers-copy {
    padding-top: 62px;
  }
}

@media (max-width: 600px) {
  .careers-main {
    min-height: 850px;
    padding: 140px 20px 80px;
  }

  .careers-main h1 {
    font-size: 20vw;
  }
}