@media (max-width: 680px) {
    header {
        gap: 6px !important;
        justify-content: space-between;
    }

        header .menu {
            display: block !important;
            order: 3;
            color: #103d26;
            background: #f4ead9;
            border: 1px solid #d8c7aa;
            border-radius: 7px;
            width: 42px;
            height: 40px;
            font-size: 22px;
            line-height: 1;
        }

        header nav {
            display: none !important;
            position: absolute;
            left: 0;
            right: 0;
            top: 66px;
            width: 100%;
            padding: 12px 6%;
            background: #fffdf9;
            border-bottom: 1px solid #eadcc5;
            box-shadow: 0 12px 18px #2b1c0922;
            z-index: 20;
        }

            header nav.open {
                display: flex !important;
                flex-direction: column;
                gap: 0;
            }

            header nav a {
                padding: 13px 4px;
                border-bottom: 1px solid #f0e5d3;
            }

                header nav a.active {
                    padding-bottom: 13px;
                    border-bottom: 2px solid #b47b16;
                }
}