/* Process step animations */
.process-step:hover,
[data-theme="light"] .process-step:hover,
[data-theme="dark"] .process-step:hover {
  transform: translateY(-8px) scale(1.02) !important;
  transition: all 0.3s ease !important;
}

.process-step.slide-in-active:hover,
[data-theme="light"] .process-step.slide-in-active:hover,
[data-theme="dark"] .process-step.slide-in-active:hover {
  transform: translateY(-8px) scale(1.02) !important;
  transition: all 0.3s ease !important;
}

/* Application Solution Cards - Normal shadows by default */
.application-solution-card {
  transition: all 0.6s ease;
  /* Normal gray shadows initially */
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 
              0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
}

/* Strategic Guidance Cards - Normal shadows by default */
.strategic-guidance-card {
  transition: all 0.6s ease;
  /* Normal gray shadows initially */
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 
              0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
}

/* Industry Cards - Normal shadows by default */
.industry-card {
  transition: all 0.6s ease;
  /* Normal gray shadows initially */
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 
              0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
}

/* Alphacode Section Cards - Normal shadows by default */
.alphacode-section-card {
  transition: all 0.6s ease;
  /* Normal gray shadows initially */
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 
              0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
}

/* Contact Cards - Normal shadows by default */
.contact-card {
  transition: all 0.6s ease;
  /* Normal gray shadows initially */
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 
              0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
}

/* Process Step Cards - Normal shadows by default */
.process-step {
  transition: all 0.6s ease;
  /* Normal gray shadows initially */
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 
              0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
}

[data-theme="dark"] .application-solution-card {
  /* Normal dark shadows initially */
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3), 
              0 4px 6px -2px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .strategic-guidance-card {
  /* Normal dark shadows initially */
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3), 
              0 4px 6px -2px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .industry-card {
  /* Normal dark shadows initially */
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3), 
              0 4px 6px -2px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .alphacode-section-card {
  /* Normal dark shadows initially */
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3), 
              0 4px 6px -2px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .contact-card {
  /* Normal dark shadows initially */
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3), 
              0 4px 6px -2px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .process-step {
  /* Normal dark shadows initially */
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3), 
              0 4px 6px -2px rgba(0, 0, 0, 0.2) !important;
}

/* Blue shadow + floating effect only when animation is active */
.application-solution-card.shadow-active,
.strategic-guidance-card.shadow-active,
.industry-card.shadow-active,
.alphacode-section-card.shadow-active,
.contact-card.shadow-active,
.product-card.shadow-active,
.process-step.shadow-active {
  box-shadow: 0 12px 28px -5px rgba(59, 130, 246, 0.30), 
              0 8px 12px -6px rgba(59, 130, 246, 0.22),
              0 20px 40px -10px rgba(59, 130, 246, 0.18) !important;
  transform: translateY(-6px) !important;
}

/* Special handling for process steps that have both slide-in and shadow animations */
.process-step.slide-in-active.shadow-active {
  transform: translateX(0) translateY(-6px) !important;
  opacity: 1 !important;
}

/* Stronger, more visible shadows on hover when animation is active */
.application-solution-card.shadow-active:hover,
.strategic-guidance-card.shadow-active:hover,
.industry-card.shadow-active:hover,
.alphacode-section-card.shadow-active:hover,
.contact-card.shadow-active:hover,
.product-card.shadow-active:hover,
.process-step.shadow-active:hover {
  box-shadow: 0 16px 32px -5px rgba(59, 130, 246, 0.38), 
              0 12px 18px -6px rgba(59, 130, 246, 0.30),
              0 25px 45px -10px rgba(59, 130, 246, 0.22) !important;
  transform: translateY(-10px) !important;
}

/* Special handling for process steps hover with both animations */
.process-step.slide-in-active.shadow-active:hover {
  transform: translateX(0) translateY(-10px) !important;
}

[data-theme="dark"] .application-solution-card.shadow-active,
[data-theme="dark"] .strategic-guidance-card.shadow-active,
[data-theme="dark"] .industry-card.shadow-active,
[data-theme="dark"] .alphacode-section-card.shadow-active,
[data-theme="dark"] .contact-card.shadow-active,
[data-theme="dark"] .product-card.shadow-active {
  box-shadow: 0 12px 28px -5px rgba(59, 130, 246, 0.35), 
              0 8px 12px -6px rgba(59, 130, 246, 0.26),
              0 20px 40px -10px rgba(59, 130, 246, 0.20) !important;
  transform: translateY(-6px) !important;
}

/* Stronger dark mode hover shadows */
[data-theme="dark"] .application-solution-card.shadow-active:hover,
[data-theme="dark"] .strategic-guidance-card.shadow-active:hover,
[data-theme="dark"] .industry-card.shadow-active:hover,
[data-theme="dark"] .alphacode-section-card.shadow-active:hover,
[data-theme="dark"] .contact-card.shadow-active:hover,
[data-theme="dark"] .product-card.shadow-active:hover {
  box-shadow: 0 16px 32px -5px rgba(59, 130, 246, 0.42), 
              0 12px 18px -6px rgba(59, 130, 246, 0.34),
              0 25px 45px -10px rgba(59, 130, 246, 0.24) !important;
  transform: translateY(-10px) !important;
}

/* Slide Animation Styles for timeline section */
.slide-in-left,
[data-theme="light"] .slide-in-left,
[data-theme="dark"] .slide-in-left {
  transform: translateX(-100px) !important;
  opacity: 0 !important;
  transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.slide-in-right,
[data-theme="light"] .slide-in-right,
[data-theme="dark"] .slide-in-right {
  transform: translateX(100px) !important;
  opacity: 0 !important;
  transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.slide-in-active,
[data-theme="light"] .slide-in-active,
[data-theme="dark"] .slide-in-active {
  transform: translateX(0) !important;
  opacity: 1 !important;
}

.process-step,
[data-theme="light"] .process-step,
[data-theme="dark"] .process-step {
  transform: translateX(0) !important;
  opacity: 1 !important;
  transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.process-step.slide-in-left:not(.slide-in-active),
[data-theme="light"] .process-step.slide-in-left:not(.slide-in-active),
[data-theme="dark"] .process-step.slide-in-left:not(.slide-in-active) {
  transform: translateX(-100px) !important;
  opacity: 0 !important;
}

.process-step.slide-in-right:not(.slide-in-active),
[data-theme="light"] .process-step.slide-in-right:not(.slide-in-active),
[data-theme="dark"] .process-step.slide-in-right:not(.slide-in-active) {
  transform: translateX(100px) !important;
  opacity: 0 !important;
}

.timeline-dot,
[data-theme="light"] .timeline-dot,
[data-theme="dark"] .timeline-dot {
  transform: scale(0) !important;
  opacity: 0 !important;
  transition: all 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.timeline-dot.slide-in-active,
[data-theme="light"] .timeline-dot.slide-in-active,
[data-theme="dark"] .timeline-dot.slide-in-active {
  transform: scale(1) !important;
  opacity: 1 !important;
}

.timeline-line,
[data-theme="light"] .timeline-line,
[data-theme="dark"] .timeline-line {
  transform: scaleY(0) !important;
  transform-origin: top !important;
  transition: transform 1.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
  transition-delay: 0.2s !important;
}

.timeline-line.slide-in-active,
[data-theme="light"] .timeline-line.slide-in-active,
[data-theme="dark"] .timeline-line.slide-in-active {
  transform: scaleY(1) !important;
}

@media (max-width: 768px) {
  /* Use opacity-based animations instead of transform to avoid horizontal scroll */
  .slide-in-left,
  [data-theme="light"] .slide-in-left,
  [data-theme="dark"] .slide-in-left {
    transform: translateX(0) !important;
    opacity: 0 !important;
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
  }

  .slide-in-right,
  [data-theme="light"] .slide-in-right,
  [data-theme="dark"] .slide-in-right {
    transform: translateX(0) !important;
    opacity: 0 !important;
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
  }

  .process-step.slide-in-left:not(.slide-in-active),
  [data-theme="light"] .process-step.slide-in-left:not(.slide-in-active),
  [data-theme="dark"] .process-step.slide-in-left:not(.slide-in-active) {
    transform: translateX(0) !important;
    opacity: 0 !important;
  }

  .process-step.slide-in-right:not(.slide-in-active),
  [data-theme="light"] .process-step.slide-in-right:not(.slide-in-active),
  [data-theme="dark"] .process-step.slide-in-right:not(.slide-in-active) {
    transform: translateX(0) !important;
    opacity: 0 !important;
  }

  /* Active animations with fade-in effect on mobile */
  .slide-in-active,
  [data-theme="light"] .slide-in-active,
  [data-theme="dark"] .slide-in-active {
    transform: translateX(0) !important;
    opacity: 1 !important;
  }
}
