/**
 * animations.css
 * Lightweight, professional motion: fade/slide reveal on scroll, subtle
 * hover lifts, and the accordion open/close transition. Everything is
 * short-duration and easing-driven rather than bouncy or decorative.
 */

@keyframes fadeSlideUp {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes softPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.45; }
}

/* --- Scroll reveal -------------------------------------------------------
   Elements start slightly translated + transparent, then transition to
   their resting state once scrollReveal.js adds .is-visible (via
   IntersectionObserver). data-reveal-delay sets a staggered start. */
[data-reveal] {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity var(--duration-slow) var(--ease-out),
    transform var(--duration-slow) var(--ease-out);
  transition-delay: var(--reveal-delay, 0ms);
}

[data-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  [data-reveal] {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* --- Hover micro-interactions -------------------------------------------- */
.core-value-card,
.advantage-card,
.service-card,
.tech-item,
.testimonial-card,
.stat-card {
  transition: transform var(--duration-base) var(--ease-out),
    box-shadow var(--duration-base) var(--ease-out),
    border-color var(--duration-base) var(--ease-out);
}

.core-value-card:hover,
.advantage-card:hover,
.service-card:hover,
.tech-item:hover,
.testimonial-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
  border-color: var(--color-border-strong);
}

/* --- Accordion transition -------------------------------------------------- */
.accordion-item__panel {
  overflow: hidden;
  transition: grid-template-rows var(--duration-base) var(--ease-in-out);
}

.accordion-item__chevron {
  transition: transform var(--duration-base) var(--ease-out);
}

.accordion-item__trigger[aria-expanded='true'] .accordion-item__chevron {
  transform: rotate(180deg);
}

/* --- Loader / spinner ------------------------------------------------------ */
.icon-spin {
  animation: spin 0.9s linear infinite;
}

/* --- Status dot pulse (hero card "system online") --------------------------- */
.status-dot {
  animation: softPulse 2.4s var(--ease-in-out) infinite;
}