body {
    background-color: rgb(31, 37, 42);
    display: flex;
    justify-content: center;
}

.a {
    position: relative;
    top: 200px;
    font: 900 100px '';
    color: #333;
    cursor: pointer;
}

.a span {
    transition: 0.5s;
    transition-delay: calc(var(--i)*.1s);
}

/* 定义关键帧动画 */
@keyframes hoverAnimation {
    0% {
        color: #333;
        text-shadow: none;
    }
    100% {
        color: #0ccfec;
        text-shadow: 0 0 10px #0ccfec,
                    0 0 20px #fff,
                    0 0 30px #fff,
                    0 0 50px #fff,
                    0 0 80px #fff;
    }
}

/* 应用动画到每个span */
.a span {
    animation: hoverAnimation 3s;
    animation-delay: calc(var(--i)*.1s);
    animation-fill-mode: forwards; /* 保持动画结束时的状态 */
}
.responsive-button {
    position: absolute; /* 绝对定位 */
    top: 80%; /* 距离顶部50% */
    left: 50%; /* 距离左侧50% */
    transform: translate(-50%, -50%); /* 使按钮居中 */
    padding: 30px 50px;
    font-size: 25px;
    color: white;
    background-color: #007bff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    
  }
  
  /* 鼠标悬停效果 */
  .responsive-button:hover {
    background-color: #0056b3;
  }
