const Nav = () => {
    return (
        <nav className="sticky top-0 z-[60] bg-white/70 backdrop-blur-2xl border-b border-white/20 shadow-sm">
            <div className="container mx-auto px-6 h-24 flex items-center justify-between">
                <div className="flex items-center gap-4 group cursor-pointer">
                    <div className="relative overflow-hidden rounded-xl p-1 transition-all group-hover:scale-105">
                        <img src="../../assets/ATU_JOBS_Logotipo_Azul 1 (1).svg" alt="ATU JOBS" className="h-10 md:h-12" />
                    </div>
                </div>
                
                <div className="hidden lg:flex items-center gap-12">
                    <div className="flex items-center gap-10">
                        <a href="#form-section" className="text-[10px] font-black text-atu-blue-deep/60 hover:text-atu-blue-vibrant uppercase tracking-[0.2em] transition-all relative group">
                            Orientación
                            <span className="absolute -bottom-1 left-0 w-0 h-0.5 bg-atu-blue-vibrant transition-all group-hover:w-full"></span>
                        </a>
                        <a href="#form-section" className="text-[10px] font-black text-atu-blue-deep/60 hover:text-atu-blue-vibrant uppercase tracking-[0.2em] transition-all relative group">
                            Sector
                            <span className="absolute -bottom-1 left-0 w-0 h-0.5 bg-atu-blue-vibrant transition-all group-hover:w-full"></span>
                        </a>
                    </div>
                    <a href="#form-section" className="px-8 py-3.5 button-shimmer text-white rounded-2xl text-[11px] font-black uppercase tracking-[0.1em] shadow-xl shadow-atu-blue-vibrant/20 transition-all transform hover:-translate-y-1 active:translate-y-0">
                        Quiero trabajar en España
                    </a>
                </div>
                
                <a href="#form-section" className="lg:hidden px-6 py-3 button-shimmer text-white rounded-xl text-[10px] font-black uppercase tracking-[0.1em] shadow-lg shadow-atu-blue-vibrant/10">
                    Empezar
                </a>
            </div>
        </nav>
    );
};