/* Animación de entrada */
.animate-in {
  opacity: 0;
  transform: scale(0.8);
  animation: fadeInUp 0.8s ease forwards;
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(30px) scale(0.8);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* Imagen con efecto loop en hover */
.card-img-container {
  overflow: hidden;
  position: relative;
}

.card-img-container img {
  transition: transform 0.6s ease;
  transform-origin: center;
}

/* Al pasar el mouse la imagen se achica y entra en loop */
.card-img-container:hover img {
  animation: zoomLoop 0.4s ease-in-out infinite alternate;
  cursor: pointer;
}

@keyframes zoomLoop {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0.9);
  }
}

/* Diseño de la tarjeta */
.card-carrera {
  border: none;
  box-shadow: 0 5px 15px rgba(0,0,0,0.1);
  border-radius: 10px;
  overflow: hidden;
  transition: transform 0.3s ease;
  background: #fff;
}

.card-carrera:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}

.card-title {
  font-size: 1.3rem;
}

.card-text {
  font-size: 0.9rem;
  color: #555;
}

/* Botón */
.btn-success {
  background-color: #28a745;
  border: none;
}

.btn-success:hover {
  background-color: #218838;
}
/* Enlaces circulares de redes sociales */
a.enlace {
  color: white; 
  background: #28AA96; 
  width: 40px; 
  height: 40px; 
  border-radius: 50%; 
  display: flex; 
  align-items: center; 
  justify-content: center;
  transition: transform 0.3s ease-in-out, background 0.3s ease-in-out;
  font-size: 18px; /* tamaño de los iconos */
  text-decoration: none;
}

/* Hover: zoom y cambio de color */
a.enlace:hover {
  transform: scale(1.15);       /* aumenta suavemente */
  background: #25d366 !important;          /* cambio de color sutil */
  cursor: pointer;
}

/* Opcional: efecto de sombra suave */
a.enlace:hover i {
  text-shadow: 0 0 5px rgba(0,0,0,0.3);
}
/* Enlace Libro Reclamaciones */
a.librorec {
  display: inline-flex;             /* más semántico para alinear icono + texto */
  align-items: center;
  justify-content: center;
  gap: 8px;                         /* espacio entre icono y texto */
  
  color: #28AA96;
  background: white;
  
  padding: 8px 15px;
  border-radius: 5px;
  font-weight: bold;
  font-size: 16px;
  text-decoration: none;

  transition: transform 0.3s ease-in-out, background 0.3s ease-in-out, color 0.3s ease-in-out;
}

/* Hover: zoom y cambio de color */
a.librorec:hover {
  transform: scale(1.1);            /* aumento suave */
  background: #28AA96;
  color: white;
  cursor: pointer;
}

/* Efecto de sombra en el icono */
a.librorec:hover i {
  text-shadow: 0 0 5px rgba(0,0,0,0.3);
}
/* Enlace de footer: icono + texto */
ul li a.enlace-footer {
  color: white;
  text-decoration: none;
  display: inline-flex;       /* alinea icono + texto */
  align-items: center;
  gap: 8px;                   /* espacio entre icono y texto */
  transition: transform 0.3s ease-in-out, color 0.3s ease-in-out;
}

/* Hover: aplica a todo el enlace (icono + texto) */
ul li a.enlace-footer:hover {
  transform: scale(1.05);      /* zoom suave */
  color: #28AA96;
  text-shadow: 0 0 5px rgba(0,0,0,0.3);
  cursor: pointer;
}

/* Icono dentro del enlace hereda el color */
ul li a.enlace-footer i {
  color: inherit;
}