/* ============================================================
   ABC Wellness — Animations
   Compositor-friendly only: transform + opacity
   ============================================================ */

/* ── Keyframes ────────────────────────────────────────────── */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(1.5rem); }
  to   { opacity: 1; transform: translateY(0); }
}

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

@keyframes scaleIn {
  from { opacity: 0; transform: scale(0.96); }
  to   { opacity: 1; transform: scale(1); }
}

@keyframes slideInRight {
  from { opacity: 0; transform: translateX(1.5rem); }
  to   { opacity: 1; transform: translateX(0); }
}

/* ── Entrance utility classes ─────────────────────────────── */
.abc-fade-up {
  animation: fadeUp var(--abc-dur-enter) var(--abc-ease-enter) both;
}

.abc-fade-in {
  animation: fadeIn var(--abc-dur-enter) var(--abc-ease-enter) both;
}

.abc-scale-in {
  animation: scaleIn var(--abc-dur-enter) var(--abc-ease-enter) both;
}

/* Staggered delays for grids */
.abc-stagger > *:nth-child(1) { animation-delay: 0ms; }
.abc-stagger > *:nth-child(2) { animation-delay: 80ms; }
.abc-stagger > *:nth-child(3) { animation-delay: 160ms; }
.abc-stagger > *:nth-child(4) { animation-delay: 240ms; }
.abc-stagger > *:nth-child(5) { animation-delay: 320ms; }
.abc-stagger > *:nth-child(6) { animation-delay: 400ms; }

/* ── Hover transitions (all use transform/opacity only) ────── */
.abc-hover-lift {
  transition: transform var(--abc-dur-std) var(--abc-ease-enter),
              box-shadow var(--abc-dur-std) var(--abc-ease-enter);
}

.abc-hover-lift:hover {
  transform: translateY(-4px);
  box-shadow: var(--abc-shadow-lg);
}

/* ── Scroll-triggered via Intersection Observer ────────────── */
.abc-reveal {
  opacity: 0;
  transform: translateY(1.5rem);
  transition: opacity var(--abc-dur-enter) var(--abc-ease-enter),
              transform var(--abc-dur-enter) var(--abc-ease-enter);
}

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

/* ── Reduced motion overrides ─────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .abc-fade-up,
  .abc-fade-in,
  .abc-scale-in {
    animation: none;
    opacity: 1;
    transform: none;
  }

  .abc-reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .abc-hover-lift:hover {
    transform: none;
  }
}