/**
 * Sokaplanet Motion System: "Culture in Motion"
 * 
 * Principles: Clarity, restraint, and performance.
 * 
 * Allowed Animations:
 * ✅ CTA hover: opacity 1 → var(--hover-opacity), 150ms var(--ease-apple)
 * ✅ Section scroll-in: fade + translateY(8px), 200ms, staggered 50ms
 * ✅ Focus states: outline draw, 100ms
 * ✅ Sub-brand accent-bar hover: width 3px → 6px, 200ms (implemented via scaleX to prevent layout thrashing)
 * 
 * Forbidden:
 * ❌ Parallax, ❌ bounce, ❌ scale>1.02, ❌ color transitions (except opacity)
 * 
 * Performance Budget:
 * - No layout thrashing (animate opacity/transform only)
 * - Total animation CSS <1KB
 */

/* Base instant state change (Fallback & Reduced Motion) */
.motion-cta {
  transition: none;
}
.motion-cta:hover {
  opacity: var(--hover-opacity);
}

.motion-scroll-in {
  opacity: 1;
  transform: none;
  transition: none;
}

.motion-focus {
  transition: none;
}
.motion-focus:focus-visible {
  outline: var(--focus-ring);
  outline-offset: 2px;
}

.motion-accent-bar {
  width: 3px;
  transform-origin: left center;
  transition: none;
}
/* Fallback for reduced motion */
.ecosystem-block:hover .motion-accent-bar {
  transform: scaleX(2);
}

/* Opt-in animations for users who prefer motion */
@media (prefers-reduced-motion: no-preference) {
  .motion-cta {
    transition: opacity 150ms var(--ease-apple);
  }

  .motion-scroll-in {
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 200ms var(--ease-apple), transform 200ms var(--ease-apple);
  }
  .motion-scroll-in.is-visible {
    opacity: 1;
    transform: translateY(0);
  }

  /* Staggering utilities (50ms increments) */
  .delay-50 { transition-delay: 50ms; }
  .delay-100 { transition-delay: 100ms; }
  .delay-150 { transition-delay: 150ms; }
  .delay-200 { transition-delay: 200ms; }
  .delay-250 { transition-delay: 250ms; }

  .motion-focus {
    transition: outline 100ms var(--ease-apple), outline-offset 100ms var(--ease-apple);
  }

  .motion-accent-bar {
    transition: transform 200ms var(--ease-apple);
  }
}