/* ================= CAREERS PAGE ================= */

.careers-hero {
  background: linear-gradient(135deg, #0d47a1, #1976d2);
  color: #fff;
  padding: 5px 20px;
}
/* Home button in hero section */
.home-btn {
  position: absolute;
  top: 20px;
  right: 20px;
  font-weight: 600;
  border-radius: 20px;
  padding: 6px 14px;
}


.profile-card,
.job-card {
  background: #fff;
  padding: 25px;
  border-radius: 16px;
  box-shadow: 0 8px 25px rgba(0,0,0,0.08);
  transition: 0.3s ease;
}

.profile-card:hover,
.job-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 16px 35px rgba(0,0,0,0.15);
}

.profile-item,
.job-item {
  background: #fff;
  padding: 20px;
  border-radius: 12px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.08);
  font-weight: 600;
  transition: 0.3s ease;
}

.profile-item:hover,
.job-item:hover {
  transform: translateY(-6px);
}

.career-card {
  background: #fff;
  padding: 22px;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);
  transition: 0.3s;
  height: 100%;
}

.career-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0,0,0,0.15);
}

.career-card h5 {
  font-weight: 700;
}

.career-card .meta {
  font-size: 0.9rem;
  color: #666;
}

.pagination button {
  border: none;
  background: #e9ecef;
  padding: 8px 14px;
  margin: 0 4px;
  border-radius: 8px;
}

.pagination button.active {
  background: #1976d2;
  color: #fff;
}