.blog {
  margin: 48px 0 37px;
}

.blog-popular-title {
  font-weight: 700;
  font-size: 28px;
  line-height: 34px;
  text-transform: uppercase;
  color: #FFFFFF;
  margin-bottom: 29px;
}

.blog-popular-top-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-bottom: 29px;
}

.blog-popular-top-cards .popular-card-image {
  height: 285px;
}

.blog-popular-cards {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 29px 22px;
}

.blog-popular-cards .popular-card-image {
  height: 204px;
}

.popular-divider {
  height: 1px;
  width: 100%;
  margin: 38px 0 34px;
  background: #29564E;
}

.popular-articles-title {
  font-weight: 700;
  font-size: 28px;
  line-height: 34px;
  text-transform: uppercase;
  color: #FFFFFF;
  margin-bottom: 36px;
}

.popular-articles {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px 18px;
}

.popular-article-card {
  background: linear-gradient(180deg, rgba(3, 15, 33, 0.7) 0%, rgba(3, 15, 33, 0) 100%);
  opacity: 0.9;
  border: 1px solid #303F4E;
  backdrop-filter: blur(11px);
  border-radius: 33px;
}

.popular-article-card-header {
  height: 177px;
  background: linear-gradient(169.2deg, rgba(4, 80, 169, 0.46) 8.03%, rgba(0, 0, 0, 0.7) 134.86%);
  border-radius: 22px 22px 0px 0px;
  border-radius: 33px 33px 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.popular-article-card-logo {
  width: 130px;
  margin-bottom: 31px;
}

.popular-article-card-tokens {
  display: flex;
  align-items: center;
}

.popular-article-card-token {
  width: 51px;
  height: 51px;
  background: #64DCC0;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.popular-article-card-swap {
  height: 36px;
  width: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(3, 19, 33, 0.3);
  border: 1px solid #303F4E;
  border-radius: 100%;
  margin: 0 20px;
}

.popular-article-card-content {
  padding: 17px 24px 24px;
}

.popular-article-card-title {
  font-weight: 700;
  font-size: 18px;
  line-height: 22px;
  color: #FFFFFF;
  margin-bottom: 17px;
}

.popular-article-card-date {
  display: flex;
  align-items: center;
  padding: 5px 11px;
  background: linear-gradient(125.97deg, #AEF4EF 28.97%, #18C490 109.16%);
  border-radius: 33px;
  font-weight: 500;
  font-size: 11px;
  line-height: 130.02%;
  color: #0E1932;
  width: max-content;
}

.popular-article-card-date img {
  margin-right: 6px;
}

@media(max-width: 1000px) {
  .blog {
    margin: 43px 0 34px;
  }

  .blog-popular-top-cards {
    grid-template: 20px;
    margin-bottom: 22px;
  }

  .blog-popular-top-cards .popular-card-image {
    height: 204px;

  }

  .popular-card-logo {
    width: 120px;
  }

  .blog-popular-cards {
    grid-template-columns: 1fr 1fr;
  }

  .popular-divider {
    margin: 42px 0 34px;
  }

  .popular-articles-title {
    margin-bottom: 34px;
  }

  .popular-articles {
    grid-template-columns: 1fr 1fr;
    gap: 19px 20px;
  }

  .popular-card {
    display: block !important;
  }
}

@media(max-width: 660px) {
  .blog {
    margin: 44px 0 21px;
  }

  .blog-popular-top-cards {
    grid-template-columns: 1fr;
    margin-bottom: 20px;
  }

  .blog-popular-cards {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .popular-divider {
    margin: 33px 0 34px;
  }

  .popular-articles-title {
    margin-bottom: 26px;
  }

  .popular-articles {
    grid-template-columns: 1fr;
    gap: 21px;
  }
}

@media(max-width: 420px) {
  .blog {
    margin: 25px 0 18px;
  }

  .blog-popular-title {
    margin-bottom: 15px;
  }

  .blog-popular-top-cards,
  .blog-popular-cards {
    gap: 15px;
  }

  .popular-divider {
    margin: 30px 0 26px;
  }

  .popular-articles-title {
    margin-bottom: 26px;
  }

  .popular-articles {
    gap: 18px;
  }
}


.popular-card {
  border-radius: 15px;
  background: linear-gradient(180deg, rgba(3, 15, 33, 0.7) 0%, rgba(3, 15, 33, 0) 100%);
  opacity: 0.9;
  border: 1px solid #303F4E;
  backdrop-filter: blur(11px);
}

.popular-card-image {
  height: 250px;
  border-radius: 15px 15px 0 0;
  padding: 17px 21px;
}

.trust-card-image-1 {
  margin-left: -155px;
  z-index: -1;
}

.popular-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 30px;
}

.popular-card-tag {
  padding: 5px 11px;
  background: #008FDF;
  border-color: #008FDF;
  border-radius: 3px;
  font-family: 'Lato', sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 11px;
  line-height: 130.02%;
  color: #0E1932;
  display: flex;
  align-items: center;
  color: #FFFFFF;
}

.popular-card-tag img {
  margin-right: 6px;
}

.popular-card-logo {
  width: 129px;
}

.popular-card-content {
  padding: 22px 34px 25px 38px;
}

.popular-card-title {
  font-style: normal;
  font-weight: 700;
  font-size: 18px;
  line-height: 22px;
  color: #FFFFFF;
  margin-bottom: 15px;
}

.popular-card-descr {
  font-weight: 300;
  font-size: 13px;
  line-height: 153.4%;
  color: #FFFFFF;
  margin-bottom: 23px;
}

.popular-card-btn {
  background: #64DCC0;
  border-radius: 33px;
  padding: 13px 23px 13px 21px;
  font-weight: 700;
  font-size: 10px;
  line-height: 98.9%;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #0C0523;
  cursor: pointer;
}

.popular-wrapper {
  margin-bottom: 40px;
}