@import "tools.functions";
@import "tools.mixins";

@mixin o-member-feature-exclusive-content--md {
  .o-member-feature-exclusive-content__cards {
    margin-bottom: rem(20);
    .o-member-feature-exclusive-content__card {
      flex-basis: calc(33.3% - #{rem(13.3)}); // 40px gap divided by 3 items
      // Second column
      &:nth-of-type(1n+1) {
        margin-left: rem(6.75);
        margin-right: rem(6.75);
      }
      // Third column
      &:nth-of-type(3n) {
        margin-left: rem(13.35);
        margin-right: 0;
      }
      // First column
      &:nth-of-type(3n+1) {
        margin-left: 0;
        margin-right: rem(13.35);
      }
    }
  }
  .o-member-feature-exclusive-content__button {
    .c-button {
      width: 50%;
    }
  }
}

@mixin o-member-feature-exclusive-content--lg {
  .o-member-feature-exclusive-content__button {
    .c-button {
      width: calc(33.3% - #{rem(13.3)}); // Same width as cards
    }
  }
}
