@import '../../_global/styles/mixins';
@import '../../_global/styles/vars';

.logo-wall {
  margin: 0 0 1em 0;
  .text-wrapper {
    margin-bottom: 2rem;
  }

  .text-box {
    max-width: 900px;

    .like-h2 {
      margin-bottom: 0.25rem;
      margin-top: 0;
    }
  }

  .logo-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem;
    align-items: center;
    justify-content: start;

    @media (max-width: 600px) {
      grid-template-columns: repeat(3, 1fr);
    }

    .logo-item {
      height: 5rem;
      max-width: 15rem;
      display: flex;
      align-items: center;
      justify-content: center;
      @media (max-width: 600px) {
        height: 2.5rem;
      }

      img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
      }
    }
  }
}