.newsCard {
  position: relative;

  display: flex;
  flex-direction: column;

  flex: 0 0 340px;

  min-width: 340px;

  overflow: hidden;

  border-radius: 24px;

  background:
    linear-gradient(
      180deg,
      rgba(22,22,24,.98) 0%,
      rgba(15,15,18,1) 100%
    );

  border:
    1px solid
    rgba(
      255,
      255,
      255,
      .05
    );

  transition:
    transform .3s ease,
    box-shadow .3s ease,
    border-color .3s ease;

  &::before {
    content: "";

    position: absolute;

    inset: 0;

    background:
      radial-gradient(
        circle at top right,
        rgba(
          247,
          147,
          24,
          .08
        ),
        transparent 45%
      );

    opacity: 0;

    transition: .3s ease;

    pointer-events: none;
  }

  &:hover {
    transform: translateX(3px);

    border-color:
      rgba(
        255,
        255,
        255,
        .08
      );

    box-shadow:
      0 25px 60px
      rgba(
        0,
        0,
        0,
        .45
      );

    &::before {
      opacity: 1;
    }

    img {
      transform: scale(1.05);
    }
  }

  &__image {
    position: relative;

    height: 210px;

    overflow: hidden;

    img {
      width: 100%;
      height: 100%;

      object-fit: cover;

      transition: .5s ease;
    }
  }

  &__overlay {
    position: absolute;

    inset: 0;

    background:
      linear-gradient(
        180deg,
        rgba(0,0,0,.05),
        rgba(0,0,0,.35)
      );
  }

  &__tag {
    position: absolute;

    top: 1rem;
    left: 1rem;

    z-index: 3;

    display: inline-flex;

    align-items: center;

    padding: .45rem .85rem;

    border-radius: 999px;

    background:
      rgba(
        247,
        147,
        24,
        .08
      );

    border:
      1px solid
      rgba(
        247,
        147,
        24,
        .15
      );

    color: #f79318;

    font-size: .62rem;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: .08em;

    backdrop-filter: blur(12px);
  }

  &__body {
    padding: 1.35rem;

    display: flex;

    flex-direction: column;

    flex: 1;
  }

  &__date {
    color:
      rgba(
        255,
        255,
        255,
        .45
      );

    font-size: .72rem;

    margin-bottom: .9rem;

    letter-spacing: .04em;
  }

  h3 {
    color: #fff;
    opacity: .85;
    font-size: .85rem !important;

    font-weight: 500;

    line-height: 1.8;

    margin-bottom: auto;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    overflow: hidden;
  }

  &__link {
    margin-top: 1.35rem;

    height: 42px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: .55rem;

    border-radius: 14px;

    text-decoration: none;

    background:
      rgba(
        255,
        255,
        255,
        .03
      );

    border:
      1px solid
      rgba(
        255,
        255,
        255,
        .05
      );

    color: #fff;

    font-size: .8rem;

    font-weight: 600;

    transition: .25s ease;

    &:hover {
      border-color:
        rgba(
          247,
          147,
          24,
          .18
        );

      background:
        rgba(
          247,
          147,
          24,
          .06
        );

      color: #f79318;
    }

    svg {
      font-size: .75rem;
    }
  }

  @media (max-width: 1000px) {
    min-width: 100%;

    flex: none;
  }
}