reviews.scss

.reviews {
  &__main-container {
    background: center/cover no-repeat url('/assets/images/reviews/reviews-main-bg.webp');
    background-color: $black_sea;
    height: 100%;
  }

  &__awards {
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(130px, 1fr));
    grid-column-gap: 45px;
    row-gap: 53px;
    margin: 100px auto;
    max-width: 655px;
    img { width: 130px; }
  }

  &__testimonials-container {
    .wrapper {
      background: left 0 top 60% no-repeat url("/assets/images/about/benefits.svg");
      position: relative;

      .overlay {
        position: absolute;
        width: 100%;
        height: 70%;
        right: 0;
        top: 10%;
        background-color: rgba(252, 252, 252, 0.7);
        backdrop-filter: blur(1.5px);
      }
    }
  }

  .accordion {
    summary {
      font-family: 'FixelText-Medium';
      flex-direction: column;
      font-size: 25px;

      span {
        font-family: Inria Serif;
        font-size: 18px;
        font-weight: 400;
        line-height: 10px;
        letter-spacing: normal;
        margin-top: 10px;
        text-transform: none;
      }
    }

    &__item { &-text { margin: 12px 63px 8px 63px; } }
  }
  &__solutions { background: $main-gradient; }
  &__expertise { background: none; }

  &__tell-us {
    background: left 0 top 100% no-repeat url('/assets/images/contacts/BGT-1x1-1.webp');
    background-size: cover;

    .button {
      background: $main-gradient;
      padding: 25px;
      width: 50%;
    }
  }
}

@media (max-width: 767px) {
  .reviews {
    &__main-container { background-position: right 13% bottom 0; }

    &__awards {
      grid-template-columns: repeat(auto-fill,minmax(108px, 1fr));
      grid-column-gap: 34px;
      margin: 40px 0 0 0;
      row-gap: 34px;
      img { width: 108px; }
    }

    .accordion {
      summary {
        align-items: start;
        font-size: 15px;
        font-weight: 700;
        padding: 20px 30px ;

        span {
          font-size: 12px;
          margin-top: 9px;
          text-align: start;
        }
        &::after { display: none; }
      }

      &__item { &-text { margin: 26px 35px 8px 35px; } }
    }

    &__tell-us {
      background: right -10px top 85% no-repeat url('/assets/images/reviews/mobile-bottom-bg.webp'), #dbdfeb;
      background-size: cover;

      .button {
        padding: 15px 25px;
        width: 75%;
      }
    }
  }
}