---

header{
    position:fixed;
    top:18px;
    left:50%;
    transform:translateX(-50%);
    width:min(1180px,calc(100% - 32px));

    display:flex;
    justify-content:space-between;
    align-items:center;

    padding:16px 28px;

    background:rgba(17,17,17,.58);
    backdrop-filter:blur(22px);
    -webkit-backdrop-filter:blur(22px);

    border:1px solid rgba(255,215,130,.12);
    border-radius:20px;

    box-shadow:
        0 20px 50px rgba(0,0,0,.35),
        inset 0 1px rgba(255,255,255,.05);

    transition:.45s;
    z-index:1000;
}

header.scrolled{
    top:10px;
    background:rgba(12,12,12,.85);
}

header::after{
    content:"";
    position:absolute;
    left:25px;
    right:25px;
    bottom:0;

    height:1px;

    background:
    linear-gradient(
        90deg,
        transparent,
        #D8B46A,
        transparent
    );
}