body {
  background: #efefef;
  color: #4f4f4f;
  font-family: 'Jost', 'Helvetica Neue', sans-serif;
  font-weight: 300;
  margin: 0;
  min-height: 100dvh;
  padding: 220px 80px 80px 220px;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

main {
  max-width: 560px;
}

.name {
  font-size: 2.45rem;
  font-weight: 400;
  letter-spacing: 0;
  margin-bottom: 6px;
  color: #3f3f3f;
}

.tagline {
  font-size: 1.6rem;
  font-weight: 300;
  color: #8c8c8c;
  margin-bottom: 48px;
}

.details {
  font-size: 1.7rem;
  line-height: 1.45;
  color: #5d5d5d;
}

.phone {
  display: inline-block;
}

@media (max-width: 1024px) {
  body {
    padding: 56px;
  }

  .name {
    font-size: 1.95rem;
  }

  .tagline {
    font-size: 1.3rem;
    margin-bottom: 36px;
  }

  .details {
    font-size: 1.5rem;
  }
}

@media (max-width: 640px) {
  body {
    padding: 24px;
  }

  .name {
    font-size: 1.45rem;
  }

  .tagline {
    font-size: 1.05rem;
    margin-bottom: 24px;
  }

  .details {
    font-size: 1.45rem;
    line-height: 1.45;
  }
}