/* Card base */
    .blog-card {
      display: flex;
      flex-direction: column;
      height: 100%;
      border-radius: 1rem;
      overflow: hidden;
      background: #222;
      color: #fff;
      text-decoration: none; /* remove link underline */
      transition: transform .2s ease, box-shadow .2s ease;
    }

    /* Image wrapper uses Bootstrap's ratio to stay responsive */
    .blog-card .img-wrap {
      overflow: hidden;
    }

    .blog-card img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform .4s ease;
      display: block;
    }

    .blog-card h5 {
      margin: 0;
      padding: 1rem;
      font-size: 1rem;
      line-height: 1.3;
      flex: 0 0 auto;
    }

    /* Hover/Lift + subtle zoom (desktop/hover devices) */
    @media (hover:hover) and (pointer:fine) {
      .blog-card:hover { transform: translateY(-4px); box-shadow: 0 10px 18px rgba(0,0,0,.45); }
      .blog-card:hover img { transform: scale(1.05); }
    }

    /* Respect reduced motion */
    @media (prefers-reduced-motion: reduce) {
      .blog-card, .blog-card img { transition: none; }
    }

    /* Small tweaks for very small screens */
    @media (max-width: 420px) {
      .blog-card h5 { font-size: .95rem; padding: .75rem; }
    }