/* styles/styles.css - FRONTEND v1.7 */
.mplist-main-container { margin: 40px 0; font-family: sans-serif; }

/* TABLA (Layout 1) */
.mplist-table-view { width: 100%; border-collapse: collapse; }
.mplist-table-view td, .mplist-table-view th { border: 1px solid #eee; padding: 15px; vertical-align: top; }

/* FIGURAS (Layout 2 - Base Móvil) */
.mplist-figures-layout { display: flex; flex-direction: column; gap: 80px; }
.mplist-figure-row { display: flex; flex-direction: column; padding-bottom: 40px; border-bottom: 1px solid #f0f0f0; }

.mplist-title-text { font-size: 2.8em; font-weight: 900; margin: 0 0 20px 0; line-height: 1; color: #1a1a1a; letter-spacing: -1px; }

.mplist-img-wrapper { margin-bottom: 25px; }
/* En móvil, la imagen ocupa el 100% disponible */
.mplist-feat-img { width: 100%; height: auto; display: block; cursor: zoom-in; border-radius: 4px; }

.mplist-description-text { font-size: 1.15em; line-height: 1.7; color: #444; margin-bottom: 25px; }
.mplist-btn-link { display: inline-block; background: #000; color: #fff; padding: 14px 35px; text-decoration: none; font-weight: bold; text-transform: uppercase; font-size: 0.9em; transition: background 0.3s; }

/* --- PC: 33% / 67% Y ANCHO MÁXIMO PROPORCIONAL --- */
@media (min-width: 992px) {
    .mplist-figure-row {
        flex-direction: row;
        border-bottom: none;
    }
    .mplist-col-header {
        flex: 0 0 33%;
        max-width: 33%;
        padding-right: 50px;
    }
    .mplist-col-content {
        flex: 0 0 67%;
        max-width: 67%;
    }

    /* AJUSTE SOLICITADO: Ancho Max 250px, Alto Proporcional */
    .mplist-img-wrapper {
         /* El contenedor se ajusta al tamaño de la imagen */
         width: fit-content;
    }

    .mplist-feat-img {
        max-width: 250px !important; /* Límite estricto de ancho */
        width: 100%; /* Intenta ocupar espacio hasta llegar a 250px */
        height: auto !important; /* Mantiene la proporción original de la imagen */
        object-fit: unset; /* Asegura que no se recorte */
    }
}

/* LIGHTBOX */
#mplist-lb-overlay { position: fixed; z-index: 99999; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.9); display: flex; align-items: center; justify-content: center; }
.mplist-lb-content img { max-width: 85%; max-height: 85vh; border: 5px solid #fff; }
.mplist-lb-close { position: absolute; top: 30px; right: 40px; color: #fff; font-size: 50px; cursor: pointer; }