.main-content-results {
    justify-content: center;
    gap: 53px;
}

.content-main-results {
    border: solid 1px #72B9E7;
    border-radius: 24px;
    padding: 24px 0 0 0;
    display: grid !important;
    grid-template-columns: 205px 1fr;
    column-gap: 16px;
    align-items: start;
    height: 340px;
    width: 206px;
    min-height: 340px;
    max-height: 340px;
    box-sizing: border-box;
    overflow: hidden;
    /* evita que texto desborde y deforme */
    /* ELIMINADO: cursor: pointer; - Ya no son clickeables */
    /* ELIMINADO: transition - Ya no hay estados de selección */
}

/* Columna de imagen a la izquierda, ocupa alto del contenido */
.content-main-results>.wp-block-column:first-child {
    grid-column: 1;
    grid-row: 1 / span 10;
}

/* Bloques de texto a la derecha */
.content-main-results>.wp-block-columns {
    grid-column: 2;
}

/* Padding del bloque de texto (soporta ambos nombres) */
.content-main-results .content--txt,
.content-main-results .content-txt {
    padding: 0 24px 0 24px;
}

/* Imagen centrada y ajustada */
.content-main-results img {
    max-width: 158px;
    height: auto;
    display: block;
    margin: 0 auto;
    -webkit-object-fit: contain;
    object-fit: contain;
    /* mantiene proporción */
}

/* Responsive: apilar en móviles */
@media (max-width: 782px) {
    .content-main-results {
        grid-template-columns: 1fr;
        row-gap: 12px;
    }

    .content-main-results>.wp-block-column:first-child {
        grid-row: auto;
    }

    .content-main-results>.wp-block-columns {
        grid-column: 1;
    }
}

/* ============================================
   ESTILOS PARA RESULTADOS DE HUELLA DE CARBONO
   Cada elemento tiene su propia clase para fácil modificación
   ============================================ */

/* Contenedor principal */
.comparacion-seleccion-categoria {
    width: 100%;
}

.mensaje-huella-estimada {
    width: 100%;
}

/* 1. Título del personaje */
.resultado-titulo-personaje {
    color: #20347D;
}



/* 2. Toneladas estimadas */
.resultado-toneladas-estimadas {
    color: #1B77BB;
}


/* 3. Categoría con mayor consumo */
.resultado-categoria-mayor-consumo {
    color: #20347D;
    font-weight: 400;
}

.resultado-categoria-mayor-consumo strong {
    font-weight: 700;
}

/* 4. Contenedor de consejos */
.resultado-consejos-container {
    margin: 0 0 20px 0;
}

.resultado-consejos-titulo {
    color: #1B77BB;
}

.resultado-consejos-lista {
    margin: 10px 0 0 0;
    padding-left: 20px;
    list-style-type: disc;
}

.resultado-consejo-item {
    margin: 8px 0;
    font-size: 16px;
    color: #0B304B;
    line-height: 22px;
    letter-spacing: -2%;
}

/* 5. Mensaje dinámico del personaje */
.resultado-mensaje-personaje {
    margin-top: 20px;
    padding: 15px;
    border-radius: 8px;
    line-height: 1.6;
    font-size: 1em;
    color: #000;
}

/* Estilos adicionales para elementos dentro del mensaje del personaje */
.resultado-mensaje-personaje p {
    margin: 10px 0;
}

.resultado-mensaje-personaje strong {
    font-weight: bold;
}

.resultado-mensaje-personaje em {
    font-style: italic;
}