/* ===== Area ===== */
..blog-listing--area{
  width: 100%;
}

/* ===== Layout: V-CARD (grid) / else (stack) ===== */
. .blog-content{
  {% if module.card_style == "v-card" %}
    display: grid;
    grid-template-columns: repeat(, minmax(0, 1fr));
    gap: 32px;
  {% else %}
    display: flex;
    flex-direction: column;
    gap: 28px;
  {% endif %}
}

/* ===== Card base ===== */
. .recent-post.clg-card{
  background-color: ;
  border: 1px solid rgba(15, 23, 42, 0.10);
  border-radius: {% if module.style.cards.border_radius %}22px{% else %}0px{% endif %};
  overflow: hidden;
  transition: transform .18s ease, box-shadow .18s ease;
}

. .recent-post.clg-card:hover{
  transform: translateY(-4px);
  {% if module.style.cards.box_shadow %}
    box-shadow: 0 18px 40px rgba(2, 6, 23, 0.10);
  {% else %}
    box-shadow: none;
  {% endif %}
}

/* ===== Image ===== */
. .image-wrapper{
  position: relative;
  display: block;
  width: 100%;
  overflow: hidden;
}

. img.post-image{
  width: 100%;
  display: block;
  object-fit: cover;
  aspect-ratio: ;
  {% if module.settings.image_aspect_ratio == 'inherit' %}
    height: px;
  {% else %}
    height: auto;
  {% endif %}
}

/* ===== Content ===== */
. .text{
  padding: 18px 20px 22px;
}

/* ===== Category ===== */
. .meta-pill{
  display: inline-block;
  margin-bottom: 6px;
  font-size: 14px;
  color: #6b8cff;
  font-weight: 500;
}

/* ===== Title (controlado) ===== */
. .post-title{
  margin: 0 0 8px;
  font-size: 22px;
  line-height: 1.22;
  font-weight: 800;
  letter-spacing: -0.01em;
}

. .post-title a{
  color: ;
  text-decoration: none;

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

/* ===== Author ===== */
. .author{
  font-size: 15px;
  color: rgba(11, 15, 26, 0.55);
  margin-bottom: 10px;
}

/* ===== Summary ===== */
. .post-summary{
  margin-bottom: 12px;
  color: ;
  font-size: 16px;
  line-height: 1.5;

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

/* ===== Reading time ===== */
. .reading-time{
  font-size: 14px;
  color: #6b8cff;
  margin-bottom: 16px;
}

/* ===== Button ===== */
. .btn-readmore.clg-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 22px;
  border-radius: 999px;
  border: 2px solid #2d4aa5;
  color: #2d4aa5;
  text-decoration: none;
  font-weight: 700;
  transition: background .15s ease, color .15s ease;
}

. .btn-readmore.clg-btn:hover{
  background: #2d4aa5;
  color: #ffffff;
}

/* ===== H-CARD support (optional) ===== */
. .recent-post.h-card{
  display: grid;
  grid-template-columns: 42% 58%;
  align-items: start;
}

. .recent-post.h-card .text{
  padding: 18px 22px 22px;
}

/* ===== Responsive ===== */
@media (max-width: 991px){
  . .blog-content{
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
  }

  . .recent-post.h-card{
    grid-template-columns: 1fr;
  }

  . .post-title{
    font-size: 20px;
  }

  . .post-summary{
    font-size: 15px;
  }
}