body {
            background-color: #0A192F;
            color: #CCD6F6;
            font-family: 'Inter', sans-serif;
        }
        h1, h2, h3, h4, h5, h6 {
            font-family: 'Poppins', sans-serif;
            color: #E6F1FF;
        }
        .text-neon {
            color: #64FFDA;
        }
        .bg-navy {
            background-color: #0A192F;
        }
        .bg-light-navy {
            background-color: #112240;
        }
        .border-neon {
            border-color: #64FFDA;
        }
        .btn-neon {
            display: inline-block;
            padding: 0.75rem 1.5rem;
            border-width: 2px;
            border-color: #64FFDA;
            color: #64FFDA;
            font-weight: 600;
            border-radius: 0.5rem;
            transition: all 0.3s ease-in-out;
            transform: translateY(0);
        }
        .btn-neon:hover {
            background-color: rgba(100, 255, 218, 0.1);
            transform: translateY(-0.25rem);
        }
        
        .campus-btn {
            padding: 0.5rem 1rem;
            border-radius: 0.375rem;
            font-weight: 600;
            transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
            border: 2px solid;
        }
        .campus-btn.active {
            background-color: #64FFDA;
            color: #0A192F;
            border-color: #64FFDA;
            box-shadow: 0 0 15px rgba(100, 255, 218, 0.4);
        }
        .campus-btn:not(.active) {
            background-color: #112240;
            color: #CCD6F6;
            border-color: #1d3a63;
        }
        .campus-btn:not(.active):hover {
            background-color: #1d3a63;
            color: #64FFDA;
            border-color: #64FFDA;
        }


        /* Efeito de background com partículas */
        #particle-canvas {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 0;
            opacity: 0.3;
        }

        /* Animação de fade-in ao rolar */
        .reveal {
            opacity: 0;
            transform: translateY(30px);
            transition: opacity 0.8s ease-out, transform 0.8s ease-out;
        }
        .reveal.visible {
            opacity: 1;
            transform: translateY(0);
        }

        /* Estilo do menu mobile */
        .mobile-menu {
            transform: translateX(100%);
            transition: transform 0.3s ease-in-out;
        }
        .mobile-menu.open {
            transform: translateX(0);
        }