/* ========== 全局样式 ========== */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: "Microsoft YaHei","PingFang SC","Helvetica Neue",Arial,sans-serif; background:#0a1a0a; color:#e8e8e8; line-height:1.8; font-size:16px; }
a { text-decoration:none; color:inherit; transition:all .3s ease; }
a:hover { color:#d4af37; }
img { max-width:100%; height:auto; }
.container { max-width:1200px; margin:0 auto; padding:0 20px; }

/* ========== 顶部信息栏 ========== */
.top-bar { background:#0d1f0d; padding:8px 0; font-size:13px; color:#8a9a8a; }
.top-bar .container { display:flex; justify-content:center; flex-wrap:wrap; gap:8px 20px; }
.top-bar span { margin:0; }

/* ========== 导航 ========== */
.header { background:linear-gradient(135deg,#0a1a0a 0%,#1a2f1a 50%,#0a1a0a 100%); border-bottom:2px solid #d4af37; position:sticky; top:0; z-index:1000; }
.nav-main { display:flex; align-items:center; justify-content:space-between; padding:10px 0; }
.logo { display:flex; align-items:center; }
.logo img { height:55px; width:auto; }
.nav-menu { display:flex; list-style:none; gap:5px; }
.nav-menu li a { display:block; padding:10px 20px; color:#e8e8e8; font-size:15px; border-radius:5px; transition:all .3s; position:relative; }
.nav-menu li a:hover,.nav-menu li a.active { color:#d4af37; background:rgba(212,175,55,.1); }
.nav-menu li a::after { content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:0; height:2px; background:#d4af37; transition:width .3s; }
.nav-menu li a:hover::after,.nav-menu li a.active::after { width:60%; }

/* ========== Banner ========== */
.banner { position:relative; min-height:500px; height:auto; overflow:hidden; background:linear-gradient(135deg,#0a1a0a,#1a3a1a,#0a2a0a); padding:80px 0; }
.banner-content { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); text-align:center; z-index:2; width:90%; }
.banner h1 { font-size:42px; color:#d4af37; text-shadow:2px 2px 10px rgba(0,0,0,.5); margin-bottom:15px; letter-spacing:3px; }
.banner .banner-title { font-size:36px; color:#d4af37; text-shadow:2px 2px 10px rgba(0,0,0,.5); margin-bottom:15px; letter-spacing:2px; font-weight:bold; }
.banner .subtitle { font-size:20px; color:#c8d8c8; margin-bottom:10px; }
.banner .tagline { font-size:16px; color:#8a9a8a; margin-bottom:30px; }
.banner .btn-group { display:flex; gap:20px; justify-content:center; flex-wrap:wrap; }
.btn-primary { display:inline-block; padding:14px 35px; background:linear-gradient(135deg,#d4af37,#b8960c); color:#0a1a0a; font-size:16px; font-weight:bold; border-radius:30px; cursor:pointer; transition:all .3s; }
.btn-primary:hover { transform:translateY(-3px); box-shadow:0 8px 25px rgba(212,175,55,.4); }
.btn-secondary { display:inline-block; padding:14px 35px; background:transparent; color:#d4af37; font-size:16px; font-weight:bold; border-radius:30px; border:2px solid #d4af37; cursor:pointer; transition:all .3s; }
.btn-secondary:hover { background:rgba(212,175,55,.1); transform:translateY(-3px); }
.banner-particles { position:absolute; width:100%; height:100%; top:0; left:0; }
.particle { position:absolute; width:4px; height:4px; background:#d4af37; border-radius:50%; opacity:.3; animation:float 6s infinite; }
@keyframes float { 0%,100% { transform:translateY(0) rotate(0deg); opacity:.3; } 50% { transform:translateY(-100px) rotate(180deg); opacity:.8; } }

/* ========== 通用区块 ========== */
.section { padding:60px 0; }
.section-dark { background:#0d1f0d; }
.section-title { text-align:center; margin-bottom:50px; }
.section-title h2 { font-size:32px; color:#d4af37; position:relative; display:inline-block; padding-bottom:15px; }
.section-title h2::after { content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:80px; height:3px; background:linear-gradient(90deg,transparent,#d4af37,transparent); }
.section-title p { color:#8a9a8a; margin-top:15px; font-size:15px; }

/* ========== 统计 ========== */
.stats-bar { display:grid; grid-template-columns:repeat(4,1fr); gap:30px; padding:40px 0; }
.stat-item { text-align:center; }
.stat-num { font-size:42px; color:#d4af37; font-weight:bold; }
.stat-label { color:#8a9a8a; font-size:14px; margin-top:5px; }

/* ========== 服务卡片 ========== */
.services-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:25px; }
.service-card { background:linear-gradient(135deg,#1a2f1a,#0d1f0d); border:1px solid rgba(212,175,55,.2); border-radius:15px; padding:35px 25px; text-align:center; transition:all .4s; position:relative; overflow:hidden; }
.service-card::before { content:''; position:absolute; top:0; left:-100%; width:100%; height:100%; background:linear-gradient(90deg,transparent,rgba(212,175,55,.05),transparent); transition:left .6s; }
.service-card:hover::before { left:100%; }
.service-card:hover { transform:translateY(-10px); border-color:#d4af37; box-shadow:0 15px 40px rgba(212,175,55,.15); }
.service-icon { font-size:50px; margin-bottom:20px; display:block; }
.service-card h3 { font-size:20px; color:#d4af37; margin-bottom:12px; }
.service-card p { color:#8a9a8a; font-size:14px; line-height:1.8; }

/* ========== 文章列表 ========== */
.articles-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:30px; }
.article-card { background:linear-gradient(135deg,#1a2f1a,#0d1f0d); border:1px solid rgba(212,175,55,.15); border-radius:12px; overflow:hidden; transition:all .4s; }
.article-card:hover { transform:translateY(-8px); border-color:#d4af37; box-shadow:0 12px 35px rgba(212,175,55,.12); }
.article-img { height:200px; background:linear-gradient(135deg,#1a3a1a,#0d2a0d); display:flex; align-items:center; justify-content:center; font-size:60px; position:relative; overflow:hidden; }
.article-img::after { content:''; position:absolute; bottom:0; left:0; right:0; height:60px; background:linear-gradient(transparent,#1a2f1a); }
.article-body { padding:25px; }
.article-body h3 { font-size:18px; color:#d4af37; margin-bottom:10px; line-height:1.5; }
.article-body h3 a { color:#d4af37; }
.article-body p { color:#8a9a8a; font-size:14px; line-height:1.8; margin-bottom:15px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.article-meta { display:flex; justify-content:space-between; color:#5a6a5a; font-size:12px; border-top:1px solid rgba(212,175,55,.1); padding-top:12px; }
.read-more { color:#d4af37; font-weight:bold; }

/* ========== 栏目导航 ========== */
.cat-nav { display:flex; gap:15px; margin-bottom:40px; flex-wrap:wrap; justify-content:center; }
.cat-nav a { padding:10px 25px; background:rgba(212,175,55,.1); border:1px solid rgba(212,175,55,.3); border-radius:25px; color:#c8d8c8; transition:all .3s; }
.cat-nav a:hover,.cat-nav a.active { background:linear-gradient(135deg,#d4af37,#b8960c); color:#0a1a0a; font-weight:bold; border-color:#d4af37; }

/* ========== 关于我们 ========== */
.about-content { display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:center; }
.about-img { height:400px; background:linear-gradient(135deg,#1a3a1a,#0d2a0d); border-radius:15px; border:2px solid rgba(212,175,55,.2); display:flex; align-items:center; justify-content:center; font-size:80px; }
.about-text h2 { font-size:30px; color:#d4af37; margin-bottom:20px; }
.about-text p { color:#b8c8b8; margin-bottom:15px; line-height:2; }
.about-features { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:30px; }
.about-feature { display:flex; align-items:center; gap:12px; }
.about-feature .icon { font-size:30px; }
.about-feature .text h4 { color:#d4af37; font-size:16px; }
.about-feature .text p { color:#8a9a8a; font-size:13px; }

/* ========== 联系我们 ========== */
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:50px; }
.contact-info { display:flex; flex-direction:column; gap:25px; }
.contact-item { display:flex; align-items:center; gap:20px; background:linear-gradient(135deg,#1a2f1a,#0d1f0d); border:1px solid rgba(212,175,55,.2); border-radius:12px; padding:25px; transition:all .3s; }
.contact-item:hover { border-color:#d4af37; transform:translateX(5px); }
.contact-icon { font-size:40px; }
.contact-detail h4 { color:#d4af37; font-size:18px; margin-bottom:5px; }
.contact-detail p { color:#8a9a8a; }

/* ========== 悬浮按钮 ========== */
.floating-btns { position:fixed; right:20px; bottom:100px; z-index:9999; display:flex; flex-direction:column; gap:12px; }
.float-btn { width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:24px; color:#fff; cursor:pointer; transition:all .3s; box-shadow:0 4px 15px rgba(0,0,0,.3); position:relative; }
.float-btn:hover { transform:scale(1.15); }
.float-btn.qq-btn { background:linear-gradient(135deg,#4a9eff,#2176d4); }
.float-btn.phone-btn { background:linear-gradient(135deg,#d4af37,#b8960c); animation:pulse 2s infinite; }
.float-btn.wechat-btn { background:linear-gradient(135deg,#07c55e,#06a84e); }
.float-btn .tooltip { position:absolute; right:65px; background:#1a2f1a; color:#d4af37; padding:8px 15px; border-radius:8px; font-size:13px; white-space:nowrap; opacity:0; pointer-events:none; transition:all .3s; border:1px solid rgba(212,175,55,.3); }
.float-btn:hover .tooltip { opacity:1; right:70px; }
@keyframes pulse { 0%,100% { box-shadow:0 4px 15px rgba(212,175,55,.3); } 50% { box-shadow:0 4px 25px rgba(212,175,55,.6); } }

/* ========== 回到顶部 ========== */
.back-top { position:fixed; right:20px; bottom:30px; width:45px; height:45px; background:linear-gradient(135deg,#d4af37,#b8960c); border-radius:50%; display:flex; align-items:center; justify-content:center; color:#0a1a0a; font-size:20px; cursor:pointer; opacity:0; transition:all .3s; z-index:999; }
.back-top.show { opacity:1; }
.back-top:hover { transform:translateY(-5px); }

/* ========== 页脚 ========== */
.footer { background:linear-gradient(135deg,#0a150a,#0d1f0d); border-top:2px solid #d4af37; padding:50px 0 0; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:40px; padding-bottom:40px; }
.footer-about h3,.footer-links h4 { color:#d4af37; margin-bottom:20px; font-size:18px; }
.footer-about p { color:#8a9a8a; font-size:14px; line-height:2; }
.footer-links ul { list-style:none; }
.footer-links li { margin-bottom:10px; }
.footer-links a { color:#8a9a8a; font-size:14px; transition:color .3s; }
.footer-links a:hover { color:#d4af37; padding-left:5px; }
.footer-bottom { border-top:1px solid rgba(212,175,55,.15); padding:20px 0; text-align:center; }
.footer-bottom p { color:#5a6a5a; font-size:13px; margin-bottom:5px; }
.footer-bottom .keywords { color:#8a9a8a; font-size:12px; display:flex; flex-wrap:wrap; justify-content:center; gap:5px 10px; }
.footer-bottom .keywords a { color:#5a7a5a; margin:0; }
.footer-bottom .keywords a:hover { color:#d4af37; }

/* ========== 文章详情页 ========== */
.article-detail { max-width:900px; margin:0 auto; }
.article-detail h1 { font-size:30px; color:#d4af37; text-align:center; margin:30px 0 15px; line-height:1.5; }
.article-detail .article-info { text-align:center; color:#5a6a5a; font-size:13px; margin-bottom:30px; padding-bottom:20px; border-bottom:1px solid rgba(212,175,55,.15); }
.article-detail .article-info span { margin:0 10px; }
.article-detail .article-content { background:linear-gradient(135deg,#1a2f1a,#0d1f0d); border:1px solid rgba(212,175,55,.15); border-radius:12px; padding:40px; line-height:2.2; color:#c8d8c8; }
.article-detail .article-content p { margin-bottom:18px; text-indent:2em; }
.article-detail .article-content h2 { color:#d4af37; font-size:22px; margin:25px 0 15px; padding-left:15px; border-left:4px solid #d4af37; }
.article-detail .article-content h3 { color:#c8d8c8; font-size:18px; margin:20px 0 10px; }
.article-nav { display:flex; justify-content:space-between; margin-top:40px; padding-top:20px; border-top:1px solid rgba(212,175,55,.15); }
.article-nav a { color:#d4af37; }

/* ========== 面包屑 ========== */
.breadcrumb { padding:15px 0; font-size:14px; color:#5a6a5a; }
.breadcrumb a { color:#8a9a8a; }
.breadcrumb a:hover { color:#d4af37; }
.breadcrumb span { margin:0 8px; }

/* ========== 推荐卡片 ========== */
.recommend-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:25px; }
.recommend-card { background:linear-gradient(135deg,#1a2f1a,#0d1f0d); border:1px solid rgba(212,175,55,.15); border-radius:12px; padding:30px; display:flex; gap:20px; transition:all .3s; }
.recommend-card:hover { border-color:#d4af37; }
.recommend-num { font-size:36px; color:#d4af37; font-weight:bold; min-width:50px; }
.recommend-text h4 { color:#d4af37; font-size:16px; margin-bottom:8px; }
.recommend-text p { color:#8a9a8a; font-size:14px; line-height:1.8; }

/* ========== 动画 ========== */
.fade-in { opacity:0; transform:translateY(30px); transition:all .6s ease; }
.fade-in.visible { opacity:1; transform:translateY(0); }

/* ========== 响应式 768px ========== */
@media (max-width:768px) {
    .nav-main { flex-direction:column; gap:12px; padding:12px 0; }
    .nav-menu { display:flex; flex-wrap:wrap; justify-content:center; gap:6px; padding:0; }
    .nav-menu li a { padding:8px 12px; font-size:13px; }
    .banner { min-height:420px; padding:60px 0; }
    .banner h1 { font-size:24px; letter-spacing:1px; }
    .banner .subtitle { font-size:15px; }
    .banner .tagline { font-size:13px; margin-bottom:20px; }
    .banner .btn-group { flex-direction:column; align-items:center; gap:12px; }
    .btn-primary,.btn-secondary { width:85%; text-align:center; padding:12px 0; font-size:15px; }
    .stats-bar { grid-template-columns:repeat(2,1fr); gap:20px; padding:30px 0; }
    .stat-num { font-size:28px; }
    .stat-label { font-size:13px; }
    .services-grid { grid-template-columns:repeat(2,1fr); gap:15px; }
    .service-card { padding:25px 15px; }
    .service-icon { font-size:36px; }
    .service-card h3 { font-size:16px; }
    .floating-btns { right:10px; bottom:75px; gap:10px; }
    .float-btn { width:45px; height:45px; font-size:20px; }
    .float-btn .tooltip { display:none; }
    .recommend-grid { grid-template-columns:1fr; gap:15px; }
    .recommend-card { flex-direction:column; align-items:flex-start; padding:20px; }
    .recommend-num { font-size:28px; margin-bottom:10px; }
    .articles-grid { grid-template-columns:1fr; }
    .about-content { grid-template-columns:1fr; }
    .contact-grid { grid-template-columns:1fr; }
    .footer-grid { grid-template-columns:1fr; gap:30px; }
    .about-features { grid-template-columns:1fr; }
    .section-title h2 { font-size:22px; }
    .section-title p { font-size:14px; }
}

@media (max-width:480px) {
    .container { padding:0 15px; }
    .section { padding:40px 0; }
    .section-title { margin-bottom:30px; }
    .section-title h2 { font-size:20px; }
    .services-grid { grid-template-columns:1fr; }
    .about-img { height:220px; font-size:60px; }
    .about-text h2 { font-size:24px; }
    .footer { padding:40px 0 0; }
    .back-top { right:10px; bottom:20px; width:40px; height:40px; font-size:18px; }
    .article-detail .article-content { padding:20px; }
    .article-detail h1 { font-size:22px; }
}