/* AnA Business R24.1 — softer migration hero visual
   Drop-in replacement: no HTML changes required.
   This file intentionally overwrites the previously deployed
   ana-home-motion-20261009-r23-2.css.
*/

.hero-home .marketing-stage{
  position:relative!important;
  min-height:0!important;
  width:106%!important;
  max-width:none!important;
  margin-left:-3%!important;
  aspect-ratio:1942 / 809!important;
  background-image:url("/ana-migration-hero-eng-soft.png")!important;
  background-repeat:no-repeat!important;
  background-position:center center!important;
  background-size:contain!important;
  filter:drop-shadow(0 16px 34px rgba(0,0,0,.16));
  overflow:visible!important;
  animation:r241MigrationVisualIn .64s cubic-bezier(.22,.75,.22,1) both;
}

/* Hide the old stacked right-side composition completely. */
.hero-home .marketing-stage > *,
.hero-home .marketing-stage::before,
.hero-home .marketing-stage::after{
  display:none!important;
  content:none!important;
}

.hero-home .hero-grid{
  align-items:center!important;
}

@keyframes r241MigrationVisualIn{
  from{opacity:0;transform:translateX(14px) scale(.99)}
  to{opacity:1;transform:translateX(0) scale(1)}
}

@keyframes r241MigrationVisualFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-4px)}
}

@media (min-width:821px) and (prefers-reduced-motion:no-preference){
  .hero-home .marketing-stage{
    animation:
      r241MigrationVisualIn .64s cubic-bezier(.22,.75,.22,1) both,
      r241MigrationVisualFloat 8.8s ease-in-out .8s infinite;
  }
}

@media(max-width:1100px){
  .hero-home .marketing-stage{
    width:108%!important;
    margin-left:-4%!important;
  }
}

@media(max-width:820px){
  .hero-home .marketing-stage{
    width:min(102%,760px)!important;
    margin:6px auto 0!important;
    aspect-ratio:1942 / 809!important;
    filter:drop-shadow(0 12px 24px rgba(0,0,0,.14));
  }
}

@media(max-width:560px){
  .hero-home .marketing-stage{
    width:100%!important;
    margin-top:10px!important;
    animation:r241MigrationVisualIn .5s ease-out both!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .hero-home .marketing-stage{
    animation:none!important;
    transform:none!important;
  }
}