/* ==========================================
 *  Home 单页样式（锚点导航模式）
 * ========================================== */

/* --- 基础重置 --- */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; color: #333; }
a { transition: color 0.3s; text-decoration: none; }

/* ==========================================
 *  导航栏
 * ========================================== */
.navbar { position: fixed; top: 0; left: 0; right: 0; background: rgba(255,255,255,0.97); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); z-index: 999; transition: box-shadow 0.3s; }
.navbar.scrolled { box-shadow: 0 2px 24px rgba(0,0,0,0.09); }
.navbar .nav-container { max-width: 1200px; margin: 0 auto; padding: 0 24px; display: flex; justify-content: space-between; align-items: center; height: 64px; }
.navbar .logo { font-size: 21px; font-weight: 800; background: linear-gradient(135deg, #667eea, #764ba2); -webkit-background-clip: text; -webkit-text-fill-color: transparent; letter-spacing: -0.5px; }
.navbar .nav-links { display: flex; gap: 8px; }
.navbar .nav-links a { color: #555; font-size: 14px; font-weight: 500; padding: 6px 14px; border-radius: 20px; transition: all 0.25s; position: relative; }
.navbar .nav-links a:hover { color: #667eea; background: rgba(102,126,234,0.07); }
.navbar .nav-links a.active { color: #667eea; background: rgba(102,126,234,0.10); font-weight: 600; }
.navbar .nav-actions { display: flex; gap: 8px; align-items: center; }
.navbar .nav-actions .btn { padding: 7px 18px; border-radius: 20px; font-size: 13px; font-weight: 600; transition: all 0.25s; display: inline-block; }
.navbar .nav-actions .btn-primary { background: linear-gradient(135deg, #667eea, #764ba2); color: #fff; }
.navbar .nav-actions .btn-primary:hover { box-shadow: 0 4px 14px rgba(102,126,234,0.35); transform: translateY(-1px); }
.navbar .nav-actions .btn-secondary { border: 1.5px solid #667eea; color: #667eea; }
.navbar .nav-actions .btn-secondary:hover { background: rgba(102,126,234,0.06); }
.navbar .nav-toggle { display: none; background: none; border: none; font-size: 22px; cursor: pointer; color: #333; padding: 4px; }
.page-content { padding-top: 64px; }

/* ==========================================
 *  Hero 区域
 * ========================================== */
.hero { padding: 140px 24px 100px; background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%); text-align: center; position: relative; overflow: hidden; }
.hero::before { content: ''; position: absolute; inset: -50%; width: 200%; height: 200%; background: radial-gradient(circle, rgba(255,255,255,0.07) 0%, transparent 50%); animation: heroRotate 40s linear infinite; }
@keyframes heroRotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
.hero .particles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.hero .particles span { position: absolute; border-radius: 50%; background: rgba(255,255,255,0.08); animation: particleFloat linear infinite; }
.hero .particles span:nth-child(1) { width: 40px; height: 40px; left: 8%; top: 18%; animation-duration: 20s; }
.hero .particles span:nth-child(2) { width: 16px; height: 16px; left: 72%; top: 55%; animation-duration: 24s; animation-delay: -4s; }
.hero .particles span:nth-child(3) { width: 28px; height: 28px; left: 28%; top: 68%; animation-duration: 17s; animation-delay: -7s; }
.hero .particles span:nth-child(4) { width: 55px; height: 55px; left: 78%; top: 12%; animation-duration: 28s; animation-delay: -10s; }
.hero .particles span:nth-child(5) { width: 20px; height: 20px; left: 48%; top: 38%; animation-duration: 22s; animation-delay: -3s; }
.hero .particles span:nth-child(6) { width: 35px; height: 35px; left: 18%; top: 48%; animation-duration: 26s; animation-delay: -12s; }
@keyframes particleFloat { 0%,100% { transform: translateY(0) scale(1); opacity: 0.5; } 50% { transform: translateY(-60px) scale(1.1); opacity: 0.2; } }

.hero-inner { max-width: 820px; margin: 0 auto; position: relative; z-index: 1; }
.hero h1 { font-size: 48px; color: #fff; font-weight: 800; line-height: 1.25; margin-bottom: 20px; letter-spacing: -1px; }
.hero h1 .gradient-text { background: linear-gradient(90deg, #fff 20%, #ffd6ff 50%, #fff 80%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-size: 200% auto; animation: shineText 5s ease-in-out infinite; }
@keyframes shineText { 0%,100% { background-position: 0% center; } 50% { background-position: 200% center; } }
.hero .hero-sub { font-size: 18px; color: rgba(255,255,255,0.88); line-height: 1.8; margin-bottom: 40px; max-width: 620px; margin-left: auto; margin-right: auto; }
.hero-actions { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; }
.hero-actions .btn { padding: 14px 36px; border-radius: 28px; font-size: 15px; font-weight: 600; transition: all 0.3s; }
.hero-actions .btn-white { background: #fff; color: #667eea; box-shadow: 0 4px 18px rgba(0,0,0,0.10); }
.hero-actions .btn-white:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(0,0,0,0.16); }
.hero-actions .btn-outline { border: 2px solid rgba(255,255,255,0.45); color: #fff; }
.hero-actions .btn-outline:hover { background: rgba(255,255,255,0.10); border-color: rgba(255,255,255,0.75); }

/* ==========================================
 *  数据统计条
 * ========================================== */
.stats-bar { position: relative; z-index: 2; margin-top: -48px; }
.stats-bar-inner { max-width: 900px; margin: 0 auto; background: #fff; border-radius: 18px; box-shadow: 0 12px 48px rgba(0,0,0,0.10); display: grid; grid-template-columns: repeat(4,1fr); padding: 36px 16px; }
.stat-item { text-align: center; position: relative; }
.stat-item:not(:last-child)::after { content: ''; position: absolute; right: 0; top: 15%; height: 70%; width: 1px; background: #eee; }
.stat-number { font-size: 34px; font-weight: 800; background: linear-gradient(135deg, #667eea, #764ba2); -webkit-background-clip: text; -webkit-text-fill-color: transparent; line-height: 1; margin-bottom: 6px; }
.stat-label { font-size: 13px; color: #999; }

/* ==========================================
 *  公共区块头
 * ========================================== */
.section { padding: 90px 24px; }
.section-alt { background: #f8fafc; }
.section-inner { max-width: 1180px; margin: 0 auto; }
.section-head { text-align: center; margin-bottom: 56px; }
.section-head .tag { display: inline-block; padding: 5px 16px; background: linear-gradient(135deg, rgba(102,126,234,0.09), rgba(118,75,162,0.09)); color: #667eea; font-size: 12px; font-weight: 700; letter-spacing: 1.5px; border-radius: 20px; margin-bottom: 14px; text-transform: uppercase; }
.section-head h2 { font-size: 32px; font-weight: 700; color: #222; margin-bottom: 14px; letter-spacing: -0.5px; }
.section-head p { font-size: 16px; color: #888; max-width: 540px; margin: 0 auto; line-height: 1.7; }

/* ==========================================
 *  产品能力（Features）
 * ========================================== */
.features-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.feature-card { background: #fff; padding: 36px 28px; border-radius: 16px; border: 1px solid #f0f0f5; transition: all 0.35s; }
.feature-card:hover { transform: translateY(-6px); box-shadow: 0 16px 40px rgba(102,126,234,0.11); border-color: rgba(102,126,234,0.20); }
.feature-card .icon { width: 56px; height: 56px; border-radius: 14px; display: flex; align-items: center; justify-content: center; margin-bottom: 20px; }
.feature-card .icon i { font-size: 26px; color: #fff; }
.feature-card .icon.c1 { background: linear-gradient(135deg, #667eea, #764ba2); }
.feature-card .icon.c2 { background: linear-gradient(135deg, #43e97b, #38f9d7); }
.feature-card .icon.c3 { background: linear-gradient(135deg, #f093fb, #f5576c); }
.feature-card .icon.c4 { background: linear-gradient(135deg, #f6d365, #fda085); }
.feature-card .icon.c5 { background: linear-gradient(135deg, #4facfe, #00f2fe); }
.feature-card .icon.c6 { background: linear-gradient(135deg, #fa709a, #fee140); }
.feature-card h3 { font-size: 17px; font-weight: 600; color: #222; margin-bottom: 10px; }
.feature-card p { font-size: 14px; color: #888; line-height: 1.7; }

/* ==========================================
 *  应用插件（Plugins）
 * ========================================== */
.plugins-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.plugin-card { background: #fff; border-radius: 16px; overflow: hidden; border: 1px solid #f0f0f5; transition: all 0.35s; }
.plugin-card:hover { transform: translateY(-6px); box-shadow: 0 14px 36px rgba(102,126,234,0.11); border-color: rgba(102,126,234,0.20); }
.plugin-card .card-banner { height: 130px; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; }
.plugin-card:nth-child(1) .card-banner { background: linear-gradient(135deg, #667eea, #764ba2); }
.plugin-card:nth-child(2) .card-banner { background: linear-gradient(135deg, #f093fb, #f5576c); }
.plugin-card:nth-child(3) .card-banner { background: linear-gradient(135deg, #43e97b, #38f9d7); }
.plugin-card:nth-child(4) .card-banner { background: linear-gradient(135deg, #4facfe, #00f2fe); }
.plugin-card:nth-child(5) .card-banner { background: linear-gradient(135deg, #fa709a, #fee140); }
.plugin-card:nth-child(6) .card-banner { background: linear-gradient(135deg, #f6d365, #fda085); }
.plugin-card .card-banner i { font-size: 48px; color: #fff; }
.plugin-card .card-banner img { max-width: 60%; max-height: 70%; object-fit: contain; }
.plugin-card .card-body { padding: 22px; }
.plugin-card .card-body h4 { font-size: 16px; font-weight: 600; color: #222; margin-bottom: 8px; }
.plugin-card .card-body p { font-size: 13px; color: #999; margin-bottom: 16px; line-height: 1.6; min-height: 40px; }
.plugin-card .card-footer { display: flex; justify-content: space-between; align-items: center; }
.plugin-card .card-footer .badge { font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 10px; }
.plugin-card .card-footer .badge-free { background: rgba(7,193,96,0.1); color: #07c160; }
.plugin-card .card-footer .badge-paid { background: rgba(102,126,234,0.1); color: #667eea; }
.plugins-empty { text-align: center; padding: 60px 20px; color: #bbb; }
.plugins-empty i { font-size: 48px; display: block; margin-bottom: 14px; }

/* ==========================================
 *  代理合作（Agent）
 * ========================================== */
.agent-section { background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%); color: #fff; }
.agent-section .section-head h2 { color: #fff; }
.agent-section .section-head p { color: rgba(255,255,255,0.6); }
.agent-section .section-head .tag { background: rgba(102,126,234,0.2); color: #a5b4fc; }
.agent-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 22px; }
.agent-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08); border-radius: 16px; padding: 32px 24px; text-align: center; transition: all 0.35s; }
.agent-card:hover { background: rgba(255,255,255,0.09); transform: translateY(-5px); border-color: rgba(102,126,234,0.4); }
.agent-card .icon { width: 56px; height: 56px; margin: 0 auto 18px; border-radius: 14px; background: linear-gradient(135deg, #667eea, #764ba2); display: flex; align-items: center; justify-content: center; }
.agent-card .icon i { font-size: 26px; color: #fff; }
.agent-card h4 { font-size: 16px; font-weight: 600; margin-bottom: 10px; color: #fff; }
.agent-card p { font-size: 13px; color: rgba(255,255,255,0.55); line-height: 1.7; }
.agent-cta { text-align: center; margin-top: 48px; }
.agent-cta .btn { padding: 13px 36px; border-radius: 26px; font-size: 15px; font-weight: 600; transition: all 0.3s; }
.agent-cta .btn-gradient { background: linear-gradient(135deg, #667eea, #764ba2); color: #fff; box-shadow: 0 4px 20px rgba(102,126,234,0.3); }
.agent-cta .btn-gradient:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(102,126,234,0.45); }

/* ==========================================
 *  套餐方案（Pricing）
 * ========================================== */
.pricing-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; align-items: start; max-width: 1000px; margin: 0 auto; }
.price-card { background: #fff; border: 2px solid #f0f0f5; border-radius: 20px; overflow: hidden; transition: all 0.35s; position: relative; }
.price-card.featured { border-color: #667eea; transform: scale(1.04); box-shadow: 0 16px 48px rgba(102,126,234,0.14); }
.price-card:hover { box-shadow: 0 14px 40px rgba(0,0,0,0.09); transform: translateY(-5px); }
.price-card.featured:hover { transform: scale(1.04) translateY(-5px); }
.price-card .card-head { padding: 32px 28px 24px; text-align: center; }
.price-card .card-head .recommend { display: inline-block; padding: 4px 16px; background: linear-gradient(135deg, #667eea, #764ba2); color: #fff; font-size: 12px; font-weight: 700; border-radius: 20px; margin-bottom: 14px; }
.price-card .card-head h3 { font-size: 20px; font-weight: 700; color: #222; margin-bottom: 10px; }
.price-card .card-head .price { font-size: 42px; font-weight: 800; background: linear-gradient(135deg, #667eea, #764ba2); -webkit-background-clip: text; -webkit-text-fill-color: transparent; line-height: 1; }
.price-card .card-head .price-desc { color: #bbb; font-size: 13px; margin-top: 6px; }
.price-card .card-head .price-original { color: #ccc; font-size: 13px; margin-top: 4px; text-decoration: line-through; }
.price-card .card-list { padding: 0 28px 24px; }
.price-card .card-list ul { list-style: none; }
.price-card .card-list li { padding: 11px 0; border-bottom: 1px solid #f7f7f7; display: flex; align-items: center; gap: 9px; font-size: 14px; color: #555; }
.price-card .card-list li:last-child { border-bottom: none; }
.price-card .card-list li i { color: #07c160; font-size: 16px; flex-shrink: 0; }
.price-card .card-action { padding: 0 28px 32px; }
.price-card .card-action .btn { display: block; width: 100%; padding: 13px; border-radius: 12px; text-align: center; font-weight: 600; font-size: 15px; transition: all 0.3s; }
.price-card .card-action .btn-gradient { background: linear-gradient(135deg, #667eea, #764ba2); color: #fff; }
.price-card .card-action .btn-gradient:hover { box-shadow: 0 6px 20px rgba(102,126,234,0.35); transform: translateY(-2px); }
.price-card .card-action .btn-outline { border: 2px solid #667eea; color: #667eea; }
.price-card .card-action .btn-outline:hover { background: rgba(102,126,234,0.05); }

/* ==========================================
 *  联系我们（Contact）
 * ========================================== */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; }
.contact-info h3 { font-size: 24px; font-weight: 700; color: #222; margin-bottom: 28px; }
.contact-item { display: flex; gap: 18px; margin-bottom: 26px; align-items: flex-start; }
.contact-item .icon { width: 46px; height: 46px; background: linear-gradient(135deg, #667eea, #764ba2); border-radius: 12px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.contact-item .icon i { font-size: 22px; color: #fff; }
.contact-item .text h4 { font-size: 15px; font-weight: 600; color: #222; margin-bottom: 4px; }
.contact-item .text p { font-size: 14px; color: #888; }
.contact-form h3 { font-size: 24px; font-weight: 700; color: #222; margin-bottom: 28px; }
.contact-form .form-group { margin-bottom: 18px; }
.contact-form .form-group label { display: block; font-size: 14px; color: #444; margin-bottom: 7px; font-weight: 500; }
.contact-form .form-group input,
.contact-form .form-group textarea { width: 100%; padding: 11px 14px; border: 1px solid #e5e5e5; border-radius: 10px; font-size: 14px; outline: none; transition: border-color 0.3s, box-shadow 0.3s; font-family: inherit; }
.contact-form .form-group textarea { min-height: 100px; resize: vertical; }
.contact-form .form-group input:focus,
.contact-form .form-group textarea:focus { border-color: #667eea; box-shadow: 0 0 0 3px rgba(102,126,234,0.10); }
.contact-form .btn-submit { padding: 12px 38px; background: linear-gradient(135deg, #667eea, #764ba2); color: #fff; border: none; border-radius: 10px; font-size: 15px; font-weight: 600; cursor: pointer; transition: all 0.3s; }
.contact-form .btn-submit:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(102,126,234,0.35); }

/* ==========================================
 *  CTA 行动召唤条
 * ========================================== */
.cta-banner { padding: 90px 24px; background: linear-gradient(135deg, #667eea, #764ba2 60%, #f093fb); text-align: center; position: relative; overflow: hidden; }
.cta-banner::before { content: ''; position: absolute; top: -40%; right: -15%; width: 500px; height: 500px; background: rgba(255,255,255,0.05); border-radius: 50%; }
.cta-banner::after { content: ''; position: absolute; bottom: -25%; left: -8%; width: 380px; height: 380px; background: rgba(255,255,255,0.04); border-radius: 50%; }
.cta-inner { max-width: 680px; margin: 0 auto; position: relative; z-index: 1; }
.cta-banner h2 { font-size: 32px; font-weight: 700; color: #fff; margin-bottom: 16px; }
.cta-banner p { font-size: 16px; color: rgba(255,255,255,0.82); margin-bottom: 36px; line-height: 1.7; }
.cta-actions { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; }
.cta-actions .btn { padding: 14px 36px; border-radius: 28px; font-size: 15px; font-weight: 600; transition: all 0.3s; }
.cta-actions .btn-white { background: #fff; color: #667eea; box-shadow: 0 4px 18px rgba(0,0,0,0.10); }
.cta-actions .btn-white:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(0,0,0,0.16); }
.cta-actions .btn-ghost { border: 2px solid rgba(255,255,255,0.4); color: #fff; }
.cta-actions .btn-ghost:hover { background: rgba(255,255,255,0.10); border-color: rgba(255,255,255,0.7); }

/* ==========================================
 *  页脚
 * ========================================== */
.footer { background: #111827; padding: 56px 24px 28px; color: #fff; }
.footer-inner { max-width: 1180px; margin: 0 auto; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 40px; margin-bottom: 40px; }
.footer-brand .logo { font-size: 20px; font-weight: 800; background: linear-gradient(135deg, #667eea, #764ba2); -webkit-background-clip: text; -webkit-text-fill-color: transparent; display: inline-block; margin-bottom: 12px; }
.footer-brand p { font-size: 14px; color: rgba(255,255,255,0.45); line-height: 1.7; max-width: 280px; }
.footer-col h5 { font-size: 14px; font-weight: 600; margin-bottom: 18px; color: rgba(255,255,255,0.8); }
.footer-col ul { list-style: none; }
.footer-col li { margin-bottom: 11px; }
.footer-col li a { color: rgba(255,255,255,0.45); font-size: 14px; transition: color 0.3s; }
.footer-col li a:hover { color: #a5b4fc; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,0.07); padding-top: 26px; text-align: center; color: rgba(255,255,255,0.28); font-size: 13px; }

/* ==========================================
 *  回到顶部
 * ========================================== */
.back-to-top { position: fixed; bottom: 28px; right: 28px; width: 44px; height: 44px; background: linear-gradient(135deg, #667eea, #764ba2); color: #fff; border: none; border-radius: 50%; cursor: pointer; box-shadow: 0 4px 16px rgba(102,126,234,0.3); display: flex; align-items: center; justify-content: center; opacity: 0; visibility: hidden; transform: translateY(16px); transition: all 0.3s; z-index: 998; }
.back-to-top i { font-size: 20px; }
.back-to-top.visible { opacity: 1; visibility: visible; transform: translateY(0); }
.back-to-top:hover { transform: translateY(-3px); box-shadow: 0 6px 24px rgba(102,126,234,0.5); }

/* ==========================================
 *  滚动渐入动画
 * ========================================== */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity 0.6s ease, transform 0.6s ease; }
.reveal.visible { opacity: 1; transform: translateY(0); }
.reveal:nth-child(2) { transition-delay: 0.08s; }
.reveal:nth-child(3) { transition-delay: 0.16s; }
.reveal:nth-child(4) { transition-delay: 0.24s; }
.reveal:nth-child(5) { transition-delay: 0.12s; }
.reveal:nth-child(6) { transition-delay: 0.20s; }

/* ==========================================
 *  响应式
 * ========================================== */

/* --- 子页 Hero Banner --- */
.page-hero { padding: 120px 24px 80px; background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%); text-align: center; position: relative; overflow: hidden; }
.page-hero::before { content: ''; position: absolute; inset: -50%; width: 200%; height: 200%; background: radial-gradient(circle, rgba(255,255,255,0.07) 0%, transparent 50%); animation: heroRotate 40s linear infinite; }
.page-hero .particles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.page-hero .particles span { position: absolute; border-radius: 50%; background: rgba(255,255,255,0.08); animation: particleFloat linear infinite; }
.page-hero .particles span:nth-child(1) { width: 40px; height: 40px; left: 8%; top: 18%; animation-duration: 20s; }
.page-hero .particles span:nth-child(2) { width: 16px; height: 16px; left: 72%; top: 55%; animation-duration: 24s; animation-delay: -4s; }
.page-hero .particles span:nth-child(3) { width: 28px; height: 28px; left: 28%; top: 68%; animation-duration: 17s; animation-delay: -7s; }
.page-hero .particles span:nth-child(4) { width: 55px; height: 55px; left: 78%; top: 12%; animation-duration: 28s; animation-delay: -10s; }
.page-hero .particles span:nth-child(5) { width: 20px; height: 20px; left: 48%; top: 38%; animation-duration: 22s; animation-delay: -3s; }
.page-hero .particles span:nth-child(6) { width: 35px; height: 35px; left: 18%; top: 48%; animation-duration: 26s; animation-delay: -12s; }
.page-hero-inner { max-width: 760px; margin: 0 auto; position: relative; z-index: 1; }
.page-hero h1 { font-size: 42px; color: #fff; font-weight: 800; margin-bottom: 16px; letter-spacing: -1px; }
.page-hero h1 .gradient-text { background: linear-gradient(90deg, #fff 20%, #ffd6ff 50%, #fff 80%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-size: 200% auto; animation: shineText 5s ease-in-out infinite; }
.page-hero .hero-sub { font-size: 17px; color: rgba(255,255,255,0.88); line-height: 1.7; margin-bottom: 28px; }
.hero-stats { display: flex; justify-content: center; align-items: center; gap: 12px; flex-wrap: wrap; }
.hero-stat { font-size: 15px; color: rgba(255,255,255,0.8); }
.hero-stat strong { font-weight: 700; color: #fff; }
.hero-stat-sep { color: rgba(255,255,255,0.35); font-size: 13px; }

/* --- 插件列表页 --- */
.plugins-list-grid { display: flex; flex-direction: column; gap: 16px; }
.plugin-list-card { display: flex; gap: 22px; padding: 22px 26px; background: #fff; border: 1px solid #f0f0f5; border-radius: 16px; transition: all 0.3s; align-items: center; color: inherit; }
.plugin-list-card:hover { transform: translateY(-3px); box-shadow: 0 12px 36px rgba(102,126,234,0.12); border-color: rgba(102,126,234,0.25); }
.plc-icon-wrap { width: 72px; height: 72px; border-radius: 18px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.plc-icon-wrap i { font-size: 32px; color: #fff; }
.plc-icon-wrap img { max-width: 60%; max-height: 60%; object-fit: contain; }
.plc-info { flex: 1; min-width: 0; }
.plc-title-row { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; flex-wrap: wrap; }
.plc-title-row h3 { font-size: 17px; font-weight: 600; color: #222; margin: 0; }
.plc-version { font-size: 12px; color: #999; background: #f5f5f7; padding: 2px 8px; border-radius: 8px; }
.plc-badge { font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 10px; margin-left: auto; }
.plc-badge-free { background: rgba(7,193,96,0.1); color: #07c160; }
.plc-badge-paid { background: rgba(102,126,234,0.1); color: #667eea; }
.plc-desc { font-size: 14px; color: #888; line-height: 1.6; margin-bottom: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.plc-meta { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #bbb; }
.plc-author { display: flex; align-items: center; gap: 4px; }
.plc-author i { font-size: 14px; }
.plc-action-hint { margin-left: auto; color: #667eea; font-weight: 500; display: flex; align-items: center; gap: 3px; }
.plc-action-hint i { font-size: 13px; }

/* --- 面包屑 --- */
.pd-breadcrumb { padding: 14px 0; background: #fff; border-bottom: 1px solid #f0f0f5; }
.pd-breadcrumb .pd-container { max-width: 1180px; margin: 0 auto; padding: 0 48px; display: flex; align-items: center; gap: 6px; font-size: 13px; }
.pd-breadcrumb a { color: #667eea; transition: opacity 0.2s; display: flex; align-items: center; }
.pd-breadcrumb a:hover { opacity: 0.75; }
.pd-bc-sep { color: #ccc; display: flex; align-items: center; }
.pd-bc-current { color: #888; }

/* --- 插件详情深色 Hero --- */
.pd-hero { position: relative; padding: 56px 0 52px; background: linear-gradient(135deg, #0f0c29 0%, #302b63 50%, #24243e 100%); overflow: hidden; }
.pd-hero-bg { position: absolute; inset: 0; background: radial-gradient(ellipse at 30% 50%, rgba(102,126,234,0.15) 0%, transparent 60%), radial-gradient(ellipse at 80% 20%, rgba(240,147,251,0.1) 0%, transparent 50%); pointer-events: none; }
.pd-hero-bg::before { content:''; position:absolute; top:-40%; right:-10%; width:500px; height:500px; background:rgba(102,126,234,0.08); border-radius:50%; }
.pd-hero-bg::after  { content:''; position:absolute; bottom:-30%; left:-5%; width:380px; height:380px; background:rgba(240,147,251,0.06); border-radius:50%; }
.pd-hero-inner { position: relative; z-index: 1; }
.pd-hero-main { display: flex; justify-content: space-between; align-items: center; gap: 40px; }
.pd-hero-left { display: flex; gap: 28px; align-items: flex-start; flex: 1; min-width: 0; }
.pd-hero-icon { width: 88px; height: 88px; border-radius: 20px; background: rgba(255,255,255,0.12); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,0.15); display: flex; align-items: center; justify-content: center; flex-shrink: 0; box-shadow: 0 8px 32px rgba(0,0,0,0.2); }
.pd-hero-icon i { font-size: 40px; color: #fff; }
.pd-hero-icon img { max-width: 60%; max-height: 60%; object-fit: contain; }
.pd-hero-info { flex: 1; min-width: 0; }
.pd-hero-info h1 { font-size: 30px; font-weight: 800; color: #fff; margin-bottom: 12px; letter-spacing: -0.5px; line-height: 1.2; }
.pd-hero-tags { display: flex; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.pd-tag { display: inline-flex; align-items: center; gap: 4px; padding: 4px 12px; border-radius: 20px; font-size: 12px; font-weight: 600; }
.pd-tag i { font-size: 13px; }
.pd-tag-version { background: rgba(102,126,234,0.2); color: #a5b4fc; }
.pd-tag-status { background: rgba(7,193,96,0.15); color: #6ee7b7; }
.pd-tag-free { background: rgba(251,191,36,0.2); color: #fcd34d; }
.pd-hero-desc { font-size: 15px; color: rgba(255,255,255,0.65); line-height: 1.7; margin-bottom: 16px; }
.pd-hero-meta { display: flex; gap: 18px; font-size: 13px; color: rgba(255,255,255,0.4); flex-wrap: wrap; }
.pd-hero-meta span { display: flex; align-items: center; gap: 5px; }
.pd-hero-meta i { font-size: 14px; }

/* Hero 右侧价格卡 */
.pd-hero-right { flex-shrink: 0; }
.pd-price-card { background: rgba(255,255,255,0.08); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border: 1px solid rgba(255,255,255,0.12); border-radius: 20px; padding: 28px 32px; text-align: center; min-width: 220px; }
.pd-price-free { margin-bottom: 18px; }
.pd-price-free .pd-price-amount { display: block; font-size: 36px; font-weight: 800; color: #6ee7b7; line-height: 1; margin-bottom: 6px; }
.pd-price-free .pd-price-hint { font-size: 13px; color: rgba(255,255,255,0.5); }
.pd-price-paid { display: flex; align-items: baseline; justify-content: center; gap: 2px; margin-bottom: 4px; }
.pd-price-paid .pd-price-currency { font-size: 20px; font-weight: 700; color: #a5b4fc; }
.pd-price-paid .pd-price-amount { font-size: 44px; font-weight: 800; color: #fff; line-height: 1; }
.pd-price-paid .pd-price-unit { font-size: 15px; color: rgba(255,255,255,0.5); margin-left: 4px; }
.pd-price-renew { font-size: 13px; color: rgba(255,255,255,0.4); margin-bottom: 18px; }
.pd-btn-primary { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 13px 32px; background: linear-gradient(135deg, #667eea, #764ba2); color: #fff; border-radius: 12px; font-size: 15px; font-weight: 600; transition: all 0.3s; box-shadow: 0 4px 20px rgba(102,126,234,0.35); width: 100%; }
.pd-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 8px 30px rgba(102,126,234,0.5); color: #fff; }
.pd-btn-primary i { font-size: 16px; }

/* --- 插件详情主体 --- */
.pd-body { padding: 56px 0 80px; background: #f7f8fc; }
.pd-container { max-width: 1180px; margin: 0 auto; padding: 0 48px; }
.pd-body-grid { display: grid; grid-template-columns: 1fr 320px; gap: 36px; align-items: start; }

/* 通用区块 */
.pd-section { background: #fff; border-radius: 16px; padding: 36px 32px; margin-bottom: 24px; border: 1px solid #eef0f5; }
.pd-section:last-child { margin-bottom: 0; }
.pd-section-head { margin-bottom: 24px; }
.pd-section-tag { display: inline-block; padding: 4px 14px; background: linear-gradient(135deg, rgba(102,126,234,0.08), rgba(118,75,162,0.08)); color: #667eea; font-size: 11px; font-weight: 700; letter-spacing: 1.5px; border-radius: 20px; margin-bottom: 10px; text-transform: uppercase; }
.pd-section-head h2 { font-size: 22px; font-weight: 700; color: #1a1a2e; margin-bottom: 4px; letter-spacing: -0.3px; }
.pd-section-sub { font-size: 14px; color: #aaa; margin-top: 4px; }

/* 功能亮点 */
.pd-features { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.pd-feature-card { display: flex; gap: 14px; padding: 18px; border-radius: 12px; border: 1px solid #f0f0f5; transition: all 0.25s; }
.pd-feature-card:hover { border-color: rgba(102,126,234,0.25); box-shadow: 0 4px 18px rgba(102,126,234,0.07); transform: translateY(-2px); }
.pd-feature-icon { width: 36px; height: 36px; border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.pd-feature-icon i { font-size: 18px; color: #fff; }
.pd-feature-c0 .pd-feature-icon { background: linear-gradient(135deg, #667eea, #764ba2); }
.pd-feature-c1 .pd-feature-icon { background: linear-gradient(135deg, #43e97b, #38f9d7); }
.pd-feature-c2 .pd-feature-icon { background: linear-gradient(135deg, #f093fb, #f5576c); }
.pd-feature-c3 .pd-feature-icon { background: linear-gradient(135deg, #4facfe, #00f2fe); }
.pd-feature-body h4 { font-size: 15px; font-weight: 600; color: #222; margin-bottom: 6px; }
.pd-feature-subs { display: flex; flex-wrap: wrap; gap: 4px; }
.pd-feature-subs span { font-size: 11px; color: #667eea; background: rgba(102,126,234,0.06); padding: 2px 8px; border-radius: 6px; }

/* 应用介绍 */
.pd-about p { font-size: 15px; color: #555; line-height: 1.85; margin-bottom: 28px; }
.pd-highlights { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.pd-highlight-item { text-align: center; padding: 24px 16px; border-radius: 14px; background: #f8f9fd; border: 1px solid #eef0f5; transition: all 0.3s; }
.pd-highlight-item:hover { transform: translateY(-4px); box-shadow: 0 8px 28px rgba(102,126,234,0.09); border-color: rgba(102,126,234,0.18); }
.pd-highlight-icon { width: 52px; height: 52px; border-radius: 14px; display: flex; align-items: center; justify-content: center; margin: 0 auto 14px; }
.pd-highlight-icon i { font-size: 24px; color: #fff; }
.pd-hl-blue  { background: linear-gradient(135deg, #667eea, #764ba2); }
.pd-hl-green { background: linear-gradient(135deg, #43e97b, #38f9d7); }
.pd-hl-purple { background: linear-gradient(135deg, #a78bfa, #7c3aed); }
.pd-hl-orange { background: linear-gradient(135deg, #f6d365, #fda085); }
.pd-highlight-item h4 { font-size: 15px; font-weight: 600; color: #222; margin-bottom: 6px; }
.pd-highlight-item p { font-size: 12px; color: #999; line-height: 1.6; margin: 0; }

/* 应用场景 */
.pd-scenarios { display: flex; flex-direction: column; gap: 12px; }
.pd-scenario-item { display: flex; align-items: center; gap: 20px; padding: 22px 24px; border-radius: 14px; border: 1px solid #f0f0f5; transition: all 0.25s; }
.pd-scenario-item:hover { border-color: rgba(102,126,234,0.25); box-shadow: 0 4px 18px rgba(102,126,234,0.07); transform: translateX(4px); }
.pd-scenario-num { font-size: 28px; font-weight: 800; background: linear-gradient(135deg, #667eea, #764ba2); -webkit-background-clip: text; -webkit-text-fill-color: transparent; flex-shrink: 0; width: 42px; text-align: center; line-height: 1; }
.pd-scenario-body { flex: 1; min-width: 0; }
.pd-scenario-body h4 { font-size: 15px; font-weight: 600; color: #222; margin-bottom: 4px; }
.pd-scenario-body p { font-size: 13px; color: #888; line-height: 1.6; margin: 0; }
.pd-scenario-icon { width: 44px; height: 44px; border-radius: 12px; background: linear-gradient(135deg, #667eea, #764ba2); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.pd-scenario-icon i { font-size: 22px; color: #fff; }

/* 套餐小卡片 */
.pd-pkgs { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.pd-pkg-card { background: #fff; border: 1.5px solid #eef0f5; border-radius: 16px; padding: 24px; transition: all 0.3s; }
.pd-pkg-card:hover { border-color: rgba(102,126,234,0.3); box-shadow: 0 8px 28px rgba(102,126,234,0.1); transform: translateY(-3px); }
.pd-pkg-head { margin-bottom: 16px; }
.pd-pkg-head h4 { font-size: 16px; font-weight: 700; color: #222; margin-bottom: 8px; }
.pd-pkg-price { display: flex; align-items: baseline; gap: 3px; }
.pd-pkg-free { font-size: 22px; font-weight: 800; color: #07c160; }
.pd-pkg-amount { font-size: 26px; font-weight: 800; background: linear-gradient(135deg, #667eea, #764ba2); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.pd-pkg-price small { font-size: 13px; color: #999; }
.pd-pkg-tagline { font-size: 12px; color: #bbb; margin-top: 6px; }
.pd-pkg-divider { height: 1px; background: #f0f0f5; margin-bottom: 14px; }
.pd-pkg-features { list-style: none; margin-bottom: 18px; }
.pd-pkg-features li { font-size: 13px; color: #666; padding: 7px 0; display: flex; align-items: center; gap: 7px; }
.pd-pkg-features li i { color: #07c160; font-size: 14px; }
.pd-pkg-btn { display: block; text-align: center; padding: 11px; background: linear-gradient(135deg, #667eea, #764ba2); color: #fff; border-radius: 10px; font-size: 14px; font-weight: 600; transition: all 0.3s; }
.pd-pkg-btn:hover { opacity: 0.92; transform: translateY(-1px); color: #fff; }

/* --- 侧边栏 --- */
.pd-side { position: sticky; top: 84px; }
.pd-card { background: #fff; border: 1px solid #eef0f5; border-radius: 16px; padding: 24px; margin-bottom: 20px; transition: all 0.3s; }
.pd-card:hover { box-shadow: 0 6px 24px rgba(102,126,234,0.07); }
.pd-card h3 { font-size: 16px; font-weight: 600; color: #222; margin-bottom: 18px; display: flex; align-items: center; }

/* 信息列表 */
.pd-info-list { display: flex; flex-direction: column; }
.pd-info-row { display: flex; justify-content: space-between; align-items: center; padding: 11px 0; border-bottom: 1px solid #f7f8fa; font-size: 14px; }
.pd-info-row:last-child { border-bottom: none; }
.pd-info-row span { color: #aaa; }
.pd-info-row b { color: #333; font-weight: 500; }
.pd-text-free { color: #07c160; font-weight: 600; font-style: normal; }
.pd-text-paid { color: #667eea; font-weight: 600; font-style: normal; }

/* CTA 卡片 */
.pd-cta-card { text-align: center; background: linear-gradient(160deg, #f8f9fd 0%, #eef2ff 100%); }
.pd-cta-icon-wrap { display: flex; justify-content: center; margin-bottom: 16px; }
.pd-cta-icon { width: 64px; height: 64px; border-radius: 18px; background: linear-gradient(135deg, #667eea, #764ba2); display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 24px rgba(102,126,234,0.2); }
.pd-cta-icon i { font-size: 28px; color: #fff; }
.pd-cta-card h3 { justify-content: center; margin-bottom: 8px; }
.pd-cta-card p { font-size: 13px; color: #888; line-height: 1.6; margin-bottom: 20px; }
.pd-btn-block { display: flex; width: 100%; margin-bottom: 16px; }
.pd-cta-tips { display: flex; flex-direction: column; gap: 7px; }
.pd-cta-tips span { font-size: 13px; color: #07c160; display: flex; align-items: center; justify-content: center; gap: 5px; }
.pd-cta-tips i { font-size: 14px; }

/* 推荐卡片 */
.pd-recommend-list { display: flex; flex-direction: column; gap: 6px; }
.pd-recommend-item { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 12px; transition: all 0.2s; color: inherit; }
.pd-recommend-item:hover { background: #f7f8fc; transform: translateX(3px); }
.pd-ri-icon { width: 38px; height: 38px; border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.pd-ri-icon i { font-size: 18px; color: #fff; }
.pd-ri-c0 { background: linear-gradient(135deg, #667eea, #764ba2); }
.pd-ri-c1 { background: linear-gradient(135deg, #f093fb, #f5576c); }
.pd-ri-c2 { background: linear-gradient(135deg, #43e97b, #38f9d7); }
.pd-ri-c3 { background: linear-gradient(135deg, #4facfe, #00f2fe); }
.pd-ri-info { flex: 1; min-width: 0; }
.pd-ri-info h4 { font-size: 14px; font-weight: 600; color: #222; margin-bottom: 2px; }
.pd-ri-info span { font-size: 12px; color: #667eea; font-weight: 500; }
.pd-ri-arrow { font-size: 14px; color: #ccc; flex-shrink: 0; }
.pd-recommend-item:hover .pd-ri-arrow { color: #667eea; }

/* --- 底部 CTA --- */
.pd-bottom-cta { background: linear-gradient(135deg, #0f0c29, #302b63, #24243e); padding: 72px 0; position: relative; overflow: hidden; }
.pd-bottom-cta::before { content:''; position:absolute; top:-30%; right:-8%; width:400px; height:400px; background:rgba(102,126,234,0.1); border-radius:50%; }
.pd-bottom-cta-inner { display: flex; justify-content: space-between; align-items: center; position: relative; z-index: 1; }
.pd-bottom-cta-text h2 { font-size: 28px; font-weight: 700; color: #fff; margin-bottom: 8px; }
.pd-bottom-cta-text p { font-size: 15px; color: rgba(255,255,255,0.6); }
.pd-bottom-cta-actions { display: flex; gap: 14px; flex-shrink: 0; }
.pd-btn-white { display: inline-block; padding: 13px 32px; background: #fff; color: #667eea; border-radius: 12px; font-size: 15px; font-weight: 600; transition: all 0.3s; box-shadow: 0 4px 16px rgba(0,0,0,0.1); }
.pd-btn-white:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(0,0,0,0.18); color: #667eea; }
.pd-btn-ghost { display: inline-block; padding: 13px 32px; border: 1.5px solid rgba(255,255,255,0.3); color: rgba(255,255,255,0.8); border-radius: 12px; font-size: 15px; font-weight: 600; transition: all 0.3s; }
.pd-btn-ghost:hover { background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.5); color: #fff; }

@media (max-width: 992px) {
    .navbar .nav-toggle { display: block; }
    .navbar .nav-links { display: none; position: absolute; top: 64px; left: 0; right: 0; background: #fff; flex-direction: column; gap: 0; box-shadow: 0 8px 24px rgba(0,0,0,0.10); }
    .navbar .nav-links.open { display: flex; }
    .navbar .nav-links a { padding: 14px 20px; border-bottom: 1px solid #f5f5f5; border-radius: 0; }
    .navbar .nav-actions { gap: 6px; }
    .navbar .nav-actions .btn { padding: 6px 12px; font-size: 12px; }
    .features-grid { grid-template-columns: repeat(2,1fr); }
    .plugins-grid { grid-template-columns: repeat(2,1fr); }
    .agent-grid { grid-template-columns: repeat(2,1fr); }
    .pricing-grid { grid-template-columns: repeat(2,1fr); }
    .price-card.featured { transform: none; }
    .price-card.featured:hover { transform: translateY(-5px); }
    .stats-bar-inner { grid-template-columns: repeat(2,1fr); gap: 22px; }
    .stat-item:nth-child(2)::after { display: none; }
    .footer-grid { grid-template-columns: 1fr 1fr; }
    .hero h1 { font-size: 36px; }
    .pd-highlights { grid-template-columns: repeat(2,1fr); }
    .pd-body-grid { grid-template-columns: 1fr; gap: 32px; }
    .pd-side { position: static; }
    .pd-hero-main { flex-direction: column; gap: 28px; }
    .pd-hero-right { width: 100%; }
    .pd-price-card { max-width: 360px; }
    .pd-bottom-cta-inner { flex-direction: column; text-align: center; gap: 24px; }
    .page-hero h1 { font-size: 34px; }
}

@media (max-width: 768px) {
    .features-grid { grid-template-columns: 1fr; }
    .plugins-grid { grid-template-columns: 1fr; }
    .agent-grid { grid-template-columns: 1fr; }
    .pricing-grid { grid-template-columns: 1fr; }
    .contact-grid { grid-template-columns: 1fr; }
    .footer-grid { grid-template-columns: 1fr; }
    .hero { padding: 110px 20px 80px; }
    .hero h1 { font-size: 28px; }
    .hero .hero-sub { font-size: 15px; }
    .stats-bar-inner { grid-template-columns: repeat(2,1fr); padding: 28px 14px; }
    .stat-number { font-size: 26px; }
    .stat-item::after { display: none; }
    .section { padding: 60px 20px; }
    .section-head h2 { font-size: 24px; }
    .cta-banner { padding: 60px 20px; }
    .cta-banner h2 { font-size: 24px; }
    .plugins-list-grid { gap: 14px; }
    .plugin-list-card { padding: 16px; }
    .plc-icon-wrap { width: 56px; height: 56px; border-radius: 14px; }
    .plc-icon-wrap i, .plc-icon-wrap img { font-size: 26px; }
    .plc-title-row h3 { font-size: 15px; }
    .page-hero h1 { font-size: 28px; }
    /* 插件详情响应式 */
    .pd-breadcrumb .pd-container { padding: 0 20px; }
    .pd-hero { padding: 40px 0 36px; }
    .pd-container { padding: 0 20px; }
    .pd-hero-left { flex-direction: column; gap: 20px; }
    .pd-hero-icon { width: 72px; height: 72px; border-radius: 16px; }
    .pd-hero-icon i { font-size: 34px; }
    .pd-hero-info h1 { font-size: 24px; }
    .pd-hero-tags { gap: 6px; }
    .pd-body { padding: 32px 0 56px; }
    .pd-body-grid { grid-template-columns: 1fr; gap: 28px; }
    .pd-side { position: static; }
    .pd-section { padding: 24px 20px; border-radius: 14px; }
    .pd-features { grid-template-columns: 1fr; }
    .pd-highlights { grid-template-columns: repeat(2,1fr); }
    .pd-pkgs { grid-template-columns: 1fr; }
    .pd-price-card { max-width: 100%; padding: 22px 24px; }
    .pd-price-paid .pd-price-amount { font-size: 36px; }
    .pd-bottom-cta { padding: 48px 0; }
    .pd-bottom-cta-text h2 { font-size: 22px; }
    .pd-bottom-cta-actions { flex-direction: column; gap: 10px; }
    .pd-btn-white, .pd-btn-ghost { text-align: center; }
    .pd-scenario-item { gap: 14px; padding: 18px 16px; }
    .pd-scenario-num { font-size: 22px; width: 32px; }
}