/* ============================================================================
   MAMBO — MOTION.  v3.0.0
   Every keyframe on the site lives here. Pages and components never define one.

   Three easings, and only three:
     --ease         reveals, bar fills, pans
     --spring       presses, pops, hover lifts, the countdown tick
     --ease-header  the header hide/reveal and the float-capsule morph
   Linear is used for exactly one thing: the marquee.
   ============================================================================ */

/* Popovers, menus, the command palette. */
@keyframes mbPop {
  from { opacity: 0; transform: scale(.97) translateY(-4px); }
  to   { opacity: 1; transform: none; }
}

/* The live dot. Retinted from the prototype's stale hard-coded rgba(192,50,43)
   to the --live token, so it tracks the theme instead of staying maroon on dark. */
@keyframes mbPulse {
  0%   { box-shadow: 0 0 0 0   rgb(241 65 42 / .55); }
  70%  { box-shadow: 0 0 0 11px rgb(241 65 42 / 0); }
  100% { box-shadow: 0 0 0 0   rgb(241 65 42 / 0); }
}

/* Hero entrance, and the scroll reveal. */
@keyframes mbRise {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: none; }
}

/* Replayed on the nav bar each time the header returns on an upward scroll. */
@keyframes mbNavIn {
  0%   { opacity: .35; transform: translateY(-7px) scale(.982); }
  60%  { opacity: 1; }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}

/* The seconds tile, once per tick. */
@keyframes mbTick {
  0%   { transform: scale(1); }
  30%  { transform: scale(1.14); }
  100% { transform: scale(1); }
}

/* The minutes digit, rolling in from above when it changes. */
@keyframes mbRoll {
  0%   { opacity: 0; transform: translateY(-42%); }
  55%  { opacity: 1; }
  100% { opacity: 1; transform: translateY(0); }
}

/* The announcement band. Travels exactly -50% because the track holds the
   message twice — any other distance makes the loop visibly jump. */
@keyframes mbDrift {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(-50%, 0, 0); }
}

/* ----------------------------------------------------------------------------
   REDUCED MOTION

   Deliberately an EXCEPTION LIST, not the blanket `* { animation-duration: .01ms
   !important }` that MOTION-SPEC suggests. That rule also kills the opacity fades
   the same document says to keep, and it would defeat the reveal system — whose
   hidden state is applied by JS — leaving content stuck invisible.

   What goes: infinite loops, and anything whose whole point is travel.
   What stays: opacity fades, so the page still resolves rather than snapping.
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {

  .mb-marquee-track,
  .mb-dot--live,
  .mb-stage-dot--live {
    animation: none;
  }

  .mb-hero-copy,
  .mb-hero-panel,
  .mb-cd-tile,
  .mb-cd-num {
    animation: none;
    transform: none;
  }

  /* Keep the fade, drop the travel. */
  [data-mb-reveal] {
    transition-property: opacity;
    transform: none;
  }

  .mb-backdrop-pool {
    animation: none;
  }

  /* Hover lifts read as jitter when motion is reduced. */
  .mb-btn:hover,
  .mb-card:hover,
  .mb-icon-btn:hover,
  .mb-acct:hover,
  .mb-cd-tile:hover {
    transform: none;
  }
}