#section-prices {
  @include flex(0, center, center);

  min-height: 80vh;

  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),
    url("/assets/img/prices-bg.jpg?as=webp");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.prices {
  @include flex(2.4rem, center, center, column);

  padding: 6rem 0;

  @include respond(phone) {
    padding: 4rem 3rem;
  }

  &__intro {
    margin-bottom: 4rem;

    font-family: $font-family-headings;
    font-size: 2.8rem;

    @include respond(phone) {
      text-align: center;
    }
  }

  &__badges {
    @include flex(1.2rem, center, center, column);

    width: 80%;

    @include respond(phone) {
      width: 100%;
    }
  }

  &__badge {
    @include flex(0, space-between, center);

    width: 100%;

    padding: 2.4rem 2.8rem;

    background-image: $color-gradient-regular;

    box-shadow: $shadow-color;
  }

  &__badge-text {
    font-family: $font-family-headings;
    font-size: $font-size-large;
    font-weight: bold;
    text-shadow: $text-shadow-grey;
  }

  &__text {
    width: 75%;

    font-size: $font-size-larger;
    text-align: center;
  }
}
