/* ============================================================
   IMAGE FIX — Paste this at the BOTTOM of your style.css
   This overrides all image-related styles with clean fixed-height approach
   ============================================================ */

/* ---- Trending card image (homepage) ---- */
.tcard-img-link {
    display: block !important;
    width: 100% !important;
    height: 200px !important;
    overflow: hidden !important;
    background: #f5f6fa !important;
    flex-shrink: 0 !important;
    position: static !important;
    padding-top: 0 !important;
}
.tcard-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    display: block !important;
    position: static !important;
    top: auto !important;
    left: auto !important;
    background: #f5f6fa !important;
}
.tcard-img-ph {
    width: 100% !important;
    height: 200px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 2.6rem !important;
    background: linear-gradient(135deg,#eef1ff,#f5f0ff) !important;
    position: static !important;
    padding-top: 0 !important;
}

/* ---- Prompt card image (category pages) ---- */
.prompt-card-img-wrap {
    display: block !important;
    width: 100% !important;
    height: 190px !important;
    overflow: hidden !important;
    background: #f5f6fa !important;
    flex-shrink: 0 !important;
    position: static !important;
    padding-top: 0 !important;
}
.prompt-card-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    display: block !important;
    position: static !important;
    top: auto !important;
    left: auto !important;
    background: #f5f6fa !important;
}
.prompt-card-img-placeholder {
    width: 100% !important;
    height: 190px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 2.6rem !important;
    background: linear-gradient(135deg,#eef1ff,#f5f0ff) !important;
    position: static !important;
    padding-top: 0 !important;
    flex-shrink: 0 !important;
}

/* ---- Blog card image ---- */
.blog-card-img-wrap {
    display: block !important;
    width: 100% !important;
    height: 210px !important;
    overflow: hidden !important;
    background: #f5f6fa !important;
    flex-shrink: 0 !important;
    position: static !important;
    padding-top: 0 !important;
}
.blog-card-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    display: block !important;
    position: static !important;
    top: auto !important;
    left: auto !important;
    background: #f5f6fa !important;
}
.blog-card-img-placeholder {
    width: 100% !important;
    height: 210px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 2.6rem !important;
    background: linear-gradient(135deg,#eef1ff,#f0fff4) !important;
    flex-shrink: 0 !important;
    position: static !important;
    padding-top: 0 !important;
}

/* ---- Single prompt/blog page hero image ---- */
.post-hero-img-wrap {
    width: 100% !important;
    height: 380px !important;
    overflow: hidden !important;
    border-radius: 20px !important;
    margin-bottom: 30px !important;
    box-shadow: 0 16px 48px rgba(15,17,51,0.14) !important;
    background: #f5f6fa !important;
    position: static !important;
    padding-top: 0 !important;
}
.post-hero-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center top !important;
    display: block !important;
    position: static !important;
    top: auto !important;
    left: auto !important;
    max-height: none !important;
    border-radius: 0 !important;
    margin-bottom: 0 !important;
}

/* ---- Responsive ---- */
@media (max-width: 768px) {
    .tcard-img-link  { height: 180px !important; }
    .tcard-img-ph    { height: 180px !important; }
    .post-hero-img-wrap { height: 240px !important; }
}