header{
    background:#07142d;
    color:white;
    padding:20px 40px;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

header a{
    color:white;
    text-decoration:none;
    margin-left:20px;
}

.post-date{
    color:#777;
    font-size:13px;
    margin-bottom:10px;
}

.logo{
    margin:0;
}

.menu-toggle{
    display:none;
    font-size:28px;
    cursor:pointer;
}

@media (max-width:768px){

    header{
        padding:15px;
        position:relative;
    }

    .menu-toggle{
        display:block;
        color:white;
    }

    #nav-menu{
        display:none;
        position:absolute;
        top:70px;
        left:0;
        width:100%;
        background:#07142d;
        flex-direction:column;
        text-align:center;
        padding:20px 0;
        z-index:1000;
    }

    #nav-menu.active{
        display:flex;
    }

    #nav-menu a{
        margin:10px 0;
    }
}

footer{
    background:#020817;
    color:white;
    padding:40px;
}

.footer-grid{
    display:grid;
    grid-template-columns:
    repeat(auto-fit,minmax(250px,1fr));
    gap:30px;
}

.footer-grid h3{
    margin-bottom:15px;
}

.footer-grid a{
    display:block;
    color:#cbd5e1;
    text-decoration:none;
    margin-bottom:8px;
}

.copyright{
    margin-top:30px;
    text-align:center;
    border-top:1px solid #334155;
    padding-top:20px;
}