/* ===== ESTILOS COMPLETOS INFO 24/7 ===== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.info247-portada-wrapper {
    font-family: 'Barlow Condensed', 'Segoe UI', sans-serif;
    background: #ECEAE6;
    overflow: visible !important;
    padding-top: 64px; /* compensa el header fijo */
}
/* Forzar overflow:visible en padres Divi/tema para que el sticky del header funcione (excepto html/body) */
#page-container, #et-main-area, #main-content,
.et_pb_section, .et_pb_section_main_inner, .et_pb_row, .et_pb_row_inner, .et_pb_column,
.et_pb_module, .et_pb_text, .et_pb_text_inner,
.entry-content, article.et_pb_post, .et_post_meta_wrapper,
.info247-portada-wrapper {
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
}

/* HEADER */
.info247-header {
    /* #000 (no #0D0D0D) para matchear el fondo negro puro del GIF del logo
       (logo_animado.gif). Con #0D0D0D quedaba un parche más claro alrededor
       del logo notorio en pantallas con buen contraste. */
    background: #000;
    border-bottom: 3px solid #CC0018;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
}

.info247-header-inner {
    width: 90%;
    max-width: none;
    margin: 0 auto;
    padding: 8px 0;
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}

.info247-logo {
    height: 42px;
    width: auto;
}

/* Screen-reader only: oculto visual pero accesible (lectores de pantalla, SEO) */
.info247-sr-only {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* El logo está dentro de un <a class="info247-nav-link">; sacamos el padding del nav-link */
.info247-logo-area > a {
    padding: 0 !important;
    border-bottom: none !important;
    display: inline-flex;
    align-items: center;
}

.info247-live-badge {
    display: flex;
    align-items: center;
    gap: 6px;
    background: #CC0018;
    padding: 4px 10px;
    border-radius: 20px;
}

.info247-live-dot {
    width: 8px;
    height: 8px;
    background: #fff;
    border-radius: 50%;
    animation: blink 1.4s infinite;
}

@keyframes blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.2; }
}

.info247-live-badge span {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 3px;
    color: #fff;
}

/* === Widget de tendencias del día === */
.info247-tendencias-widget {
    position: relative;
    flex-shrink: 0;
    cursor: pointer;
    outline: none;
}

/* Empuja todo el bloque de widgets a la derecha en desktop.
   El primer widget (botón de búsqueda) lleva margin-left:auto y eso
   pega los demás juntos a su derecha. */
.info247-header-inner > .info247-search-btn {
    margin-left: auto;
}

.info247-tendencias-widget .info247-tendencias-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 12px;
    background: rgba(255, 255, 255, 0.1);
    border: none;
    border-radius: 20px;
    line-height: 1;
    font-family: 'Barlow Condensed', sans-serif;
    transition: background 0.15s;
}

@media (hover: hover) {
    .info247-tendencias-widget:hover .info247-tendencias-header {
        background: rgba(255, 255, 255, 0.2);
    }
}
.info247-tendencias-widget.is-open .info247-tendencias-header {
    background: rgba(255, 255, 255, 0.2);
}

.info247-tendencias-icon {
    color: #FFB800;
    font-size: 16px;
    animation: tendenciaBolt 2s ease-in-out infinite;
}

@keyframes tendenciaBolt {
    0%, 100% { transform: scale(1); opacity: 1; }
    50%      { transform: scale(1.15); opacity: 0.7; }
}

.info247-tendencias-label {
    font-size: 11px;
    font-weight: 700;
    color: #FFB800;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.info247-tendencias-primera {
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    text-transform: capitalize;
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.info247-tendencias-count {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.6);
}

/* Dropdown — anclado a la izquierda del widget (que ahora vive cerca del
   margen derecho del header). Si se sale del viewport, ajustar a right:0. */
.info247-tendencias-dropdown {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 280px;
    max-width: 360px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
    padding: 12px 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
    z-index: 1000;
}

/* Hover solo en dispositivos con puntero real (desktop). En mobile el `:focus`
   se dispara al tap y abriría el dropdown sin pasar por el click handler que
   pushea el state — el back no lo cerraría. Por eso quedamos en `is-open`
   como única vía en touch, y hover en desktop. */
@media (hover: hover) {
    .info247-tendencias-widget:hover .info247-tendencias-dropdown {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }
}
.info247-tendencias-widget.is-open .info247-tendencias-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.info247-tendencias-dropdown-titulo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 16px 10px;
    font-size: 11px;
    font-weight: 700;
    color: #CC0018;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    margin-bottom: 6px;
}

.info247-tendencias-dropdown-titulo i {
    margin-right: 6px;
    color: #FFB800;
}

.info247-tendencias-close {
    background: transparent;
    border: 0;
    color: #999;
    font-size: 22px;
    line-height: 1;
    padding: 0 4px;
    cursor: pointer;
    transition: color 0.15s;
}
.info247-tendencias-close:hover,
.info247-tendencias-close:focus {
    color: #222;
    outline: none;
}

.info247-tendencias-lista {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 60vh;
    overflow-y: auto;
}

.info247-tendencias-lista li {
    margin: 0;
}

.info247-tendencia-chip {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 16px;
    background: transparent;
    border: 0;
    color: #222;
    text-align: left;
    cursor: pointer;
    font-family: inherit;
    transition: background 0.15s ease;
}

.info247-tendencia-chip:hover,
.info247-tendencia-chip:focus {
    background: rgba(204, 0, 24, 0.08);
    outline: none;
}

.info247-tendencia-rank {
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #CC0018;
    color: #fff;
    border-radius: 50%;
    font-size: 11px;
    font-weight: 700;
    flex-shrink: 0;
}

.info247-tendencia-token {
    flex: 1;
    font-size: 14px;
    text-transform: capitalize;
    color: #222;
}

.info247-tendencia-count {
    font-size: 12px;
    color: #888;
    background: rgba(0, 0, 0, 0.05);
    padding: 2px 8px;
    border-radius: 10px;
}

.info247-ubicacion-header {
    flex-shrink: 0;
}

/* Row break para fila 2 en mobile (oculto en desktop) */
.info247-mobile-row-break { display: none; }

/* Chip genérico para dólar y fútbol (clima usa su propio chip pero compatible) */
.info247-info-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255,255,255,0.1);
    color: #fff;
    border: none;
    padding: 4px 12px;
    border-radius: 20px;
    cursor: pointer;
    line-height: 1;
    font-family: 'Barlow Condensed', sans-serif;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background 0.15s;
}
.info247-info-chip:hover { background: rgba(255,255,255,0.2); }
.info247-info-chip-icon { font-size: 16px; }
.info247-info-chip-label { font-size: 15px; font-weight: 600; color: #fff; }

/* Popups del dólar y fútbol (mismo aspecto que clima) */
.info247-dolar-widget, .info247-futbol-widget {
    position: relative;
    font-family: 'Barlow Condensed', sans-serif;
}
.info247-info-popup {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    background: #fff;
    color: #222;
    width: 380px;
    max-width: 92vw;
    max-height: 85vh;
    overflow-y: auto;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.25);
    padding: 14px;
    z-index: 250;
}
.info247-futbol-popup {
    width: 440px;
    right: 0;
    left: auto;
}
.info247-info-popup-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #eee;
    padding-bottom: 8px;
    margin-bottom: 10px;
}
.info247-info-popup-title {
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #0D0D0D;
}
.info247-info-popup-close {
    background: none;
    border: none;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    color: #888;
    padding: 0 4px;
}
.info247-info-popup-close:hover { color: #CC0018; }
.info247-info-popup-source {
    font-size: 10px;
    color: #999;
    text-align: right;
    margin-top: 6px;
}
.info247-info-loading, .info247-info-error, .info247-info-empty {
    text-align: center; padding: 14px; color: #888; font-size: 13px;
}
.info247-info-update {
    font-size: 10px; color: #999; text-align: right; margin-top: 6px;
}

/* Lista de cotizaciones */
.info247-dolar-list { padding: 2px 0; }
.info247-dolar-row {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 10px;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid #f1f1f1;
}
.info247-dolar-row:last-child { border-bottom: none; }
.info247-dolar-row-name {
    font-weight: 700;
    font-size: 13px;
    border-left: 4px solid #ccc;
    padding-left: 8px;
    color: #0D0D0D;
}
.info247-dolar-row-vals {
    display: flex;
    justify-content: flex-end;
    gap: 14px;
    font-size: 13px;
    color: #444;
}
.info247-dolar-row-cell { display: flex; flex-direction: column; align-items: flex-end; }
.info247-dolar-row-key {
    font-size: 9px;
    text-transform: uppercase;
    color: #aaa;
    letter-spacing: 1px;
}
.info247-dolar-row-venta { font-weight: 700; color: #0D0D0D; }

/* Fútbol */
.info247-futbol-tabs {
    display: flex;
    gap: 4px;
    margin-bottom: 10px;
    border-bottom: 1px solid #eee;
}
.info247-futbol-tab {
    background: none;
    border: none;
    padding: 6px 12px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #888;
    border-bottom: 2px solid transparent;
    font-family: 'Barlow Condensed', sans-serif;
}
.info247-futbol-tab.active {
    color: #CC0018;
    border-bottom-color: #CC0018;
}
.info247-futbol-block { margin-bottom: 12px; }
.info247-futbol-block-title {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #555;
    margin-bottom: 6px;
}
.info247-futbol-list { display: flex; flex-direction: column; gap: 4px; }
.info247-futbol-match {
    background: #fafafa;
    border-radius: 6px;
    padding: 8px 10px;
    font-size: 12px;
}
.info247-futbol-match-meta {
    font-size: 10px;
    color: #999;
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.info247-futbol-match-row {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 8px;
}
.info247-futbol-team {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #0D0D0D;
    font-weight: 600;
    font-size: 15px;
    overflow: hidden;
}
.info247-futbol-team img {
    width: 28px;
    height: 28px;
    object-fit: contain;
    flex-shrink: 0;
}
.info247-futbol-team > span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.info247-futbol-team:last-child { justify-content: flex-end; }
.info247-futbol-team.is-winner { font-weight: 800; }
.info247-futbol-score {
    font-weight: 800;
    color: #0D0D0D;
    background: #fff;
    padding: 4px 12px;
    border-radius: 4px;
    border: 1px solid #ddd;
    font-size: 14px;
    text-align: center;
    min-width: 56px;
}

/* HAMBURGER (oculto en desktop) */
.info247-hamburger-btn {
    display: none;
    background: rgba(255,255,255,0.1);
    color: #fff;
    border: none;
    padding: 6px 14px;
    border-radius: 20px;
    cursor: pointer;
    font-size: 16px;
    line-height: 1;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.15s;
}
.info247-hamburger-btn:hover { background: rgba(255,255,255,0.2); }
.info247-hamburger-btn i { font-size: 18px; }

/* OVERLAY Y CIERRE DEL DRAWER (ocultos en desktop) */
.info247-mobile-drawer-overlay {
    display: none;
}
.info247-drawer-close-btn {
    display: none;
}

/* BOTON BUSQUEDA */
.info247-search-btn {
    background: rgba(255,255,255,0.1);
    color: #fff;
    border: none;
    padding: 6px 14px;
    border-radius: 20px;
    cursor: pointer;
    font-size: 14px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.15s;
    font-family: 'Barlow Condensed', sans-serif;
}
.info247-search-btn:hover { background: rgba(255,255,255,0.2); }
.info247-search-btn i { font-size: 18px; }

/* OVERLAY BUSQUEDA */
.info247-search-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.85);
    z-index: 9999;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 40px 16px;
    overflow-y: auto;
}
.info247-search-panel {
    background: #fff;
    width: 100%;
    max-width: 900px;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.info247-search-header {
    display: flex;
    gap: 8px;
    padding: 16px;
    background: #0D0D0D;
    align-items: center;
}
.info247-search-input {
    flex: 1;
    padding: 10px 14px;
    border: 1px solid #333;
    background: #1a1a1a;
    color: #fff;
    border-radius: 4px;
    font-size: 16px;
}
.info247-search-input::placeholder { color: #888; }
.info247-search-dias {
    padding: 10px;
    background: #1a1a1a;
    color: #fff;
    border: 1px solid #333;
    border-radius: 4px;
    font-size: 14px;
    cursor: pointer;
}
.info247-search-orden,
.info247-search-profunda {
    background: transparent;
    color: #fff;
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: 4px;
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    padding: 8px 10px;
    transition: background 0.15s, border-color 0.15s;
}
.info247-search-orden:hover,
.info247-search-orden:focus,
.info247-search-profunda:hover,
.info247-search-profunda:focus {
    background: rgba(255,255,255,0.1);
    outline: none;
}
.info247-search-profunda.is-on {
    background: #CC0018;
    border-color: #CC0018;
}
.info247-search-profunda.is-on:hover,
.info247-search-profunda.is-on:focus {
    background: #a30013;
    border-color: #a30013;
}
.info247-search-close {
    background: transparent;
    color: #fff;
    border: none;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
    padding: 0 8px;
}
.info247-search-status-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    padding: 12px 16px;
    border-bottom: 1px solid #eee;
    background: #f9f9f9;
}
.info247-search-status {
    color: #555;
    font-size: 13px;
}
.info247-search-dedup-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #555;
    cursor: pointer;
    user-select: none;
}
.info247-search-dedup-toggle input[type="checkbox"] {
    margin: 0;
}
.info247-search-results {
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-height: 65vh;
    overflow-y: auto;
}
.info247-search-result {
    display: flex;
    gap: 12px;
    padding: 10px;
    border: 1px solid #eee;
    border-radius: 6px;
    text-decoration: none;
    color: inherit;
    transition: background 0.15s;
}
.info247-search-result:hover { background: #f5f5f5; }
.info247-search-result-img {
    width: 110px;
    height: 80px;
    object-fit: cover;
    border-radius: 4px;
    flex-shrink: 0;
    background: #ddd;
}
.info247-search-result-body { flex: 1; min-width: 0; }
.info247-search-result-meta {
    font-size: 12px;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 4px;
}
.info247-search-result-meta .pill {
    background: #CC0018;
    color: #fff;
    padding: 3px 7px;
    border-radius: 3px;
    margin-right: 6px;
    font-size: 11px;
}
.info247-search-result-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.25;
    color: #111;
    margin: 4px 0;
}
.info247-search-result-fecha {
    font-size: 13px;
    color: #999;
}
.info247-search-result-excerpt {
    font-size: 15px;
    line-height: 1.45;
    color: #555;
    margin: 4px 0 8px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.info247-search-result-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: 6px;
}
.info247-search-result-link {
    font-size: 14px;
    font-weight: 600;
    color: #CC0018;
    flex-shrink: 0;
}
.info247-search-result {
    cursor: pointer;
    transition: background 0.15s ease;
}
.info247-search-result:hover,
.info247-search-result:focus {
    background: rgba(204, 0, 24, 0.04);
    outline: none;
}
.info247-search-pagination {
    padding: 12px;
    text-align: center;
    border-top: 1px solid #eee;
}
.info247-search-pagination button {
    background: #CC0018;
    color: #fff;
    border: none;
    padding: 10px 24px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
}
.info247-search-pagination button:disabled { background: #888; cursor: default; }
@media (max-width: 768px) {
    .info247-search-overlay { padding: 0; }
    .info247-search-panel { border-radius: 0; height: 100vh; max-height: 100vh; }
    .info247-search-results { max-height: none; flex: 1; }
    .info247-search-input { font-size: 14px; }
    .info247-search-dias { font-size: 12px; padding: 8px; }
    .info247-search-result-img { width: 80px; height: 60px; }
    .info247-search-result-title { font-size: 16px; }
    .info247-search-result-excerpt { font-size: 14px; }
    .info247-search-result-meta { font-size: 11px; }
    .info247-search-result-fecha { font-size: 12px; }
    .info247-search-result-link { font-size: 13px; }
}

/* NAVEGACIÓN */
.info247-nav {
    background: #fff;
    border-bottom: 1px solid #ddd;
    position: relative;
}

.info247-nav-inner {
    width: 90%;
    max-width: none;
    margin: 0 auto;
    padding: 0;
    display: flex;
    overflow-x: auto;
    gap: 0;
}

.info247-nav-inner::-webkit-scrollbar {
    display: none;
}

.info247-nav-link {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #666;
    padding: 12px 16px;
    text-decoration: none;
    white-space: nowrap;
    border-bottom: 3px solid transparent;
    transition: all 0.2s;
}

.info247-nav-link:hover {
    color: #111;
}

.info247-nav-link.active {
    color: #CC0018;
    border-bottom-color: #CC0018;
}

/* Secciones temáticas en rojo institucional (las áreas geográficas quedan en gris) */
.info247-nav-link[data-cat="politica"],
.info247-nav-link[data-cat="policiales"],
.info247-nav-link[data-cat="judiciales"],
.info247-nav-link[data-cat="deportes"],
.info247-nav-link[data-cat="economia"],
.info247-nav-link[data-cat="cultura"],
.info247-nav-link[data-cat="espectaculos"],
.info247-nav-link[data-cat="sociedad"] {
    color: #CC0018;
}
.info247-nav-link[data-cat="politica"]:hover,
.info247-nav-link[data-cat="policiales"]:hover,
.info247-nav-link[data-cat="judiciales"]:hover,
.info247-nav-link[data-cat="deportes"]:hover,
.info247-nav-link[data-cat="economia"]:hover,
.info247-nav-link[data-cat="cultura"]:hover,
.info247-nav-link[data-cat="espectaculos"]:hover,
.info247-nav-link[data-cat="sociedad"]:hover {
    color: #8B0010;
}

/* FILTROS */
.info247-filters {
    background: #F7F5F1;
    border-bottom: 1px solid #ddd;
    position: relative;
}

/* Bloque "mobile-only" del drawer: solo visible dentro del drawer en mobile.
   En desktop nunca aparece. La regla complementaria (ocultar el bloque
   desktop dentro del drawer mobile) está dentro del @media (max-width:1024px). */
.info247-filters-mobile-only {
    display: none;
}

.info247-filters-inner {
    width: 90%;
    max-width: none;
    margin: 0 auto;
    padding: 8px 0;
    display: flex;
    align-items: center;
    gap: 10px;
    overflow-x: auto;
}

.info247-filters-inner::-webkit-scrollbar {
    display: none;
}

.info247-filters-label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
    color: #aaa;
    padding-right: 10px;
    border-right: 1px solid #ddd;
}

.info247-filter-btn {
    background: none;
    border: 1px solid #ddd;
    padding: 4px 12px;
    border-radius: 0;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
}

.info247-filter-btn:hover {
    background: #ddd;
}

.info247-filter-btn.active {
    background: #CC0018;
    color: #fff;
    border-color: #CC0018;
}

/* CONTENEDOR PRINCIPAL */
.info247-container {
    width: 90%;
    max-width: none;
    margin: 0 auto;
    padding: 8px 0 24px;
}

/* SECCIONES */
.info247-section {
    margin-bottom: 40px;
}

.info247-section-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 12px;
    border-bottom: 2px solid #ddd;
    margin-bottom: 20px;
}

.info247-section-bar {
    width: 5px;
    height: 24px;
    border-radius: 2px;
}

.info247-section-title {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 4px;
    text-transform: uppercase;
}

.info247-section-line {
    flex: 1;
    height: 1px;
    background: #ddd;
}

.info247-section-more {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #666;
    text-decoration: none;
    padding: 4px 12px;
    border: 1px solid #ddd;
    border-radius: 3px;
    transition: all 0.2s;
}

.info247-section-more:hover {
    background: #CC0018;
    color: #fff;
    border-color: #CC0018;
}

/* CARDS */
.info247-card {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    border-radius: 4px;
    background: #0d0d0d;
    transition: transform 0.2s, box-shadow 0.2s;
}

.info247-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3);
}

.info247-card-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

.info247-card-grad {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.80) 0%, rgba(0, 0, 0, 0.30) 45%, rgba(0, 0, 0, 0.10) 100%);
    pointer-events: none;
    z-index: 1;
    /* Transicion suave del gradient cuando se intensifica al hover */
    transition: background 380ms cubic-bezier(0.22, 0.61, 0.36, 1);
}

.info247-card-top {
    position: absolute;
    top: 12px;
    left: 12px;
    right: 12px;
    display: flex;
    justify-content: space-between;
    z-index: 2;
}
/* Cuando el pill esta dentro del body (movido por JS), va en flujo antes del medio */
.info247-card-body > .info247-card-top {
    position: static;
    top: auto;
    left: auto;
    right: auto;
    justify-content: flex-start;
    align-items: stretch;
    gap: 8px;
    margin-bottom: 6px;
}
.info247-card-body > .info247-card-top .info247-pill {
    font-size: 12px !important;
    line-height: 1.2 !important;
    padding: 3px 8px !important;
    display: inline-flex;
    align-items: center;
}
.info247-card-body > .info247-card-top .info247-card-src {
    font-size: 12px !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    padding: 3px 8px !important;
    display: inline-flex;
    align-items: center;
    background: rgba(0, 0, 0, 0.6);
    color: rgba(255, 255, 255, 0.5) !important;
    border-radius: 3px;
}

.info247-pill {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 0;
}

.info247-pill-red {
    background: #CC0018;
    color: #fff;
}

.info247-pill-dark {
    background: rgba(0, 0, 0, 0.65);
    backdrop-filter: blur(3px);
    color: rgba(255, 255, 255, 0.8);
}

.info247-card-body {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 0 14px 14px;
    z-index: 2;
}

.info247-card-src {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.5);
    margin-bottom: 5px;
}

.info247-card-title {
    font-weight: 600;
    line-height: 1.15;
    color: #fff;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
    font-size: 18px;
}

.info247-card-summary {
    font-family: 'Source Sans 3', sans-serif;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.7);
    margin-top: 6px;
    line-height: 1.4;
}

/* GRID DESTACADAS */
.info247-destacadas-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 12px;
}

.info247-card-hero {
    grid-row: span 2;
    height: 420px;
}

.info247-card-hero .info247-card-title {
    font-size: 28px;
}

.info247-destacadas-side {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.info247-card-side {
    height: 204px;
}

/* === Layout 1+4 (hero 3:2 + grilla 2x2 cuadrada a la derecha) === */
.info247-destacadas-grid.info247-destacadas-grid--14 {
    grid-template-columns: 3fr 2fr;
}
.info247-destacadas-grid--14 .info247-card-hero {
    grid-row: auto;
    height: auto;
    aspect-ratio: 3 / 2;
}
.info247-destacadas-grid--14 .info247-destacadas-side {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 12px;
}
.info247-destacadas-grid--14 .info247-card-side {
    height: auto;
    aspect-ratio: 1 / 1;
}

/* GRID ÚLTIMO MOMENTO */
.info247-ultimo-momento-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.info247-card-um {
    height: 220px;
}

/* GRID 4 COLUMNAS */
.info247-grid-4 {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 12px;
}

.info247-card-lead {
    height: 270px;
}

.info247-card-item {
    height: 270px;
}

.info247-card-lead .info247-card-title {
    font-size: 28px;
}
.info247-card-lead .info247-card-src {
    font-size: 12px;
    margin-bottom: 8px;
}

/* GRID 3 COLUMNAS */
.info247-grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.info247-grid-3 .info247-card {
    height: 260px;
}

/* DEPORTES */
.info247-deportes-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.info247-card-dep-lead {
    height: 320px;
}

.info247-card-dep-lead .info247-card-title {
    font-size: 22px;
}

.info247-deportes-lista {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.info247-deporte-item {
    background: #fff;
    padding: 14px;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
}

.info247-deporte-item:hover {
    background: #FFF6F7;
    transform: translateX(3px);
}

.info247-deporte-src {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #CC0018;
    margin-bottom: 5px;
}

.info247-deporte-titulo {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
}

/* FOOTER */
.info247-footer {
    background: #0D0D0D;
    margin-top: 40px;
    padding: 30px 0 40px;
    width: 100%;
}

.info247-footer-inner {
    width: 90%;
    max-width: none;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
}

.info247-footer-logo {
    display: flex;
    align-items: center;
    gap: 8px;
}

.info247-footer-logo-li {
    font-family: 'Oswald', sans-serif;
    font-size: 22px;
    font-weight: 700;
    color: #fff;
}

.info247-footer-logo-divider {
    width: 3px;
    height: 24px;
    background: #CC0018;
}

.info247-footer-logo-ln {
    font-family: 'Oswald', sans-serif;
    font-size: 22px;
    font-weight: 700;
    color: #CC0018;
}

.info247-footer-nav {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.info247-footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 15px 25px;
}

.info247-footer-links a {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #666;
    text-decoration: none;
}

.info247-footer-links a:hover {
    color: #fff;
}

/* Temáticas en rojo institucional, igual que en el menú principal */
.info247-footer-links-tematicas a {
    color: #CC0018;
}
.info247-footer-links-tematicas a:hover {
    color: #ff3850;
}

/* === Botón "ir arriba" — fixed bottom-right, aparece tras 400px de scroll === */
#info247-scroll-top {
    position: fixed;
    right: 20px;
    bottom: 20px;
    width: 44px;
    height: 44px;
    border: none;
    border-radius: 50%;
    background: #CC0018;
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0,0,0,0.25);
    z-index: 900;
    opacity: 0;
    transform: translateY(8px);
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease, background .2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
#info247-scroll-top.visible {
    opacity: 0.92;
    transform: translateY(0);
    pointer-events: auto;
}
#info247-scroll-top:hover {
    opacity: 1;
    background: #ff1f3a;
}
/* Ocultarlo cuando está abierto el lector desktop (toma el viewport completo) */
body.info247-reader-open #info247-scroll-top { display: none !important; }
/* Tendencias: solo en la portada completa, no en el reader */
body.info247-reader-open .info247-tendencias-widget { display: none !important; }
@media (max-width: 768px) {
    #info247-scroll-top {
        right: 14px;
        bottom: 14px;
        width: 40px;
        height: 40px;
    }
}

.info247-footer-copyright {
    font-size: 11px;
    color: #444;
    text-align: right;
    line-height: 1.5;
}

/* ===== LECTOR DESKTOP (50% IZQUIERDA / 50% DERECHA) ===== */
.info247-reader {
    position: fixed;
    top: 64px;
    left: 0;
    right: 0;
    bottom: 0;
    background: #ECEAE6;
    z-index: 9000;
    display: flex;
    overflow: hidden;
}

/* Panel izquierdo 50% */
.info247-reader-left {
    width: 50% !important;
    background: #F5F3EF !important;
    border-right: 1px solid #ddd !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}

/* Header y filtros */
.info247-reader-header {
    background: #fff;
    padding: 12px 16px;
    border-bottom: 2px solid #ddd;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
}

.info247-reader-header span {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
    color: #666;
}

.info247-reader-back,
.info247-reader-close {
    background: #CC0018;
    color: #fff;
    border: none;
    padding: 5px 12px;
    border-radius: 3px;
    font-size: 10px;
    font-weight: 700;
    cursor: pointer;
}

.info247-reader-close {
    background: #1e1e1e;
}

/* Acciones del lector (abrir original + cerrar) — agrupadas a la derecha del header */
.info247-reader-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}
.info247-reader-open-original {
    display: inline-block;
    padding: 5px 12px;
    border-radius: 3px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    text-decoration: none;
    background: #fff;
    color: #0D0D0D;
    transition: background 0.2s, color 0.2s;
    white-space: nowrap;
}
.info247-reader-open-original:hover {
    background: #CC0018;
    color: #fff;
}

.info247-reader-filters {
    padding: 8px 12px;
    display: flex;
    gap: 8px;
    overflow-x: auto;
    background: #fff;
    border-bottom: 1px solid #ddd;
    flex-shrink: 0;
}

.info247-reader-filter {
    background: none;
    border: 1px solid #ddd;
    color: #CC0018;
    padding: 4px 10px;
    border-radius: 0;
    font-size: 9px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    line-height: 1.2;
    /* Centrar el contenido vertical y horizontalmente — necesario cuando hay
       botones de 1 linea junto a botones de 2 lineas para que queden alineados. */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* Botones de 2 lineas (POLICIALES/JUDICIALES, ECONOMÍA/PRODUCCIÓN, CULTURA/ESPECTÁCULOS).
   Padding vertical reducido para que la altura sea similar a los de 1 linea. */
.info247-reader-filter--2lines {
    padding: 3px 10px;
    line-height: 1.15;
}

.info247-reader-filter.active {
    background: #CC0018;
    color: #fff;
    border-color: #CC0018;
}


/* ===== ESTILOS DE CADA NOTICIA EN EL READER ===== */
/* Cada noticia ocupa el 100% del ancho de su columna */
.info247-rn-item {
    display: block !important;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 12px;
    cursor: pointer;
    border: 1px solid #eee;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    transition: all 0.2s;
}

.info247-rn-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.info247-rn-item.active {
    border: 2px solid #CC0018;
}

/* CONTENEDOR DE LA IMAGEN - BLOQUE PURO */
.info247-rn-photo {
    display: block !important;
    width: 100% !important;
    height: 140px !important;
    overflow: hidden !important;
    background: #0d0d0d !important;
    position: relative !important;
}

/* LA IMAGEN - FORZADA A OCUPAR TODO */
.info247-rn-photo img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
}

/* Cuerpo del texto */
.info247-rn-body {
    display: block !important;
    padding: 10px 12px !important;
    background: #fff !important;
}

.info247-rn-src {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #CC0018;
    margin-bottom: 5px;
    display: block;
}

.info247-rn-title {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;
    color: #111;
    display: block;
}


/* Panel derecho 50% */
.info247-reader-right {
    width: 50% !important;
    display: flex !important;
    flex-direction: column !important;
    background: #fff !important;
    overflow: hidden !important;
}

.info247-reader-right-header {
    background: #0D0D0D;
    padding: 10px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #CC0018;
    flex-shrink: 0;
}

.info247-reader-source {
    display: flex;
    align-items: center;
    gap: 10px;
}

.info247-reader-dot {
    width: 8px;
    height: 8px;
    background: #CC0018;
    border-radius: 50%;
}

.info247-reader-source-name {
    font-size: 14px;
    font-weight: 700;
    color: #fff;
}

.info247-reader-source-cat {
    font-size: 11px;
    color: #aaa;
}

.info247-reader-open {
    background: #CC0018;
    color: #fff;
    border: none;
    padding: 6px 14px;
    border-radius: 3px;
    font-size: 10px;
    font-weight: 700;
    cursor: pointer;
}

.info247-reader-frame {
    flex: 1;
}

.info247-reader-frame iframe {
    width: 100%;
    height: 100%;
    border: none;
}

.info247-reader-footer {
    background: #F5F3EF;
    padding: 8px 18px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #ddd;
    flex-shrink: 0;
}

.info247-reader-prev,
.info247-reader-next {
    background: none;
    border: 1px solid #ddd;
    padding: 5px 12px;
    border-radius: 3px;
    font-size: 10px;
    font-weight: 700;
    cursor: pointer;
    margin: 0 3px;
}

.info247-reader-actions {
    display: flex;
    align-items: center;
    gap: 4px;
}

.info247-reader-share {
    background: none;
    border: 1px solid #ddd;
    width: 28px;
    height: 28px;
    border-radius: 3px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    color: #444;
    transition: background .15s, color .15s, border-color .15s;
    padding: 0;
}
.info247-reader-share:hover {
    background: #fff;
    border-color: #999;
}
#reader-share-wa:hover { color: #25D366; border-color: #25D366; }
#reader-share-copy:hover { color: #C8102E; border-color: #C8102E; }

/* Responsive del reader */
@media (max-width: 1024px) {
    .info247-reader {
        flex-direction: column;
        top: 64px;
    }
    .info247-reader-left {
        width: 100% !important;
        height: 50%;
    }
    .info247-reader-right {
        width: 100% !important;
        height: 50%;
    }
}
/* BOTTOM SHEET MOBILE */
.info247-bs-overlay {
    position: fixed;
    inset: 0;
    z-index: 900;
    background: rgba(0, 0, 0, 0);
    pointer-events: none;
    transition: background 0.25s;
}

.info247-bs-overlay.open {
    background: rgba(0, 0, 0, 0.6);
    pointer-events: auto;
}

.info247-bs {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    height: 88vh;
    background: #fff;
    border-radius: 16px 16px 0 0;
    display: flex;
    flex-direction: column;
    transform: translateY(100%);
    transition: transform 0.32s ease;
    box-shadow: 0 -6px 30px rgba(0, 0, 0, 0.3);
}

.info247-bs.open {
    transform: translateY(0);
}

.info247-bs-handle {
    padding: 10px 0 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    cursor: grab;
    touch-action: none;
}

.info247-bs-handle:active {
    cursor: grabbing;
}

.info247-bs-handle-bar {
    width: 50px;
    height: 5px;
    background: #bbb;
    border-radius: 3px;
}

.info247-bs-bar {
    background: #0D0D0D;
    padding: 10px 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #CC0018;
}

.info247-bs-source {
    display: flex;
    align-items: center;
    gap: 8px;
}

.info247-bs-dot {
    width: 8px;
    height: 8px;
    background: #CC0018;
    border-radius: 50%;
}

.info247-bs-source-name {
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    color: #fff;
}

.info247-bs-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.info247-bs-open-original {
    display: inline-block;
    padding: 5px 10px;
    border-radius: 3px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    text-decoration: none;
    background: #fff;
    color: #0D0D0D;
    transition: background 0.2s, color 0.2s;
    white-space: nowrap;
}
.info247-bs-open-original:hover {
    background: #CC0018;
    color: #fff;
}

.info247-arrow-red {
    color: #CC0018 !important;
    font-size: 1.15em;
    font-weight: 900;
    -webkit-text-fill-color: #CC0018;
}
.info247-reader-open-original:hover .info247-arrow-red,
.info247-bs-open-original:hover .info247-arrow-red {
    color: #fff !important;
    -webkit-text-fill-color: #fff;
}

.info247-bs-close {
    background: #fff;
    color: #1e1e1e;
    border: none;
    width: 38px;
    height: 38px;
    padding: 0;
    border-radius: 50%;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.info247-bs-hero {
    height: 200px;
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
    /* Compensar el padding del scroll para que la foto vaya edge-to-edge */
    margin: -16px -16px 16px;
}

.info247-bs-hero img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.info247-bs-hero-grad {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, transparent 30%, rgba(0, 0, 0, 0.85) 100%);
}

.info247-bs-hero-text {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20px 16px 14px;
}

.info247-bs-hero-cat {
    display: inline-block;
    background: #CC0018;
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 3px;
    margin-bottom: 8px;
}

.info247-bs-hero-title {
    /* Mismas reglas que el título de las cards de portada (info247-card-title)
       para que el lector tenga la misma identidad tipográfica. */
    font-family: 'Barlow Condensed', 'Segoe UI', sans-serif;
    font-size: 26px;
    font-weight: 600;
    color: #fff;
    line-height: 1.15;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}

.info247-bs-scroll {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
}

.info247-bs-body {
    font-family: 'Source Sans 3', 'Segoe UI', sans-serif;
    font-size: 17px;
    line-height: 1.55;
    color: #222;
}

.info247-bs-fecha {
    font-family: 'Source Sans 3', 'Segoe UI', sans-serif;
    font-size: 13px;
    color: #888;
    font-style: italic;
    /* Va ARRIBA de la bajada — sin margin-top, margin-bottom para separarlo del body */
    margin: 0 0 8px 0;
}

.info247-bs-cta {
    background: #f5f5f5;
    border: 1px solid #ddd;
    padding: 12px 14px;
    border-radius: 6px;
    margin-top: 20px;
    text-align: center;
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.info247-bs-cta-text {
    color: #555;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
}

.info247-bs-cta .info247-bs-cta-source {
    font-weight: 800;
    color: #0D0D0D;
}

.info247-bs-cta:hover {
    background: #ebebeb;
    border-color: #bbb;
}

.info247-bs-footer {
    background: #0D0D0D;
    padding: 12px 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
}

.info247-bs-prev,
.info247-bs-next {
    background: none;
    border: 1px solid #333;
    padding: 8px 16px;
    border-radius: 4px;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
}

.info247-bs-share {
    background: none;
    border: 1px solid #333;
    width: 36px;
    height: 36px;
    border-radius: 4px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    padding: 0;
    transition: background .15s, color .15s, border-color .15s;
}
.info247-bs-share:active,
.info247-bs-share:hover {
    background: #1a1a1a;
}
#bs-share-wa:hover { color: #25D366; border-color: #25D366; }
#bs-share-copy:hover { color: #fff; border-color: #fff; }

.info247-toast {
    position: fixed;
    left: 50%;
    bottom: 32px;
    transform: translateX(-50%) translateY(20px);
    background: #1a1a1a;
    color: #fff;
    padding: 10px 18px;
    border-radius: 24px;
    font-size: 13px;
    font-weight: 600;
    z-index: 100000;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s, transform .2s;
    box-shadow: 0 4px 20px rgba(0, 0, 0, .25);
}
.info247-toast.visible {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* RESPONSIVE */
@media (max-width: 1024px) {
    /* Cajas internas mas anchas en mobile/tablet (95% en lugar de 90%) */
    .info247-header-inner,
    .info247-nav-inner,
    .info247-filters-inner,
    .info247-container,
    .info247-footer-inner {
        width: 95% !important;
    }
    .info247-ultimo-momento-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .info247-grid-4 {
        grid-template-columns: repeat(2, 1fr);
    }
    .info247-grid-3 {
        grid-template-columns: repeat(2, 1fr);
    }
    .info247-destacadas-grid {
        grid-template-columns: 1fr;
    }
    .info247-destacadas-side {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .info247-card-hero {
        height: 350px;
    }
    /* En mobile, el layout 1+4 colapsa: TODAS las cards (hero y sides) en
       una sola columna y en 3:2, una abajo de la otra. */
    .info247-destacadas-grid.info247-destacadas-grid--14 {
        grid-template-columns: 1fr;
    }
    .info247-destacadas-grid--14 .info247-card-hero,
    .info247-destacadas-grid--14 .info247-card-side {
        aspect-ratio: 3 / 2;
        height: auto;
    }
    .info247-destacadas-grid--14 .info247-destacadas-side {
        display: flex;
        flex-direction: column;
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .info247-footer-inner {
        flex-direction: column;
        text-align: center;
    }
    .info247-footer-copyright {
        text-align: center;
    }
    .info247-reader {
        flex-direction: column;
    }
    .info247-reader-left {
        width: 100% !important;
        height: 45%;
    }
    .info247-reader-right {
        width: 100% !important;
        height: 55%;
    }
    .info247-reader-list {
        grid-template-columns: 1fr 1fr !important;
    }
}

@media (max-width: 768px) {
    .info247-container {
        padding: 8px !important;
    }
    .info247-destacadas-grid,
    .info247-ultimo-momento-grid,
    .info247-grid-4,
    .info247-grid-3,
    .info247-deportes-grid {
        gap: 6px !important;
    }
    .info247-section {
        margin-bottom: 20px !important;
    }
    .info247-ultimo-momento-grid {
        grid-template-columns: 1fr;
    }
    .info247-grid-4 {
        grid-template-columns: 1fr;
    }
    .info247-grid-3 {
        grid-template-columns: 1fr;
    }
    .info247-destacadas-side {
        grid-template-columns: 1fr;
    }
    .info247-deportes-grid {
        grid-template-columns: 1fr;
    }
    /* Header mobile compacto: logo + hora + ubicacion en 1 linea */
    .info247-header {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        z-index: 100 !important;
    }
    .info247-portada-wrapper {
        padding-top: 84px !important;
    }
    /* Header móvil: 2 filas via flex-wrap + order
       Fila 1: logo · search · ubicación · hamburguesa
       Fila 2: dólar · fútbol · clima */
    .info247-header-inner {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        gap: 6px !important;
        padding: 6px 10px !important;
        row-gap: 6px !important;
    }
    .info247-logo-area {
        flex-shrink: 0 !important;
        margin-right: auto !important;
        order: 1 !important;
    }
    .info247-logo { height: 34px !important; }
    .info247-live-badge, .info247-ticker { display: none !important; }

    /* Lupa de búsqueda: fila 1, justo antes del rayo de tendencias */
    .info247-search-btn {
        font-size: 13px !important;
        padding: 4px 10px !important;
        flex-shrink: 0 !important;
        order: 2 !important;
    }
    .info247-search-btn i { font-size: 14px !important; }

    /* Rayo de tendencias: fila 1, al lado del buscador. Compacto: solo el icono.
       Mismas medidas que el search-btn para que no rompa la grilla. */
    .info247-tendencias-widget {
        order: 3 !important;
        margin-left: 0 !important;
    }
    .info247-tendencias-widget .info247-tendencias-header {
        padding: 4px 10px !important;
        gap: 0 !important;
        background: rgba(255, 255, 255, 0.1) !important;
    }
    .info247-tendencias-widget .info247-tendencias-label,
    .info247-tendencias-widget .info247-tendencias-primera,
    .info247-tendencias-widget .info247-tendencias-count {
        display: none !important;
    }
    .info247-tendencias-widget .info247-tendencias-icon {
        font-size: 14px !important;
        color: #FFB800 !important;
    }
    /* Dropdown anclado al viewport por la derecha en mobile, no al widget
       (sino se cuelga afuera del header inner). */
    .info247-tendencias-widget .info247-tendencias-dropdown {
        position: fixed !important;
        top: 110px !important;
        left: auto !important;
        right: 8px !important;
        min-width: 240px !important;
        max-width: 92vw !important;
    }

    .info247-ubicacion-header {
        flex-shrink: 0 !important;
        order: 4 !important;
    }
    .info247-ubicacion-display { padding: 2px 8px !important; gap: 4px !important; }
    .info247-ubicacion-icon { font-size: 14px !important; color: #CC0018 !important; }
    .info247-ubicacion-texto { font-size: 12px !important; }
    .info247-ubicacion-btn { font-size: 8px !important; padding: 2px 5px !important; }

    .info247-hamburger-btn {
        display: inline-flex !important;
        padding: 5px 11px !important;
        font-size: 14px !important;
        flex-shrink: 0 !important;
        order: 5 !important;
    }
    .info247-hamburger-btn i { font-size: 15px !important; }

    /* Salto de fila después del hamburger */
    .info247-mobile-row-break {
        display: block !important;
        flex-basis: 100% !important;
        height: 0 !important;
        order: 6 !important;
    }

    /* Fila 2: dólar · fútbol · clima (después del row-break order:6) */
    .info247-dolar-widget   { order: 7 !important; }
    .info247-futbol-widget  { order: 8 !important; }
    .info247-clima-widget   { order: 9 !important; }

    /* Compactar chips en mobile */
    .info247-info-chip,
    .info247-clima-chip {
        padding: 3px 10px !important;
        gap: 5px !important;
    }
    .info247-info-chip-label { font-size: 13px !important; }
    .info247-info-chip-icon { font-size: 14px !important; }
    .info247-clima-temp { font-size: 14px !important; }
    .info247-clima-icon { font-size: 14px !important; }

    /* ============================================
       DRAWER MOBILE (oculta nav y filtros y los muestra en panel)
       ============================================ */
    .info247-mobile-drawer-overlay {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.6);
        z-index: 9997;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.25s;
    }
    .info247-mobile-drawer-overlay.open {
        opacity: 1;
        pointer-events: auto;
    }
    .info247-mobile-drawer-wrap {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        width: 85%;
        max-width: 320px;
        background: #fff;
        color: #0D0D0D;
        z-index: 9998;
        transform: translateX(100%);
        transition: transform 0.3s ease;
        overflow-y: auto;
        padding: 50px 0 30px;
        border-left: 3px solid #CC0018;
    }
    .info247-mobile-drawer-wrap.open {
        transform: translateX(0);
    }
    .info247-drawer-close-btn {
        display: inline-flex;
        position: absolute;
        top: 10px;
        right: 10px;
        background: rgba(0,0,0,0.06);
        color: #0D0D0D;
        border: none;
        width: 36px;
        height: 36px;
        border-radius: 50%;
        font-size: 16px;
        cursor: pointer;
        align-items: center;
        justify-content: center;
        z-index: 1;
    }
    .info247-drawer-close-btn:hover { background: rgba(0,0,0,0.12); }

    /* Nav y filtros dentro del drawer: layout vertical, fondo blanco */
    .info247-mobile-drawer-wrap .info247-nav {
        position: static !important;
        top: auto !important;
        background: transparent !important;
        border: none !important;
    }
    .info247-mobile-drawer-wrap .info247-nav-inner {
        flex-direction: column !important;
        align-items: stretch !important;
        width: 100% !important;
        padding: 0 !important;
    }
    .info247-mobile-drawer-wrap .info247-nav-link {
        text-align: left !important;
        padding: 14px 20px !important;
        border-bottom: 1px solid rgba(0,0,0,0.08) !important;
        font-size: 14px !important;
        letter-spacing: 1.5px !important;
        color: #0D0D0D !important;
    }
    /* Secciones temáticas en rojo institucional dentro del drawer (igual que en desktop) */
    .info247-mobile-drawer-wrap .info247-nav-link[data-cat="politica"],
    .info247-mobile-drawer-wrap .info247-nav-link[data-cat="policiales"],
    .info247-mobile-drawer-wrap .info247-nav-link[data-cat="judiciales"],
    .info247-mobile-drawer-wrap .info247-nav-link[data-cat="deportes"],
    .info247-mobile-drawer-wrap .info247-nav-link[data-cat="economia"],
    .info247-mobile-drawer-wrap .info247-nav-link[data-cat="cultura"],
    .info247-mobile-drawer-wrap .info247-nav-link[data-cat="espectaculos"],
    .info247-mobile-drawer-wrap .info247-nav-link[data-cat="sociedad"] {
        color: #CC0018 !important;
    }
    /* Sección activa: fondo rojo sólido + texto blanco (mismo patrón que los filtros de fuente).
       Esto pisa el rojo de las temáticas, así no se confunde la activa con las no-activas. */
    .info247-mobile-drawer-wrap .info247-nav-link.active {
        background: #CC0018 !important;
        color: #fff !important;
    }
    /* Desdoble desktop/mobile: en mobile mostramos solo el bloque de medios
       plano alfabético (.info247-filters-mobile-only); ocultamos el bloque
       desktop con prioritarios + dropdown OTRAS FUENTES.
       (El reverso — ocultar mobile-only en desktop — está en la regla por
       fuera del @media: .info247-filters-mobile-only { display: none; }) */
    .info247-mobile-drawer-wrap .info247-filters-desktop-only {
        display: none !important;
    }
    .info247-mobile-drawer-wrap .info247-filters-mobile-only {
        display: block !important;
    }

    .info247-mobile-drawer-wrap .info247-filters {
        position: static !important;
        top: auto !important;
        background: transparent !important;
        border: none !important;
        margin-top: 8px !important;
        border-top: 1px solid rgba(0,0,0,0.1) !important;
        padding-top: 8px !important;
    }
    .info247-mobile-drawer-wrap .info247-filters-inner {
        flex-direction: column !important;
        align-items: stretch !important;
        width: 100% !important;
        padding: 0 !important;
        gap: 0 !important;
    }
    .info247-mobile-drawer-wrap .info247-filters-label {
        padding: 10px 20px 6px !important;
        color: #888 !important;
        font-size: 10px !important;
        letter-spacing: 2px !important;
    }
    .info247-mobile-drawer-wrap .info247-filter-btn,
    .info247-mobile-drawer-wrap .info247-filter-dropdown-item {
        font-family: inherit !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        line-height: 1.4 !important;
        letter-spacing: 0 !important;
        text-transform: uppercase !important;
        text-align: left !important;
        text-decoration: none !important;
        color: #0D0D0D !important;
        background: transparent !important;
        padding: 12px 20px !important;
        margin: 0 !important;
        border: none !important;
        border-bottom: 1px solid rgba(0,0,0,0.08) !important;
        border-radius: 0 !important;
        width: 100% !important;
        box-sizing: border-box !important;
        display: block !important;
        white-space: normal !important;
        cursor: pointer !important;
        appearance: none !important;
        -webkit-appearance: none !important;
    }
    .info247-mobile-drawer-wrap .info247-filter-btn.active {
        background: #CC0018 !important;
        color: #fff !important;
    }
    /* Lista plana de fuentes: ocultar el botón "OTRAS FUENTES ▼" y aplanar el dropdown */
    .info247-mobile-drawer-wrap .info247-filter-dropdown-btn {
        display: none !important;
    }
    .info247-mobile-drawer-wrap .info247-filter-dropdown {
        width: 100% !important;
        position: static !important;
        display: block !important;
    }
    .info247-mobile-drawer-wrap .info247-filter-dropdown-content {
        position: static !important;
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        border: none !important;
        border-radius: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        z-index: auto !important;
    }
    .info247-reader-list {
        grid-template-columns: 1fr !important;
    }
    .info247-reader-left {
        height: 40%;
    }
    .info247-reader-right {
        height: 60%;
    }

    /* Hero formato 3:2 en mobile */
    .info247-card-hero {
        aspect-ratio: 3 / 2 !important;
        height: auto !important;
    }
    /* Cards formato 3:2 en mobile */
    .info247-card-side,
    .info247-card-um,
    .info247-card-lead,
    .info247-card-item,
    .info247-card-dep-lead,
    .info247-grid-3 .info247-card,
    .info247-grid-4 .info247-card {
        aspect-ratio: 3 / 2 !important;
        height: auto !important;
    }
    /* Textos mobile */
    .info247-card-title {
        font-size: 20px !important;
        line-height: 1.25 !important;
        font-weight: 700 !important;
    }
    .info247-card-hero .info247-card-title,
    .info247-card-lead .info247-card-title {
        font-size: 22px !important;
        font-weight: 700 !important;
    }
    .info247-card-hero .info247-card-summary {
        font-size: 12px !important;
    }
    .info247-card-src {
        font-size: 11px !important;
        letter-spacing: 1px !important;
        margin-bottom: 4px !important;
    }
    .info247-pill {
        font-size: 11px !important;
        padding: 3px 8px !important;
    }
    .info247-card-body {
        padding: 0 10px 10px !important;
    }
    .info247-section-title {
        font-size: 14px !important;
    }
}

/* Forzar ancho completo y eliminar paddings verticales de Divi que crean gaps */
.et_pb_section, .et_pb_row, .et_pb_column {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
.et_pb_row {
    width: 100% !important;
}
body .et_pb_section .et_pb_row .et_pb_column {
    padding: 0 !important;
    margin: 0 !important;
}
.info247-portada-wrapper {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}




    /* ============================================
       WIDGET DE CLIMA
       ============================================ */
    .info247-clima-header {
        flex-shrink: 0;
        position: relative;
    }
    .info247-clima-widget {
        font-family: 'Barlow Condensed', sans-serif;
        position: relative;
    }
    .info247-clima-chip {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        background: rgba(255,255,255,0.1);
        color: #fff;
        border: none;
        padding: 4px 12px;
        border-radius: 20px;
        cursor: pointer;
        line-height: 1;
        transition: background 0.15s;
    }
    .info247-clima-chip:hover { background: rgba(255,255,255,0.2); }
    .info247-clima-icon {
        font-size: 18px;
        color: #FFD45F;
    }
    .info247-clima-temp {
        font-size: 18px;
        font-weight: 600;
        color: #fff;
    }
    .info247-clima-popup {
        position: absolute;
        top: calc(100% + 10px);
        right: 0;
        left: auto;
        background: #fff;
        color: #222;
        width: 480px;
        max-width: 92vw;
        max-height: 85vh;
        overflow-y: auto;
        border-radius: 8px;
        box-shadow: 0 8px 24px rgba(0,0,0,0.25);
        padding: 14px 14px 10px;
        z-index: 250;
    }
    .info247-clima-popup-section-title {
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 1.5px;
        color: #555;
        margin: 14px 0 8px;
        border-bottom: 1px solid #eee;
        padding-bottom: 4px;
    }
    .info247-clima-popup-hourly {
        display: flex;
        overflow-x: auto;
        gap: 4px;
        padding-bottom: 6px;
        margin-bottom: 4px;
        -webkit-overflow-scrolling: touch;
    }
    .info247-clima-popup-hourly::-webkit-scrollbar { height: 6px; }
    .info247-clima-popup-hourly::-webkit-scrollbar-thumb { background: #ddd; border-radius: 3px; }
    .info247-clima-hour {
        flex: 0 0 auto;
        min-width: 56px;
        text-align: center;
        background: #fafafa;
        border-radius: 6px;
        padding: 8px 4px;
    }
    .info247-clima-hour-label {
        font-size: 11px;
        font-weight: 700;
        color: #555;
        margin-bottom: 4px;
    }
    .info247-clima-hour-icon {
        font-size: 18px;
        margin: 4px 0;
        display: block;
    }
    .info247-clima-hour-temp {
        font-size: 13px;
        font-weight: 700;
        color: #0D0D0D;
    }
    .info247-clima-hour-prob {
        font-size: 10px;
        color: #4a90e2;
        margin-top: 2px;
        min-height: 12px;
    }
    .info247-clima-hour-prob i { margin-right: 2px; }
    .info247-clima-popup-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-bottom: 1px solid #eee;
        padding-bottom: 8px;
        margin-bottom: 10px;
    }
    .info247-clima-popup-ciudad {
        font-weight: 700;
        font-size: 15px;
        text-transform: uppercase;
        letter-spacing: 1px;
        color: #0D0D0D;
    }
    .info247-clima-popup-close {
        background: none;
        border: none;
        font-size: 22px;
        line-height: 1;
        cursor: pointer;
        color: #888;
        padding: 0 4px;
    }
    .info247-clima-popup-close:hover { color: #CC0018; }
    .info247-clima-popup-now {
        display: flex;
        align-items: center;
        gap: 14px;
        margin-bottom: 10px;
    }
    .info247-clima-popup-now-icon {
        font-size: 42px;
        color: #CC0018;
    }
    .info247-clima-popup-now-temp {
        font-size: 36px;
        font-weight: 700;
        line-height: 1;
        color: #0D0D0D;
    }
    .info247-clima-popup-now-desc {
        font-size: 13px;
        color: #555;
        margin-top: 2px;
    }
    .info247-clima-popup-meta {
        display: flex;
        justify-content: space-between;
        font-size: 12px;
        color: #555;
        background: #f5f5f5;
        padding: 8px 10px;
        border-radius: 6px;
        margin-bottom: 10px;
    }
    .info247-clima-popup-meta i { color: #CC0018; margin-right: 4px; }
    .info247-clima-popup-forecast {
        display: flex;
        overflow-x: auto;
        gap: 4px;
        padding-bottom: 6px;
        margin-bottom: 4px;
        -webkit-overflow-scrolling: touch;
    }
    .info247-clima-popup-forecast::-webkit-scrollbar { height: 6px; }
    .info247-clima-popup-forecast::-webkit-scrollbar-thumb { background: #ddd; border-radius: 3px; }
    .info247-clima-day {
        flex: 0 0 auto;
        min-width: 60px;
        text-align: center;
        background: #fafafa;
        border-radius: 6px;
        padding: 8px 4px;
        border: 1px solid transparent;
        cursor: pointer;
        font-family: inherit;
        transition: background 150ms, border-color 150ms;
    }
    .info247-clima-day:hover,
    .info247-clima-day:focus-visible {
        background: #fff;
        border-color: #CC0018;
        outline: none;
    }
    .info247-clima-popup-hint {
        font-size: 11px;
        color: #888;
        margin: -4px 0 6px;
        font-style: italic;
    }
    .info247-clima-detalle-volver {
        background: none;
        border: 0;
        color: #CC0018;
        font-weight: 700;
        font-size: 12px;
        cursor: pointer;
        padding: 4px 0;
        margin-bottom: 6px;
        font-family: inherit;
    }
    .info247-clima-detalle-volver:hover { text-decoration: underline; }
    .info247-clima-detalle-titulo {
        font-size: 16px;
        font-weight: 700;
        text-transform: capitalize;
        margin-bottom: 8px;
        color: #0D0D0D;
    }
    .info247-clima-detalle-resumen {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 8px 0;
        border-bottom: 1px solid #eee;
        margin-bottom: 8px;
    }
    .info247-clima-detalle-icon {
        font-size: 36px;
    }
    .info247-clima-detalle-temps {
        font-size: 22px;
        color: #0D0D0D;
    }
    .info247-clima-detalle-temps strong { font-weight: 700; }
    .info247-clima-detalle-temps span { color: #888; margin-left: 4px; font-size: 16px; }
    .info247-clima-detalle-desc {
        font-size: 13px;
        color: #555;
        margin-top: 2px;
    }
    .info247-clima-detalle-meta {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        font-size: 11px;
        color: #555;
        margin-bottom: 10px;
    }
    .info247-clima-detalle-meta i { color: #CC0018; margin-right: 3px; }
    .info247-clima-day-name {
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        color: #555;
        margin-bottom: 4px;
    }
    .info247-clima-day-icon {
        font-size: 22px;
        color: #CC0018;
        margin-bottom: 4px;
    }
    .info247-clima-day-temps {
        font-size: 12px;
        color: #0D0D0D;
    }
    .info247-clima-day-temps strong { font-weight: 700; }
    .info247-clima-day-temps span { color: #888; margin-left: 2px; }
    .info247-clima-day-prob {
        font-size: 10px;
        color: #4a90e2;
        margin-top: 2px;
    }
    .info247-clima-popup-source {
        font-size: 10px;
        color: #999;
        text-align: right;
        margin-top: 4px;
    }
    @media (max-width: 768px) {
        .info247-clima-popup,
        .info247-info-popup {
            position: fixed;
            top: 86px;
            bottom: 12px;
            left: 12px;
            right: 12px;
            width: auto;
            max-height: none;
        }
    }

    .info247-ubicacion-widget {
        font-family: 'Barlow Condensed', sans-serif;
    }
    .info247-ubicacion-display {
        display: flex;
        align-items: center;
        gap: 8px;
        background: rgba(255,255,255,0.1);
        padding: 4px 12px;
        border-radius: 20px;
    }
    .info247-ubicacion-icon {
        font-size: 20px;
        color: #CC0018;
    }
    .info247-ubicacion-texto {
        font-size: 17px;
        color: #fff;
        font-weight: 400;
    }
    .info247-ubicacion-texto strong {
        color: #fff;
        font-weight: 500;
    }
    .info247-ubicacion-btn {
        background: #CC0018;
        color: #fff;
        border: none;
        padding: 3px 10px;
        border-radius: 15px;
        font-size: 9px;
        font-weight: 700;
        cursor: pointer;
    }
    .info247-ubicacion-selector {
        position: absolute;
        top: 50px;
        right: 20px;
        background: #fff;
        padding: 12px;
        border-radius: 8px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.2);
        display: flex;
        gap: 10px;
        z-index: 200;
    }
    .info247-ubicacion-selector select {
        padding: 5px 10px;
        border-radius: 4px;
        border: 1px solid #ddd;
    }
    @media (max-width: 768px) {
        .info247-ubicacion-selector {
            position: fixed;
            top: auto;
            bottom: 80px;
            left: 20px;
            right: 20px;
        }
    }

    /* Base del listado */
    .info247-reader-list {
        flex: 1;
        overflow-y: auto;
        padding: 12px;
    }

    /* UNICO BLOQUE PARA LECTOR 2 COLUMNAS */
    .info247-reader-list {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 20px !important;
        padding: 16px !important;
        overflow-y: auto !important;
        flex: 1;
        min-height: 0;
    }

    #info247-reader-list .info247-card {
        position: relative !important;
        width: 100% !important;
        padding-bottom: 66.6667% !important;
        height: 0 !important;
        min-height: auto !important;
        margin: 0 !important;
    }

    #info247-reader-list .info247-card .info247-card-img {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    #info247-reader-list .info247-card .info247-card-grad,
    #info247-reader-list .info247-card .info247-card-body {
        position: absolute !important;
    }
    /* Cuando el chip de categoría está dentro del body (estructura nueva,
       igualada con la portada), va en flujo, no absolute */
    #info247-reader-list .info247-card .info247-card-body > .info247-card-top {
        position: static !important;
    }

    /* Separadores de seccion en el listado del reader */
    #info247-reader-list .info247-rl-section {
        grid-column: 1 / -1;
        display: flex;
        align-items: center;
        gap: 10px;
        margin: 6px 0 2px;
    }
    #info247-reader-list .info247-rl-bar {
        width: 4px;
        height: 18px;
        border-radius: 2px;
        flex-shrink: 0;
    }
    #info247-reader-list .info247-rl-title {
        font-size: 13px;
        font-weight: 700;
        letter-spacing: 2px;
        color: #111;
        text-transform: uppercase;
        white-space: nowrap;
    }
    #info247-reader-list .info247-rl-line {
        flex: 1;
        height: 1px;
        background: #ddd;
    }


/* Dropdown de fuentes - VERSIÓN SIMPLIFICADA */
.info247-filter-dropdown {
    position: relative;
    display: inline-block;
}

.info247-filter-dropdown-btn {
    cursor: pointer;
}

.info247-filter-dropdown-content {
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    min-width: 180px;
    max-height: min(70vh, 480px);
    overflow-y: auto;
    overscroll-behavior: contain;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    border-radius: 4px;
    margin-top: 4px;
    padding: 4px 0;
    display: none;
    z-index: 9998;
}

.info247-filter-dropdown-content.show {
    display: block !important;
}

.info247-filter-dropdown-content a,
.info247-filter-dropdown-content .info247-filter-btn {
    display: block;
    width: 100%;
    text-align: left;
    border: none;
    background: none;
    padding: 5px 14px;
    margin: 0;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
    line-height: 1.3;
    text-transform: uppercase;
    color: #333;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
}

.info247-filter-dropdown-content a:hover,
.info247-filter-dropdown-content .info247-filter-btn:hover {
    background: #f0f0f0;
}

/* ===== HEADER COMPACTO CUANDO EL LECTOR ESTA ABIERTO ===== */
body.info247-reader-open .info247-header {
    padding: 0 !important;
    border-bottom-width: 2px !important;
    right: 50% !important;
    height: 42px !important;
    box-sizing: border-box !important;
}
body.info247-reader-open .info247-header-inner {
    padding: 0 !important;
    height: 100% !important;
    align-items: center !important;
}
body.info247-reader-open .info247-logo {
    height: 28px !important;
}
body.info247-reader-open .info247-search-btn,
body.info247-reader-open .info247-ubicacion-header,
body.info247-reader-open .info247-clima-widget,
body.info247-reader-open .info247-dolar-widget,
body.info247-reader-open .info247-futbol-widget {
    display: none !important;
}
body.info247-reader-open .info247-reader-header {
    display: none !important;
}
body.info247-reader-open .info247-reader {
    top: 0 !important;
}
body.info247-reader-open .info247-reader-left {
    padding-top: 42px !important;
}
body.info247-reader-open .info247-reader-right-header {
    padding: 0 20px !important;
    height: 42px !important;
    box-sizing: border-box !important;
}

/* ===========================================================
   PÁGINAS ESTÁTICAS (Quiénes somos, privacidad, términos)
   =========================================================== */
.info247-pagina-inst-volver {
    font-family: 'Oswald', sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
    color: #fff;
    text-decoration: none;
    margin-left: auto;
    padding: 8px 14px;
    border: 1px solid rgba(255,255,255,0.25);
    border-radius: 4px;
    transition: background .15s ease, border-color .15s ease;
}
.info247-pagina-inst-volver:hover {
    background: #CC0018;
    border-color: #CC0018;
}

.info247-pagina-inst {
    background: #ECEAE6;
    min-height: calc(100vh - 64px - 240px);
    padding: 60px 20px;
}
.info247-pagina-inst-article {
    max-width: 760px;
    margin: 0 auto;
    background: #fff;
    padding: 50px 60px;
    border-radius: 4px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    font-family: 'Source Sans 3', system-ui, sans-serif;
    color: #1a1a1a;
    line-height: 1.7;
    font-size: 17px;
}
.info247-pagina-inst-titulo {
    font-family: 'Oswald', sans-serif;
    font-size: 34px;
    font-weight: 700;
    line-height: 1.2;
    color: #0D0D0D;
    margin-bottom: 28px;
    padding-bottom: 18px;
    border-bottom: 3px solid #CC0018;
}
.info247-pagina-inst-cuerpo h2 {
    font-family: 'Oswald', sans-serif;
    font-size: 22px;
    font-weight: 700;
    color: #CC0018;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 36px;
    margin-bottom: 14px;
}
.info247-pagina-inst-cuerpo h3 {
    font-family: 'Oswald', sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: #0D0D0D;
    margin-top: 24px;
    margin-bottom: 10px;
}
.info247-pagina-inst-cuerpo p {
    margin-bottom: 16px;
}
.info247-pagina-inst-cuerpo ul,
.info247-pagina-inst-cuerpo ol {
    margin: 0 0 18px 24px;
}
.info247-pagina-inst-cuerpo li {
    margin-bottom: 6px;
}
.info247-pagina-inst-cuerpo a {
    color: #CC0018;
    text-decoration: underline;
}
.info247-pagina-inst-cuerpo a:hover {
    color: #ff1f3a;
}
.info247-pagina-inst-cuerpo strong {
    color: #0D0D0D;
}
.info247-pagina-inst-lead {
    font-size: 19px;
    color: #2a2a2a;
    border-left: 3px solid #CC0018;
    padding-left: 16px;
    margin-bottom: 24px !important;
}
.info247-pagina-inst-cierre {
    margin-top: 32px;
    font-size: 18px;
    color: #2a2a2a;
}
.info247-pagina-inst-firma {
    font-size: 22px;
    color: #CC0018;
    font-weight: 600;
    text-align: center;
    margin-top: 28px;
}

/* Tercera columna del footer: enlaces institucionales */
.info247-footer-links-institucional a {
    color: #888;
}
.info247-footer-links-institucional a:hover {
    color: #fff;
}

@media (max-width: 768px) {
    .info247-pagina-inst {
        padding: 30px 12px;
    }
    .info247-pagina-inst-article {
        padding: 30px 22px;
        font-size: 16px;
    }
    .info247-pagina-inst-titulo {
        font-size: 26px;
    }
    .info247-pagina-inst-cuerpo h2 {
        font-size: 19px;
    }
    .info247-pagina-inst-volver {
        font-size: 11px;
        padding: 6px 10px;
    }
}

/* ============================================
   BAJADA EN HOVER (solo desktop con puntero fino)
   ============================================
   Al pasar el mouse sobre una card aparece la bajada bajo el titulo,
   con un fade + slide. El gradiente del card se intensifica para que
   el texto extra siga siendo legible. En mobile/touch no se activa
   (los usuarios tap-an y abren la nota; un hover-state que ocupa
   espacio por un instante seria ruido visual).
*/
.info247-card-bajada {
    font-family: 'Source Sans 3', sans-serif;
    font-size: 13px;
    line-height: 1.35;
    color: rgba(255, 255, 255, 0.92);
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
    margin-top: 0;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    /* Transicion mas suave: cubic-bezier de easeOutQuart, mas larga, opacity
       arranca 60ms despues del expand para que no se sienta brusco. */
    transition:
        max-height 380ms cubic-bezier(0.22, 0.61, 0.36, 1),
        margin-top 380ms cubic-bezier(0.22, 0.61, 0.36, 1),
        opacity 280ms ease-out 60ms;
    /* Truncar a ~4 lineas si es muy larga */
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

/* Fecha relativa ("Publicado hace X min"). Por defecto oculta como la bajada;
   en hover desktop aparece debajo de la bajada con tipografia mas chica y
   discreta. */
.info247-card-fecha {
    font-family: 'Source Sans 3', sans-serif;
    font-size: 11px;
    line-height: 1.3;
    color: rgba(255, 255, 255, 0.6);
    font-style: italic;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
    margin-top: 0;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    /* Misma curva suave que la bajada, pero entra con un poco mas de delay para
       que aparezca "despues" de la bajada (lectura natural arriba->abajo). */
    transition:
        max-height 380ms cubic-bezier(0.22, 0.61, 0.36, 1),
        margin-top 380ms cubic-bezier(0.22, 0.61, 0.36, 1),
        opacity 280ms ease-out 140ms;
}

@media (hover: hover) and (pointer: fine) {
    .info247-card:hover .info247-card-bajada {
        max-height: 88px;       /* ~4 lineas a 13px/1.35 */
        opacity: 1;
        margin-top: 8px;
    }
    .info247-card:hover .info247-card-fecha {
        max-height: 18px;
        opacity: 1;
        margin-top: 6px;
    }
    /* Reforzar el gradiente cuando se expande la bajada */
    .info247-card:hover .info247-card-grad {
        background: linear-gradient(to top,
            rgba(0, 0, 0, 0.85) 0%,
            rgba(0, 0, 0, 0.6) 40%,
            rgba(0, 0, 0, 0) 80%);
    }
    /* HERO (primer destacada): bajada + fecha SIEMPRE visibles, sin necesidad
       de hover. Solo en desktop — en mobile la hero se comporta igual que las
       demas (oculta porque no hay hover). */
    .info247-card-hero .info247-card-bajada {
        max-height: 110px;
        opacity: 1;
        margin-top: 8px;
        font-size: 14px;
        -webkit-line-clamp: 5;
    }
    .info247-card-hero .info247-card-fecha {
        max-height: 18px;
        opacity: 1;
        margin-top: 6px;
    }
    .info247-card-hero .info247-card-grad {
        background: linear-gradient(to top,
            rgba(0, 0, 0, 0.85) 0%,
            rgba(0, 0, 0, 0.6) 40%,
            rgba(0, 0, 0, 0) 80%);
    }
    /* Hero al hover usa fonts mas grandes — dejamos mas margen para la bajada */
    .info247-card-hero:hover .info247-card-bajada {
        max-height: 110px;
        font-size: 14px;
        -webkit-line-clamp: 5;
    }
    /* Cards muy chicas (UM/DEP del grid de 4 columnas) — bajada mas compacta */
    .info247-card-um:hover .info247-card-bajada,
    .info247-card-item:hover .info247-card-bajada {
        max-height: 56px;
        -webkit-line-clamp: 3;
        font-size: 12px;
    }
}