/* Estilização Específica do Menu - Dois Pontos */
:root {
    --bg-verde: #AFBD77;
    --texto-escuro: #201E1E;
}

/* Base da Navbar com sombra elegante */
.navbar {
    background-color: var(--bg-verde);
    padding: 12px 0;
    transition: all 0.4s ease;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
    /* Sombra suave para destacar o menu do resto do site */
}

/* Alinhamento dos itens para a barra vertical ficar centralizada */
.navbar-nav .nav-item {
    display: flex;
    align-items: center;
}

/* --- O Segredo das Barras de Divisão ( | ) --- */
/* Adiciona a barra em todos os itens, EXCETO no último */
.navbar-nav .nav-item:not(:last-child)::after {
    content: '|';
    color: var(--texto-escuro);
    font-size: 1.2rem;
    font-weight: 300;
    /* Mais fina para elegância */
    opacity: 0.5;
    margin: 0 8px;
    /* Espaço entre o texto e a barra */
    display: inline-block;
}

/* Links do Menu */
.navbar-nav .nav-link {
    color: var(--texto-escuro) !important;
    text-transform: uppercase;
    font-size: 1.05rem;
    /* Fonte um pouco maior, conforme mockup */
    letter-spacing: 1.5px;
    font-weight: 400;
    /* Removido o negrito pesado, deixando editorial */
    padding: 5px 12px !important;
    transition: all 0.3s ease;
    position: relative;
    will-change: transform;
}

/* --- Efeito Hover Premium --- */
/* Cria a linha invisível embaixo do texto */
.navbar-nav .nav-link::before {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 50%;
    width: 0;
    height: 2px;
    background-color: var(--texto-escuro);
    transition: all 0.3s ease;
    transform: translateX(-50%);
}

/* Animação ao passar o mouse */
.navbar-nav .nav-link:hover {
    transform: translateY(-2px);
    /* Dá uma leve "levantada" no texto */
    text-shadow: 0 2px 5px rgba(32, 30, 30, 0.15);
    /* Sombra sutil na fonte */
}

/* A linha invisível cresce de 0 para 70% */
.navbar-nav .nav-link:hover::before {
    width: 70%;
}

/* --- Controle de tamanho e nitidez da Logo --- */
.logo-navbar {
    max-height: 85px;
    width: auto;
    transition: transform 0.3s ease, filter 0.3s ease;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}

.logo-navbar:hover {
    transform: scale(1.03);
    filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.1));
    /* Leve sombra na logo no hover */
}

/* --- Ajustes para o Toggler (Mobile) --- */
.navbar-toggler {
    border: none;
    color: var(--texto-escuro);
    transition: transform 0.3s ease;
}

.navbar-toggler:focus {
    box-shadow: none;
    transform: scale(0.95);
    /* Efeito de clique no celular */
}

/* --- Responsividade --- */
@media (max-width: 991px) {

    /* Esconde as barras verticais no celular para não quebrar a lista */
    .navbar-nav .nav-item:not(:last-child)::after {
        content: none;
    }

    /* Centraliza os links e dá mais espaço no menu aberto no celular */
    .navbar-nav .nav-item {
        justify-content: center;
        width: 100%;
        margin-bottom: 5px;
    }

    .navbar-nav .nav-link:hover::before {
        width: 30%;
        /* Linha menor no mobile */
    }
}