/* ==== Gradient Background Moving (Body + Footer) ==== */
body, .footer-obf {
  background: linear-gradient(-45deg, #FFFBDE, #91C8E4, #749BC2, #4682A9);
  background-size: 400% 400%;
  animation: gradientMove 3s ease infinite;
}
@keyframes gradientMove {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* ==== Navbar Black with White Text ==== */
.navbar.custom-navbar {
  background-color: #000 !important;
}
.navbar.custom-navbar .navbar-brand,
.navbar.custom-navbar .nav-link,
.navbar-toggler i {
  color: #fff !important;
}
.navbar.custom-navbar .nav-link:hover {
  color: #91C8E4 !important;
}

/* ==== Team Card ==== */
.team-box {
  background: rgba(255, 255, 255, 0.85);
  border-radius: 20px;
  padding: 25px;
  transition: transform 0.4s ease, box-shadow 0.4s ease;
}
.team-box:hover {
  transform: translateY(-10px) scale(1.05);
  box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}
.team-avatar {
  width: 120px;
  height: 120px;
  object-fit: cover;
  border: 5px solid #fff;
  transition: transform 0.3s ease;
}
.team-avatar:hover {
  transform: rotate(3deg) scale(1.1);
}

/* ==== Animation fade ==== */
.fade-in-down { 
  opacity: 0; 
  transform: translateY(-30px); 
  animation: fadeDown 1.2s ease forwards; 
}
@keyframes fadeDown { 
  to { opacity: 1; transform: translateY(0); } 
}
.fade-in-up { 
  opacity: 0; 
  transform: translateY(50px); 
  animation: fadeUp 1.2s ease forwards; 
}
@keyframes fadeUp { 
  to { opacity: 1; transform: translateY(0); } 
}

/* ==== Footer Styling ==== */
.footer-obf {
  color: #fff;
  padding: 40px 20px;
}
.footer-obf h5 {
  font-weight: bold;
  margin-bottom: 15px;
}
.footer-obf a {
  color: #fff;
  text-decoration: none;
}
.footer-obf a:hover {
  color: #000;
}