$empty-vars: (
  text-size: (
    mobile: (
      font-size: 18px,
      line-height: 1.25,
    ),
    tablet: (
      font-size: 28px,
    ),
  ),
);

.article-empty {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-top: 20px;
  padding-bottom: 20px;

  @include media(mobile up) {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  &__content {
    @include responsive-deep($empty-vars, 'text-size');
    display: block;
    text-align: center;
    margin: 20px 0;
    padding: 10px 30px;
    font-weight: bold;
  }
}