/* Tarjeta de artículo de blog */
    .blog-card {
      background: var(--color-bg-white);
      border-radius: var(--border-radius-card);
      overflow: hidden;
      box-shadow: var(--shadow-card);
      transition: all var(--transition-base);
      height: 100%;
      display: flex;
      flex-direction: column;
    }
    .blog-card:hover {
      transform: translateY(-8px);
      box-shadow: var(--shadow-card-hover);
    }

    /* Contenedor de imagen con proporción fija 16:9 */
    .blog-card .bc-image {
      position: relative;
      padding-top: 56.25%;
      overflow: hidden;
    }
    .blog-card .bc-image img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.5s ease;
    }
    .blog-card:hover .bc-image img {
      transform: scale(1.06);
    }

    /* Etiqueta de categoría sobre la imagen */
    .blog-card .bc-tag {
      position: absolute;
      top: 16px;
      left: 16px;
      background: var(--color-accent);
      color: #fff;
      font-family: var(--font-heading);
      font-size: 0.7rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.8px;
      padding: 4px 12px;
      border-radius: 20px;
    }

    /* Cuerpo de la tarjeta */
    .blog-card .bc-body {
      padding: 24px 28px 28px;
      display: flex;
      flex-direction: column;
      flex: 1;
    }

    /* Meta: fecha de publicación */
    .blog-card .bc-meta {
      font-size: 0.78rem;
      color: var(--color-text-mid);
      margin-bottom: 10px;
      font-family: var(--font-heading);
    }

    /* Título del artículo */
    .blog-card .bc-title {
      font-family: var(--font-heading);
      font-size: 1.15rem;
      font-weight: 700;
      color: var(--color-text-dark);
      margin-bottom: 12px;
      line-height: 1.3;
    }

    /* Descripción breve */
    .blog-card .bc-desc {
      font-size: 0.88rem;
      color: var(--color-text-mid);
      margin-bottom: 20px;
      flex: 1;
      line-height: 1.6;
    }

    /* Enlace "Leer receta" */
    .blog-card .bc-link {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-family: var(--font-heading);
      font-size: 0.82rem;
      font-weight: 700;
      color: var(--color-primary);
      text-transform: uppercase;
      letter-spacing: 0.5px;
      text-decoration: none;
      align-self: flex-start;
      transition: gap var(--transition-base), color var(--transition-base);
    }
    .blog-card .bc-link:hover {
      color: var(--color-accent);
      gap: 10px;
    }