How do I change SASS variable values in a media query?

Question

I have variables for different typography sizes and want to change the values on mobile and tablet devices, but my code below isn't working.

$h1-size: 2.5rem;
$h2-size: 2rem;
$h3-size: 1.7rem;
$h4-size: 1.4rem;
$h5-size: 1.2rem;
$h6-size: 1rem;

@media screen and (max-width: 768px) {
    $h1-size: 2rem;
    $h2-size: 1.7rem;
    $h3-size: 1.4rem;
    $h4-size: 1.2rem;
    $h5-size: 1rem;
}