Select only direct children from element with Sass

Try this:

    ...
    & > div {width: 33%;}

    div {
      float: left;
      height: 4.1rem;
      line-height: 4.1rem;
      color: #fff;
      ...

Take out div width and apply it only on direct children. Leave rest as is. Here is quick fiddle (remove .option and .search styles later, its only for visualisation).

Please edit your question and better explain what exactly you want to achieve.

Use the & with > inside the parent element like this:

.services {
    & > div {
        margin-bottom: 25px;
    }
}

I am not certain I understand you. But I think you want a combination of direct children and child pseudo selectors, in pure CSS:

header > div:first-child {
}

Or, for the second div:

header > div:nth-child(2) {
}

You could also use the not selector:

header > div:not(.account) {
}

to exclude any unwanted div's.