/* Formato blog */
/* --- BLOQUE DE ORDEN INTERNO (Sustituir el anterior) --- */

/* Esta línea es necesaria para que tu lógica de "order" funcione */
.grid-blog-especifico .mod-articles-item-content { display: flex !important; flex-direction: column !important; }

/* Quitar el fondo gris en el contenedor del artículo */
.grid-blog-especifico div.mod-articles-item-content .resumenArticulo {
    background: #ffffff !important;
    padding:0px !important;
}

.grid-blog-especifico #resumen {
  min-height: 290px !important;
    width: 30% !important;
}
  
/* Elimina los puntos de lista y resetea el margen */
ul.mod-articles-items.mod-list.grid-blog-especifico, 
.grid-blog-especifico li {
    list-style: none !important;
    list-style-type: none !important;
    background-image: none !important; /* Por si la plantilla usa iconos como puntos */
    padding-left: 0 !important;
    margin-left: 0 !important;
}

/* Asegura que el contenedor de la lista no tenga el padding por defecto de las listas */
ul.mod-articles-items.mod-list.grid-blog-especifico {
    padding: 0 !important;
    margin: 0 !important;
}
  
/* --- NUEVO ORDEN: Imagen (1) -> Título (2) -> Texto (3) --- */

/* 1. Imagen arriba del todo */
.grid-blog-especifico .mod-articles-image {
    order: 1 !important;
    margin: 0 0 15px 0 !important;
    width: 100% !important;
}

/* 2. Título debajo de la imagen */
.grid-blog-especifico .mod-articles-title {
    order: 2 !important;
    margin-bottom: 10px !important;
    font-size: 1.4rem !important;
}

/* 3. Texto debajo del título */
.grid-blog-especifico .resumenArticulo {
    order: 3 !important;
    width: 100% !important;
    min-height: auto !important;
    margin-bottom: 15px !important;
    margin-left: 0px;
}

/* 4. Botón Leer más al final */
.grid-blog-especifico .readmore {
    order: 4 !important;
    margin-top: auto !important;
    text-align: right !important;
}
