/* ============================================================
   MEDIA CYCLE (assets/js/cycle.js)
   A still and two clips stacked in one box, crossfading on a beat.
   Shared by the RACERSHIP gate page and the RACERSHIP entry in
   Selected Work, so the case-study cover and the page it opens are
   the same piece of film.

   Resting opacity is read from --cyc-on, letting each host set its
   own weight: full strength inside a Selected Work frame, knocked
   back behind the headline on the gate page.
   ============================================================ */
.cyc { position:absolute; inset:0; overflow:hidden; }
.cyc-f { position:absolute; inset:0; width:100%; height:100%;
  object-fit: cover; opacity:0; transition: opacity 1.1s var(--ease); }
.cyc-f.is-on { opacity: var(--cyc-on, 1); }
.cyc-still { background-size:cover; background-position:50% 42%;
  background-image: image-set(url("/assets/img/racership/hero-pitlane-w1600.webp") type("image/webp"),
                              url("/assets/img/racership/hero-pitlane-w1600.jpg") type("image/jpeg")); }
/* Inside a Selected Work frame the media is the subject, not a backdrop. */
.wframe .cyc-f.is-on { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .cyc-f { transition: none; } }