/* EL BOTÓN LIQUID GLASS */
        .glass-btn {
            position: relative;
            width: 150px;
            height: 70px;
            border: none;
            border-radius: 50%; /* Redondo */
            cursor: pointer;
            
            /* 1. La Base del Vidrio */
            background: rgba(255, 255, 255, 0.1); /* Muy transparente */
            backdrop-filter: blur(15px); /* El efecto de distorsión */
            -webkit-backdrop-filter: blur(15px);
            
            /* 2. Bordes para definir los límites (luz arriba, sombra abajo) */
            border-top: 1px solid rgba(255, 255, 255, 0.5);
            border-left: 1px solid rgba(255, 255, 255, 0.5);
            border-bottom: 1px solid rgba(255, 255, 255, 0.2);
            border-right: 1px solid rgba(255, 255, 255, 0.2);

            /* 3. Luces y Sombras Internas (Volumen) */
            box-shadow: 
                inset 10px 10px 20px rgba(255, 255, 255, 0.2), /* Brillo interno sup */
                inset -10px -20px 20px rgba(0, 0, 0, 0.1), /* Sombra interna inf */
                10px 20px 30px rgba(0, 0, 0, 0.2); /* Sombra externa (drop shadow) */
            
            color: white;
            font-size: 1.2rem;
            font-weight: bold;
            letter-spacing: 2px;
            text-shadow: 0 2px 5px rgba(0,0,0,0.2);
            transition: all 0.5s ease;
            overflow: hidden; 
        }

        /* EFECTO LÍQUIDO INTERNO (Animación) */
        .glass-btn::before {
            content: '';
            position: absolute;
            top: -40%;
            left: -40%;
            width: 180%;
            height: 180%;
            border-radius: 40%;
            background: radial-gradient(circle, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 60%);
            opacity: 0.3;
            animation: liquidMove 8s linear infinite;
            pointer-events: none; /* Para que no interfiera con el click */
        }

        /* BRILLO FUERTE (Reflejo especular) */
        .glass-btn::after {
            content: '';
            position: absolute;
            top: 15px;
            left: 25px;
            width: 30px;
            height: 15px;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.8);
            filter: blur(2px);
            transform: rotate(-45deg);
        }

        /* HOVER: Se vuelve más "líquido" y cambia de forma sutilmente */
        .glass-btn:hover {
            transform: translateY(-5px) scale(1.05);
            box-shadow: 
                inset 5px 5px 30px rgba(255, 255, 255, 0.4),
                0 25px 40px rgba(0, 0, 0, 0.3);
            background: rgba(255, 255, 255, 0.2);
        }

        /* ANIMACIONES */
        @keyframes liquidMove {
            0% { transform: rotate(0deg) translate(10px, 10px); }
            50% { transform: rotate(180deg) translate(-10px, -10px); }
            100% { transform: rotate(360deg) translate(10px, 10px); }
        }

        @keyframes gradientBG {
            0% { background-position: 0% 50%; }
            50% { background-position: 100% 50%; }
            100% { background-position: 0% 50%; }
        }