.card {
  transition: all 0.4s ease;
  border: none;
}
.card:hover {
  transform: translateY(-10px) scale(1.03);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
}
.card img {
  transition: transform 0.4s ease;
}
.card:hover img {
  transform: scale(1.05);
}
.btn {
  transition: all 0.3s ease;
}
.btn:hover {
  transform: scale(1.05);
  opacity: 0.9;
}

/* categoris */

.category-box {
  transition: all 0.4s ease;
  cursor: pointer;
}

.category-box:hover {
  transform: translateY(-10px) scale(1.05);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25);
}
.category-box img {
  transition: transform 0.4s ease;
}
.category-box:hover img {
  transform: scale(1.08);
}

 /* Smooth transition for cards */
  .category-card {
    transition: all 0.4s ease;
    border-radius: 12px;
    overflow: hidden;
  }

  /* Hover effect: subtle lift and shadow */
  .category-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
  }

  /* Smooth image scaling */
  .category-card img {
    transition: transform 0.4s ease;
  }

  .category-card:hover img {
    transform: scale(1.05);
  }

  /* Button hover */
  .btn-danger {
    transition: all 0.3s ease;
  }

  .btn-danger:hover {
    transform: scale(1.05);
    opacity: 0.9;
  }

  /* Responsive heading spacing */
  #backpack h1 {
    font-size: 2rem;
  }

  @media (min-width: 768px) {
    #backpack h1 {
      font-size: 2.5rem;
    }
  }