Small problem with contact section font size

I’ve completed the project but I don’t understand why the font for “FreeCodeCamp” is smaller than call and email??

Here is a link to my codepen:

Here is my contact section code:

.contact-section {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 100%;
  height: 80vh;
  padding: 0 2rem;
  background: var(--main-gray)
}

.contact-section-header > h2 {
  font-size: 2rem;
}

@media (max-width: 28.75em) {
  .contact-section-header > h2 {
    font-size: 1rem;
  }
}

.contact-links {
  display: flex;
  justify-content: center;
  width: 100%;
  max-width: 980px;
  margin-top: 2rem;
  flex-wrap: wrap;
}

.contact-details {
  font-size: 2.4rem;
  text-shadow: 2px 2px 1px #1f1f1f;
  transition: transform 0.3s ease-out;
}

.btn {
  display: inline-block;
  padding: .5rem .5rem;
  border-radius: 2px;
}

Because when you copied from the sample you made a typo.
contact_details versus contact-details

Make the project from scratch, with your own code, style and content. Don’t take code from the sample project.

Roma -

Thanks for your note. No intentions to rip from sample code with learning. I go through piece by piece and use w3 schools along with a jon duckett book to understand how and why certain lines were implemented. However, I will take heed of your advice and practice crafting more pages from scratch through other challenges.