title: Redefining sass variables within media queries
body: <p>say this common use case:</p>
  
  <pre><code>h2{ // logo
    $width: 146px;
    $height: 22px;
    @include size($width, $height); // previously defined mixin for simple size assignment
  
    a{
      @include size($width, $height);
    }
  
    @include mq($medium-aux-up){
      $width: 180px;
      $height: 28px;
      @include size($width, $height);
  
      a{
        @include size($width, $height);
      }
    }
  
    @include mq($large-up){
      $width: 220px;
      $height: 34px;
      @include size($width, $height);
  
      a{
        @include size($width, $height);
      }
    }
  }
  </code></pre>
  
  <p>Is there a way to change size in media queries by only overriding $width and $height values? Like this (fake):</p>
  
  <pre><code>h2{ // logo
    $width: 146px;
    $height: 22px;
    @include size($width, $height);
  
    a{
      @include size($width, $height);
    }
  
    @include mq($medium-aux-up){
      $width: 180px;
      $height: 28px;
    }
  
    @include mq($large-up){
      $width: 220px;
      $height: 34px;
    }
  }
  </code></pre>