Order Summary Component made with Sass @mixin

Hello mentee's!

I have learned what the purpose is of "Mixins" and why & when it's convenient to use them. I made a "Partial" in which I have inserted Google Fonts, Variables, Resets and Mixins:

// _BASE.SCSS
@mixin component-width {
  max-width: 17rem;
}

@mixin grid-columns {
  display: grid;
  grid-template-columns: auto auto 1fr;
  grid-gap: 1rem;
  place-items: center;
}

@mixin border-radius {
  border-radius: 10px;
}

// STYLE.SCSS
.card_subscription {
      background-color: $clr_neutral_pale_blue;
      @include component-width;
      margin: 0 auto;
      @include grid-columns;
      padding: 1rem;
      @include border-radius;
      @media screen and (min-width: $tablet) {
        max-width: 20rem;
      }

Feel free to comment if you have any suggestions.