/* Decorative motion helpers. The scroll reveal (opacity + translate) lives in experience.css and
   only applies once JS has added .motion-ready, so content stays visible without JS and with reduced motion. */

.world-card[data-reveal] {
  transition:
    transform 700ms var(--ease-out) var(--reveal-delay, 0ms),
    border-color var(--duration-base) var(--ease-standard),
    box-shadow var(--duration-base) var(--ease-standard);
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0ms !important;
    scroll-behavior: auto !important;
  }

  .motion-ready [data-reveal],
  .motion-ready [data-reveal]:not(.is-revealed) {
    transform: none;
  }

  .button:hover,
  a.service-card:hover,
  a.role-card:hover,
  .service-card:has(a:hover) {
    transform: none;
  }

  .security-graph__orbit,
  .security-graph__path,
  .security-graph__path.is-active {
    animation: none !important;
  }
}

/* System reduced motion applies to every decorative layer. */
html:not(.motion-enabled) *, html:not(.motion-enabled) *::before, html:not(.motion-enabled) *::after,
html.motion-static *, html.motion-static *::before, html.motion-static *::after {
  animation: none !important; transition: none !important; scroll-behavior: auto !important;
}
html:not(.motion-enabled) [data-reveal], html.motion-static [data-reveal] { opacity: 1 !important; transform: none !important; }
html:not(.motion-enabled) .spotlight { display: none; }
html:not(.motion-enabled) { view-transition-name: none; }