/* ==========================================================
   1. LIMPIEZA Y ELEMENTOS OCULTOS
   ========================================================== */
.designed-by, 
.readmore_button, 
.featured_area { 
    display: none !important; 
}

.edit-post-visual-editor { 
    background-color: #ffffff; 
}

/* ==========================================================
   2. NAVEGACIÓN Y LOGOTIPO
   ========================================================== */
#website-navigation {
    background: #ffffff;
    height: 60px;
    z-index: 170;
    margin: 0 auto;
    border-bottom: 1px solid #dadada;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
}

.main-navbar .navbar-nav > li > a {
    font-family: "Roboto Condensed", sans-serif;
    font-size: 13px; /* Subido 1px para mejor legibilidad */
    text-transform: uppercase;
    color: #222222 !important; /* Texto oscuro, profesional */
    font-weight: bold;
}

/* Logotipo Móvil Primero */
.navbar-brand-wpz img {
    max-width: 120px; 
    height: auto;
    transition: max-width 0.3s ease;
}

@media (min-width: 992px) {
    .navbar-brand-wpz img {
        max-width: 200px;
    }
}

/* ==========================================================
   3. TIPOGRAFÍA EDITORIAL Y COLORES
   ========================================================== */
h2 {
    font-family: "Barlow Extra Bold", sans-serif;
    font-size: 1.5em; /* Aumentado para dar peso de "Titular" */
    color: #1a1a1a !important; /* Negro mate */
}

h3 {
    font-size: 1.2em;
    color: #333333;
}

.entry-title {
    font-family: "Barlow Black", sans-serif;
    color: #111111 !important;
}

/* Categorías (Sustituye el rosa neón por un morado oscuro institucional) */
.entry-category a {
    font-family: "Barlow Extra Bold", sans-serif !important;
    color: #3a0066 !important; 
    text-transform: uppercase;
}

/* Enlaces (Sustituye el hover rosa por el morado oscuro) */
a:hover {
    color: #3a0066 !important;
}

p a, p strong {
    font-family: "Barlow Extra Bold", sans-serif !important;
    color: #1a1a1a !important;
}

/* Sidebar y Bloques (Sustituye el azul eléctrico por gris oscuro) */
.theiaStickySidebar ul li a,
.theiaStickySidebar h3,
h2.wp-block-heading {
    color: #1a1a1a !important;
}

/* Tags (Corregido el error hex) */
.tags a, .tags a:after {
    background: #333333; /* Gris oscuro en lugar de rojo inválido */
    color: #ffffff;
}

/* ==========================================================
   4. ESTRUCTURA, GRIDS Y BANNERS (Tu lógica original)
   ========================================================== */
.grid-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    justify-content: space-between;
}

.grid-item { text-align: center; }

.cols-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}

.cols-item {
    text-align: center;
    max-width: 350px;
}

.semanario {
    display: block;
    margin-top: 50px;
    margin-left: auto;
    margin-right: auto;
    width: 300px;
}

.widget_media_image {
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: 600px;
}

#media_image-19, #media_image-25 { width: 100%; }

.banner {
    min-width: 938px !important; /* Sintaxis corregida */
    display: block;
}

.banner_programa {
    height: 100px !important; /* Añadido 'px' que faltaba */
    width: auto;
}

/* Títulos de Categorías Destacadas */
.wpzoom-featured-cat h3.entry-title { font-size: 16px; }
.wpzoom-featured-cat .featured-grid-3 > div h3.entry-title { font-size: 15px; }

/* ==========================================================
   5. MEDIA QUERIES (Agrupadas para mayor rendimiento)
   ========================================================== */
@media screen and (max-width: 700px) {
    /* Corregida la falta de llaves en tu código original */
    .wpzoom-featured-cat h3.entry-title { font-size: 15px; }
    .wpzoom-featured-cat .featured-grid-3 > div h3.entry-title { font-size: 18px; }
}

@media screen and (max-width: 600px) {
    .custom-logo-link {
        display: block;
        max-width: 100px;    
        margin: auto;
    }
    .header_banner, #header_banner, .slider_widgets {
        display: none;
    }
    .widget_media_image {
        width: 100%;
    }
    .cols-container {
        grid-template-columns: 1fr;
    }
}

@media screen and (max-width: 450px) {
    .header_banner { display: none; }
}