/* Estilos generales del footer */
@font-face{
font-family: "Montserrat-Medium";
src: url('Fonts/Montserrat-Medium.woff2') format('woff2');
font-weight: normal; /* o 400 */
font-style: normal;
}



footer {
  background-color: #f1f1f1; /* Color de fondo del footer */
  padding: 25px 20px;       /* Espaciado interno (arriba/abajo - izquierda/derecha) */
  color: #333;              /* Color del texto */
  font-family: "Montserrat-Medium" ; /* Fuente del texto */
  border-top: 1px solid #ddd;   /* Línea sutil en la parte superior */
}

.footer-container {
  display: flex;              /* Activa Flexbox para alinear elementos */
  justify-content: space-between; /* Distribuye el espacio entre los grupos de elementos */
  align-items: center;        /* Centra verticalmente los elementos */
  flex-wrap: wrap;            /* Permite que los elementos se muevan a la siguiente línea en pantallas pequeñas */
  max-width: 1200px;          /* Ancho máximo del contenido del footer */
  margin: 0 auto;             /* Centra el contenedor en la página */
}

/* Sección de información (copyright y política de privacidad) */
.footer-info {
  text-align: left;           /* Alineación del texto a la izquierda */
  flex-grow: 1;               /* Permite que esta sección crezca si hay espacio */
}

.footer-info p {
  margin: 5px 0;              /* Margen pequeño entre los párrafos */
  font-size: 0.9em;
}

.privacy-link {
  color: #083750;             /* Color del enlace de política de privacidad */
  text-decoration: none;      /* Sin subrayado por defecto */
}

.privacy-link:hover {
  text-decoration: underline; /* Subrayado al pasar el mouse */
}

/* Sección de iconos de redes sociales */
.footer-social {
  text-align: center;         /* Centra los iconos */
  margin: 10px 0;             /* Margen para separar en móviles */
}

.footer-social a {
  margin: 0 10px;             /* Espacio horizontal entre iconos */
  display: inline-block;      /* Asegura que el margen se aplique correctamente */
}


/* Sección del logo UABM */
.footer-logo {
  text-align: right;          /* Alinea el logo a la derecha */
  margin-left: 20px;          /* Espacio a la izquierda del logo para separarlo */
}

.uabmimage {
  height: 50px;               /* Altura del logo (ajusta según sea necesario) */
  width: auto;                /* Ancho automático para mantener la proporción */
}

/* Media Query para pantallas más pequeñas (responsividad) */
@media (max-width: 768px) {
  .footer-container {
      flex-direction: column; /* Apila los elementos verticalmente */
      text-align: center;     /* Centra el texto de todos los elementos */
  }

  .footer-info,
  .footer-social,
  .footer-logo {
      text-align: center;     /* Asegura la alineación central para cada sección */
      width: 100%;            /* Ocupa todo el ancho disponible */
      margin-bottom: 10px;    /* Espacio debajo de cada sección apilada */
  }

  .footer-logo {
      margin-left: 0;         /* Elimina el margen izquierdo en móviles */
      margin-bottom: 0;       /* Sin margen inferior para el último elemento */
  }
}


.fa-brands {
  padding: 20px;
  font-size: 20px;
  width: 20px;
  text-align: center;
  text-decoration: none;
  border-radius: 50%;
}

.fa:hover {
  opacity: 0.7;
}

/* Set a specific color for each brand */

/* Facebook */
.fa-facebook {
  background: #3B5998;
  color: white;
}

.fa-linkedin {
  background: #007bb5;
  color: white;
}
.fa-tiktok {
  background: #171717;
  color: white;
}
.fa-instagram {
  background: #125688;
  color: white;
}