[data-ms-motion-root] {
  --ms-motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ms-motion-duration: 800ms;
  --ms-motion-distance: 24px;
  --ms-motion-image-duration: 1200ms;
  --ms-motion-image-scale-from: 1.05;
  --ms-motion-image-blur-from: 8px;
  --ms-motion-char-delay: 25ms;
  --ms-motion-word-delay: 60ms;
  --ms-header-offset: 96px;
}

/* Premium Motion owns reveal state when enabled; legacy .reveal must stay visible on JS failure. */
:where([data-ms-motion-root][data-ms-motion-enabled="true"]:not(.ms-motion-ready)) .reveal {
  opacity: 1;
  transform: none;
  transition: none;
}

.ms-motion-ready [data-ms-reveal-prepared="fade-up"] {
  opacity: 0;
  transform: translate3d(0, var(--ms-motion-distance), 0);
  transition:
    opacity var(--ms-motion-duration) var(--ms-motion-ease) var(--ms-reveal-delay, 0ms),
    transform var(--ms-motion-duration) var(--ms-motion-ease) var(--ms-reveal-delay, 0ms);
}

.ms-motion-ready [data-ms-reveal-prepared="fade-up"].ms-is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.ms-motion-ready [data-ms-reveal-prepared="chars"] .ms-motion-word {
  display: inline-block;
  white-space: nowrap;
}

.ms-motion-ready [data-ms-reveal-prepared="chars"] .ms-motion-token,
.ms-motion-ready [data-ms-reveal-prepared="words"] .ms-motion-token {
  display: inline-block;
  opacity: 0;
  transition-property: opacity, filter, transform;
  transition-duration: var(--ms-motion-duration);
  transition-timing-function: var(--ms-motion-ease);
}

.ms-motion-ready [data-ms-reveal-prepared="chars"] .ms-motion-token {
  transform: translate3d(0, 0.5em, 0);
  transition-delay: calc(
    var(--ms-reveal-delay, 0ms) + var(--ms-token-delay, 0ms)
  );
}

.ms-motion-ready [data-ms-reveal-prepared="words"] .ms-motion-token {
  filter: blur(var(--ms-motion-image-blur-from));
  transform: translate3d(0, 0.4em, 0);
  transition-delay: calc(
    var(--ms-reveal-delay, 0ms) + var(--ms-token-delay, 0ms)
  );
}

.ms-motion-ready [data-ms-reveal-prepared="chars"].ms-is-visible .ms-motion-token,
.ms-motion-ready [data-ms-reveal-prepared="words"].ms-is-visible .ms-motion-token {
  opacity: 1;
  filter: none;
  transform: translate3d(0, 0, 0);
}

.ms-motion-ready [data-ms-reveal-prepared="image"] {
  overflow: hidden;
}

.ms-motion-ready [data-ms-reveal-prepared="image"] > :is(img, video),
.ms-motion-ready [data-ms-reveal-prepared="image"] > picture > img {
  opacity: 0;
  filter: blur(var(--ms-motion-image-blur-from));
  transform: scale(var(--ms-motion-image-scale-from));
  transition:
    opacity 1000ms var(--ms-motion-ease) var(--ms-reveal-delay, 0ms),
    filter 1000ms var(--ms-motion-ease) var(--ms-reveal-delay, 0ms),
    transform var(--ms-motion-image-duration) var(--ms-motion-ease) var(--ms-reveal-delay, 0ms);
}

.ms-motion-ready [data-ms-reveal-prepared="image"].ms-is-visible > :is(img, video),
.ms-motion-ready [data-ms-reveal-prepared="image"].ms-is-visible > picture > img {
  opacity: 1;
  filter: none;
  transform: scale(1);
}

.ms-motion-ready [data-ms-reveal-prepared="stagger-cards"] > * {
  opacity: 0;
  transform: translate3d(0, 20px, 0) scale(0.95);
  transition:
    opacity var(--ms-motion-duration) var(--ms-motion-ease)
      calc(var(--ms-reveal-delay, 0ms) + var(--ms-card-delay, 0ms)),
    transform var(--ms-motion-duration) var(--ms-motion-ease)
      calc(var(--ms-reveal-delay, 0ms) + var(--ms-card-delay, 0ms));
}

.ms-motion-ready [data-ms-reveal-prepared="stagger-cards"].ms-is-visible > * {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

.ms-motion-ready [data-ms-reveal].ms-is-animating,
.ms-motion-ready [data-ms-reveal].ms-is-animating .ms-motion-token,
.ms-motion-ready [data-ms-reveal-prepared="image"].ms-is-animating > :is(img, video),
.ms-motion-ready [data-ms-reveal-prepared="image"].ms-is-animating > picture > img,
.ms-motion-ready [data-ms-reveal-prepared="stagger-cards"].ms-is-animating > * {
  will-change: opacity, filter, transform;
}

[data-ms-motion-root] [data-ms-header="glass"] {
  position: fixed;
  inset-block-start: 0;
  inset-inline: 0;
  z-index: var(--ms-z-header, 1000);
  background: var(--ms-header-bg, rgb(15 25 24 / 72%));
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  transition: background-color 300ms ease, border-color 300ms ease, box-shadow 300ms ease;
}

[data-ms-motion-root] [data-ms-header="glass"].ms-is-scrolled {
  background: var(--ms-header-bg-scrolled, rgb(15 25 24 / 88%));
  border-block-end: 1px solid rgb(255 255 255 / 10%);
  box-shadow: 0 12px 32px rgb(0 0 0 / 12%);
}

@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  [data-ms-motion-root] [data-ms-header="glass"] {
    background: var(--ms-header-bg-fallback, rgb(15 25 24 / 94%));
  }
}

[data-ms-motion-root] :is(section[id], .anchor-target) {
  scroll-margin-block-start: var(--ms-header-offset);
}

@media (prefers-reduced-motion: reduce) {
  [data-ms-motion-root] [data-ms-reveal],
  [data-ms-motion-root] [data-ms-reveal] > *,
  [data-ms-motion-root] [data-ms-reveal] > picture > img {
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }
}

@media print {
  [data-ms-motion-root] [data-ms-reveal],
  [data-ms-motion-root] [data-ms-reveal] > *,
  [data-ms-motion-root] [data-ms-reveal] > picture > img {
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }
}
