Ajuda com box-shadow css

Bom dia a todos!
Estou quebrando a cabeça aqui com uma sombra que desaparece sempre que eu coloco uma cor no div de baixo.
Estou usando grid layout.
A imagem abaixo é para vcs verem o que está acontecendo, o lado esquerdo coloquei uma cor branca e a sombra do header sumiu, Do lado direito deixei a cor do "body" e a sombra funciona normalmente.



Segue o código.

<?php include "header.php";?>



left
centro

*{
margin:0;
padding:0;
font-family-removed: Gotham Narrow SSm A,Gotham Narrow SSm B,Rubik,Lato,Lucida Grande,Lucida Sans Unicode,Tahoma,Sans-Serif;
list-style:none;
}
body{
background:#f2f7fa;
}
/*HEADER*/
header{
background:#212121;
height:40px;
color:[HASHTAG]#FFF[/HASHTAG];
box-shadow:7px 7px 7px #555;
}
nav{display:flex; display:flex; justify-content:space-between;}
nav ul{display:flex;}
nav li{margin-left:20px;}
/*MAIN*/
main{
display:grid;
grid-template-areas:"aside section";
grid-template-columns:1f 6fr;
height:500px;
}
aside{grid-area:aside; background:[HASHTAG]#FFF[/HASHTAG];}
section{grid-area:section;}