.project-carousel-3d .project-carousel-item {
  position: relative;
  z-index: 1;
  border-radius: 12px;
  overflow: hidden;
}

.project-carousel-3d .project-carousel-photo {
  position: relative;
  z-index: 1;
  padding-top: 75%;
}

.project-carousel-3d .project-carousel-detail,
.project-carousel-3d .project-carousel-date {
  display: block !important;
  
  visibility: visible !important;
  transform: none !important;
  z-index: 100;
  pointer-events: none;
}

.project-carousel-3d .project-carousel-date {
  position: absolute !important;
  top: 20px !important;
  right: 20px !important;
  color: #201a17 !important;
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  z-index: 10 !important;
  
  border-radius: 30px !important;
  padding: 0.4rem 0.8rem !important;
  
}

/* Force title and category to be visible */
.project-carousel-3d .project-carousel-title,
.project-carousel-3d .project-carousel-category {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: #fff !important;
}

.project-carousel-3d .project-carousel-title {
  font-size: 1.4rem !important;
  margin-bottom: 0.5rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

.project-carousel-3d .project-carousel-category {
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: #cd7656 !important;
}

/* Ensure the detail container is properly positioned and visible */
.project-carousel-3d .project-carousel-detail {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  padding: 2rem !important;
  z-index: 100 !important;
  pointer-events: auto !important;
  
  border-radius: 0 !important;
}

/* Override any 3D transforms that might affect text visibility */
.project-carousel-3d .owl-item {
  transform-style: flat !important;
  -webkit-transform-style: flat !important;
}

/* Ensure text stays above everything */
.project-carousel-3d {
  perspective: none !important;
  -webkit-perspective: none !important;
}

.carousel-container {
  overflow: visible !important;
  position: relative;
}

/* Navigation button fixes */
.project-carousel-3d .owl-nav {
  z-index: 1000 !important;
}

.project-carousel-3d .owl-prev,
.project-carousel-3d .owl-next {
  z-index: 1000 !important;
  background: rgba(161, 129, 103, 0.8) !important;
  color: white !important;
  width: 50px !important;
  height: 50px !important;
  min-width: 50px !important;
  min-height: 50px !important;
}

.project-carousel-3d .owl-prev:hover,
.project-carousel-3d .owl-next:hover {
  background: rgba(161, 129, 103, 1) !important;
}

.project-carousel-3d .owl-prev i,
.project-carousel-3d .owl-next i {
  font-size: 1.2rem !important;
  color: white !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
}

/* Responsive adjustments */
@media (max-width: 767px) {
  .project-carousel-3d .project-carousel-date {
    top: 15px !important;
    right: 15px !important;
    font-size: 0.8rem !important;
    padding: 0.3rem 0.6rem !important;
  }
  
  .project-carousel-3d .project-carousel-title {
    font-size: 1.1rem !important;
  }
  
  .project-carousel-3d .project-carousel-category {
    font-size: 0.8rem !important;
  }
  
  .project-carousel-3d .project-carousel-detail {
    padding: 1.2rem !important;
  }
  
  .project-carousel-3d .owl-prev,
  .project-carousel-3d .owl-next {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    font-size: 1.2rem !important;
  }
  
  .project-carousel-3d .owl-prev i,
  .project-carousel-3d .owl-next i {
    font-size: 1rem !important;
  }
  
  .project-carousel-3d .owl-prev {
    left: 5px !important;
  }
  
  .project-carousel-3d .owl-next {
    right: 5px !important;
  }
}