/* SORYXPAY — unified upward card hover motion.
   Motion only: no visual/layout changes. The old 3D tilt is neutralized so
   every main card uses the same clean "float upward" interaction. */

@media (hover:hover) and (pointer:fine){
  /* Benefits cards */
  html.sx-card-float-hover .why-section .bento{
    transition:
      border-color .4s ease,
      box-shadow .4s ease,
      background .4s ease,
      transform .45s cubic-bezier(.2,.8,.2,1) !important;
  }

  /* Risk cards */
  html.sx-card-float-hover .risk-section .risk-card{
    transition:
      border-color .45s ease,
      box-shadow .45s ease,
      transform .45s cubic-bezier(.2,.8,.2,1) !important;
  }

  /* Business overview cards */
  html.sx-card-float-hover #business-overview .overview-feature{
    transition:
      background .35s ease,
      transform .45s cubic-bezier(.2,.8,.2,1) !important;
  }

  /* One motion for every card shown on the main page. */
  html.sx-card-float-hover .why-section .bento:hover,
  html.sx-card-float-hover .why-section .bento.tilt:hover,
  html.sx-card-float-hover .why-section .bento.tilt.is-pointer-tilting,
  html.sx-card-float-hover .risk-section .risk-card:hover,
  html.sx-card-float-hover .risk-section .risk-card.tilt:hover,
  html.sx-card-float-hover .risk-section .risk-card.tilt.is-pointer-tilting,
  html.sx-card-float-hover #business-overview .overview-feature:hover{
    transform:translate3d(0,-7px,0) !important;
  }
}

@media (prefers-reduced-motion:reduce){
  html.sx-card-float-hover .why-section .bento,
  html.sx-card-float-hover .risk-section .risk-card,
  html.sx-card-float-hover #business-overview .overview-feature{
    transition-duration:.45s !important;
  }
}