/* ===========================================================================
   Mercado — motion.

   All scroll motion lives in assets/js/modules/scenes.js. This file only
   prepares the few elements that need a clipping box or a starting state the
   script cannot infer.

   There is deliberately no CSS reveal system here. An earlier version had one
   running alongside GSAP and the two fought: GSAP sampled an element's
   opacity while the CSS transition was still mid-flight, read 0 as the
   target, and animated 0 → 0 — the hero copy simply never appeared. One
   system owns each element now.

   The test from the brief: with every animation removed the page must still
   look finished. Nothing below hides content, so it does.
   =========================================================================== */

/* A line of display type that can be wiped up from behind its own baseline.
   The span sits at its natural position; scenes.js is what pushes it down and
   brings it back, so with no JS — or under reduced motion — the headline is
   simply there. */
.wipe {
  display: block;
  overflow: hidden;
  padding-block-end: 0.12em; /* room for Arabic tails inside the clip box */
}

.wipe > span { display: block; }

/* ---------------------------------------------------------------------------
   Reduced motion: scenes.js returns before creating a single tween, so there
   is nothing to unwind. This only stops CSS-level transitions.
   --------------------------------------------------------------------------- */
@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;
    scroll-behavior: auto !important;
  }
}
