/* Menu Branco */
.site-header {
    background-color: #ffffff;
    height: 83px;
    width: 100%;
    display: flex;
    align-items: center; /* Centraliza verticalmente o conteúdo nos 83px */
    justify-content: center; /* Centraliza horizontalmente o conteúdo nos 83px */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08); /* Sombra sutil para dar destaque */
    position: relative; /* Garante que a sombra apareça sobre o conteúdo abaixo */
    z-index: 100; /* Garante que o menu fique na frente de outros elementos */
}

/* Padrão Container Elementor (1140px) */
.container-header {
    width: 100%;
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 15px;
    display: flex;
    align-items: center;
    justify-content: space-between; /* Empurra a logo pra esquerda e o menu pra direita */
}

/* Logo */
.logo img {
    height: 53px; /* Altura exata solicitada para a logo */
    width: auto;
    display: block;
}

/* Navegação */
.main-menu ul {
    display: flex;
    list-style: none;
    gap: 30px;
    align-items: center;
}

/* Estilos base dos botões do menu */
.main-menu a.btn {
    text-decoration: none;
    padding: 12px 24px;
    border-radius: 6px;
    font-weight: 600;
    color: #ffffff;
    transition: opacity 0.3s ease;
}

.main-menu a.btn-black {
    background-color: #111111; /* Fundo preto */
}

.main-menu a.btn-red {
    background-color: #e60000; /* Fundo vermelho */
}

.main-menu a.btn:hover {
    opacity: 0.85; /* Leve transparência no hover */
}

/* Efeito "pop" (pulinho) nos botões */
.main-menu a.pop-hover {
    display: inline-block; /* Necessário para que a propriedade transform funcione corretamente em tags <a> */
    transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0.3s;
}

.main-menu a.pop-hover:hover {
    transform: translateY(-4px) scale(1.05); /* Dá um pulinho para cima e cresce levemente */
}

@media (max-width: 768px) {
    .logo img {
        height: 38px; /* Diminui a logo no mobile para dar mais espaço ao menu */
    }

    .menu-icon {
        display: block; /* Mostra o ícone no celular */
    }

    .main-menu {
        display: none; /* Esconde o menu por padrão no mobile */
        position: absolute;
        top: 83px; /* Começa logo abaixo do header */
        left: 0;
        width: 100%;
        background-color: #ffffff;
        padding: 20px 0;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
        z-index: 99;
    }

    .main-menu ul {
        flex-direction: column; /* Empilha os botões */
        gap: 15px;
    }

    .main-menu a.btn {
        width: 90%;
        text-align: center;
    }

    /* Abre o menu quando o usuário clica no ícone */
    .menu-checkbox:checked ~ .main-menu {
        display: block;
    }
}

@keyframes pulse {
    0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7); }
    70% { transform: scale(1.05); box-shadow: 0 0 0 15px rgba(37, 211, 102, 0); }
    100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
}

/* --- Menu Mobile (Toggle Hambúrguer) --- */
.menu-checkbox {
    display: none; /* Oculta a caixa de seleção */
}

.menu-icon {
    display: none; /* Oculta o ícone de hambúrguer no desktop */
    font-size: 28px;
    cursor: pointer;
    color: #111111;
    user-select: none;
}
