/*
Theme Name:      INCOOP Institucional
Theme URI:       https://www.incoop.gov.py/
Description:     Tema personalizado ultra-liviano para el Instituto Nacional de Cooperativismo (INCOOP). Desarrollado por DESIGNERLO siguiendo los lineamientos del Gobierno Nacional y optimizado para Elementor, WPO extremo y seguridad.
Author:          DESIGNERLO / Adrián Lucena
Author URI:      https://designerlo.com/
Template:        hello-elementor
Version:         1.0.0
License:         GNU General Public License v2 or later
License URI:     http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:     incoop-designerlo
*/

/* ==========================================================================
   1. ESTRUCTURA GLOBAL Y CONTENEDORES (DESIGNERLO HIGH-ENGINEERING)
   ========================================================================== */

.header-grid-container {
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    padding: 0 15px;
    box-sizing: border-box;
}

html, body {
    overflow-x: hidden !important;
    position: relative;
}

#comments, .comments-area, .reply, #respond { 
    display: none !important; 
}

/* ==========================================================================
   2. HEADER FIJO NATIVO - ESCRITORIO (MENÚ HOVER INTELIGENTE)
   ========================================================================== */

/* --- BARRA SUPERIOR: ACCESIBILIDAD --- */
.top-bar-accessibility {
    background-color: #f5f6f8;
    border-bottom: 1px solid #e0e0e0;
    padding: 6px 0;
}

.accessibility-options {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
}

.access-btn {
    background: none !important;
    border: none !important;
    color: #555555 !important;
    font-family: 'Montserrat', sans-serif;
    font-size: 13px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 8px;
    transition: color 0.2s ease;
}

.access-btn:hover {
    color: #00529c !important;
}

/* --- BARRA PRINCIPAL: LOGO Y BUSCADOR --- */
.main-header-bar {
    background-color: #ffffff;
    padding: 20px 0;
}

.main-header-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 80px;
}

.header-logo-area {
    flex-shrink: 0;
}

.header-search-area {
    flex-grow: 1;
    max-width: 500px;
}

/* --- BARRA DE MENÚ: NAVEGACIÓN Y SUBMENÚS HOVER --- */
.main-navigation-bar {
    background-color: #EA2428;
    position: relative;
    z-index: 990;
}

/* Contenedor de la lista nativa de WordPress (wp_nav_menu) */
.main-navigation-bar ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
}

/* Elementos principales del menú */
.main-navigation-bar ul li {
    position: relative !important; /* Base para el posicionamiento absoluto del submenú */
    margin: 0 !important;
    padding: 0 !important;
}

.main-navigation-bar ul li a {
    display: block !important;
    padding: 16px 22px !important;
    color: #ffffff !important;
    text-decoration: none !important;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 14px;
    transition: background-color 0.2s ease, color 0.2s ease;
    box-sizing: border-box;
}

/* Estado activo / Hover del elemento principal */
.main-navigation-bar ul li a:hover,
.main-navigation-bar ul li:hover > a {
    background-color: #9F181B !important;
}

/* --- CONFIGURACIÓN DE LOS SUBMENÚS (HIJOS - ROJO INSTITUCIONAL) --- */
.main-navigation-bar ul li ul {
    position: absolute !important;
    top: 100% !important; /* Se planta justo abajo del padre */
    left: 0 !important;
    background-color: #EA2428 !important; /* ¡AHORA ROJO! Mismo tono de la barra principal */
    min-width: 250px !important; /* Un poco más de aire para textos largos */
    box-shadow: 0 6px 18px rgba(0,0,0,0.2) !important;
    display: flex !important;
    flex-direction: column !important;
    
    /* Efecto oculto por defecto con transición fluida */
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(10px) !important;
    transition: opacity 0.25s ease, visibility 0.25s ease, transform 0.25s ease !important;
    
    padding: 8px 0 !important;
    border-radius: 0 0 6px 6px !important;
    border-top: 3px solid #9F181B !important; /* Línea superior en el rojo oscuro de acento */
}

/* --- DESPLIEGUE AL PASAR EL MOUSE (HOVER) --- */
.main-navigation-bar ul li:hover > ul {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}

/* Elementos de lista dentro del Submenú */
.main-navigation-bar ul li ul li {
    width: 100% !important;
}

/* Enlaces dentro del Submenú (Texto Blanco sobre fondo Rojo) */
.main-navigation-bar ul li ul li a {
    color: #ffffff !important; /* Tipografía blanca por defecto */
    background-color: transparent !important;
    padding: 12px 20px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    border: none !important;
    width: 100% !important;
    box-sizing: border-box;
    transition: background-color 0.2s ease, padding 0.2s ease !important;
}

/* Hover dentro del Submenú (Rojo Oscuro + Texto Blanco + MicroDesplazamiento) */
.main-navigation-bar ul li ul li a:hover,
.main-navigation-bar ul li ul li:hover > a {
    background-color: #9F181B !important; /* El color de hover de la barra */
    color: #ffffff !important; /* Mantiene la tipografía en blanco */
    padding-left: 25px !important; /* Desplazamiento sutil de guía visual */
}

/* ==========================================================================
   3. BUSCADOR INSTITUCIONAL (WPO EXTREMO CON SVG)
   ========================================================================== */

.incoop-search-form {
    width: 100%;
    margin: 0 auto;
}

.incoop-search-form .search-wrapper {
    display: flex;
    align-items: center;
    position: relative;
    width: 100%;
    height: 50px;
    background-color: #ffffff;
    border: 2px solid #e0e0e0;
    border-radius: 6px;
    overflow: hidden;
    box-sizing: border-box;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.incoop-search-form .search-wrapper:focus-within {
    border-color: #00529c;
    box-shadow: 0 0 8px rgba(0, 82, 156, 0.15);
}

.incoop-search-form .search-input {
    width: 100%;
    height: 100%;
    border: none !important;
    background: #ffffff !important;
    padding: 0 65px 0 15px !important;
    font-family: 'Montserrat', sans-serif;
    font-size: 15px;
    color: #333333;
    outline: none !important;
    box-sizing: border-box;
}

.incoop-search-form .search-submit {
    position: absolute;
    right: 0;
    top: 0;
    width: 55px;
    height: 100%;
    background-color: #00529c !important;
    border: none !important;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s ease;
    padding: 0 !important;
    margin: 0 !important;
}

.incoop-search-form .search-submit:hover {
    background-color: #003a6e !important;
}

.incoop-search-form .search-svg-icon {
    color: #ffffff !important;
    display: block;
    width: 18px;
    height: 18px;
    transition: transform 0.2s ease;
}

.incoop-search-form .search-submit:hover .search-svg-icon {
    transform: scale(1.1);
}

/* ==========================================================================
   4. BOTTOM FOOTER - LINEAMIENTOS GOBIERNO NACIONAL
   ========================================================================== */

.section-institutional-gov {
    background-color: #00529c !important;
    width: 100% !important;
    min-height: 185px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 25px 20px;
    box-sizing: border-box;
    font-family: 'Montserrat', sans-serif;
    clear: both;
}

.bottom-footer-container {
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
}

.footer-gov-logo .gov-brand-img {
    max-width: 240px;
    height: auto;
    display: block;
    filter: brightness(0) invert(1);
}

.footer-gov-info {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.footer-gov-info p {
    color: #ffffff !important;
    margin: 0 !important;
    padding: 0 !important;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
}

.footer-text-line1 {
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0.3px;
}

.footer-text-line2 {
    font-size: 13px;
    font-weight: 400;
    opacity: 0.85;
}

.section-institutional-gov a {
    color: #ffffff !important;
    text-decoration: none !important;
    transition: color 0.3s ease;
    display: inline-block;
}

.section-institutional-gov a:hover,
.section-institutional-gov a:focus {
    color: #7dc2ff !important;
}

.section-institutional-gov ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.section-institutional-gov li {
    margin-bottom: 8px;
    color: #ffffff !important;
}

/* ==========================================================================
   5. TOP FOOTER - REDES SOCIALES ULTRA-LIGHT
   ========================================================================== */

.top-footer-social-box {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 25px;
    width: 100%;
    padding: 15px 0;
    box-sizing: border-box;
}

.social-icon-link {
    display: flex !important;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.social-svg {
    color: #606060 !important;
    opacity: 0.50 !important;
    display: block;
    width: 30px;
    height: 30px;
    transition: color 0.3s ease, opacity 0.2s ease;
}

.social-icon-link:hover .social-svg {
    color: #00529c !important;
    opacity: 1.0 !important;
    transform: scale(1.15);
}

body.alto-contrast .social-svg,
body.alto-contreste .social-svg {
    color: #ffff00 !important;
    opacity: 1.0 !important;
}

/* ==========================================================================
   6. CONTROL DE ANCHO GLOBAL DEL CUERPO
   ========================================================================== */

#content.site-content {
    max-width: 1200px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 40px 15px !important;
    box-sizing: border-box !important;
}

#content.site-content .elementor-section-wrap,
#content.site-content .elementor-inner {
    max-width: 100% !important;
    width: 100% !important;
}

/* ==========================================================================
   7. LAYOUT DE NOTICIAS: COEXISTENCIA EN ESCRITORIO (BASE)
   ========================================================================== */

/* Estilos base para PC sin encerrar en Media Queries para evitar llaves rotas */
.incoop-single-post-flex-wrapper {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important; /* Sidebar inmune a caídas */
    justify-content: space-between !important;
    align-items: flex-start !important;
    gap: 40px !important;
    max-width: 1200px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 40px 15px !important;
    box-sizing: border-box !important;
}

.incoop-single-post-flex-wrapper .single-news-layout {
    width: 72% !important;
    max-width: 72% !important;
    flex: 0 0 72% !important;
    box-sizing: border-box !important;
}

.incoop-single-post-flex-wrapper .sidebar-col-force {
    width: 25% !important;
    max-width: 25% !important;
    flex: 0 0 25% !important;
    box-sizing: border-box !important;
    display: block !important;
}

/* --- ESTILOS INTERNOS DEL SIDEBAR --- */
.sidebar-col-force .sidebar-noticias-container,
.sidebar-col-force #secondary,
.sidebar-col-force aside {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    display: block !important;
}

.sidebar-col-force .widget {
    background: #ffffff;
    border: 1px solid #eef0f4;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 25px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.02);
    width: 100% !important;
    box-sizing: border-box !important;
}

.sidebar-col-force .widget-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: #00529c;
    margin-top: 0;
    margin-bottom: 15px;
    padding-bottom: 8px;
    border-bottom: 2px solid #f0f2f5;
}

.sidebar-col-force .widget ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.sidebar-col-force .widget ul li {
    padding: 8px 0;
    border-bottom: 1px solid #f7f9fb;
    font-size: 14px;
}

.sidebar-col-force .widget ul li a {
    color: #444444 !important;
    text-decoration: none;
    transition: color 0.2s ease;
}

.sidebar-col-force .widget ul li a:hover {
    color: #00529c !important;
}

/* ==========================================================================
   8. ESTILOS CRÍTICOS PARA ARTÍCULOS Y CONTENIDO
   ========================================================================== */

.entry-header {
    margin-bottom: 20px;
}
.entry-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 28px;
    font-weight: 700;
    color: #333333;
    margin: 0 0 10px 0;
}
.entry-meta {
    font-size: 13px;
    color: #777777;
    font-family: 'Montserrat', sans-serif;
}

.news-featured-image-wrapper {
    width: 100%;
    height: 400px;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 30px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    background-color: #f0f2f5;
}

.news-featured-image-wrapper .news-fixed-thumb {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block;
}

/* ==========================================================================
   9. UNIFICACIÓN DEL LOGO (SOPORTE ESCRITORIO BASE)
   ========================================================================== */

.incoop-custom-logo {
    display: block !important;
    width: 100% !important;
    max-width: 650px !important;
    height: auto !important;
}

/* ==========================================================================
   10. RESPONSIVO CONTROLADO (MÓVILES Y TABLETS)
   ========================================================================== */

@media (max-width: 1199px) {
    #content.site-content {
        max-width: 95% !important;
        padding: 25px 15px !important;
    }
}

/* --- BLOQUE ÚNICO EN TODO EL ARCHIVO PARA MÓVILES --- */
@media (max-width: 991px) {
    .main-header-flex {
        gap: 40px;
    }

    /* Desarmamos la grilla horizontal en celulares */
    .incoop-single-post-flex-wrapper {
        display: block !important; 
        width: 100% !important;
        padding: 20px 15px !important;
        box-sizing: border-box !important;
    }

    /* La noticia se libera al 100% real sin reservas */
    .incoop-single-post-flex-wrapper .single-news-layout {
        width: 100% !important; 
        max-width: 100% !important;
        flex: 1 1 100% !important;
        display: block !important;
        margin: 0 !important;
    }

    /* Ocultamos el sidebar por completo del viewport */
    .incoop-single-post-flex-wrapper .sidebar-col-force {
        display: none !important; 
    }

    /* Forzamos a que cualquier contenedor interno rebelde de Elementor respire al 100% */
    .single-news-layout article,
    .single-news-layout .entry-content,
    .single-news-layout .elementor,
    .single-news-layout .elementor-section {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        display: block !important;
    }
    
    .single-news-layout .entry-content > *,
    .single-news-layout .elementor-widget-container {
        max-width: 100% !important;
        width: 100% !important;
    }

    /* Forzar reajuste del logo en teléfonos */
    .incoop-custom-logo {
        max-width: 240px !important;
    }

    .main-header-flex {
        display: flex !important;
        flex-direction: column !important;
        gap: 15px !important;
        padding: 12px 15px !important;
    }

    .header-logo-area {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        flex-shrink: 0 !important;
    }

    .header-search-area {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    .incoop-search-form .search-wrapper {
        height: 46px;
    }

    .menu-flex-container {
        display: flex;
        justify-content: flex-end;
        padding: 10px 15px;
        position: relative;
    }

    .menu-toggle-btn {
        display: flex !important;
        flex-direction: column;
        justify-content: space-between;
        width: 26px;
        height: 18px;
        background: transparent !important;
        border: none !important;
        cursor: pointer;
        padding: 0 !important;
        z-index: 999;
    }

    .hamburger-bar {
        width: 100%;
        height: 3px;
        background-color: #ffffff;
        border-radius: 2px;
        transition: all 0.3s ease;
    }

    .nav-menu-wrapper {
        display: none;
        width: 100%;
        position: absolute;
        top: 100%;
        left: 0;
        background-color: #EA2428;
        box-shadow: 0 4px 10px rgba(0,0,0,0.1);
        z-index: 998;
    }

    .nav-menu-wrapper.is-open {
        display: block !important;
    }

    .main-navigation-bar ul {
        flex-direction: column !important;
        width: 100%;
    }

    .main-navigation-bar ul li {
        width: 100%;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }

    .main-navigation-bar ul li a {
        padding: 15px 20px !important;
        width: 100%;
        box-sizing: border-box;
    }

    .section-institutional-gov {
        min-height: 200px;
        padding: 30px 15px;
    }
    .footer-text-line1 { font-size: 14px; line-height: 1.4; }
    .footer-text-line2 { font-size: 12px; line-height: 1.4; }

    .top-bar-accessibility .accessibility-options,
    .top-footer-social-box {
        flex-direction: row !important;
        justify-content: center !important;
        gap: 20px;
    }
    
    .news-featured-image-wrapper {
        height: 220px;
        margin-bottom: 20px;
    }
    .entry-title {
        font-size: 22px;
    }
}

/* Control visual de escritorio para el menú hamburguesa */
@media (min-width: 768px) {
    .menu-toggle-btn {
        display: none !important;
    }
    .nav-menu-wrapper {
        display: block !important;
    }
}

/* ==========================================================================
   12. COMPLEMENTO GUÍA: PIE DE NOTICIA SUTIL
   ========================================================================== */

.incoop-post-footer-guide {
    margin-top: 50px !important;
    padding-top: 25px !important;
    border-top: 1px solid #c0c0c0 !important; /* Línea fina y elegante */
    font-family: 'Montserrat', sans-serif;
}

.guide-meta-content {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    font-size: 13px; /* Tamaño reducido para que actúe como guía sutil */
    color: #777777; /* Gris atenuado que no distrae */
    line-height: 1.5;
}

.guide-text, .guide-tags {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
}

/* Íconos sutiles */
.incoop-post-footer-guide .guide-icon,
.incoop-post-footer-guide .guide-icon-tags {
    color: #00529c; /* Azul institucional para mantener la identidad */
    opacity: 0.7;
    margin-right: 6px;
    font-size: 12px;
}

.incoop-post-footer-guide .guide-icon-tags {
    margin-left: 5px;
}

/* Estilos de los enlaces de Categorías y Etiquetas */
.incoop-post-footer-guide a {
    color: #444444 !important;
    text-decoration: none !important;
    font-weight: 600;
    margin-left: 4px;
    transition: color 0.2s ease, border-bottom 0.2s ease;
    border-bottom: 1px solid transparent;
}

.incoop-post-footer-guide a:hover {
    color: #ea2428 !important; /* Toque rojo sutil al pasar el cursor */
    border-bottom-color: #ea2428 !important;
}

/* Ajuste responsivo para celulares */
@media (max-width: 991px) {
    .incoop-post-footer-guide {
        margin-top: 30px !important;
        padding-top: 15px !important;
    }
    .guide-meta-content {
        flex-direction: column;
        gap: 10px;
        font-size: 12px;
    }
}

/* Control de tamaño para los íconos SVG de la guía */
.incoop-post-footer-guide .guide-svg-icon {
    width: 15px;
    height: 15px;
    color: #00529c; /* Tu azul institucional */
    margin-right: 6px;
    display: inline-block;
    vertical-align: middle;
}

/* ==========================================================================
   13. COMPONENTES: GRID DE NOTICIAS EN TARJETAS (FLEXBOX BLINDADO)
   ========================================================================== */

/* Contenedor principal: Forzamos la fila horizontal en PC */
.incoop-cards-news-grid {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important; /* Permite bajar si no entran, pero en PC entran */
    justify-content: flex-start !important;
    gap: 30px !important;
    width: 100% !important;
    margin: 25px 0 !important;
    box-sizing: border-box !important;
    clear: both !important;
}

/* Tarjeta individual: Forzamos matemáticamente el ancho para 3 columnas */
.incoop-cards-news-grid .news-card-item {
    /* (100% - 60px de gaps totales) / 3 columnas = 33.33% exacto por card */
    width: calc((100% - 60px) / 3) !important;
    max-width: calc((100% - 60px) / 3) !important;
    min-width: calc((100% - 60px) / 3) !important;
    
    background: #ffffff !important;
    border: 1px solid #eef0f4 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03) !important;
    display: flex !important;
    flex-direction: column !important; /* Flujo interno vertical */
    height: auto !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    box-sizing: border-box !important;
    float: left !important; /* Parche de seguridad para navegadores antiguos */
}

/* Efecto hover sobre la tarjeta */
.incoop-cards-news-grid .news-card-item:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.08) !important;
}

/* Contenedor de la foto de la tarjeta */
.news-card-thumb-holder {
    width: 100% !important;
    height: 190px !important;
    overflow: hidden !important;
    background: #f7f9fb !important;
    position: relative !important;
}

.news-card-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.4s ease !important;
}

.news-card-item:hover .news-card-img {
    transform: scale(1.06) !important;
}

/* Cuerpo contenedor del texto interno */
.news-card-body {
    padding: 22px !important;
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
    box-sizing: border-box !important;
}

.news-card-date {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    color: #888888 !important;
    margin-bottom: 10px !important;
    display: block !important;
}

.news-card-title {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    margin: 0 0 12px 0 !important;
}

.news-card-title a {
    color: #333333 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.news-card-title a:hover {
    color: #00529c !important;
}

.news-card-excerpt {
    font-size: 13px !important;
    color: #666666 !important;
    line-height: 1.5 !important;
    margin-bottom: 20px !important;
}

.news-card-footer-action {
    margin-top: auto !important; /* Empuja el botón al fondo */
    padding-top: 5px !important;
}

.news-card-btn {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #ea2428 !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    transition: color 0.2s ease !important;
}

.news-card-btn:hover {
    color: #00529c !important;
}

/* ==========================================================================
   ADAPTACIÓN RESPONSIVA (TABLETS Y CELULARES)
   ========================================================================== */

/* Tablets: 2 Columnas */
@media (max-width: 991px) {
    .incoop-cards-news-grid .news-card-item {
        /* (100% - 20px de gap) / 2 columnas = 49% aprox */
        width: calc((100% - 20px) / 2) !important;
        max-width: calc((100% - 20px) / 2) !important;
        min-width: calc((100% - 20px) / 2) !important;
    }
}

/* Celulares: 1 Columna completa */
@media (max-width: 767px) {
    .incoop-cards-news-grid .news-card-item {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
    }
    .news-card-thumb-holder {
        height: 200px !important;
    }
}