/* Motion is opt-in at runtime; content remains visible with JavaScript disabled. */
.motion-ready .motion-reveal {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity 720ms cubic-bezier(.18,.72,.22,1), transform 720ms cubic-bezier(.18,.72,.22,1);
  transition-delay: var(--reveal-delay, 0ms);
}
.motion-ready .motion-reveal.motion-in {
  opacity: 1;
  transform: none;
}
/* Preserve the card's own hover lift after its one-time entrance. */
@media (hover:hover) and (pointer:fine) {
  .motion-ready .product-card.motion-in:hover { transform: translateY(-5px); }
}
.motion-ready .motion-surface { overflow: hidden; isolation: isolate; }
/* Anchor ripples without changing positioned controls or activating old insets. */
.motion-ready .motion-surface.motion-relative { position: relative; inset: auto; }
.motion-ripple {
  position: absolute;
  pointer-events: none;
  z-index: 5;
  border-radius: 50%;
  background: currentColor;
  opacity: 0;
  transform: translate(-50%,-50%) scale(0);
  animation: mrvs-ripple 650ms cubic-bezier(.16,.72,.2,1) forwards;
}
.motion-ready .product-dialog[open] { animation: mrvs-dialog-enter 380ms cubic-bezier(.18,.8,.22,1) both; }
.motion-ready .product-dialog[open]::backdrop { animation: mrvs-backdrop-enter 280ms ease-out both; }
.motion-ready .faq-list details[open] > div { animation: mrvs-answer-enter 360ms cubic-bezier(.2,.75,.2,1) both; }
.motion-ready .title-spark { animation: mrvs-spark-idle 11s ease-in-out infinite; transform-origin: 50% 50%; }
.motion-ready .closing-spark { animation: mrvs-closing-spark 14s ease-in-out infinite; transform-origin: 50% 50%; }
.motion-ready .hero-copy > .eyebrow .orange-dot { animation: mrvs-status-breathe 4s ease-in-out infinite; }
.motion-paused .title-spark,
.motion-paused .closing-spark,
.motion-paused .hero-copy > .eyebrow .orange-dot { animation-play-state: paused; }
@keyframes mrvs-ripple {
  0% { opacity: .16; transform: translate(-50%,-50%) scale(.06); }
  100% { opacity: 0; transform: translate(-50%,-50%) scale(1); }
}
@keyframes mrvs-dialog-enter {
  from { opacity: 0; transform: translateY(16px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes mrvs-backdrop-enter { from { opacity: 0; } to { opacity: 1; } }
@keyframes mrvs-answer-enter {
  from { opacity: 0; transform: translateY(-5px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes mrvs-spark-idle {
  0%,100% { transform: translateY(0) rotate(13deg); }
  50% { transform: translateY(-5px) rotate(31deg); }
}
@keyframes mrvs-closing-spark {
  0%,100% { transform: rotate(0deg); }
  50% { transform: rotate(25deg); }
}
@keyframes mrvs-status-breathe {
  0%,100% { opacity: 1; box-shadow: 0 0 0 0 rgb(255 148 31 / 0); }
  50% { opacity: .6; box-shadow: 0 0 0 4px rgb(255 148 31 / .07); }
}
@media (max-width:680px) {
  .motion-ready .motion-reveal { transform: translateY(15px); transition-duration: 580ms; }
  .motion-ready .motion-reveal.motion-in { transform: none; }
}
@media (prefers-reduced-motion:reduce) {
  .motion-ready .motion-reveal { opacity: 1; transform: none; transition: none; }
  .motion-ready .product-dialog[open],
  .motion-ready .product-dialog[open]::backdrop,
  .motion-ready .faq-list details[open] > div,
  .motion-ready .title-spark,
  .motion-ready .closing-spark,
  .motion-ready .hero-copy > .eyebrow .orange-dot { animation: none; }
  .motion-ripple { display: none; }
}
.motion-reduced .motion-reveal { opacity: 1; transform: none; transition: none; }
