/* ══ MF Scroll Animations ══════════════════════════════════════════ */
@media (prefers-reduced-motion: no-preference) {

  .mf-sa {
    opacity: 0;
    will-change: opacity, transform, filter;
    transition:
      opacity   .7s cubic-bezier(.22,1,.36,1) var(--mf-d,0s),
      transform .7s cubic-bezier(.22,1,.36,1) var(--mf-d,0s),
      filter    .7s cubic-bezier(.22,1,.36,1) var(--mf-d,0s);
  }

  /* ── Типы анимаций ── */
  .mf-sa--up    { transform: translateY(52px); }
  .mf-sa--left  { transform: translateX(-52px); }
  .mf-sa--right { transform: translateX(52px); }
  .mf-sa--scale { transform: scale(.84) translateY(20px); }
  .mf-sa--blur  { transform: translateY(32px); filter: blur(8px); }
  .mf-sa--pop   { transform: scale(.78); filter: blur(4px); }
  .mf-sa--clip  {
    transform: translateY(36px);
    clip-path: inset(0 0 100% 0);
    transition:
      opacity   .65s cubic-bezier(.22,1,.36,1) var(--mf-d,0s),
      transform .65s cubic-bezier(.22,1,.36,1) var(--mf-d,0s),
      clip-path .65s cubic-bezier(.22,1,.36,1) var(--mf-d,0s);
  }

  /* ── Финальное состояние ── */
  .mf-sa.mf-vis {
    opacity: 1;
    transform: none;
    filter: none;
    clip-path: inset(0 0 0% 0);
  }

  /* Небольшой оверride для быстрых элементов (badge, icon) */
  .mf-sa--fast {
    transition-duration: .45s;
  }
}