/* =====================================================
   BLOG KARTLARI EŞİT BOYUT VE DOĞRU SIRALAMA
===================================================== */

.blog-grid-wrapper {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}

/* Kart sıralaması: 1 - 2 - 3 - 4 - 5 - 6 */

.blog-grid-wrapper .item:nth-child(1) {
  order: 1;
}

.blog-grid-wrapper .item:nth-child(2) {
  order: 2;
}

.blog-grid-wrapper .item:nth-child(3) {
  order: 3;
}

.blog-grid-wrapper .item:nth-child(4) {
  order: 4;
}

.blog-grid-wrapper .item:nth-child(5) {
  order: 5;
}

.blog-grid-wrapper .item:nth-child(6) {
  order: 6;
}

/* Her kolon eşit yükseklikte */

.blog-grid-wrapper .item {
  display: flex;
  height: 610px;
  margin-bottom: 40px;
}

/* Kartın tamamı eşit yükseklikte */

.blog-grid-wrapper .blog-item.elegan-card {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}

/* Bütün görseller aynı boyutta */

.blog-grid-wrapper .elegan-card .image {
  flex: 0 0 235px;
  width: 100%;
  height: 235px;
  aspect-ratio: auto;
}

.blog-grid-wrapper .elegan-card .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* İçerik alanları eşit */

.blog-grid-wrapper .elegan-card .content {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 30px 28px;
}

/* Başlık alanları eşit */

.blog-grid-wrapper .elegan-card h6 {
  display: flex;
  align-items: flex-start;
  min-height: 58px;
  margin-bottom: 14px;
}

/* Açıklamalar eşit uzunlukta */

.blog-grid-wrapper .elegan-card p {
  display: -webkit-box;
  flex: 1;
  min-height: 100px;
  margin-bottom: 22px;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}

/* Devamını oku bağlantıları aynı hizada */

.blog-grid-wrapper .elegan-read-more {
  width: 100%;
  margin-top: auto;
}

/* Tablet */

@media only screen and (max-width: 991px) {
  .blog-grid-wrapper .item {
    height: 610px;
  }

  .blog-grid-wrapper .elegan-card .image {
    flex-basis: 225px;
    height: 225px;
  }
}

/* Telefon */

@media only screen and (max-width: 767px) {
  .blog-grid-wrapper .item {
    height: auto;
    min-height: 575px;
  }

  .blog-grid-wrapper .elegan-card .image {
    flex-basis: 220px;
    height: 220px;
  }

  .blog-grid-wrapper .elegan-card h6,
  .blog-grid-wrapper .elegan-card p {
    min-height: auto;
  }
}