.elementor-1514 .elementor-element.elementor-element-6987364{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1514 .elementor-element.elementor-element-ddeada2{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}/* Start custom CSS *//* =============================================
   EXPLORA HUB — CSS ESPECÍFICO DE PÁGINA
   Pegar en: Elementor → Ajustes avanzados →
   CSS personalizado (en la sección raíz)

   Depende de:
   - huelgas-master-styles-v2.css
   - CSS-AÑADIR-OFERTA-HUB.css
     (oferta-grid, oferta-card, oferta-card-image,
      oferta-card-content, oferta-card-link ya definidos)

   Solo añade el comportamiento especial de las
   2 cards anchas de la fila inferior.
   ============================================= */

/* -----------------------------------------
   FILA INFERIOR: 2 CARDS ANCHAS
   Cada una ocupa la mitad del grid de 3 cols
   → grid de 6 unidades: cada card = 3 unidades
   ----------------------------------------- */
.explora-grid {
    grid-template-columns: repeat(6, 1fr);
}

/* Las 3 primeras cards: 2 columnas cada una → 2×3 = 6 */
.explora-grid .oferta-card:nth-child(-n+3) {
    grid-column: span 2;
}

/* Las 2 últimas cards: 3 columnas cada una → 3+3 = 6 */
.explora-grid .oferta-card--wide {
    grid-column: span 3;
}

/* La imagen de las cards anchas puede ser un poco más alta */
.explora-grid .oferta-card--wide .oferta-card-image {
    height: 240px;
}

/* -----------------------------------------
   RESPONSIVE — TABLET (max 1024px)
   2 columnas: las cards anchas ocupan 1 col entera
   ----------------------------------------- */
@media (max-width: 1024px) {

    .explora-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .explora-grid .oferta-card:nth-child(-n+3) {
        grid-column: span 1;
    }

    .explora-grid .oferta-card--wide {
        grid-column: span 1;
    }

    .explora-grid .oferta-card--wide .oferta-card-image {
        height: 200px;
    }
}

/* -----------------------------------------
   RESPONSIVE — MÓVIL (max 768px)
   1 columna: todas las cards igual
   ----------------------------------------- */
@media (max-width: 768px) {

    .explora-grid {
        grid-template-columns: 1fr;
    }

    .explora-grid .oferta-card:nth-child(-n+3),
    .explora-grid .oferta-card--wide {
        grid-column: span 1;
    }

    .explora-grid .oferta-card--wide .oferta-card-image {
        height: 200px;
    }
}/* End custom CSS */