/* Estilo del menú de escritorio */
.custom-nav {
    background-color: rgba(255, 255, 255, 0.8); /* Fondo blanco con transparencia */
    backdrop-filter: blur(10px); /* Desenfoque del fondo */
    position: fixed; /* Para que el menú se quede fijo al hacer scroll */
    width: 100%; /* Ancho completo */
    z-index: 1000; /* Asegúrate de que esté en la parte superior */
}

/* Solo se aplica en pantallas grandes */
@media (min-width: 769px) {
    .nav__links {
        display: flex; /* Mostrar el menú en pantallas grandes */
    }

    .menu-toggle {
        display: none; /* Esconder el botón de menú en pantallas grandes */
    }
}

/* Estilo para los enlaces del menú */
.nav__links a {
    color: #e0c58a; /* Color del texto */
    transition: color 0.3s; /* Suaviza el cambio de color */
}

    /* Cambia el color del texto cuando pasa el mouse sobre el enlace */
    .nav__links a:hover {
        color: black; /* Color al pasar el mouse */
    }

/* Estilo de la lista */
.nav__links {
    list-style: none; /* Elimina los puntos de la lista */
    padding: 0; /* Sin padding */
    margin: 0; /* Sin margen */
    display: flex; /* Mostrar los elementos en línea */
}

    /* Estilo para cada enlace */
    .nav__links li {
        margin-right: 20px; /* Espacio entre los enlaces */
    }

/* Esconder el menú de escritorio en dispositivos móviles */
@media (max-width: 768px) {
    .custom-nav {
        display: none; /* Esconder el menú de escritorio en móviles */
    }
}