@use "styles/index" as *;

.newspaper {
  &-article {
    flex-direction: row;

    @include tablet {
      flex-direction: column;
    }

    &__img {
      width: 100%;
      max-height: 400px;
      object-fit: cover;
      transform: scale(0.9);
      cursor: pointer;

      @include tablet {
        transform: scale(1);
      }
    }

    &__content {
      margin-top: 40px;

      @include tablet {
        margin-top: 20px;
      }

      small {
        color: $gray;
      }

      h6 {
        font-size: 2.5rem;
        padding-right: 50px;

        @include tablet {
          padding-right: 0;
        }
      }
    }
  }

  &-divider {
    margin: 50px 0;
    width: 100%;
    height: 1px;
    background-color: $gray-1;
    position: relative;

    &::after {
      content: "";
      position: absolute;
      top: 0;
      left: 50%;
      transform: translate(-50%, -40%);
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background-color: $green-1;
    }
  }

  &:last-child {
    .newspaper-divider {
      display: none;
    }
  }
}