.hero {
  background: url('../images/img1.jpg') center/cover no-repeat;
  position: relative;
  color: white;
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.4); /* dark overlay */
}

.hero .container {
  position: relative;
  z-index: 1;
}


/* Navbar hover & transparency */
.navbar .nav-link:hover {
  color: #0d6efd !important; /* highlight on hover */
  transition: 0.3s;
}

/* Add slight background on scroll */
.navbar.scrolled {
  background: rgba(0, 0, 0, 0.85) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.3);
  transition: 0.3s;
}

/* Hero text animation */
.hero h1 {
  animation: fadeInDown 1s ease forwards;
}
.hero p {
  animation: fadeInUp 1s ease 0.5s forwards;
}
.hero .btn {
  animation: fadeIn 1s ease 1s forwards;
}

/* Animations */
@keyframes fadeInDown {
  0% { opacity: 0; transform: translateY(-30px); }
  100% { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInUp {
  0% { opacity: 0; transform: translateY(30px); }
  100% { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}