/*
 * Animations — drop-in entrance motion library.
 *
 * Add data-aed-fade-in, data-aed-fade-up, etc., to any element. The
 * addon attaches IntersectionObserver and toggles `is-visible` when
 * the element scrolls into view. CSS handles the transition.
 *
 * See /animations/README.md.
 */

/* Default duration / easing — overridable per-element via inline style
   or per-page CSS variable. */
[data-aed-fade-in],
[data-aed-fade-up],
[data-aed-fade-down],
[data-aed-fade-left],
[data-aed-fade-right],
[data-aed-zoom-in],
[data-aed-zoom-out] {
  --aed-anim-duration: 700ms;
  --aed-anim-ease: cubic-bezier(0.4, 0, 0.2, 1);
  opacity: 0;
  transition:
    opacity var(--aed-anim-duration) var(--aed-anim-ease),
    transform var(--aed-anim-duration) var(--aed-anim-ease);
  will-change: opacity, transform;
}

/* Initial transforms (the addon clears them when is-visible) */
[data-aed-fade-up]    { transform: translateY(24px); }
[data-aed-fade-down]  { transform: translateY(-24px); }
[data-aed-fade-left]  { transform: translateX(24px); }
[data-aed-fade-right] { transform: translateX(-24px); }
[data-aed-zoom-in]    { transform: scale(0.94); }
[data-aed-zoom-out]   { transform: scale(1.06); }

/* Visible state — addon adds .is-visible */
[data-aed-fade-in].is-visible,
[data-aed-fade-up].is-visible,
[data-aed-fade-down].is-visible,
[data-aed-fade-left].is-visible,
[data-aed-fade-right].is-visible,
[data-aed-zoom-in].is-visible,
[data-aed-zoom-out].is-visible {
  opacity: 1;
  transform: none;
}

/* No-JS / addon-disabled fallback: show everything */
html.no-js [data-aed-fade-in],
html.no-js [data-aed-fade-up],
html.no-js [data-aed-fade-down],
html.no-js [data-aed-fade-left],
html.no-js [data-aed-fade-right],
html.no-js [data-aed-zoom-in],
html.no-js [data-aed-zoom-out] {
  opacity: 1;
  transform: none;
}

@media print {
  [data-aed-fade-in],
  [data-aed-fade-up],
  [data-aed-fade-down],
  [data-aed-fade-left],
  [data-aed-fade-right],
  [data-aed-zoom-in],
  [data-aed-zoom-out] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  [data-aed-fade-in],
  [data-aed-fade-up],
  [data-aed-fade-down],
  [data-aed-fade-left],
  [data-aed-fade-right],
  [data-aed-zoom-in],
  [data-aed-zoom-out] {
    opacity: 1;
    transform: none;
    transition: none;
  }
}