/* ====================================
   SERVICE PAGES HOVER EFFECTS
   Scoped to .services-page only
   ==================================== */
.services-page .card-hover {
  transition: all 0.3s ease;
  cursor: pointer;
}

.services-page .card-hover:hover {
  transform: translateY(-8px);
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
}

.services-page .feature-grid {
  transition: all 0.3s ease;
  cursor: pointer;
}

.services-page .feature-grid:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
  border-color: #ffc107 !important;
}

.services-page .feature-grid-icon-box {
  transition: all 0.3s ease;
}

.services-page .card-hover:hover .feature-grid-icon-box,
.services-page .feature-grid:hover .feature-grid-icon-box {
  transform: scale(1.1) rotate(5deg);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.services-page .service-package-card {
  transition: all 0.3s ease;
}

.services-page .service-package-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 20px 40px rgba(0, 123, 255, 0.2);
}

.services-page .service-package-card:hover .feature-grid-icon-box {
  transform: scale(1.15) rotate(10deg);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.services-page .translation-card {
  transition: all 0.3s ease;
  cursor: pointer;
}

.services-page .translation-card:hover {
  transform: translateY(-5px) scale(1.02);
  box-shadow: 0 12px 25px rgba(0, 0, 0, 0.15);
}

.services-page .copy-service-card {
  transition: all 0.3s ease;
  cursor: pointer;
}

.services-page .copy-service-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
}

.services-page .copy-service-card:hover .bg-primary,
.services-page .copy-service-card:hover .bg-warning,
.services-page .copy-service-card:hover .bg-secondary {
  transform: scale(1.1);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.services-page .sidebar-card {
  transition: all 0.3s ease;
}

.services-page .sidebar-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.services-page .bg-gradient-warning {
  background: linear-gradient(135deg, #ffc107 0%, #ff8906 100%);
  transition: all 0.3s ease;
}

.services-page .bg-gradient-warning:hover {
  background: linear-gradient(135deg, #ff8906 0%, #ffc107 100%);
  transform: translateY(-5px);
  box-shadow: 0 12px 30px rgba(255, 193, 7, 0.3);
}

.services-page .bg-gradient-primary {
  background: linear-gradient(135deg, #007bff 0%, #0056b3 100%);
  transition: all 0.3s ease;
}

.services-page .bg-gradient-primary:hover {
  background: linear-gradient(135deg, #0056b3 0%, #007bff 100%);
  transform: translateY(-5px);
  box-shadow: 0 12px 30px rgba(0, 123, 255, 0.3);
}

.services-page .excluded-services {
  transition: all 0.3s ease;
}

.services-page .excluded-services:hover {
  transform: translateY(-3px);
  border-color: #ff6b6b !important;
  box-shadow: 0 5px 15px rgba(255, 193, 7, 0.3);
}

.services-page .included-services {
  transition: all 0.3s ease;
}

.services-page .included-services:hover {
  transform: translateY(-3px);
  box-shadow: 0 5px 15px rgba(108, 117, 125, 0.2);
}

.services-page .benefit-item {
  transition: all 0.3s ease;
  cursor: pointer;
}

.services-page .benefit-item:hover {
  transform: translateY(-5px);
}

.services-page .benefit-item:hover .feature-grid-icon-box {
  transform: scale(1.15) rotate(5deg);
  background: linear-gradient(135deg, #007bff 0%, #0056b3 100%) !important;
}

.services-page .highlight-item {
  transition: all 0.2s ease;
  cursor: pointer;
}

.services-page .highlight-item:hover {
  transform: translateX(5px);
  background-color: rgba(0, 123, 255, 0.05);
  border-radius: 8px;
  padding: 8px;
  margin: -8px;
}

.services-page .service-icon[data-feather] {
  transition: all 0.2s ease;
}

.services-page .d-flex:hover .service-icon[data-feather] {
  transform: scale(1.2);
}

.services-page .btn-white:hover {
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.services-page .service-list li {
  transition: all 0.2s ease;
}

.services-page .service-list li:hover {
  transform: translateX(5px);
  color: #ffc107 !important;
}

.services-page .service-list li:hover i {
  transform: scale(1.2);
}

.services-page .card-body ul {
  list-style: disc !important;
  list-style-position: inside !important;
  padding-left: 1rem !important;
}

.services-page .card-body ul li {
  list-style: disc !important;
  display: list-item !important;
}