/* 3D Hover Card */
.hover-card-3d {
  height: 280px;
  background: var(--card-bg);
  border-radius: 15px;
  overflow: hidden;
  position: relative;
  transition: all 0.4s ease;
  border: 1px solid var(--glass-border);
  transform-style: preserve-3d;
  perspective: 1000px;
}

.hover-card-3d:hover {
  transform: rotateY(10deg) rotateX(5deg);
  box-shadow: -20px 20px 30px rgba(0, 0, 0, 0.3);
}

.hover-card-3d::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(45deg, transparent, rgba(255, 255, 255, 0.1));
  opacity: 0;
  transition: all 0.4s ease;
}

.hover-card-3d:hover::before {
  opacity: 1;
}

.hover-card-3d .card-content {
  padding: 20px;
  position: absolute;
  bottom: 0;
  width: 100%;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(5px);
  transform: translateZ(20px);
  transition: all 0.4s ease;
}