.contact__section{
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-top: 10rem;
}

.contact__title{
  display: flex;
  align-items: center;
  color: var(--secondary-gray);
  font-size: var(--text-xl);
  font-weight: 600;
}

.contact__title > span{
  font-size: var(--text-base);
  padding-right: 1rem;
  color: var(--primary-green);
}

.contact__container{
  margin-top: 2.5rem;
}

.contact__content > h3{
  font-size: var(--text-4xl);
  font-weight: 600;
  color: var(--secondary-gray);
  margin-bottom: 1.5rem;
}

.contact__container > p{
  font-size: var(--text-lg);
}

.contact__socials__container{
  display: flex;
  flex-direction: column;
  /* align-items: center; */
  /* padding: 2.5rem; */
}

.contact__socials{
  display: flex;
}

.social__item{
  list-style-type: none;
  margin: 2rem 1rem 0 0;
}

.social__link{
  color: var(--secondary-gray);
}

.social__link:hover{
  color: var(--primary-green);
}

.social__icon{
  width: 1.5rem;
  height: 1.5rem;
  fill: currentColor;
}

@media (min-width: 640px){
  .contact__title{
  font-size: var(--text-2xl);
  }

  .contact__title > span{
    font-size: var(--text-lg);
  }

  .contact__content > h3{
    font-size: var(--text-5xl);
  }
}

@media (min-width: 768px){
  .contact__section{
    margin-top: 5rem;
  }

  .contact__title{
    font-size: var(--text-3xl);
  }

  .contact__title > span{
    font-size: var(--text-xl);
  }

  .contact__content > h3{
    font-size: var(--text-6xl);
  }
}