nav {
    padding-top: 1rem;
    padding-bottom: 1rem;
    .logo {
        img {
            width: 100%;
            object-fit: scale-down;
        }
        @media (max-width: 600px) {
            img {
                width: 50%;
            }
        }
    }
    a {
        font-weight: bold;
        text-decoration: none;
        color: var(--text-color);
        font-size: 0.85rem;
        &:hover {
            transition: color 0.2s;
            color: var(--primary-color);
        }
    }
    .btn {
        color: var(--background-color);
        padding: 0.75rem;
        padding-left: 1.5rem;
        padding-right: 1.5rem;
        background: var(--primary-color);
        box-shadow: 4px 5px 4.9px rgba(0, 0, 0, 0.25);
        border-radius: 36px;
        &:hover {
            background: var(--secondary-color);
            color: var(--background-color);
            transition:
                background 0.2s,
                color 0.2s;
        }
    }
}