/*
Theme Name: The7 Child
Theme URI: https://the7.io/
Template: The7/dt-the7
Author: Dream-Theme
Author URI: https://dream-theme.com/
Description: Any design, any layout. No coding required. The7 is the most customisable WordPress theme on the market up to date. Add the power of Visual Composer, The7 Post Types, Ultimate Addons, Slider Revolution, and WooCommerce to the mix, and you'll get the ultimate web-site building toolkit! Theme is translation ready, compatible with WPML, SEO and mobile friendly (certified by Google).
Tags: multipurpose,responsive,retina ready,SEO ready,mobile friendly,iOS,material design,clean,minimal,business,corporate,portfolio,creative,photography,one page site,micro site
Version: 12.4.0.1743678530
Updated: 2025-04-03 11:08:50

*/

/*LOGO*//*
img.preload-me {
    width: 100px;
    height: 100px;
}*/
.page-title-breadcrumbs{
    display: none;
}

/*Titulo bloque de 3 imagenes*/

  .titulo-bloqueimg,
  .titulo-bloqueimg * {
      color: #8abcde !important;
      text-align: center !important;
      /*font-family: "Mulish" !important;*/

  }
  
  .titulo-bloqueimg:hover,
  .titulo-bloqueimg:hover * {
      color: #888484 !important;
      text-align: center !important;
  }

  .single-share-box{
    display: none;
  }

/*Margenes*/
.margen-arriba{
    margin-top: 10rem;
}
.margen-abajo{
    margin-bottom: 10rem;
}
/*Justificar*/
.justificado{
    text-align: justify;
}
.margen-arriba2{
    margin-top: 3rem !important;
    margin-bottom: 3rem !important;
}
.modulo-descargable {
    position: relative !important;
    height: 360px !important;
    text-align: center !important;
    padding: 20px 15px 60px !important;
    overflow: hidden !important;
    border: 2px solid #e0e0e0 !important;
    border-radius: 12px !important;
    background-color: #fff !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05) !important;

  }
  
 /* SLIDER DENTRO DE NOTICIAS */


.modulo-descargable:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15) !important;
  border-color: #00bcd4 !important;
}
  
  /* Ícono abajo centrado */
  .modulo-descargable .vc_icon_element {
    position: absolute !important;
    bottom: 20px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    margin-top: 0 !important;
  }



/*HOVER ICONOS*/
.icono-hover {
    transition: filter 0.3s ease, color 0.3s ease !important;
  }
  
  /* Efecto al hacer hover: solo cambia visualmente */
  .icono-hover:hover {
    filter: brightness(1.5) !important;
  }
  

/*Filtros noticias*/

.filter-categories {
    max-width: 50rem; /* Ajusta el valor según lo que necesites */
    gap: 1em;
}
  
.images-container{
    display: none;
}
.titulo-proyectos{
    color:white;
    text-align: center;

}

.edificios{
    background-image: url(/wp-content/uploads/2025/04/edificios2.png);
    background-size: contain;
    background-position: center bottom;
    background-repeat: repeat-x;
    height: 200px;
    margin-top: 6em;
}
.titulo-noticia{
  text-align: center;
  font-size: 2em;
  margin-bottom: 2rem;
  margin-top: 1rem;
}


/*TITULO OBJETIVOS*/
.fila-categorias {
    display: flex;
    justify-content: center;
    flex-wrap: nowrap; /* evita que salten de línea */
    gap: 30px;
    overflow-x: auto; /* scroll horizontal si no caben */
    padding: 20px 0;
  }
  
.bloque-categoria {
    background-color: white;
    border-radius: 16px;
    padding: 30px 20px;
    text-align: center;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    width: 230px;
    flex-shrink: 0; /* evita que se reduzcan para encajar */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    min-height: 280px;
}  
.bloque-categoria img {
    max-width: 80px;
    margin-bottom: 15px;
}
.titulo-objetivos{
    color:white;
}
.iconos{
    transition: transform 0.3s ease !important;
}



/*BLOQUE IMAGEN*/
/* La FILA debe tener posición relativa y altura fija */
.contenedor-boton-premios {
    position: relative;
    min-height: 500px; /* ajusta a la altura visible de la imagen */
  }
  
  /* La COLUMNA debe ocupar todo el espacio y centrar su contenido */
  .centrar-boton-premios {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  /* El BOTÓN con estilo visual */
  .boton-descarga-premios {
    color: #fff !important;
    font-weight: 600;
    padding: 16px 36px;
    border-radius: 20px;
    font-size: 18px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    text-align: center;
  }
  
  /* Hover */
  .boton-descarga-premios:hover {
    color: #000 !important;
    transform: scale(1.05);
  }



/*TIPO DE CONTENIDO VIDEOS*/
.videos-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    justify-content: center;
    padding: 40px 0;
  }
  
  .video-card {
    width: 100%;
    max-width: 550px;
    background-color: #fff;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    border-radius: 10px;
    overflow: hidden;
    transition: transform 0.2s ease;
  }
  
  .video-card:hover {
    transform: translateY(-5px);
  }
  
  .video-card iframe {
    width: 100%;
    height: 300px;
    display: block;
    border: none;
  }
  
  .video-card-title {
    font-weight: 600;
    font-size: 16px;
    padding: 15px;
    text-align: center;
    background-color: #f5f5f5;
    color: #333;
  }

  

/*BIBLIOTECA*/
.biblioteca-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    justify-content: center;
    padding: 40px 0;
}

.biblioteca-item {
    background-color: #e9f8ff;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    width: 340px; /* ancho aumentado */
    text-align: center;
    padding: 20px 20px 60px 20px;
    position: relative;
    transition: transform 0.3s ease;
    box-sizing: border-box;
}

.biblioteca-item:hover {
    transform: translateY(-5px);
}

.biblioteca-item img {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
}

.biblioteca-titulo {
    font-weight: 600;
    margin-top: 15px;
    font-size: 16px;
    color: #21759b;
}

.biblioteca-anio {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #ccc;
    color: #ffffff;
    font-size: 14px;
    padding: 8px;
    border-radius: 0 0 8px 8px;
    box-sizing: border-box;
}

  
  
  

/*MAPA*/
/* Contenedor principal */
#municipios-container {
    position: relative;
    display: flex;
    width: 100%;
    height: 65vh; /* o 60vh si prefieres aún más compacto */
    overflow: hidden;
    box-sizing: border-box;
    margin-bottom: -35px;

}

/* Buscador */
#buscador {
    width: 350px;
    background-color: #f8f8f8;
    height: 100%;
    padding: 20px;
    display: flex;
    flex-direction: column; /* ← importante para que funcione el layout */
    box-sizing: border-box;
}
#buscar-municipio {
    width: 100%;
    padding: 10px;
    font-size: 16px;
    border: 1px solid #ccc;
    border-radius: 5px;
    margin-bottom: 15px;
    flex-shrink: 0; /* el input nunca se encoge */
}

#lista-municipios {
    flex-grow: 1; /* ← que use todo el espacio restante */
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0;
    margin: 0;
    list-style-type: none;
}

#lista-municipios li {
    padding: 12px;
    margin: 5px 0;
    background-color: #f4f4f4;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

#lista-municipios li:hover {
    background-color: #e9e9e9;
}

/* Mapa */
#mapa {
    flex-grow: 1;
    height: 100%;
    border: none;
}

/* Modal */
#modal-municipio {
    position: absolute;
    display: none;
    z-index: 10;
    max-height: 90%;
    border-radius: 10px;
    padding: 20px;
    
}


/* Contenido del modal */
.modal-content {
    background: #fff;
    padding: 20px;
    border-radius: 10px;
    text-align: center;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
    max-height: inherit;
    overflow-y: auto;
    position: relative;
}

/* Imagen */
.modal-content img {
    max-width: 100%;
    height: auto;
    border-radius: 5px;
    margin-bottom: 15px;
}

/* Título */
.modal-content h2 {
    font-size: 24px;
    margin-top: 15px;
    color: #333;
}

/* Texto */
.modal-content p {
    font-size: 16px;
    color: #555;
    margin-bottom: 10px;
}

/* Enlace */
#modal-enlace {
    display: inline-block;
    padding: 10px 20px;
    margin-top: 20px;
    text-decoration: none;
    color: #fff;
    background-color: #2a80d9;
    border-radius: 5px;
    transition: background-color 0.3s ease;
}

#modal-enlace:hover {
    background-color: #1e60a9;
}

/* Cerrar */
.cerrar {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 28px;
    font-weight: bold;
    color: #aaa;
    cursor: pointer;
    transition: color 0.3s ease;
}

.cerrar:hover {
    color: #333;
}

/* Responsive */
@media (max-width: 768px) {
    #municipios-container {
        flex-direction: column;
        height: auto;
    }

    #buscador {
        width: 100%;
    }

    #lista-municipios {
        max-height: 200px;
        overflow-y: scroll;
    }

    #mapa {
        height: 300px;
        margin-top: 20px;
    }
}







/*Noticias*/
.comments-area{
    display: none;
}


.post-thumbnail {
    text-align: center;
    margin: 0 auto;
}

.post-thumbnail img {
    width: 100%;
    max-width: 900px; 
    height: auto;
    display: block;
    margin: 0 auto;
}




/*DISEÑO URL*/
/* Contenedor principal */
.docs-section {
  margin: 2em 0;
}

.docs-title {
  margin-bottom: 1em;
  font-weight: bold;
}

.docs-list {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5em 2em;
  max-width: 1200px;
}

.doc-link {
  width: calc(33.333% - 1.4em); /* 3 columnas */
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  color: #67c6dd;
}

.doc-link:hover {
  text-decoration: underline;
}

.doc-icon {
  width: 20px;
  height: 20px;
  margin-right: 0.5em;
  flex-shrink: 0;
}

.doc-text {
  font-size: 1em;
}

/* Tablet: 2 columnas */
@media (max-width: 992px) {
  .doc-link {
    width: calc(50% - 1em);
  }
}

/* Móvil: 1 columna */
@media (max-width: 600px) {
  .doc-link {
    width: 100%;
  }
}

.page-title.solid-bg {
  background: linear-gradient(to bottom, #67c6dd 0%, #e8f1f8 100%);

}
.entry-title{
  color:#003049	!important;
}



.filtro-btn {
  background: #eee;
  border: none;
  padding: 10px 20px;
  margin: 5px;
  cursor: pointer;
  font-weight: bold;
}

.filtro-btn.activo {
  background: #00abc8;
  color: #fff;
}







/*NOTICIAS DENTRO SINGLE-MUNICIPIOS*/

/* Contenedor para la vista de masonry */
.the7-masonry-container {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: flex-start;
  max-width: 1200px;
  margin: 0 auto;
  align-items: flex-start; 
}


.the7-masonry-post {
  width: calc(33.333% - 13.34px); /* 3 columnas con gap */
  margin: 0;
  background: #fff;
  border: 1px solid #eaeaea;
  border-radius: 6px;
  overflow: hidden;
  transition: box-shadow 0.3s ease, transform 0.3s ease;
  display: block; /* 👈 No uses flex aquí */
}


/* Efecto hover en la tarjeta */
.the7-masonry-post:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

/* Contenedor de la imagen */
.the7-masonry-thumb img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.3s ease;
}

/* Zoom en hover a la imagen */
.the7-masonry-post:hover .the7-masonry-thumb img {
    transform: scale(1.05);
}

/* Contenido del post */
.the7-masonry-content {
    padding: 15px;
}

/* Fecha */
.the7-masonry-date {
    font-size: 0.9em;
    color: #999;
    margin-bottom: 5px;
}

/* Título */
.the7-masonry-title {
    font-size: 1.2em;
    margin: 0 0 10px;
    line-height: 1.3em;
}
.the7-masonry-title a {
    color: #333;
    text-decoration: none;
}
.the7-masonry-title a:hover {
    color: #0073aa;
}

/* Extracto */
.the7-masonry-excerpt {
    font-size: 0.95em;
    color: #555;
    margin-bottom: 15px;
}

/* Botón "Leer más" con flecha y color turquesa */
.the7-masonry-button {
    display: inline-flex;
    align-items: center;
    background-color: #4acecb; 
    color: #fff;
    padding: 8px 16px;
    border-radius: 4px;
    text-decoration: none;
    font-size: 0.9em;
    font-weight: 600;
    transition: background-color 0.3s ease;
}

/* Hover del botón */
.the7-masonry-button:hover {
    background-color: #31b2b1; 
    color:white;
}
/* Tablet: 2 columnas */
@media (max-width: 992px) {
  .the7-masonry-post {
    width: calc(50% - 10px);
  }
}

/* Móvil: 1 columna, ancho completo */
@media (max-width: 768px) {
  .the7-masonry-container {
    flex-direction: column;
  }

  .the7-masonry-post {
    width: 100%;
  }

  .the7-masonry-post > * {
    width: 100%;
  }

  .the7-masonry-thumb,
  .the7-masonry-content,
  .the7-masonry-excerpt {
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
  }
}



/*Jornadas y talleres*/
.filter-by{
    display: none;
}
.custom-blocks-wrapper {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    margin: 3rem 0;
  }
  
  .custom-block {
    background: #fff;
    border-left: 6px solid #01a0c6;
    padding: 1.5rem 2rem;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
  }
  
  .block-title {
    margin-bottom: 1rem;
    font-size: 1.2rem;
    font-weight: 600;
    color: #01a0c6;
  }
  
  .video-wrapper {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    border-radius: 8px;
  }
  
  .video-wrapper iframe {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    border: none;
  }
  
  ul.pdf-list {
    list-style: none !important;
    padding-left: 0;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.8rem;
    max-width: 1000px;
  }
  
  ul.pdf-list li {
    margin: 0;
    padding: 0;
    list-style: none;
  }
  
  .pdf-button {
    display: inline-block;
    background-color: #01a0c6;
    color: #fff;
    padding: 0.6rem 1.2rem;
    border-radius: 8px;
    font-weight: 500;
    text-decoration: none;
    text-align: center;
    transition: background 0.3s ease, transform 0.2s;
    min-width: 180px;
    max-width: 100%;
    white-space: normal;
  }
  
  .pdf-button:hover {
    background-color: #007a96;
    transform: translateY(-3px);
  }
  
  @media (max-width: 600px) {
    .pdf-button {
      min-width: 100%;
    }
  }

  

  /*Diseño 2*/
  .jornada-bloques {
    max-width: 900px;
    margin: 3rem auto;
    padding: 2rem;
    background: #f8fafa;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.06);
  }
  
  .jornada-bloques h3 {
    font-size: 1.6rem;
    color: #01a0c6;
    margin-bottom: 2rem;
    border-left: 4px solid #01a0c6;
    padding-left: 1rem;
  }
  
  .jornada-bloques .bloque {
    background: white;
    border-left: 6px solid #01a0c6;
    border-radius: 8px;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.04);
    transition: transform 0.3s ease;
  }
  
  .jornada-bloques .bloque:hover {
    transform: translateY(-4px);
  }
  
  .jornada-bloques .bloque iframe {
    width: 100%;
    aspect-ratio: 16/9;
    border: none;
    border-radius: 6px;
  }
  
  .jornada-bloques .bloque a {
    display: inline-block;
    margin-top: 1rem;
    padding: 0.7rem 1.2rem;
    background-color: #01a0c6;
    color: white;
    font-weight: 600;
    border-radius: 5px;
    text-decoration: none;
    transition: background 0.3s ease;
  }
  
  .jornada-bloques .bloque a:hover {
    background-color: #0087a8;
  }
  








/*DEscargables proyectos*/
.downloads-wrapper {
    padding: 4rem 2rem;
  }
  
  .attachments-title {
    text-align: center;
    margin-bottom: 3rem;
    margin-top: 3rem;
    color: #222;
  }
  
  .downloads {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1.5rem;
  }
  
  .download-item {
    width: 140px;
    background: #ffffff;
    border: 1px solid #ddd;
    border-radius: 6px;
    text-align: center;
    text-decoration: none;
    color: #333;
    transition: box-shadow 0.25s ease, border-color 0.25s ease;
    padding: 1rem 0.5rem;
  }
  
  .download-item .icon {
    background: #01a0c6;
    border-radius: 50%;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 0.8rem;
    transition: background-color 0.25s ease;
  }
  
  .download-item .icon img {
    width: 24px;
    height: 24px;
    filter: invert(1);
  }
  
  .download-item .label {
    font-size: 0.85rem;
    font-weight: 600;
    line-height: 1.3;
    font-family: 'Open Sans', sans-serif;
    color: #333;
  }
  
  /* Hover destacado */
  .download-item:hover {
    box-shadow: 0 6px 18px rgba(0, 160, 198, 0.25);
    border-color: #01a0c6;
  }
  
  .download-item:hover .icon {
    background-color: #028aae;
  }
  
  @media (max-width: 600px) {
    .download-item {
      width: 42%;
    }
  }
  
  @media (max-width: 360px) {
    .download-item {
      width: 100%;
    }
  }
  

/*Tamaño imagen noticias*/




/*FOOTER*/
.footer-logos-container {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 30px 0;
  }
  
  .footer-logos {
    display: flex;
    gap: 40px;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    max-width: 1200px;
    width: 100%;
    padding: 0 20px;
  }
  
  .footer-logos a {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .footer-logos img {
    max-height: 70px;
    height: auto;
    width: auto;
    display: block;
    transition: transform 0.3s ease;
  }
  
  .footer-logos a:hover img {
    transform: scale(1.05);
  }
  
  /* 🔽 RESPONSIVE: una imagen debajo de otra */
  @media (max-width: 768px) {
    .footer-logos {
      flex-direction: column;
      gap: 25px;
    }
  }
  
  .footer-logos a:hover img {
    transform: scale(1.05);
  }
  .footer-legal {
    text-align: center;
    padding-top: 20px;
    padding-bottom: 20px;
    color: #ffffff;
    font-size: 13px;
    line-height: 1.6;
  }
  
  .footer-legal p {
    margin: 5px 0;
  }
  
  .footer-legal a {
    color: #ffffff;
    text-decoration: none;
    margin: 0 5px;
  }
  .footer-legal-line2 a{
    color: white !important;

  }
  
  .footer-legal a:hover {
    text-decoration: underline;
  }


  /* Color blanco para los textos del top bar */

.top-bar,
.top-bar * {
  color: #ffffff !important;
  fill: #ffffff !important;
}
/* ─────────────────────────────────────────────
   1) Ocultar los enlaces originales J1/J2
───────────────────────────────────────────── */
.iso-filter .filter-categories a[data-filter=".category-596"],
.iso-filter .filter-categories a[data-filter=".category-597"] {
  display: none !important;
}

/* ─────────────────────────────────────────────
   2) Contenedor de subcategorías
───────────────────────────────────────────── */
#subcats-jornadas {
  display: none;      /* oculto por defecto */
  width: 100%;        /* toda la línea */
  clear: both;        /* salto de línea */
  margin: 12px 0;     /* separación arriba/abajo */
  text-align: center; /* centra los botones */
}

/* ─────────────────────────────────────────────
   3) Botones — estilo base igual que menú
───────────────────────────────────────────── */
#subcats-jornadas .filtro-btn {
  display: inline-block;
  box-sizing: border-box;
  position: relative;
  text-decoration: none;
  white-space: nowrap;
  font: 700 14px/18px "Mulish", Helvetica, Arial, Verdana, sans-serif;
  text-transform: none;
  color: var(--the7-title-color);
  background: transparent;
  border: none;
  padding: 6px 15px;
  margin: 0 3px;
  border-radius: 100px;
  overflow: hidden;
  cursor: pointer !important;
  transition: background-color .2s, color .2s;
}

/* ─────────────────────────────────────────────
   4) Hover — mismo color de texto que enlaces
───────────────────────────────────────────── */
#subcats-jornadas .filtro-btn:hover {
  color: var(--the7-links-color) !important;
}

/* ─────────────────────────────────────────────
   5) Activo — igual que “Jornadas” activo
───────────────────────────────────────────── */
#subcats-jornadas .filtro-btn.active {
  background-color: var(--the7-accent-color) !important;
  color: #fff !important;
}




/*CAMPAÑAS*/
/* Asegura que el contenedor del grid se centra y limita el ancho */
.campanas-grid-wrapper {
    max-width: 1000px; /* Ancho máximo del grid completo */
    margin: 0 auto; /* Centrado horizontal */
    padding: 40px 20px; /* Separación */
}

.page-id-57725 .wf-container-main {
    display: block !important; /* Elimina el grid del tema */
}

.campanas-grid {
    display: grid;
    grid-template-columns: repeat(3, 300px);
    gap: 40px;
    max-width: 960px;
    margin: 0 auto;
    justify-content: center;
}

.campanas-item {
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* Mantiene el orden */
    height: 100%;
    border-radius: 10px;
    overflow: hidden; /* Para que el borde redondeado afecte a todo */
    background-color: #fff;
    box-shadow: 0 8px 20px rgba(0,0,0,0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.campanas-item:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.15);
}

.campanas-item img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 10px 10px 0 0; /* Redondea solo la parte superior */
}

.campanas-titulo {
    font-size: 1.1em;
    font-weight: bold;
    color: #333;
    margin: 15px 15px 20px; /* Aumentamos el espacio inferior */
}

.campanas-subtitulo {
    font-size: 1em;
    color: #ffffff; /* Texto en blanco */
    background-color: #007BFF; /* Fondo azul clarito */
    padding: 8px 12px;
    border-radius: 0; /* Sin borde redondeado */
    margin-bottom: 10px;
    display: block; /* Ocupa todo el ancho */
    text-align: center; /* Centra el texto */
    margin-top: auto; /* Empuja hacia abajo */
}


@media (max-width: 1024px) {
    .campanas-grid {
        grid-template-columns: repeat(2, 300px);
    }
}

@media (max-width: 600px) {
    .campanas-grid {
        grid-template-columns: 300px;
    }
}





@media (max-width: 768px) {
  .imagen-red {
    display: block;
    margin: 20px auto; /* Centrado horizontal y margen superior/inferior */
    max-width: 80%; /* Opcional: ajusta el ancho máximo para móviles */
    height: auto; /* Mantiene la proporción original */
  }
}