@media (max-height: 750px) {
  .social {
    display: flex;
    flex-direction: row;
    justify-content: end;
  }
  .subtitle-contact {
    font-size: 25px;
    margin-right: var(--spacing-lg);
    margin-top: 4px;
    margin-bottom: var(--spacing-sm);
  }
  .contact-list {
    margin-top: var(--spacing-sm);
    margin-bottom: var(--spacing-sm);
  }
  .logo {
  width: 30px;
  height: 30px;
}
}
@media (max-width: 1150px) {
  .certificate-list {
    display: grid;
  }
}

@media (max-width: 870px) {
  .header {
    flex-direction: column;
    text-align: center;
  }

  .nav-list {
    justify-content: center;
  }

  .profile-photo {
    width: 150px;
    height: 150px;
  }

  .subtitle {
    font-size: 1.6rem;
  }

  .me,
  .projects,
  .skills,
  .certificates {
    padding: 0 var(--spacing-md);
  }
}