/* ==========================================================
   Hotel Codru Moma — Blog Cards (FINAL CLEAN VERSION)
   DRY + Responsive + No empty image space
   ========================================================== */

:root{
  --cm-green:#185253;
  --cm-black:#000000;
  --cm-teal:#30A2A7;
  --cm-mint:#82AFB0;
  --cm-ice:#CAEEEF;
  --cm-white:#FFFFFF;

  --cm-radius:16px;
  --cm-border:1px solid rgba(24,82,83,.10);
  --cm-shadow:0 10px 28px rgba(0,0,0,.08);
  --cm-shadow-hover:0 18px 45px rgba(0,0,0,.12);
}

.blog_wrapper{
  margin-top: 60px;
}

/* ========================
   Base Card
   ======================== */

article.post.post-item{
  position:relative;
  background:var(--cm-white);
  border:var(--cm-border);
  border-radius:var(--cm-radius);
  box-shadow:var(--cm-shadow);
  overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

article.post.post-item:hover{
  transform:translateY(-6px) scale(1.01);
  box-shadow:var(--cm-shadow-hover);
  border-color:rgba(48,162,167,.28);
}

/* ========================
   Date Badge
   ======================== */

article.post.post-item .date_label{
  position:absolute;
  top:14px;
  left:14px;
  z-index:5;
  padding:8px 10px;
  border-radius:999px;
  font-size:12px;
  line-height:1;
  color:#fff;
  background:rgba(24,82,83,.92);
  box-shadow:0 8px 20px rgba(0,0,0,.12);
}

/* ========================
   Image Styling
   ======================== */

article.post.post-item .post-photo-wrapper.image_frame{
  margin:0 !important;
}

article.post.post-item .image_wrapper{
  overflow:hidden;
}

article.post.post-item img.wp-post-image{
  display:block;
  width:100%;
  height:auto;
  transform:scale(1);
  transition:transform .35s ease;
}

article.post.post-item:hover img.wp-post-image{
  transform:scale(1.06);
}

/* Overlay */
article.post.post-item .mask{
  position:absolute;
  inset:0;
  background:linear-gradient(
    180deg,
    rgba(24,82,83,0) 0%,
    rgba(24,82,83,.06) 45%,
    rgba(48,162,167,.16) 100%
  );
  opacity:0;
  transition:opacity .25s ease;
  pointer-events:none;
}

article.post.post-item:hover .mask{
  opacity:1;
}

/* Hide image wrapper completely if no thumbnail */
article.post.post-item:not(.has-post-thumbnail) .post-photo-wrapper{
  display:none !important;
}

/* ========================
   Content Styling
   ======================== */

article.post.post-item .post-desc-wrapper{
  background:transparent !important;
  padding:18px 18px 16px;
  box-sizing: border-box;
}

article.post.post-item .post-title h2{
  margin:8px 0 10px;
  font-size:22px;
  line-height:1.25;
}

article.post.post-item .post-title a{
  color:var(--cm-black);
  text-decoration:none;
  transition:color .18s ease;
}

article.post.post-item:hover .post-title a{
  color:var(--cm-green);
}

article.post.post-item .post-excerpt{
  color:rgba(0,0,0,.72);
  font-size:15px;
  line-height:1.6;
  margin:0 0 14px;
}

article.post.post-item .post-meta{
  color:rgba(0,0,0,.55);
  font-size:13px;
}

/* ========================
   Footer
   ======================== */

article.post.post-item .post-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding-top:14px;
  border-top:1px solid rgba(24,82,83,.10);
}

article.post.post-item .button-love .love-text{
  display:none;
}

article.post.post-item .mfn-love{
  border-radius: 999px;
  padding: 0 20px 0 44px;
  background:rgba(202,238,239,.45);
  border:1px solid rgba(24,82,83,.12);
  margin-left: 0;
}

article.post.post-item .post-links{
  border-left-width: 0;
}

article.post.post-item .post-links i{
  display: none;
}

article.post.post-item .post-links .post-more{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 12px;
  border-radius:999px;
  background:rgba(48,162,167,.10);
  border:1px solid rgba(48,162,167,.22);
  color:var(--cm-green);
  font-weight:600;
  text-decoration:none;
  transition:all .18s ease;
}

article.post.post-item:hover .post-links .post-more{
  background:rgba(48,162,167,.14);
  border-color:rgba(48,162,167,.35);
  transform:translateY(-1px);
}

.post-footer .button-love a.mfn-love i, .post-footer .button-love a.loved.mfn-love i{
  margin-left: 15px;
}

article.post.post-item .post-footer{
  padding-left: 0;
}

/* ========================
   Desktop Layout ONLY if has image
   ======================== */

@media (min-width:768px){

  /* Apply flex only if thumbnail exists */
  article.post.post-item.has-post-thumbnail{
    display:flex;
    align-items:stretch;
  }

  article.post.post-item.has-post-thumbnail .post-photo-wrapper{
    flex:0 0 42%;
    max-width:42%;
    display:flex;
  }

  article.post.post-item.has-post-thumbnail .image_wrapper{
    width:100%;
    height:100%;
    display:flex;
  }

  article.post.post-item.has-post-thumbnail .image_wrapper > a{
    display:block;
    width:100%;
    height:100%;
    position:relative;
  }

  article.post.post-item.has-post-thumbnail img.wp-post-image{
    height:100% !important;
    object-fit:cover;
    object-position:center;
  }

  article.post.post-item.has-post-thumbnail .post-desc-wrapper{
    flex:1;
    display:flex;
  }

  article.post.post-item.has-post-thumbnail .post-desc{
    display:flex;
    flex-direction:column;
    width:100%;
  }

  article.post.post-item.has-post-thumbnail .post-footer{
    margin-top:auto;
  }
}

/* ========================
   Mobile
   ======================== */

@media (max-width:767px){

  article.post.post-item{
    display:block;
  }

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

  article.post.post-item .post-desc-wrapper{
    padding:16px 14px 14px;
  }
}