Is it possible to write media queries like this?

Question

css

Kind.
I use the SASS (scss) preprocessor for layout.
For media queries I use mixins like this:

@include resp (xs) {
        padding-top: 50px;
    }

Because I make an adaptive immediately after the layout of the section, then I write media queries right there - right after the block, tag, etc.
It turns out something like this:

.header-email {
   @include resp (xs) {
      display: none;
   }
   @include resp (xs_1) {
      display: none;
  }
}

Is it possible (permitted) to immediately write media queries together with the scss section code or MANDATORY at the end of the file / in a separate file ?
I really don't like to move the code to another place (duplicate) and write media queries there.
Thank you!

Answer 1

The main thing is that there should be a single style, if everyone does this everywhere, then it is quite a good decision.