.elementor-3507 .elementor-element.elementor-element-723a1e86{--display:flex;}.elementor-3507 .elementor-element.elementor-element-6f62d1ed{--display:flex;}/* Start custom CSS for shortcode, class: .elementor-element-a69d7d4 *//* ---------------- PRIMERA ENTRADA --------------------*/


    /* SOLO la primera entrada */
    .hemeroteca_ordenada_desk #hemeroteca-principal {
    grid-column: 1 / 2;   /* Primera columna */
    grid-row: 1 / 2;      /* Fila superior */
    width: 100%;
    height: 400px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    overflow: visible;   /* Ahora no corta nada */
    padding: 10px;
    box-sizing: border-box;
}

/* Imagen controlada */
.hemeroteca_ordenada_desk #hemeroteca-principal .imagen-hemeroteca img {
    width: 80%;
    height: 300px;       /* La imagen ocupa 180px (AJUSTABLE) */
    object-fit: cover;
    border-radius: 8px;
    transition: .5s;
    transition: .5s;
}
.hemeroteca_ordenada_desk #hemeroteca-principal .imagen-hemeroteca img:hover {
    filter: grayscale(1);
}

/* Título */
.hemeroteca_ordenada_desk #hemeroteca-principal .titulo-hemeroteca {
    max-width: 80%;
    color: white;
    font-size: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Fecha */
.hemeroteca_ordenada_desk #hemeroteca-principal .fecha-hemeroteca {
    font-size: 13px;
    color: grey;
    display: block;    /* IMPORTANTE: permite márgenes */
    margin-top: -15px;   /* Ajusta a tu gusto */
}


/* ------------------------------------------------------*/

/* ---------------- SEGUNDA ENTRADA --------------------*/

/* ------------------------------------------------------*/

/* Contenedor principal: mantiene fila horizontal para primera y segunda */
.hemeroteca_ordenada_desk .hemeroteca-contenedor {
    display: grid;
    flex-direction: column;
    grid-template-columns: 25% 25% auto;
    grid-template-rows: 400px 350px 300px auto;
    position: relative;
}

/* ENTRADA 2 (secundaria) */
.hemeroteca_ordenada_desk #hemeroteca-secundaria {
    grid-column: 2 / 3;   /* Segunda columna */
    grid-row: 1 / 2;      /* Fila superior */
    width: 100%;
    height: 300px;       /* 🔥 MÁS BAJA QUE LA PRINCIPAL */
    padding: 10px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

.hemeroteca_ordenada_desk #hemeroteca-secundaria .imagen-hemeroteca-sec img {
    width: 100%;
    height: 120px;       /* 🔥 Más pequeño para que quepa */
    object-fit: cover;
    border-radius: 8px;
    transition: .5s;
}
.hemeroteca_ordenada_desk #hemeroteca-secundaria .imagen-hemeroteca-sec img:hover {
    filter: grayscale(1);
}

/* Título */
.hemeroteca_ordenada_desk #hemeroteca-secundaria .titulo-hemeroteca-sec {
    max-width: 100%;
    color: white;
    font-size: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Fecha */
.hemeroteca_ordenada_desk #hemeroteca-secundaria .fecha-hemeroteca-sec {
    font-size: 13px;
    color: grey;
    display: block;    /* IMPORTANTE: permite márgenes */
    margin-top: -15px; /* Ajusta a tu gusto */
}



/* ------------------------------------------------------*/

/* ---------------- TERCERA ENTRADA --------------------*/

/* ------------------------------------------------------*/


/* Entrada tercera */
.hemeroteca_ordenada_desk #hemeroteca-tercera {
    position: relative;
    top: -160px; /* sube la entrada */
    grid-column: 2 / 3;   /* Misma columna que secundaria */
    grid-row: 2 / 3;      /* Fila inferior */
    width: 65%;           /* Menos ancha que secundaria */
    height: 650px;        /* Más alta */
    display: flex;
    flex-direction: column;
    justify-self: end;    /* Alinea la tercera a la derecha de la columna */
}

/* Imagen de la tercera entrada */
.hemeroteca_ordenada_desk #hemeroteca-tercera .imagen-hemeroteca-terc img {
    width: 100%;
    height: 350px;        /* Ajusta según lo quieras de grande */
    object-fit: cover;
    border-radius: 8px;
    transition: .5s;
}
.hemeroteca_ordenada_desk #hemeroteca-tercera .imagen-hemeroteca-terc img:hover {
    filter: grayscale(1);
}

/* Título */
.hemeroteca_ordenada_desk #hemeroteca-tercera .titulo-hemeroteca-terc {
    max-width: 100%;
    color: white;
    font-size: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 2;      /* Máximo 2 líneas */
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: 8px;
}

/* Fecha */
.hemeroteca_ordenada_desk #hemeroteca-tercera .fecha-hemeroteca-terc {
    font-size: 13px;
    color: grey;
    display: block;             /* Permite usar margin-top */
    margin-top: -10px;          /* Ajusta según lo pegada que quieras la fecha al título */
}


/* ------------------------------------------------------*/

/* ---------------- CUARTA ENTRADA --------------------*/

/* ------------------------------------------------------*/

/* Entrada cuarta: debajo de la tercera, ocupa ancho de principal + secundaria */
/* Entrada cuarta */
.hemeroteca_ordenada_desk #hemeroteca-cuarta {
    grid-column: 1 / 3;
    grid-row: 3 / 4;
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
}

/* Imagen de la cuarta entrada */
.hemeroteca_ordenada_desk #hemeroteca-cuarta .imagen-hemeroteca-cuarta img {
    width: 100%;
    height: 180px;
    object-fit: cover;
    border-radius: 8px;
    transition: .5s;
}
.hemeroteca_ordenada_desk #hemeroteca-cuarta .imagen-hemeroteca-cuarta img:hover {
    filter: grayscale(1);
}

/* Título */
.hemeroteca_ordenada_desk #hemeroteca-cuarta .titulo-hemeroteca-cuarta {
    max-width: 100%;
    color: white;
    font-size: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: 8px;
    
}

/* Fecha */
.hemeroteca_ordenada_desk #hemeroteca-cuarta .fecha-hemeroteca-cuarta {
    font-size: 13px;
    color: grey;
    display: block;
    margin-top: -10px;
}


/* ------------------------------------------------------*/

/* ---------------- QUINTA ENTRADA --------------------*/

/* ------------------------------------------------------*/

.hemeroteca_ordenada_desk #hemeroteca-quinta {
    grid-column: 3 / 4;  /* tercera columna */
    grid-row: 1 / 3;     /* ocupa fila 1 y 2 */
    display: flex;
    flex-direction: column;
    justify-self: start;  /* arriba de la columna */
    width: 100%;          /* ancho total de la columna */
    max-width: 400px;     /* aumenta el ancho de la entrada */
    margin-left: 80px;    /* aumenta la separación de la entrada 2 */
}

/* Imagen de la quinta entrada */
.hemeroteca_ordenada_desk #hemeroteca-quinta .imagen-hemeroteca-quinta img {
    width: 100%;          /* ocupa todo el ancho de la entrada */
    height: 230px;        /* aumenta la altura de la imagen */
    object-fit: cover;
    border-radius: 8px;
    transition: .5s;
}
.hemeroteca_ordenada_desk #hemeroteca-quinta .imagen-hemeroteca-quinta img:hover {
    filter: grayscale(1);
}

/* Título */
.hemeroteca_ordenada_desk #hemeroteca-quinta .titulo-hemeroteca-quinta {
    max-width: 100%;
    color: white;
    font-size: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 2;      
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: 8px;
        text-align: right;     
}

/* Fecha */
.hemeroteca_ordenada_desk #hemeroteca-quinta .fecha-hemeroteca-quinta {
    font-size: 13px;
    color: grey;
    display: block;     
    margin-top: -10px;  
        text-align: right;     
}


/* ------------------------------------------------------*/

/* ---------------- QUINTA ENTRADA --------------------*/

/* ------------------------------------------------------*/



/* Sexta entrada: debajo de la quinta, columna derecha */
.hemeroteca_ordenada_desk #hemeroteca-sexta {
    grid-column: 3 / 4;  /* misma columna que la quinta */
    grid-row: 3 / 4;     /* fila debajo de la quinta */
    display: flex;
    flex-direction: column;
    justify-self: start;  
    width: 100%;         
    max-width: 450px;    /* más ancha que la quinta */
    margin-left: 20px;   /* separación de la columna 2 */
    position: relative;
    top: -400px; /* sube la entrada */
}

/* Imagen de la sexta entrada */
.hemeroteca_ordenada_desk #hemeroteca-sexta .imagen-hemeroteca-sexta img {
    width: 100%;
    height: 480px;       /* más alta que la quinta */
    object-fit: cover;
    border-radius: 8px;
    transition: .5s;
}
.hemeroteca_ordenada_desk #hemeroteca-sexta .imagen-hemeroteca-sexta img:hover {
    filter: grayscale(1);
}

/* Título alineado a la derecha */
.hemeroteca_ordenada_desk #hemeroteca-sexta .titulo-hemeroteca-sexta {
    max-width: 100%;
    color: white;
    font-size: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 2;      
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: 8px;
    text-align: left;    /* alineación derecha */
}

/* Fecha alineada a la derecha */
.hemeroteca_ordenada_desk #hemeroteca-sexta .fecha-hemeroteca-sexta {
    font-size: 13px;
    color: grey;
    display: block;     
    margin-top: -10px;
    text-align: left;    /* alineación derecha */
}

/*---------------------------------PAGINACION----------------------------*/

/* Contenedor de paginación */
.hemeroteca_ordenada_desk .hemeroteca-paginacion {
    grid-column: 1 / -1;  /* ocupa todo el ancho del grid */
    justify-self: center;
    margin-top: 20px;      /* ajustable */
    text-align: center;
}

/* Enlaces de paginación */
.hemeroteca_ordenada_desk .hemeroteca-paginacion a,
.hemeroteca_ordenada_desk .hemeroteca-paginacion span {
    color: white;          /* texto blanco */
    font-size: 16px;       /* tamaño de letra */
    margin: 0 5px;         /* espacio entre números */
    padding: 5px 10px;     /* relleno para que sea más "clicable" */
    border-radius: 4px;    /* opcional: bordes redondeados */
    text-decoration: none; /* quitar subrayado */
    background-color: rgba(255,255,255,0.1); /* ligero fondo para resaltar */
    transition: background 0.3s;
}

/* Hover de los enlaces */
.hemeroteca_ordenada_desk .hemeroteca-paginacion a:hover {
    background-color: rgba(255,255,255,0.3);
}

/* Página actual */
.hemeroteca_ordenada_desk .hemeroteca-paginacion .current {
    font-weight: bold;
    background-color: white;
    color: black; /* opcional: número actual con contraste */
}


/*---------------------------------BOTONES AÑOS----------------------------*/

/* Contenedor de los botones de años */
.hemeroteca_ordenada_desk .hemeroteca-columna-derecha {
    display: flex;
    flex-direction: column;
    position: absolute;
    right: 0;
    top: 0;
    padding: 10px;

}

/* Botones de filtro de años */
.hemeroteca_ordenada_desk .hemeroteca-columna-derecha .filtro-ano {
    color: white;
    font-size: 16px;
    padding: 5px 18px;
    border-radius: 4px;
    background-color: rgba(255,255,255,0.1);
    border: none;
    cursor: pointer;
    transition: background 0.3s;
    text-align: center;
    width: 100%;          /* todos del mismo ancho */
    box-sizing: border-box;
    margin-bottom: -10px;   /* separación mínima extra entre botones */
}

/* Separación entre columna de años y entradas */
.hemeroteca_ordenada_desk .hemeroteca-contenedor {
    padding-right: 90px; /* ajusta según el ancho de la columna de años */
}

/* Hover de los botones */
.hemeroteca_ordenada_desk .hemeroteca-columna-derecha .filtro-ano:hover {
    background-color: rgba(255,255,255,0.3);
}

/* Botón activo (puedes agregar clase 'active' vía PHP si quieres resaltar el año actual) */
.hemeroteca_ordenada_desk .hemeroteca-columna-derecha .filtro-ano.active {
    font-weight: bold;
    background-color: white;
    color: black;
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-378e0c5 *//* ---------------- PRIMERA ENTRADA --------------------*/


    /* SOLO la primera entrada */
    .hemeroteca_ordenado_movile #hemeroteca-principal {
    grid-column: 1 / 2;   /* Primera columna */
    grid-row: 1 / 2;      /* Fila superior */
    width: 100%;
    height: 400px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    overflow: visible;   /* Ahora no corta nada */
    padding: 10px;
    box-sizing: border-box;
}

/* Imagen controlada */
.hemeroteca_ordenado_movile #hemeroteca-principal .imagen-hemeroteca img {
    width: 80%;
    height: 300px;       /* La imagen ocupa 180px (AJUSTABLE) */
    object-fit: cover;
    border-radius: 8px;
}

/* Título */
.hemeroteca_ordenado_movile #hemeroteca-principal .titulo-hemeroteca {
    max-width: 100%;
    color: white;
    font-size: 13px;
    overflow: hidden;
}

/* Fecha */
.hemeroteca_ordenado_movile #hemeroteca-principal .fecha-hemeroteca {
    font-size: 13px;
    color: grey;
    display: block; 
    margin-top: 0px;   
    top: 0px;   
}


/* ------------------------------------------------------*/

/* ---------------- SEGUNDA ENTRADA --------------------*/

/* ------------------------------------------------------*/

/* Contenedor principal: mantiene fila horizontal para primera y segunda */
.hemeroteca_ordenado_movile .hemeroteca-contenedor {
    display: flex;
    flex-direction: column;
    position: relative;
}

/* ENTRADA 2 (secundaria) */
.hemeroteca_ordenado_movile #hemeroteca-secundaria {
    width: 100%;
    height: max-content;
    padding: 10px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

.hemeroteca_ordenado_movile #hemeroteca-secundaria .imagen-hemeroteca-sec img {
    width: 100%;
    height: 120px;       /* 🔥 Más pequeño para que quepa */
    object-fit: cover;
    border-radius: 8px;
}

/* Título */
.hemeroteca_ordenado_movile #hemeroteca-secundaria .titulo-hemeroteca-sec {
    max-width: 100%;
    color: white;
    font-size: 13px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Fecha */
.hemeroteca_ordenado_movile #hemeroteca-secundaria .fecha-hemeroteca-sec {
    font-size: 13px;
    color: grey;
    display: block; 
    margin-top: 0px;   
    top: 0px;   
}



/* ------------------------------------------------------*/

/* ---------------- TERCERA ENTRADA --------------------*/

/* ------------------------------------------------------*/


/* Entrada tercera */
.hemeroteca_ordenado_movile #hemeroteca-tercera {
    width: 100%;
    height: max-content;
    padding: 10px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

/* Imagen de la tercera entrada */
.hemeroteca_ordenado_movile #hemeroteca-tercera .imagen-hemeroteca-terc img {
    width: 100%;
    height: 350px;        /* Ajusta según lo quieras de grande */
    object-fit: cover;
    border-radius: 8px;
}

/* Título */
.hemeroteca_ordenado_movile #hemeroteca-tercera .titulo-hemeroteca-terc {
    max-width: 100%;
    color: white;
    font-size: 13px;
    display: -webkit-box;
    -webkit-line-clamp: 2;      /* Máximo 2 líneas */
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: 8px;
}

/* Fecha */
.hemeroteca_ordenado_movile #hemeroteca-tercera .fecha-hemeroteca-terc {
    font-size: 13px;
    color: grey;
    display: block; 
    margin-top: 0px;   
    top: 0px;   
}


/* ------------------------------------------------------*/

/* ---------------- CUARTA ENTRADA --------------------*/

/* ------------------------------------------------------*/

/* Entrada cuarta: debajo de la tercera, ocupa ancho de principal + secundaria */
/* Entrada cuarta */
.hemeroteca_ordenado_movile #hemeroteca-cuarta {
    width: 100%;
    height: max-content;
    padding: 10px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

/* Imagen de la cuarta entrada */
.hemeroteca_ordenado_movile #hemeroteca-cuarta .imagen-hemeroteca-cuarta img {
    width: 100%;
    height: 180px;
    object-fit: cover;
    border-radius: 8px;
}

/* Título */
.hemeroteca_ordenado_movile #hemeroteca-cuarta .titulo-hemeroteca-cuarta {
    max-width: 100%;
    color: white;
    font-size: 13px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: 8px;
    
}

/* Fecha */
.hemeroteca_ordenado_movile #hemeroteca-cuarta .fecha-hemeroteca-cuarta {
    font-size: 13px;
    color: grey;
    display: block; 
    margin-top: 0px;   
    top: 0px;   
}


/* ------------------------------------------------------*/

/* ---------------- QUINTA ENTRADA --------------------*/

/* ------------------------------------------------------*/

.hemeroteca_ordenado_movile #hemeroteca-quinta {
    width: 100%;
    height: max-content;
    padding: 10px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}
.hemeroteca_ordenado_movile #hemeroteca-quinta .imagen-hemeroteca-quinta img {
    width: 100%;          /* ocupa todo el ancho de la entrada */
    height: 230px;        /* aumenta la altura de la imagen */
    object-fit: cover;
    border-radius: 8px;
}

/* Título */
.hemeroteca_ordenado_movile #hemeroteca-quinta .titulo-hemeroteca-quinta {
    max-width: 100%;
    color: white;
    font-size: 13px;
    overflow: hidden;
}

/* Fecha */
.hemeroteca_ordenado_movile #hemeroteca-quinta .fecha-hemeroteca-quinta {
    font-size: 13px;
    color: grey;
    display: block; 
    margin-top: 0px;   
    top: 0px;     
}


/* ------------------------------------------------------*/

/* ---------------- QUINTA ENTRADA --------------------*/

/* ------------------------------------------------------*/



/* Sexta entrada: debajo de la quinta, columna derecha */
.hemeroteca_ordenado_movile #hemeroteca-sexta {
    width: 100%;
    height: max-content;
    padding: 10px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

/* Imagen de la sexta entrada */
.hemeroteca_ordenado_movile #hemeroteca-sexta .imagen-hemeroteca-sexta img {
    width: 100%;
    height: 480px;       /* más alta que la quinta */
    object-fit: cover;
    border-radius: 8px;
}

/* Título alineado a la derecha */
.hemeroteca_ordenado_movile #hemeroteca-sexta .titulo-hemeroteca-sexta {
    max-width: 100%;
    color: white;
    font-size: 13px;
    overflow: hidden;
}

/* Fecha alineada a la derecha */
.hemeroteca_ordenado_movile #hemeroteca-sexta .fecha-hemeroteca-sexta {
    font-size: 13px;
    color: grey;
    display: block; 
    margin-top: 0px;   
    top: 0px;   
}

/*---------------------------------PAGINACION----------------------------*/

/* Contenedor de paginación */
.hemeroteca_ordenado_movile .hemeroteca-paginacion {
    grid-column: 1 / -1;  /* ocupa todo el ancho del grid */
    justify-self: center;
    margin-top: 20px;      /* ajustable */
    text-align: center;
}

/* Enlaces de paginación */
.hemeroteca_ordenado_movile .hemeroteca-paginacion a,
.hemeroteca_ordenado_movile .hemeroteca-paginacion span {
    color: white;          /* texto blanco */
    font-size: 16px;       /* tamaño de letra */
    margin: 0 5px;         /* espacio entre números */
    padding: 5px 10px;     /* relleno para que sea más "clicable" */
    border-radius: 4px;    /* opcional: bordes redondeados */
    text-decoration: none; /* quitar subrayado */
    background-color: rgba(255,255,255,0.1); /* ligero fondo para resaltar */
    transition: background 0.3s;
}

/* Hover de los enlaces */
.hemeroteca_ordenado_movile .hemeroteca-paginacion a:hover {
    background-color: rgba(255,255,255,0.3);
}

/* Página actual */
.hemeroteca_ordenado_movile .hemeroteca-paginacion .current {
    font-weight: bold;
    background-color: white;
    color: black; /* opcional: número actual con contraste */
}


/*---------------------------------BOTONES AÑOS----------------------------*/

/* Contenedor de los botones de años */
.hemeroteca_ordenado_movile .hemeroteca-columna-derecha {
    display: flex;
    flex-direction: column;
    position: absolute;
    right: 0;
    top: 0;
    padding: 10px;

}

/* Botones de filtro de años */
.hemeroteca_ordenado_movile .hemeroteca-columna-derecha .filtro-ano {
    color: white;
    font-size: 16px;
    padding: 5px 18px;
    border-radius: 4px;
    background-color: rgba(255,255,255,0.1);
    border: none;
    cursor: pointer;
    transition: background 0.3s;
    text-align: center;
    width: 100%;          /* todos del mismo ancho */
    box-sizing: border-box;
    margin-bottom: -10px;   /* separación mínima extra entre botones */
}

/* Separación entre columna de años y entradas */
.hemeroteca_ordenado_movile .hemeroteca-contenedor {
    padding-right: 90px; /* ajusta según el ancho de la columna de años */
}

/* Hover de los botones */
.hemeroteca_ordenado_movile .hemeroteca-columna-derecha .filtro-ano:hover {
    background-color: rgba(255,255,255,0.3);
}

/* Botón activo (puedes agregar clase 'active' vía PHP si quieres resaltar el año actual) */
.hemeroteca_ordenado_movile .hemeroteca-columna-derecha .filtro-ano.active {
    font-weight: bold;
    background-color: white;
    color: black;
}/* End custom CSS */