/*
 * Public motion layer
 * This file is intentionally standalone. Remove its header include to disable
 * every enhancement without touching component or page styles.
 */
:root {
  --sem-motion-reveal-distance: 16px;
  --sem-motion-reveal-duration: 480ms;
  --sem-motion-menu-duration: 180ms;
}

html.sem-motion-enabled .sem-reveal {
  opacity: 0;
  transform: translate3d(0, var(--sem-motion-reveal-distance), 0);
  transition:
    opacity var(--sem-motion-reveal-duration) var(--sem-ease),
    transform var(--sem-motion-reveal-duration) var(--sem-ease);
  transition-delay: var(--sem-motion-delay, 0ms);
  will-change: opacity, transform;
}

html.sem-motion-enabled .sem-reveal.sem-reveal--hero {
  --sem-motion-reveal-distance: 12px;
}

html.sem-motion-enabled .sem-reveal.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

/* Images remain visible while loading; only a restrained softening is added. */
html.sem-motion-enabled .sem-media.is-loading {
  opacity: .72;
  filter: blur(2px);
  transform: scale(1.008);
}

html.sem-motion-enabled .sem-media {
  transition:
    opacity var(--sem-motion-normal) var(--sem-ease),
    filter var(--sem-motion-normal) var(--sem-ease),
    transform var(--sem-motion-normal) var(--sem-ease);
}

html.sem-motion-enabled .sem-media.is-loaded {
  opacity: 1;
  filter: none;
  transform: none;
}

/* Desktop mega menus retain their accessible hover/focus behaviour. */
@media (min-width: 992px) {
  .mega-menu {
    transition:
      opacity var(--sem-motion-menu-duration) var(--sem-ease),
      transform var(--sem-motion-menu-duration) var(--sem-ease),
      visibility 0s linear var(--sem-motion-menu-duration);
  }

  .mega-menu .mega-intro,
  .mega-menu .mega-links,
  .mega-menu .mega-product-columns {
    opacity: 0;
    transform: translate3d(0, 6px, 0);
    transition:
      opacity 180ms var(--sem-ease),
      transform 180ms var(--sem-ease);
  }

  .has-mega:hover .mega-menu .mega-intro,
  .has-mega:focus-within .mega-menu .mega-intro,
  .has-mega:hover .mega-menu .mega-links,
  .has-mega:focus-within .mega-menu .mega-links,
  .has-mega:hover .mega-menu .mega-product-columns,
  .has-mega:focus-within .mega-menu .mega-product-columns {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }

  .has-mega:hover .mega-menu .mega-links,
  .has-mega:focus-within .mega-menu .mega-links,
  .has-mega:hover .mega-menu .mega-product-columns,
  .has-mega:focus-within .mega-menu .mega-product-columns {
    transition-delay: 35ms;
  }
}

/* Keep interactive feedback small and consistent with the corporate visual tone. */
@media (hover: hover) and (pointer: fine) {
  .site-footer a,
  .utility-contact a,
  .utility-social a,
  .language-menu a {
    transition-timing-function: var(--sem-ease);
  }
}