How to make my frosted glass style top navigation have a fade out instead of a sharp bottom line.

Site URL: https://www.austinhines.design/work-ah

Hello, I am building a portfolio website and I would like my top navigation to have a fade out effect instead of a sharp bottom cut of. I have used a line of code listed here to create the frosted look -

// Frosted Blur Header //

.header {
   background: rgba(0,0,0,.4) !important;
   box-shadow: 0px 5px 15px rgba(100,100,100,0.3) !important;
   backdrop-filter: blur(12px) !important;
   -webkit-backdrop-filter: blur(12px) !important;

Again, I would like the bottom line to be a fade out instead of sharp. Thank you !

my password is Hines5791!