.img-transition-scale a img {
  border-radius: 10px;
}

.echo-trending-area h2 {
  color: var(--text-color, #000);
}

/* Define o container da imagem como círculo */
.right-side-banner .echo-hero-banner-main-img,
.left-side-banner .echo-hero-banner-main-img {
  width: 87px !important;
  height: 87px !important;
  min-width: 87px !important;
  min-height: 87px !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 12px; /* opcional, só para espaçamento */
}

/* Faz a imagem preencher o círculo corretamente */
.right-side-banner .echo-hero-banner-main-img img,
.left-side-banner .echo-hero-banner-main-img img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 50% !important;
  aspect-ratio: 1 / 1 !important;
  display: block !important;
  transition: transform 0.3s ease !important;
}

/* Efeito leve no hover */
.right-side-banner .echo-hero-banner-main-img:hover img,
.left-side-banner .echo-hero-banner-main-img:hover img {
  transform: scale(1.05);
}

.echo-banner-right-area-content ul li { display: flex; align-items: center; justify-content: space-between; } .echo-banner-right-area-content ul li .echo-latest-news-img { width: 87px !important; height: 87px !important; min-width: 87px !important; min-height: 87px !important; border-radius: 50% !important; overflow: hidden !important; flex: 0 0 87px !important; display: flex !important; align-items: center !important; justify-content: center !important; } .echo-banner-right-area-content ul li .echo-latest-news-img img { width: 100% !important; height: 100% !important; object-fit: cover !important; border-radius: 50% !important; aspect-ratio: 1 / 1 !important; display: block !important; }

.echo-hero-baner.post-item-card .img-transition-scale a img {
  width: 100%;
}