/* Premium entrance motion — opacity, translate3d, optional blur */

[data-motion] {
  --motion-local-y: var(--motion-y);
  --motion-local-blur: var(--motion-blur);
  --motion-local-duration: var(--motion-duration);

  opacity: 0;
  transform: translate3d(0, var(--motion-local-y), 0);
  filter: blur(var(--motion-local-blur));
  transition:
    opacity var(--motion-local-duration) var(--motion-ease),
    transform var(--motion-local-duration) var(--motion-ease),
    filter var(--motion-local-duration) var(--motion-ease);
  transition-delay: calc(
    var(--motion-stagger-index, 0) * var(--motion-stagger-step) +
      var(--motion-delay-extra, 0s)
  );
}

[data-motion].is-motion-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  filter: blur(0);
}

[data-motion].is-motion-pending {
  will-change: opacity, transform, filter;
}

[data-motion].is-motion-done {
  will-change: auto;
}

/* Variants */
[data-motion="fade-up"] {
  /* default — uses root tokens */
}

[data-motion="fade-down"] {
  --motion-local-y: -16px;
}

[data-motion="text"] {
  --motion-local-blur: 0;
}

[data-motion="fade-settle"] {
  --motion-local-y: var(--motion-y-sm);
  --motion-local-blur: 0;
}

[data-motion="fade-settle"].is-motion-visible {
  transform: translate3d(0, 0, 0) scale(1);
}

[data-motion="fade-settle"]:not(.is-motion-visible) {
  transform: translate3d(0, var(--motion-local-y), 0) scale(0.98);
}

[data-motion="image-reveal"] {
  --motion-local-blur: 0;
  overflow: hidden;
}

[data-motion="image-reveal"]:not(.is-motion-visible) {
  transform: translate3d(0, var(--motion-y-sm), 0);
}

[data-motion="image-reveal"].is-motion-visible {
  transform: translate3d(0, 0, 0);
}

[data-motion="image-reveal"] img {
  transform: scale(var(--motion-image-scale-from));
  transition: transform var(--motion-local-duration) var(--motion-ease);
  transition-delay: inherit;
}

[data-motion="image-reveal"].is-motion-visible img {
  transform: scale(1);
}

/* Card entrance — subtle scale without fighting hover on inner card */
[data-motion="card"] {
  --motion-local-blur: 0;
}

[data-motion="card"]:not(.is-motion-visible) {
  transform: translate3d(0, var(--motion-local-y), 0) scale(0.98);
}

[data-motion="card"].is-motion-visible {
  transform: translate3d(0, 0, 0) scale(1);
}

/* Stagger containers */
[data-motion-stagger] > [data-motion] {
  transition-delay: calc(
    var(--motion-stagger-index, 0) * var(--motion-stagger-step) +
      var(--motion-delay-extra, 0s)
  );
}

/* Hero actions stagger children */
.hero__actions[data-motion-stagger] > [data-motion] {
  display: inline-flex;
}

/* Mobile — faster, less blur, tighter stagger */
@media (max-width: 767px) {
  :root {
    --motion-duration: 0.7s;
    --motion-y: 16px;
    --motion-blur: 0px;
    --motion-stagger-step: 0.06s;
  }
}

@media (prefers-reduced-motion: reduce) {
  [data-motion] {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
    will-change: auto !important;
  }

  [data-motion="image-reveal"] img {
    transform: none !important;
    transition: none !important;
  }

  [data-motion="fade-settle"]:not(.is-motion-visible),
  [data-motion="card"]:not(.is-motion-visible) {
    transform: none !important;
  }
}