/* Services Slider Section Styles */

.services-slider-section {
  @apply relative;
}

/* Background decorative shapes */
.services-bg-shape-1,
.services-bg-shape-2,
.services-bg-shape-3 {
  animation: float 8s ease-in-out infinite;
}

.services-bg-shape-2 {
  animation-delay: 2s;
}

.services-bg-shape-3 {
  animation-delay: 4s;
}

/* Services Slider Container */
.services-slider-container {
  @apply relative;
}

/* Service Slide Card */
.service-slide-card {
  @apply bg-white rounded-2xl overflow-hidden shadow-lg;
}

/* Service Card Image */
.service-card-image {
  @apply relative h-64 overflow-hidden;
}

.service-card-image img {
  @apply w-full h-full object-cover;
}

/* Service Card Overlay */
.service-card-overlay {
  @apply absolute inset-0 bg-gradient-to-t from-black/60 via-transparent to-transparent flex items-end justify-center pb-6;
  opacity: 0;
}

.service-icon {
  @apply w-16 h-16 bg-accent rounded-full flex items-center justify-center;
}

.service-icon i {
  @apply text-white;
}

/* Service Card Content */
.service-card-content {
  @apply p-8;
}

.service-title {
  @apply text-xl font-bold text-gray-900 mb-4;
}

.service-description {
  @apply text-gray-600 leading-relaxed mb-6;
}

/* Service Features */
.service-features {
  @apply flex flex-wrap gap-2;
}

.feature-tag {
  @apply px-3 py-1 bg-gray-100 text-gray-600 text-xs font-medium rounded-full;
}

/* Splide Customization */
.services-slider .splide__track {
  @apply overflow-visible;
}

.services-slider .splide__list {
  @apply gap-6;
}

.services-slider .splide__slide {
  @apply px-3;
}

/* Slider Navigation */
.services-slider-prev,
.services-slider-next {
  @apply transition-all duration-200;
}

.services-slider-prev:hover,
.services-slider-next:hover {
  @apply shadow-lg;
}

/* Pagination */
.services-slider-pagination .splide__pagination__page {
  @apply w-3 h-3 bg-gray-300 rounded-full transition-all duration-200;
}

.services-slider-pagination .splide__pagination__page.is-active {
  @apply bg-accent w-8;
}

.services-slider-pagination .splide__pagination__page:hover {
  @apply bg-accent/70;
}

/* Responsive Design */
@media (max-width: 768px) {
  .service-card-content {
    @apply p-6;
  }

  .service-title {
    @apply text-lg;
  }

  .service-description {
    @apply text-sm;
  }

  .services-slider .splide__slide {
    @apply px-2;
  }
}

@media (max-width: 640px) {
  .service-card-image {
    @apply h-48;
  }

  .service-card-content {
    @apply p-4;
  }

  .service-features {
    @apply gap-3;
  }

  .feature-tag {
    @apply px-2 py-1 text-xs;
  }
}

/* Animation keyframes */
@keyframes float {
  0%,
  100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-20px);
  }
}

/* Loading animation for images */
.service-card-image img {
  transition: opacity 0.3s ease;
}

.service-card-image img[loading] {
  opacity: 0;
}

.service-card-image img:not([loading]) {
  opacity: 1;
}