﻿
/* ========== 基础重置与变量 ========== */
:root {
    --primary: #b21010;
    --primary-dim: rgba(178,16,16,0.30);
    --secondary: #ff8800;
    --secondary-dim: rgba(255,136,0,0.15);
    --accent: #ffd700;
    --bg-dark: #000000;
    --bg-card: rgba(255,255,255,0.04);
    --bg-card-hover: rgba(255,255,255,0.08);
    --text-main: #f0d0d0;
    --text-dim: #c08080;
    --border-glow: rgba(178,16,16,0.45);
    --font-main: "Microsoft YaHei","PingFang SC","Hiragino Sans GB",sans-serif;
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
    font-family:var(--font-main);
    background:linear-gradient(180deg,rgba(220,16,16,0.003) 0%,var(--bg-dark) 100%,var(--bg-dark) 70%,rgba(0,0,0,0.6) 100%),var(--bg-dark);
    background-image: url('bgc.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    color:var(--text-main);
    overflow-x:hidden;
    line-height:1.7;
}
a{color:var(--primary);text-decoration:none;transition:all .3s;}
a:hover{color:#fff;text-shadow:0 0 12px var(--primary);}
ul{list-style:none;}


/* ========== 音乐播放器 ========== */
.musicbox{
    position:fixed;top:20px;right:20px;z-index:9999;
    width:50px;height:50px;border-radius:50%;
    background:linear-gradient(135deg,var(--primary),var(--secondary));
    display:flex;align-items:center;justify-content:center;
    cursor:pointer;box-shadow:0 0 25px rgba(178,16,16,0.6);
    transition:all .3s;font-size:22px;
}
.musicbox:hover{transform:scale(1.1);box-shadow:0 0 40px rgba(178,16,16,0.8);}
.musicplay::after{content:"🎵";font-size:24px;}
.musicstop::after{content:"🔇";font-size:24px;}

/* ========== 顶部导航栏(充值页顶部按钮) ========== */
.top-bar{
    position:fixed;top:0;left:0;width:100%;z-index:999;
    background:linear-gradient(180deg,rgba(5,5,10,0.98) 0%,rgba(5,5,10,0.95) 100%);
    backdrop-filter:blur(16px);
    border-bottom:1px solid var(--border-glow);
    padding:10px 40px;
    display:flex;align-items:center;justify-content:center;gap:12px;
    flex-wrap:wrap;
}
.top-bar .btn-group a{
    padding:8px 20px;border-radius:8px;font-size:17px;font-weight:600;
    color:#fff;transition:all .3s;display:inline-block;
    border:1px solid rgba(255,255,255,0.15);
    background:var(--bg-card);
}
.top-bar .btn-group a:hover{
    background:var(--primary);color:#000;
    box-shadow:0 0 30px var(--primary-dim);
    transform:translateY(-2px);
}
.top-bar .btn-group a:nth-child(1){
    background:linear-gradient(135deg,var(--primary),#8a0a0a);color:#000;border:none;
}
.top-bar .btn-group a:nth-child(4){
    background:linear-gradient(135deg,var(--accent),#ff8800);color:#000;border:none;
}

/* ========== 顶部导航(主导航) ========== */
.topbar{
    position:fixed;top:56px;left:0;width:100%;z-index:100;
    background:linear-gradient(180deg,rgba(5,5,10,0.98) 0%,rgba(5,5,10,0.93) 100%);
    backdrop-filter:blur(16px);
    border-bottom:1px solid var(--border-glow);
    padding:0 40px;
    display:flex;align-items:center;justify-content:space-between;
    height:68px;
    transition:all .3s;
}



.topbar.scrolled{height:56px;background:rgba(5,5,10,0.99);}
.logo{display:flex;align-items:center;gap:12px;}
.logo-icon{
    width:42px;height:42px;
    background:linear-gradient(135deg,var(--primary),var(--secondary));
    border-radius:10px;
    display:flex;align-items:center;justify-content:center;
    font-size:24px;font-weight:900;color:#fff;
    box-shadow:0 0 30px rgba(178,16,16,0.5);
    animation:pulse-glow 3s ease-in-out infinite;
}
@keyframes pulse-glow{
    0%,100%{box-shadow:0 0 30px rgba(178,16,16,0.5);}
    50%{box-shadow:0 0 50px rgba(178,16,16,0.8);}
}
.logo-text{font-size:24px;font-weight:800;
    background:linear-gradient(90deg,var(--primary),var(--secondary));
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;
    letter-spacing:2px;
}
.nav{display:flex;gap:8px;align-items:center;}
.nav a{
    padding:8px 20px;border-radius:8px;font-size:17px;font-weight:600;
    color:var(--text-dim);transition:all .3s;position:relative;
}
.nav a:hover{color:#fff;background:var(--primary-dim);}
.nav a::after{
    content:'';position:absolute;bottom:2px;left:50%;width:0;height:2px;
    background:var(--primary);transition:all .3s;transform:translateX(-50%);}
.nav a:hover::after{width:60%;}
.nav .btn-download{
    background:linear-gradient(135deg,var(--primary),#8a0a0a);
    color:#000!important;font-weight:700;
    box-shadow:0 4px 20px rgba(178,16,16,0.5);}
.nav .btn-download:hover{transform:translateY(-2px);box-shadow:0 6px 35px rgba(178,16,16,0.7);}
.nav .btn-download::after{display:none;}

/* ========== 粒子背景 ========== */
#particles{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none;}
.particle{
    position:absolute;border-radius:50%;
    background:var(--primary);opacity:0.6;
    animation:floatUp linear infinite;
}
@keyframes floatUp{
    0%{opacity:0;transform:translateY(100vh) scale(0);}
    10%{opacity:1;}
    90%{opacity:1;}
    100%{opacity:0;transform:translateY(-10vh) scale(1);}
}

/* ========== Hero 区域 ========== */
.hero{
    position:relative;min-height:100vh;
    display:flex;align-items:center;justify-content:center;
    text-align:center;
    background:
        radial-gradient(ellipse at 20% 50%,rgba(178,16,16,0.05) 0%,transparent 50%),
        radial-gradient(ellipse at 80% 50%,rgba(255,136,0,0.025) 0%,transparent 50%),
        radial-gradient(ellipse at 50% 0%,rgba(255,170,0,0.015) 0%,transparent 60%),
        var(--bg-dark);
    overflow:hidden;
    padding:160px 20px 80px;
}
.hero::before{
    content:'';position:absolute;top:0;left:0;right:0;bottom:0;
    background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23b21010' fill-opacity='0.06'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    opacity:0.5;z-index:0;
}
.hero-content{position:relative;z-index:2;max-width:900px;}
.hero-badge{
    display:inline-block;
    padding:6px 20px;border-radius:50px;
    background:var(--secondary-dim);border:1px solid rgba(255,136,0,0.3);
    color:var(--secondary);font-size:15px;font-weight:600;
    margin-bottom:24px;letter-spacing:1px;
    animation:fadeInDown 1s ease;
}
.hero h1{
    font-size:clamp(47px,9.2vw,90px);font-weight:900;
    line-height:1.1;margin-bottom:20px;
    background:linear-gradient(135deg,#fff 0%,var(--primary) 50%,var(--secondary) 100%);
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;
    animation:fadeInUp 1s ease 0.2s both;
}
.hero p{
    font-size:clamp(19px,2.9vw,25px);color:var(--text-dim);
    margin-bottom:40px;max-width:650px;margin-left:auto;margin-right:auto;
    animation:fadeInUp 1s ease 0.4s both;
}
.hero-buttons{
    display:flex;gap:16px;justify-content:center;flex-wrap:wrap;
    animation:fadeInUp 1s ease 0.6s both;
}
.btn{
    display:inline-flex;align-items:center;gap:8px;
    padding:14px 32px;border-radius:12px;font-size:18px;font-weight:700;
    transition:all .3s;cursor:pointer;border:none;position:relative;overflow:hidden;
}
.btn-primary{
    background:linear-gradient(135deg,var(--primary),#8a0a0a);color:#000;
    box-shadow:0 4px 25px rgba(178,16,16,0.55);
}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 8px 45px rgba(178,16,16,0.75);}
.btn-secondary{
    background:var(--bg-card);color:#fff;
    border:1px solid rgba(255,255,255,0.15);
    backdrop-filter:blur(10px);
}
.btn-secondary:hover{
    background:var(--bg-card-hover);border-color:var(--primary);
    box-shadow:0 0 30px var(--primary-dim);transform:translateY(-3px);}
.btn::after{
    content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;
    background:linear-gradient(45deg,transparent 30%,rgba(255,255,255,0.1) 50%,transparent 70%);
    transform:translateX(-100%);transition:transform .6s;
}
.btn:hover::after{transform:translateX(0);}

@keyframes fadeInUp{from{opacity:0;transform:translateY(30px);}to{opacity:1;transform:translateY(0);}}
@keyframes fadeInDown{from{opacity:0;transform:translateY(-20px);}to{opacity:1;transform:translateY(0);}}

/* ========== 数据统计栏 ========== */
.stats-bar{
    position:relative;z-index:2;
    display:flex;justify-content:center;gap:40px;flex-wrap:wrap;
    padding:40px 20px;
    background:linear-gradient(180deg,var(--bg-dark) 0%,transparent 100%);
}
.stat-item{
    text-align:center;padding:20px 30px;
    background:var(--bg-card);border:1px solid rgba(255,255,255,0.06);
    border-radius:16px;min-width:160px;
    backdrop-filter:blur(10px);transition:all .3s;
}
.stat-item:hover{transform:translateY(-5px);border-color:var(--primary);box-shadow:0 8px 30px var(--primary-dim);}
.stat-num{
    font-size:38px;font-weight:900;
    background:linear-gradient(135deg,var(--primary),var(--secondary));
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;
}
.stat-label{font-size:16px;color:var(--text-dim);margin-top:4px;letter-spacing:1px;}

/* ========== 通用 Section ========== */
.section{
    position:relative;z-index:2;
    padding:80px 20px;max-width:1500px;margin:0 auto;
}
.section-title{text-align:center;margin-bottom:50px;}
.section-title h2{
    font-size:clamp(31px,5.8vw,47px);font-weight:800;margin-bottom:12px;
    background:linear-gradient(90deg,#fff,#ff6600,var(--primary));
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;
    text-shadow:0 0 20px rgba(255,100,0,0.3);
}
.section-title p{color:var(--text-dim);font-size:19px;max-width:500px;margin:0 auto;}
.section-title .line{
    width:60px;height:3px;margin:16px auto 0;border-radius:3px;
    background:linear-gradient(90deg,var(--primary),var(--secondary));
}

/* ========== 核心特色卡片 ========== */
.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
@media(max-width:900px){.features-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.features-grid{grid-template-columns:1fr;}}
.feature-card{
    background:var(--bg-card);border:1px solid rgba(255,255,255,0.06);
    border-radius:20px;padding:32px 28px;backdrop-filter:blur(12px);
    transition:all .4s;position:relative;overflow:hidden;
    border-bottom:2px solid transparent;
}
.feature-card::before{
    content:'';position:absolute;top:0;left:0;right:0;height:3px;
    background:linear-gradient(90deg,#ff4500,#ff6a00);
    transform:scaleX(0);transform-origin:left;transition:transform .4s;
}
.feature-card:hover::before{transform:scaleX(1);}
.feature-card:hover{
    transform:translateY(-8px);border-color:rgba(255,80,0,0.45);
    box-shadow:0 20px 50px rgba(0,0,0,0.3),0 0 30px var(--primary-dim),0 0 40px rgba(255,69,0,0.15),0 0 60px rgba(255,80,0,0.08);
    border-bottom-color:#ff4500;
}
.feature-card::after{
    content:'';position:absolute;bottom:0;right:0;width:80px;height:80px;
    background:radial-gradient(circle,rgba(255,80,0,0.15) 0%,transparent 70%);
    border-radius:50%;transform:translate(30%,30%);
    transition:all .5s;opacity:0;pointer-events:none;
}
.feature-card:hover::after{
    opacity:1;transform:translate(20%,20%) scale(1.5);
    background:radial-gradient(circle,rgba(255,69,0,0.25) 0%,transparent 70%);
}
.feature-icon{
    width:56px;height:56px;border-radius:14px;
    display:flex;align-items:center;justify-content:center;
    font-size:28px;margin-bottom:20px;
    background:linear-gradient(135deg,rgba(255,69,0,0.15),rgba(255,136,0,0.15));
    border:1px solid rgba(255,80,0,0.4);
    box-shadow:0 0 20px rgba(255,80,0,0.2),0 0 30px rgba(255,69,0,0.1);
    transition:all .4s;
}
.feature-card:hover .feature-icon{
    background:linear-gradient(135deg,rgba(255,69,0,0.3),rgba(255,136,0,0.25));
    border-color:rgba(255,80,0,0.6);
    box-shadow:0 0 35px rgba(255,69,0,0.35),0 0 50px rgba(255,80,0,0.2);
    transform:scale(1.05);
}
.feature-card h3{font-size:22px;font-weight:700;color:#fff;margin-bottom:10px;text-shadow:0 0 15px rgba(255,69,0,0.7),0 0 25px rgba(255,80,0,0.5),0 0 35px rgba(255,45,0,0.3);}
.feature-card p{
    background:linear-gradient(90deg,#ffcccc,#ff6633,#ff8844,#ff6633,#ffcccc);
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;
    background-clip:text;font-size:17px;line-height:1.8;font-weight:500;
    filter:drop-shadow(0 0 8px rgba(255,80,0,0.5)),drop-shadow(0 0 12px rgba(255,69,0,0.3));
}

.feature-card .card-shimmer{
    position:absolute;top:0;left:-100%;width:100%;height:100%;
    background:linear-gradient(90deg,transparent,rgba(255,80,0,0.08),transparent);
    transition:none;pointer-events:none;
}
.feature-card:hover .card-shimmer{
    animation:shimmer 1.2s ease-in-out;
}
@keyframes shimmer{
    0%{left:-100%;}
    100%{left:100%;}
}

/* ========== 服务器列表 ========== */
.server-table-wrap{
    background:var(--bg-card);border:1px solid rgba(255,255,255,0.06);
    border-radius:20px;overflow:hidden;backdrop-filter:blur(12px);
}
.server-table{width:100%;border-collapse:collapse;}
.server-table thead{background:linear-gradient(90deg,rgba(178,16,16,0.25),rgba(255,136,0,0.15));}
.server-table th{
    padding:18px 20px;text-align:center;font-size:19px;font-weight:700;
    color:var(--primary);text-transform:uppercase;letter-spacing:1px;
    border-bottom:1px solid rgba(178,16,16,0.3);
}
.server-table td{
    padding:16px 20px;text-align:center;font-size:18px;
    border-bottom:1px solid rgba(255,255,255,0.04);transition:all .3s;
}
.server-table tbody tr:hover{background:rgba(178,16,16,0.12);}
.server-table tbody tr:hover td{color:#fff;}
.server-table .tag{
    display:inline-block;padding:4px 12px;border-radius:50px;
    font-size:16px;font-weight:600;
}
.tag-new{background:rgba(178,16,16,0.3);color:var(--primary);}
.tag-hot{background:rgba(255,170,0,0.15);color:var(--accent);}
.tag-stable{background:rgba(0,255,187,0.15);color:#ffd700;}

/* ========== 充值区(融合版) ========== */
.recharge-section{position:relative;z-index:2;padding:80px 20px;max-width:1500px;margin:0 auto;}
.recharge-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;margin-bottom:40px;}
.recharge-card{
    background:var(--bg-card);border:1px solid rgba(255,255,255,0.06);
    border-radius:20px;padding:36px 30px;text-align:center;
    backdrop-filter:blur(12px);position:relative;overflow:hidden;
    transition:all .4s;
}
.recharge-card.featured{border-color:var(--accent);box-shadow:0 0 40px rgba(255,170,0,0.1),0 0 60px rgba(178,16,16,0.15);}
.recharge-card.featured::before{
    content:'推荐';position:absolute;top:16px;right:-30px;
    background:linear-gradient(135deg,var(--accent),#ff8800);
    color:#000;font-size:14px;font-weight:700;
    padding:4px 40px;transform:rotate(45deg);
}
.recharge-card:hover{transform:translateY(-8px);box-shadow:0 20px 50px rgba(0,0,0,0.3);}
.recharge-card h3{font-size:24px;font-weight:800;color:#fff;margin-bottom:8px;text-shadow:0 0 15px rgba(255,69,0,0.7),0 0 25px rgba(255,80,0,0.5),0 0 35px rgba(255,45,0,0.3);}
.recharge-card .price{
    font-size:51px;font-weight:900;
    background:linear-gradient(135deg,var(--primary),var(--secondary));
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;margin:16px 0;
}
.recharge-card .price span{font-size:18px;}
.recharge-card ul{text-align:left;margin:20px 0;}
.recharge-card li{
    padding:8px 0;color:var(--text-dim);font-size:17px;
    border-bottom:1px solid rgba(255,255,255,0.04);
    display:flex;align-items:center;gap:8px;
}
.recharge-card li::before{content:'✓';color:var(--primary);font-weight:700;}


/* 支付方式区域 */
.payment-section{
    background:var(--bg-card);border:1px solid rgba(255,255,255,0.06);
    border-radius:20px;padding:40px 36px;backdrop-filter:blur(12px);
    text-align:center;
}
.payment-section h3{
    font-size:26px;font-weight:800;color:#fff;margin-bottom:24px;text-shadow:0 0 15px rgba(255,100,0,0.6);
}
.payment-buttons{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;}
.payment-btn{
    padding:14px 32px;border-radius:12px;font-size:18px;font-weight:700;
    color:#fff;transition:all .3s;cursor:pointer;border:none;
    display:inline-flex;align-items:center;gap:8px;
}
.payment-btn:hover{transform:translateY(-3px);}
.payment-btn.wx{background:linear-gradient(135deg,#07c160,#06ad56);box-shadow:0 4px 15px rgba(7,193,96,0.3);}
.payment-btn.wx:hover{box-shadow:0 8px 25px rgba(7,193,96,0.5);}
.payment-btn.qq{background:linear-gradient(135deg,#12b7f5,#0e9bd4);box-shadow:0 4px 15px rgba(18,183,245,0.3);}
.payment-btn.qq:hover{box-shadow:0 8px 25px rgba(18,183,245,0.5);}
.payment-btn.zfb{background:linear-gradient(135deg,#1677ff,#0958d9);box-shadow:0 4px 15px rgba(22,119,255,0.3);}
.payment-btn.zfb:hover{box-shadow:0 8px 25px rgba(22,119,255,0.5);}

/* ========== 3D轮播海报区 ========== */
.carousel-section{position:relative;z-index:2;padding:60px 20px 100px;text-align:center;overflow:hidden;}
.carousel-3d-wrapper{
    max-width:1500px;margin:0 auto;position:relative;
    height:420px;display:flex;align-items:center;justify-content:center;
    perspective:1500px;
}
.carousel-3d-scene{
    width:450px;height:350px;position:relative;
    transform-style:preserve-3d;
}
.carousel-3d-track{
    width:100%;height:100%;position:absolute;
    transform-style:preserve-3d;
    transition:transform 0.8s cubic-bezier(0.25,0.46,0.45,0.94);
}
.carousel-3d-slide{
    position:absolute;top:0;left:0;width:100%;height:100%;
    border-radius:16px;overflow:hidden;
    backface-visibility:hidden;
    box-shadow:0 15px 40px rgba(0,0,0,0.4);
    border:2px solid rgba(255,255,255,0.1);
    transition:box-shadow 0.4s, border-color 0.4s;
}
.carousel-3d-slide img{
    width:100%;height:100%;object-fit:cover;display:block;
}
.carousel-3d-slide.active{
    border-color:var(--primary);
    box-shadow:0 0 40px rgba(178,16,16,0.5),0 15px 40px rgba(0,0,0,0.4);
}
.carousel-3d-arrows{
    position:absolute;top:50%;width:100%;
    display:flex;justify-content:space-between;
    padding:0 30px;transform:translateY(-50%);
    pointer-events:none;
}
.carousel-3d-arrow{
    width:52px;height:52px;border-radius:50%;
    background:rgba(255,255,255,0.08);
    backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,0.15);
    color:#fff;font-size:24px;font-weight:bold;
    cursor:pointer;display:flex;align-items:center;justify-content:center;
    transition:all .5s;pointer-events:auto;
    z-index:10;
}
.carousel-3d-arrow:hover{
    background:var(--primary);color:#000;
    border-color:var(--primary);
    box-shadow:0 0 35px rgba(178,16,16,0.7);
    transform:scale(1.1);
}
.carousel-3d-indicators{
    display:flex;justify-content:center;gap:14px;
    margin-top:30px;position:relative;z-index:5;
}
.carousel-3d-dot{
    width:14px;height:14px;border-radius:50%;
    background:rgba(255,255,255,0.2);cursor:pointer;
    transition:all .5s;border:2px solid transparent;
    position:relative;
}
.carousel-3d-dot.active{
    background:var(--primary);
    border-color:var(--primary);
    box-shadow:0 0 25px var(--primary);
}
.carousel-3d-dot.active::after{
    content:'';position:absolute;top:-4px;left:-4px;right:-4px;bottom:-4px;
    border-radius:50%;border:2px solid var(--primary);
    animation:dotPulse 5s infinite;
}
@keyframes dotPulse{
    0%{transform:scale(1);opacity:1;}
    100%{transform:scale(1.5);opacity:0;}
}/* ========== 游戏介绍滚动 ========== */
/* 游戏介绍标题橙红色增强 */
.section-title[style*="padding:0 20px"] h2{
    background:linear-gradient(90deg,#fff,#ff6600,var(--primary))!important;
    -webkit-background-clip:text!important;-webkit-text-fill-color:transparent!important;
}
.section-title[style*="padding:0 20px"] .line{
    background:linear-gradient(90deg,var(--secondary),var(--primary))!important;
    box-shadow:0 0 15px rgba(255,100,0,0.5)!important;
}
.intro-scroll{position:relative;z-index:2;overflow:hidden;padding:60px 0;background:linear-gradient(180deg,transparent 0%,rgba(178,16,16,0.02) 30%,rgba(255,100,0,0.01) 50%,rgba(178,16,16,0.02) 70%,transparent 100%);}
.intro-track{
    display:flex;flex-direction:column;gap:16px;
    animation:scrollUp 0s linear infinite;
    width:100%;max-width:1500px;margin:0 auto;padding:0 20px;
    position:relative;
}
.intro-track::before{
    content:'';position:absolute;top:0;left:0;right:0;bottom:0;
    background:linear-gradient(180deg,rgba(255,80,0,0.008) 0%,transparent 50%,rgba(178,16,16,0.008) 100%);
    pointer-events:none;z-index:0;
}
@keyframes scrollUp{0%{transform:translateY(0);}100%{transform:translateY(-50%);}}
.intro-item{
    background:var(--bg-card);border:1px solid rgba(255,255,255,0.06);
    border-radius:14px;padding:20px 28px;backdrop-filter:blur(8px);
    border-left:4px solid var(--secondary);transition:all .3s;
    box-shadow:0 2px 10px rgba(255,80,0,0.05);
}
.intro-item::before{
    content:'';position:absolute;top:0;left:0;right:0;height:2px;
    background:linear-gradient(90deg,var(--secondary),var(--primary),var(--secondary));
    border-radius:14px 14px 0 0;opacity:0;transition:opacity .3s;
}
.intro-item:hover::before{opacity:1;}
.intro-item{position:relative;overflow:hidden;}
.intro-item:hover{background:linear-gradient(90deg,rgba(255,100,0,0.08),var(--bg-card-hover));border-left-color:#ff6600;transform:translateX(8px);box-shadow:0 4px 20px rgba(255,80,0,0.15),0 0 30px rgba(178,16,16,0.1);}
.intro-item h4{color:var(--primary);font-size:26px;margin-bottom:10px;font-weight:800;text-shadow:0 0 25px rgba(255,100,0,0.8),0 0 50px rgba(255,80,0,0.5),0 0 30px rgba(178,16,16,0.5);}
.intro-item p{color:#d0d0e8;font-size:22px;line-height:2.2;font-weight:500;background:linear-gradient(90deg,#f0d0d0,#ff6600,var(--primary),#ff6600,#f0d0d0);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:drop-shadow(0 0 8px rgba(255,80,0,0.3));}

/* ========== 页脚 ========== */
.footer{position:relative;z-index:2;border-top:1px solid rgba(255,255,255,0.06);padding:50px 20px 30px;text-align:center;background:linear-gradient(180deg,transparent,rgba(0,0,0,0.85));}
.footer-links{display:flex;justify-content:center;flex-wrap:wrap;gap:20px;margin-bottom:24px;}
.footer-links a{color:var(--text-dim);font-size:16px;transition:all .3s;}
.footer-links a:hover{color:var(--primary);}
.footer p{color:var(--text-dim);font-size:15px;line-height:2;}
.footer .health{
    max-width:1500px;margin:0 auto 20px;
    padding:16px 24px;border-radius:10px;
    background:rgba(255,170,0,0.05);border:1px solid rgba(255,170,0,0.1);
    color:var(--accent);font-size:15px;line-height:1.8;
    display:flex;align-items:center;justify-content:center;gap:24px;
}
.footcer_3{flex-shrink:0;display:flex;align-items:center;justify-content:center;}
.footcer-left{order:1;}
.footcer-right{order:3;}
.health-text{order:2;text-align:center;flex:1;}

/* ========== 响应式 ========== */
@media(max-width:768px){
    .footer .health{flex-direction:column;}
    .footcer-left{order:0;}
    .health-text{order:1;}
    .footcer-right{order:2;}
    .top-bar{padding:8px 16px;}
    .topbar{padding:0 16px;top:48px;}
    .nav a{padding:6px 12px;font-size:16px;}
    .hero{padding:140px 16px 60px;}
    .stats-bar{gap:16px;}
    .stat-item{min-width:130px;padding:16px 20px;}
    .stat-num{font-size:32px;}
    .section{padding:60px 16px;}
    /* 3D轮播响应式 */
.carousel-3d-wrapper{max-width:900px;margin:0 auto;position:relative;height:320px;}
.carousel-3d-scene{width:240px;height:165px;}
.carousel-3d-arrow{width:42px;height:42px;font-size:20px;}
.carousel-section{padding:40px 16px 60px;}
    .server-table th,.server-table td{padding:12px 10px;font-size:17px;}
    .payment-section{padding:24px 16px;}
}

/* ========== 滚动条美化 ========== */
::-webkit-scrollbar{width:8px;}
::-webkit-scrollbar-track{background:linear-gradient(180deg,rgba(178,16,16,0.002) 0%,var(--bg-dark) 30%,var(--bg-dark) 70%,rgba(178,16,16,0.002) 100%),var(--bg-dark);}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--primary),var(--secondary));border-radius:4px;}
/* ========== 背景遮罩 ========== */
.bg-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(180deg,rgba(12,2,6,0.80) 0%,rgba(0,0,0,0.98) 50%,rgba(12,2,6,0.80) 100%);z-index:-1;pointer-events:none;}
