/*!
 * HF Motion v1.0.0
 * Free with attribution to https://humanfriend.digital/.
 * Attribution is waived for Human Friend Digital clients and development partners.
 * Runtime state is gated by data-hf-ready so missing JavaScript never hides content.
 */
html.hf-motion-pending [data-hf-trigger="load"],
html.hf-motion-pending [data-hf-trigger="load"].hf-stagger-children > *,
html.hf-motion-pending [data-hf-trigger="load"].hf-reveal-children > *,
html.hf-motion-pending [data-hf-trigger="load"][data-hf-stagger] > *,
html.hf-motion-pending [data-hf-trigger="load"] .hf-motion-item {
  opacity: 0;
}

[data-hf-ready] [data-hf-reveal-state],
[data-hf-ready] [data-hf-parallax-state] {
  --hf-reveal-from-x: 0px;
  --hf-reveal-from-y: 0px;
  --hf-reveal-scale: 1;
  --hf-reveal-rotate: 0deg;
  --hf-reveal-blur: 0px;
  --hf-reveal-origin: center center;
  --hf-reveal-duration: 700ms;
  --hf-reveal-delay: 0ms;
  --hf-reveal-easing: cubic-bezier(0.22, 1, 0.36, 1);
  --hf-parallax-x: 0px;
  --hf-parallax-y: 0px;
  --hf-active-reveal-x: 0px;
  --hf-active-reveal-y: 0px;
  --hf-active-scale: 1;
  --hf-active-rotate: 0deg;
  --hf-active-blur: 0px;
  -webkit-transform: translate3d(
    calc(var(--hf-active-reveal-x) + var(--hf-parallax-x)),
    calc(var(--hf-active-reveal-y) + var(--hf-parallax-y)),
    0
  ) scale(var(--hf-active-scale)) rotate(var(--hf-active-rotate));
  transform: translate3d(
    calc(var(--hf-active-reveal-x) + var(--hf-parallax-x)),
    calc(var(--hf-active-reveal-y) + var(--hf-parallax-y)),
    0
  ) scale(var(--hf-active-scale)) rotate(var(--hf-active-rotate));
  -webkit-transform-origin: var(--hf-reveal-origin);
  transform-origin: var(--hf-reveal-origin);
  -webkit-filter: blur(var(--hf-active-blur));
  filter: blur(var(--hf-active-blur));
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

[data-hf-ready] [data-hf-reveal-state] {
  -webkit-transition-property: opacity, -webkit-transform, -webkit-filter;
  transition-property: opacity, transform, filter;
  -webkit-transition-duration: var(--hf-reveal-duration);
  transition-duration: var(--hf-reveal-duration);
  -webkit-transition-timing-function: var(--hf-reveal-easing);
  transition-timing-function: var(--hf-reveal-easing);
  -webkit-transition-delay: var(--hf-reveal-delay);
  transition-delay: var(--hf-reveal-delay);
  will-change: opacity, transform, filter;
}

[data-hf-ready] [data-hf-reveal-state="hidden"] {
  --hf-active-reveal-x: var(--hf-reveal-from-x);
  --hf-active-reveal-y: var(--hf-reveal-from-y);
  --hf-active-scale: var(--hf-reveal-scale);
  --hf-active-rotate: var(--hf-reveal-rotate);
  --hf-active-blur: var(--hf-reveal-blur);
  -webkit-transform: translate3d(
    calc(var(--hf-reveal-from-x) + var(--hf-parallax-x)),
    calc(var(--hf-reveal-from-y) + var(--hf-parallax-y)),
    0
  ) scale(var(--hf-reveal-scale)) rotate(var(--hf-reveal-rotate));
  transform: translate3d(
    calc(var(--hf-reveal-from-x) + var(--hf-parallax-x)),
    calc(var(--hf-reveal-from-y) + var(--hf-parallax-y)),
    0
  ) scale(var(--hf-reveal-scale)) rotate(var(--hf-reveal-rotate));
  -webkit-filter: blur(var(--hf-reveal-blur));
  filter: blur(var(--hf-reveal-blur));
  opacity: 0;
}

[data-hf-ready] [data-hf-reveal-state="visible"] {
  --hf-active-reveal-x: 0px;
  --hf-active-reveal-y: 0px;
  --hf-active-scale: 1;
  --hf-active-rotate: 0deg;
  --hf-active-blur: 0px;
  -webkit-transform: translate3d(var(--hf-parallax-x), var(--hf-parallax-y), 0) scale(1) rotate(0deg);
  transform: translate3d(var(--hf-parallax-x), var(--hf-parallax-y), 0) scale(1) rotate(0deg);
  -webkit-filter: blur(0px);
  filter: blur(0px);
  opacity: 1;
}

[data-hf-ready] [data-hf-parallax-state="active"] {
  will-change: transform;
}

[data-hf-ready] [data-hf-parallax-state="disabled"] {
  --hf-parallax-x: 0px !important;
  --hf-parallax-y: 0px !important;
}

@media (max-width: 767px) {
  [data-hf-ready] .hf-disable-mobile,
  [data-hf-ready] [data-hf-disable~="mobile"] {
    --hf-active-reveal-x: 0px !important;
    --hf-active-reveal-y: 0px !important;
    --hf-active-scale: 1 !important;
    --hf-active-rotate: 0deg !important;
    --hf-active-blur: 0px !important;
    --hf-parallax-x: 0px !important;
    --hf-parallax-y: 0px !important;
    opacity: 1 !important;
    -webkit-transform: none !important;
    transform: none !important;
    -webkit-filter: none !important;
    filter: none !important;
    -webkit-transition: none !important;
    transition: none !important;
    will-change: auto !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.hf-motion-pending [data-hf-trigger="load"],
  html.hf-motion-pending [data-hf-trigger="load"].hf-stagger-children > *,
  html.hf-motion-pending [data-hf-trigger="load"].hf-reveal-children > *,
  html.hf-motion-pending [data-hf-trigger="load"][data-hf-stagger] > *,
  html.hf-motion-pending [data-hf-trigger="load"] .hf-motion-item {
    opacity: 1 !important;
  }

  [data-hf-ready] [data-hf-reveal-state],
  [data-hf-ready] [data-hf-parallax-state] {
    --hf-active-reveal-x: 0px !important;
    --hf-active-reveal-y: 0px !important;
    --hf-active-scale: 1 !important;
    --hf-active-rotate: 0deg !important;
    --hf-active-blur: 0px !important;
    --hf-parallax-x: 0px !important;
    --hf-parallax-y: 0px !important;
    opacity: 1 !important;
    -webkit-transform: none !important;
    transform: none !important;
    -webkit-filter: none !important;
    filter: none !important;
    -webkit-transition: none !important;
    transition: none !important;
    will-change: auto !important;
  }
}

@media print {
  [data-hf-ready] [data-hf-reveal-state],
  [data-hf-ready] [data-hf-parallax-state] {
    opacity: 1 !important;
    -webkit-transform: none !important;
    transform: none !important;
    -webkit-filter: none !important;
    filter: none !important;
    -webkit-transition: none !important;
    transition: none !important;
  }
}
