/* ─────────────────────────────────────────────────────────────
   AiS1.52 — Motion
   GSAP-driven entrance reveals + reduced-motion fallback.
   ───────────────────────────────────────────────────────────── */

/* Default state for elements that GSAP will animate in. */
[data-reveal] {
  opacity: 0;
  transform: translateY(24px);
  will-change: transform, opacity;
}

[data-reveal-up] {
  opacity: 0;
  transform: translateY(60px);
  will-change: transform, opacity;
}

[data-reveal-stagger] > * {
  opacity: 0;
  transform: translateY(20px);
  will-change: transform, opacity;
}

[data-split] {
  visibility: hidden;
}

.split-char {
  display: inline-block;
  transform: translateY(110%);
  opacity: 0;
  will-change: transform, opacity;
}

/* ─────────────────────────────────────────────────────────────
   Reduced motion — disable all transitions and animations,
   reveal everything immediately, no Lenis, no GSAP timelines.
   ───────────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  [data-reveal],
  [data-reveal-up],
  [data-reveal-stagger] > * {
    opacity: 1 !important;
    transform: none !important;
  }

  [data-split] { visibility: visible !important; }
  .split-char { opacity: 1 !important; transform: none !important; }

  .marquee-track { animation: none !important; transform: none !important; }
  .status-dot { animation: none !important; }
  .fab::before, .fab:hover::before { transition: none !important; }

  /* Disable horizontal scroll pin — show projects in vertical stack */
  .work-pin {
    height: auto !important;
    overflow: visible !important;
  }
  .work-track {
    flex-wrap: wrap !important;
    transform: none !important;
    padding-right: var(--container-px) !important;
    gap: var(--sp-6) !important;
  }
  .card {
    flex: 1 1 100% !important;
    max-width: 720px !important;
  }
}