https://twitter.com/frontendmentor/status/1123867638919237633

  .cta {
  
}

@media (hover: hover) {
  .cta:hover {
    /* hover styles */
  }
}

/*or If you want the query to be slightly broader to test if any available input can hover you can use the any-hover query instead. */

@media (any-hover: hover) {
  .cta:hover {
    /* hover styles */
  }
}

it's also useful to differentiate between touch and pointer devices