.subheading-text {
  max-width: 750px;
}

.quote {
  margin: 75px auto;
  text-align: center;
  max-width: 750px;
}

.quote p {
  font-style: italic;
}

.quote span {
  color: var(--text-100);
}

.logos {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 50px;

  margin-bottom: 100px;
}

@media screen and (min-width: 768px) {
  main {
    margin-block: 150px;
  }

  .logos {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin-inline: 100px;
  }
}

@media screen and (min-width: 1024px) {
  .quote {
    margin: 150px auto;
  }

  .quote span {
    font-size: 18px;
  }
}

@media screen and (min-width: 1200px) {
  .logos {
    grid-template-columns: repeat(4, 1fr);
  }
}