.page { position: relative; min-height: 100vh; padding: 0 28rpx 70rpx; background: var(--bg); overflow: hidden; } /* 顶部两团辉光,对应官网的红 / 青径向光 */ .glow { position: absolute; left: -30%; top: -200rpx; width: 160%; height: 1000rpx; pointer-events: none; background: radial-gradient(560rpx 340rpx at 30% 38%, rgba(242, 53, 59, 0.22), transparent 66%), radial-gradient(520rpx 320rpx at 72% 26%, rgba(79, 193, 255, 0.16), transparent 68%); } /* ===== 顶部 ===== */ .hero { position: relative; padding: 56rpx 4rpx 0; } .hero-title { margin-top: 0; font-size: 54rpx; line-height: 1.24; font-weight: 800; color: var(--text); } .hero-title-sub { margin-top: 16rpx; font-size: 38rpx; line-height: 1.4; font-weight: 600; color: var(--text); } .hero-accent { color: var(--accent-2); } .hero-sub { margin-top: 22rpx; font-size: 25rpx; line-height: 1.8; color: var(--text-dim); } .hero-cta { display: flex; margin-top: 40rpx; } .btn { flex: 1; height: 92rpx; line-height: 92rpx; text-align: center; border-radius: var(--r-lg); font-size: 29rpx; font-weight: 600; } .btn.primary { background: linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%); color: #ffffff; box-shadow: 0 12rpx 26rpx rgba(242, 53, 59, 0.26); } .btn.ghost { margin-left: 20rpx; border: 2rpx solid var(--border); background: var(--panel); color: var(--text); } /* 单独一行的宽按钮 */ .btn.ghost.wide { display: block; flex: none; width: 100%; margin: 30rpx 0 0; } .stats { display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 36rpx; } .stat { width: 48%; margin-bottom: 16rpx; padding: 22rpx 24rpx; border: 2rpx solid var(--border); border-radius: var(--r-lg); background: rgba(28, 28, 34, 0.74); } .stat-value { font-size: 40rpx; font-weight: 700; color: var(--text); } .stat-label { margin-top: 6rpx; font-size: 21rpx; line-height: 1.5; color: var(--text-dim); } .chips { display: flex; flex-wrap: wrap; margin-top: 30rpx; } .chip { margin: 0 14rpx 14rpx 0; padding: 10rpx 22rpx; border-radius: var(--r-pill); border: 2rpx solid var(--border); background: var(--panel); color: var(--text-dim); font-size: 21rpx; } .chip.on { color: var(--cyan); border-color: rgba(79, 193, 255, 0.4); background: rgba(79, 193, 255, 0.08); } .note { margin-top: 4rpx; font-size: 22rpx; line-height: 1.7; color: var(--text-dim); } /* ===== 小程序定位 ===== */ .notice { margin-top: 46rpx; padding: 30rpx 32rpx; border: 2rpx solid var(--border); border-radius: var(--r-lg); background: var(--panel); } .notice-title { font-size: 28rpx; font-weight: 600; color: var(--accent-2); } .notice-desc { margin-top: 12rpx; font-size: 24rpx; line-height: 1.75; color: var(--text-dim); } .notice-link { margin-top: 18rpx; font-size: 24rpx; color: var(--cyan); } /* ===== 通用分节 ===== */ .section { position: relative; margin-top: 76rpx; } .section.alt { margin: 76rpx -28rpx 0; padding: 56rpx 28rpx; background: var(--bg-2); border-top: 2rpx solid var(--border); border-bottom: 2rpx solid var(--border); } .kicker { font-size: 20rpx; font-weight: 700; letter-spacing: 4rpx; color: var(--accent); } .h2 { margin-top: 14rpx; font-size: 40rpx; font-weight: 700; color: var(--text); } .lead { margin: 16rpx 0 30rpx; font-size: 24rpx; line-height: 1.75; color: var(--text-dim); } .card { padding: 26rpx 30rpx; margin-bottom: 18rpx; border: 2rpx solid var(--border); border-radius: var(--r-lg); background: var(--panel); } .card-title { font-size: 28rpx; font-weight: 600; color: var(--text); } .card-desc { margin-top: 12rpx; font-size: 24rpx; line-height: 1.7; color: var(--text-dim); } /* ===== 版本表 ===== */ .rows { border: 2rpx solid var(--border); border-radius: var(--r-lg); background: var(--panel); overflow: hidden; } .row { padding: 26rpx 30rpx; border-bottom: 2rpx solid var(--border); } .row:last-child { border-bottom: none; } .row-ver { font-size: 26rpx; font-weight: 600; color: var(--cyan); } .row-desc { margin-top: 10rpx; font-size: 23rpx; line-height: 1.7; color: var(--text-dim); } /* ===== 步骤 ===== */ .step { display: flex; align-items: flex-start; margin-bottom: 24rpx; } .step-index { flex-shrink: 0; width: 48rpx; height: 48rpx; line-height: 48rpx; text-align: center; border-radius: var(--r-pill); border: 2rpx solid rgba(242, 53, 59, 0.35); background: rgba(242, 53, 59, 0.12); color: var(--accent-2); font-size: 23rpx; } .step-text { flex: 1; margin-left: 20rpx; padding-top: 6rpx; font-size: 25rpx; line-height: 1.7; color: var(--text); } /* ===== 常见问题 ===== */ .faq { margin-bottom: 26rpx; } .faq-q { font-size: 27rpx; color: var(--text); } .faq-a { margin-top: 10rpx; font-size: 24rpx; line-height: 1.75; color: var(--text-dim); } .foot { margin-top: 60rpx; font-size: 22rpx; line-height: 1.7; color: rgba(157, 157, 168, 0.6); }