/* =====================================================
   MH Theme — Motion System
   Phase 9: controlled reveal presets + reduced-motion safety

   Motion rule: no animation ships unless it helps guide attention,
   sequence information, reduce overload, show interactivity, or create a
   controlled premium perception. This layer centralizes reveal behavior so
   old .mht-* sections and new .mht-* components use the same motion contract.
   ===================================================== */

:root {
  --mht-reveal-duration: var(--mht-motion-reveal, 700ms);
  --mht-reveal-delay: var(--rd, 0ms);
  --mht-reveal-x: 0px;
  --mht-reveal-rotate: 0deg;
}

html[data-mht-motion="none"] {
  scroll-behavior: auto;
}

html[data-mht-motion="none"] *,
html[data-mht-motion="none"] *::before,
html[data-mht-motion="none"] *::after {
  animation-duration: 1ms !important;
  animation-iteration-count: 1 !important;
  scroll-behavior: auto !important;
}

html[data-mht-motion="none"] [data-reveal],
html[data-mht-motion="none"] .mht-reveal,
html[data-mht-motion="none"] .mht-logo-item,
html[data-mht-motion="none"] .mht-who-card--mreveal,
html[data-mht-motion="none"] .mht-project-gallery__item {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  transition: none !important;
}

html[data-mht-motion="gentle-fade"] {
  --mht-reveal-y: 0px;
  --mht-reveal-x: 0px;
  --mht-reveal-scale: 1;
  --mht-reveal-duration: 560ms;
}

html[data-mht-motion="glass-rise"] {
  --mht-reveal-y: 18px;
  --mht-reveal-x: 0px;
  --mht-reveal-scale: .985;
  --mht-reveal-duration: 700ms;
}

html[data-mht-motion="editorial-slide"] {
  --mht-reveal-y: 10px;
  --mht-reveal-x: -18px;
  --mht-reveal-scale: 1;
  --mht-reveal-duration: 680ms;
}

html[data-mht-motion="soft-scale"] {
  --mht-reveal-y: 8px;
  --mht-reveal-x: 0px;
  --mht-reveal-scale: .965;
  --mht-reveal-duration: 720ms;
}

html[data-mht-motion="staggered-cards"] {
  --mht-reveal-y: 20px;
  --mht-reveal-x: 0px;
  --mht-reveal-scale: .985;
  --mht-reveal-duration: 680ms;
}

/* The old theme had reveal CSS repeated inside section files. This final
   motion file loads later and becomes the product source of truth without
   needing to rename .mht-* selectors yet. */
.js-enabled [data-reveal]:not(.is-visible):not(.mht-reveal-done) {
  opacity: 0 !important;
  transform: translate3d(var(--mht-reveal-x), var(--mht-reveal-y), 0) scale(var(--mht-reveal-scale)) rotate(var(--mht-reveal-rotate)) !important;
  transition:
    opacity var(--mht-reveal-duration) var(--mht-ease-soft),
    transform var(--mht-reveal-duration) var(--mht-ease-soft) !important;
  transition-delay: var(--mht-reveal-delay, var(--rd, 0ms)) !important;
  will-change: opacity, transform;
}

[data-reveal].is-visible,
[data-reveal].mht-reveal-done,
.mht-reveal.is-visible,
.mht-reveal.mht-reveal-done {
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) scale(1) rotate(0deg) !important;
  filter: none !important;
}

[data-reveal].mht-reveal-done {
  transition: none !important;
  will-change: auto !important;
}


/* Phase 151O.7 — project cards are public content, not animation-dependent.
   The live Project Visibility Doctor proved cards were generated/rendered, so
   this scoped safety prevents the global reveal contract from leaving project
   cards invisible if IntersectionObserver or a section script fails. */
.js-enabled .mht-work-wall .mht-work-card[data-reveal],
.js-enabled .mht-work-wall .mht-work-card[data-reveal]:not(.is-visible):not(.mht-reveal-done) {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  filter: none !important;
}

.mht-work-wall .mht-work-card[data-reveal] {
  min-height: 0;
}

html[data-mht-motion="staggered-cards"] [data-mht-component="card"][data-reveal],
html[data-mht-motion="staggered-cards"] [data-mht-component="grid"] > [data-reveal],
html[data-mht-motion="staggered-cards"] .mht-storefront-lite__card[data-reveal] {
  transition-delay: var(--mht-reveal-delay, var(--rd, 0ms)) !important;
}

/* Scroll-driven / decorative motion should also respect product-level none. */
html[data-mht-motion="none"] .mht-perspective-reveal,
html[data-mht-motion="none"] .mht-perspective-reveal__word,
html[data-mht-motion="none"] .mht-logo-item,
html[data-mht-motion="none"] .mht-empty-state *,
html[data-mht-motion="none"] .mht-no-results *,
html[data-mht-motion="none"] .mht-about-process *,
html[data-mht-motion="none"] .mht-about-story__scene-inner * {
  animation: none !important;
  transition: none !important;
  transform: none !important;
  filter: none !important;
}

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

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

  [data-reveal],
  .mht-reveal,
  .mht-logo-item,
  .mht-who-card--mreveal,
  .mht-project-gallery__item,
  .mht-perspective-reveal__word {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
    will-change: auto !important;
  }
}
