/* =====================================================
   FEATURES SECTION MOBILE ANIMATIONS ONLY
   (Separate file - does not affect other styles)
   ===================================================== */

/* === MOBILE ONLY (max-width: 767px) === */
@media screen and (max-width: 767px) {
  
  /* Left column - Slide in from left */
  .features-left .services-item {
    animation: slideInFromLeft 0.8s ease-out !important;
  }

  /* Right column - Slide in from right */
  .features-right .services-item {
    animation: slideInFromRight 0.8s ease-out !important;
  }

  /* Stagger delays for sequential appearance */
  .features-left .services-item:nth-child(1) {
    animation-delay: 0.1s !important;
  }

  .features-left .services-item:nth-child(2) {
    animation-delay: 0.3s !important;
  }

  .features-right .services-item:nth-child(1) {
    animation-delay: 0.5s !important;
  }

  .features-right .services-item:nth-child(2) {
    animation-delay: 0.7s !important;
  }

  /* Images - Slide up from bottom */
  .features-tab-image-wrapper {
    animation: slideUpFromBottom 0.6s ease-out !important;
  }

  /* Titles - Flip animation with 3D effect */
  .services-title {
    animation: flipAnimation 0.6s ease-out !important;
    animation-delay: 0.2s !important;
  }
}

/* === KEYFRAME ANIMATIONS === */

/* Slide in from left */
@keyframes slideInFromLeft {
  0% {
    opacity: 0;
    transform: translateX(-50px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

/* Slide in from right */
@keyframes slideInFromRight {
  0% {
    opacity: 0;
    transform: translateX(50px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

/* Slide up from bottom */
@keyframes slideUpFromBottom {
  0% {
    opacity: 0;
    transform: translateY(40px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Flip animation with 3D perspective */
@keyframes flipAnimation {
  0% {
    opacity: 0;
    transform: perspective(1000px) rotateX(-20deg);
  }
  100% {
    opacity: 1;
    transform: perspective(1000px) rotateX(0);
  }
}

/* === ACCESSIBILITY === */
@media (prefers-reduced-motion: reduce) {
  .services-item,
  .features-tab-image-wrapper,
  .services-title {
    animation: none !important;
  }
}