/* BSLR — homepage hero motion. index.html only.
   No entrance animation by design: the hero text is the FCP element and the
   device shot is the LCP element, so fading either in delays the metric it
   defines on every load. Only the perpetual float remains, which runs after
   paint on the compositor. Measure before adding an entrance. */

@media (prefers-reduced-motion:no-preference){

  /* Slow (9s) and shallow (7px) on purpose. Fast or deep float on a
     product screenshot reads as a toy. */
  @keyframes heroFloat{
    0%,100%{ transform:translate3d(0,0,0) }
    50%    { transform:translate3d(0,-7px,0) }
  }

  .hero .devices img{
    animation:heroFloat 9s ease-in-out infinite;
    animation-delay:.6s;
    will-change:transform;
  }
}