/* =========================================
   聚合支付平台 - 微信支付绿主题
   ========================================= */
:root{
  --wx-green:#07C160;
  --wx-green-dark:#06AD56;
  --wx-green-deep:#05964B;
  --wx-green-bg:#E8F8EF;
  --wx-blue:#10AEFF;
  --wx-orange:#FF9F0A;
  --wx-purple:#8B5CF6;
  --bg:#F7F8FA;
  --card:#FFFFFF;
  --text:#1A1A1A;
  --text-2:#5F6672;
  --text-3:#8A909C;
  --border:#E5E8EC;
  --radius:14px;
  --radius-sm:10px;
  --shadow:0 4px 20px rgba(0,0,0,0.06);
  --shadow-lg:0 12px 40px rgba(7,193,96,0.18);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;background:var(--bg);color:var(--text);font-size:15px;line-height:1.7;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;}
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 24px;}
.row{display:flex;flex-wrap:wrap;gap:24px;}
.align-center{text-align:center;}
.clearfix{clear:both;}
i.icon{font-style:normal;}

/* ---------- 按钮 ---------- */
.btn{display:inline-block;padding:10px 22px;border-radius:8px;font-size:14px;line-height:1.4;text-align:center;transition:all .2s;cursor:pointer;border:1px solid transparent;}
.btn-primary{background:var(--wx-green);color:#fff;}
.btn-primary:hover{background:var(--wx-green-dark);box-shadow:0 4px 14px rgba(7,193,96,.35);}
.btn-ghost{background:#fff;color:var(--wx-green);border-color:var(--wx-green);}
.btn-ghost:hover{background:var(--wx-green-bg);}
.btn-hero-primary{background:#fff;color:var(--wx-green-deep);font-size:16px;font-weight:600;padding:13px 34px;border-radius:10px;box-shadow:0 6px 20px rgba(0,0,0,.12);}
.btn-hero-primary:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(0,0,0,.16);}
.btn-hero-ghost{background:rgba(255,255,255,.12);color:#fff;font-size:16px;padding:13px 34px;border-radius:10px;border:1px solid rgba(255,255,255,.45);}
.btn-hero-ghost:hover{background:rgba(255,255,255,.22);}
.btn-cta{background:#fff;color:var(--wx-green-deep);font-size:16px;font-weight:600;padding:13px 40px;border-radius:10px;}
.btn-cta:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(0,0,0,.15);}
.btn-cta-ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.5);font-size:16px;padding:13px 40px;border-radius:10px;}
.btn-cta-ghost:hover{background:rgba(255,255,255,.14);}
.button{display:inline-block;padding:10px 24px;border-radius:8px;font-size:14px;background:var(--wx-green);color:#fff;transition:all .2s;}
.button:hover{background:var(--wx-green-dark);}
.button.alt{background:#fff;color:var(--wx-green-deep);box-shadow:0 4px 14px rgba(0,0,0,.1);}
.button.big{font-size:16px;padding:13px 36px;}
.button_box{text-align:center;margin:20px 0;}

/* ---------- 头部导航 ---------- */
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border);}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:64px;}
.logo{display:flex;align-items:center;gap:10px;font-size:20px;font-weight:700;color:var(--text);}
.logo-badge{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--wx-green),var(--wx-green-deep));color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:16px;box-shadow:0 4px 10px rgba(7,193,96,.3);}
.logo-text{letter-spacing:.5px;}
.site-nav{display:flex;gap:6px;}
.site-nav a{padding:8px 14px;border-radius:8px;font-size:14px;color:var(--text-2);transition:all .2s;}
.site-nav a:hover{color:var(--wx-green);background:var(--wx-green-bg);}
.header-actions{display:flex;align-items:center;gap:12px;}
.nav-toggle{display:none;font-size:20px;color:var(--text);padding:8px 10px;}

/* ---------- Hero ---------- */
.hero{background:linear-gradient(135deg,#07C160 0%,#06AD56 45%,#05964B 100%);padding:72px 0 96px;position:relative;overflow:hidden;}
.hero::before{content:"";position:absolute;top:-120px;right:-80px;width:420px;height:420px;border-radius:50%;background:rgba(255,255,255,.08);}
.hero::after{content:"";position:absolute;bottom:-160px;left:-100px;width:380px;height:380px;border-radius:50%;background:rgba(255,255,255,.06);}
.hero-inner{display:flex;align-items:center;gap:48px;position:relative;z-index:2;}
.hero-text{flex:1 1 55%;}
.hero-text h1{color:#fff;font-size:40px;line-height:1.35;font-weight:700;margin-bottom:18px;}
.hero-text h1 em{display:block;font-size:22px;font-weight:500;color:rgba(255,255,255,.85);margin-top:8px;font-style:normal;}
.hero-sub{color:rgba(255,255,255,.92);font-size:16px;max-width:520px;margin-bottom:32px;}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:36px;}
.hero-points{list-style:none;display:flex;flex-direction:column;gap:10px;}
.hero-points li{color:rgba(255,255,255,.9);font-size:14px;}
.hero-points i{color:#fff;margin-right:8px;font-size:15px;}
.hero-visual{flex:1 1 45%;display:flex;justify-content:center;}
.pay-card{width:280px;background:#fff;border-radius:20px;padding:26px 24px 22px;box-shadow:0 24px 60px rgba(0,0,0,.22);text-align:center;transform:rotate(2deg);}
.pay-card-head{display:flex;align-items:center;justify-content:center;gap:8px;font-size:14px;color:var(--text-2);margin-bottom:18px;}
.pay-card-brand{width:28px;height:28px;border-radius:8px;background:var(--wx-green-bg);color:var(--wx-green);display:inline-flex;align-items:center;justify-content:center;font-size:14px;}
.pay-card-qr{width:160px;height:160px;margin:0 auto 18px;border:1px solid var(--border);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:72px;color:var(--wx-green);background:#FAFDFB;}
.pay-card-amount{font-size:34px;font-weight:700;color:var(--text);margin-bottom:8px;}
.pay-card-amount b{font-size:20px;color:var(--text-2);font-weight:500;margin-right:2px;}
.pay-card-status{font-size:14px;color:var(--wx-green);font-weight:600;}
.pay-card-status i{margin-right:4px;}

/* ---------- 数据条 ---------- */
.stats-bar{background:#fff;border-bottom:1px solid var(--border);}
.stats-inner{display:flex;justify-content:space-around;padding:28px 0;gap:16px;flex-wrap:wrap;}
.stat-item{text-align:center;flex:1 1 120px;}
.stat-item b{display:block;font-size:28px;color:var(--wx-green);font-weight:700;line-height:1.3;}
.stat-item span{font-size:13px;color:var(--text-2);}

/* ---------- 区块 ---------- */
.section{padding:72px 0;}
.section-gray{background:#fff;}
.section-title{font-size:30px;font-weight:700;text-align:center;color:var(--text);margin-bottom:10px;}
.section-desc{text-align:center;color:var(--text-2);font-size:15px;margin-bottom:48px;}

/* ---------- 特性卡片 ---------- */
.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px;}
.feature-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:32px 26px;transition:all .25s;}
.feature-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:transparent;}
.feature-icon{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:20px;}
.icon-green{background:var(--wx-green-bg);color:var(--wx-green);}
.icon-blue{background:#EAF6FE;color:var(--wx-blue);}
.icon-orange{background:#FFF4E5;color:var(--wx-orange);}
.icon-purple{background:#F3EEFF;color:var(--wx-purple);}
.feature-card h4{font-size:17px;margin-bottom:10px;}
.feature-card p{font-size:13.5px;color:var(--text-2);line-height:1.8;}

/* ---------- 功能卡片 ---------- */
.func-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;}
.func-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:36px 30px;position:relative;overflow:hidden;transition:all .25s;}
.func-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);}
.func-card::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--wx-green),#4CD58C);}
.func-icon{width:60px;height:60px;border-radius:16px;background:var(--wx-green-bg);color:var(--wx-green);display:flex;align-items:center;justify-content:center;font-size:28px;margin-bottom:22px;}
.func-card h4{font-size:18px;margin-bottom:10px;}
.func-card p{font-size:13.5px;color:var(--text-2);line-height:1.8;margin-bottom:18px;}
.func-tag{display:inline-block;padding:4px 12px;border-radius:20px;background:var(--wx-green-bg);color:var(--wx-green);font-size:12px;font-weight:600;}

/* ---------- 接入流程 ---------- */
.steps{display:flex;align-items:stretch;gap:0;flex-wrap:wrap;}
.step-item{flex:1 1 220px;text-align:center;padding:20px 16px;}
.step-num{width:56px;height:56px;line-height:56px;margin:0 auto 16px;border-radius:50%;background:linear-gradient(135deg,var(--wx-green),var(--wx-green-deep));color:#fff;font-size:18px;font-weight:700;box-shadow:0 8px 20px rgba(7,193,96,.3);}
.step-item h4{font-size:16px;margin-bottom:8px;}
.step-item p{font-size:13px;color:var(--text-2);}
.step-line{flex:0 0 80px;display:flex;align-items:center;justify-content:center;color:var(--border);font-size:22px;}
.step-line::before{content:"›";font-size:28px;color:#CBD5E0;}

/* ---------- CTA ---------- */
.cta{background:linear-gradient(135deg,#07C160,#05964B);padding:72px 0;text-align:center;}
.cta h2{color:#fff;font-size:30px;margin-bottom:12px;}
.cta p{color:rgba(255,255,255,.9);font-size:15px;margin-bottom:36px;}
.cta-inner .btn{margin:0 8px;}

/* ---------- 页脚 ---------- */
.site-footer{background:#17181C;color:#A6ABB4;}
.footer-inner{display:grid;grid-template-columns:2fr 1fr 1fr 1.4fr;gap:40px;padding:56px 0 40px;}
.footer-logo{display:flex;align-items:center;gap:10px;color:#fff;font-size:18px;font-weight:700;margin-bottom:16px;}
.footer-brand p{font-size:13px;color:#8A909C;line-height:1.9;margin-bottom:20px;max-width:280px;}
.footer-qr{width:96px;height:96px;border-radius:10px;background:#26282F;display:flex;align-items:center;justify-content:center;font-size:44px;color:var(--wx-green);}
.footer-col h5{color:#fff;font-size:15px;margin-bottom:18px;}
.footer-col a{display:block;font-size:13.5px;color:#8A909C;margin-bottom:12px;transition:color .2s;}
.footer-col a:hover{color:var(--wx-green);}
.footer-contact{font-size:13.5px;color:#8A909C;margin-bottom:12px;}
.footer-contact i{width:20px;color:var(--wx-green);}
.footer-contact a{display:inline;margin:0;color:#B8BDC6;}
.footer-contact a:hover{color:var(--wx-green);}
.footer-bottom{border-top:1px solid #26282F;padding:18px 0;}
.footer-bottom p{font-size:12.5px;color:#6B7078;text-align:center;}

/* ============ 内容页（关于我们/功能介绍/协议/文档） ============ */
.page-banner,.about_banner{background:linear-gradient(135deg,#07C160,#05964B);padding:56px 0;color:#fff;text-align:center;}
.page-banner h2,.about_banner h2{font-size:28px;margin-bottom:6px;}
.page-banner p,.about_banner p{color:rgba(255,255,255,.85);font-size:14px;}
.content-page{padding:56px 0;}
.content-page .row{justify-content:center;}
.header-body{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:32px;margin-bottom:24px;}
.text-lead{font-size:16px;color:var(--text-2);margin-bottom:16px;}
.col-lg-12{flex:1 1 100%;}
.about_info{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:32px;margin:24px 0;}
.about_img{border-radius:var(--radius);overflow:hidden;margin-bottom:20px;}
.company_info{font-size:14px;color:var(--text-2);line-height:2;}
.intro{font-size:14px;color:var(--text-2);line-height:2;margin-bottom:20px;}
.list{list-style:none;}
.list li{font-size:14px;color:var(--text-2);padding:6px 0;padding-left:20px;position:relative;}
.list li::before{content:"";position:absolute;left:0;top:15px;width:8px;height:8px;border-radius:50%;background:var(--wx-green);}
.circle{width:64px;height:64px;border-radius:50%;background:var(--wx-green-bg);color:var(--wx-green);display:flex;align-items:center;justify-content:center;font-size:26px;margin:0 auto 16px;}
.round_div{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:24px;margin:16px 0;}
.history_main{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:32px;margin:24px 0;}
.history_title{display:flex;align-items:center;gap:12px;margin-bottom:20px;}
.history_title .date{font-size:14px;color:var(--wx-green);font-weight:700;background:var(--wx-green-bg);padding:4px 14px;border-radius:20px;}
.year_div{margin-bottom:20px;}
.year_div .cls{font-size:15px;font-weight:600;margin-bottom:6px;}
.year_div .block_text{font-size:13.5px;color:var(--text-2);line-height:1.9;}
.cls.highlight{color:var(--wx-green);}
.contact_block{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px;margin-top:32px;}
.contact_text{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:28px 24px;text-align:center;}
.contact_text p{font-size:13.5px;color:var(--text-2);margin-top:8px;}
.contact_text a{color:var(--wx-green);}
.weixin_box{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:20px;text-align:center;}
.weixin_box p{font-size:13px;color:var(--text-2);margin-top:10px;}
.weixin_box img{border-radius:8px;}
.api_doc{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:40px;margin:32px 0;}
.api_doc h3{font-size:18px;margin:28px 0 14px;color:var(--text);}
.api_doc h3:first-child{margin-top:0;}
.api_doc p{font-size:14px;color:var(--text-2);line-height:1.9;margin-bottom:12px;}
.api_doc_bar{background:var(--wx-green-bg);border-left:4px solid var(--wx-green);padding:14px 20px;border-radius:0 8px 8px 0;font-size:13.5px;color:var(--text);margin:16px 0;}
.api_block{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:28px;margin:20px 0;transition:all .25s;}
.api_block:hover{box-shadow:var(--shadow);transform:translateY(-2px);}
.api_block h4{font-size:16px;margin-bottom:10px;color:var(--text);}
.api_block p{font-size:13.5px;color:var(--text-2);line-height:1.9;}
.round_icon{width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:16px;}
.round_border{background:var(--wx-green-bg);color:var(--wx-green);}
.featured{color:var(--wx-green);}
.featured.alt{color:var(--wx-blue);}
.featured.alt2{color:var(--wx-orange);}
.fund_text{font-size:14px;color:var(--text-2);}
.fund_text p{margin-top:10px;}
.doc-content{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:40px;margin:24px 0;}
.doc-content h3{font-size:18px;margin:28px 0 14px;}
.doc-content p{font-size:14px;color:var(--text-2);line-height:2;}
.doc-content pre{background:#F6F8FA;border:1px solid var(--border);border-radius:8px;padding:16px;overflow-x:auto;font-size:13px;margin:12px 0;}
.doc-content code{font-family:Consolas,Menlo,monospace;font-size:13px;color:#C7254E;}
.doc-content table{width:100%;border-collapse:collapse;margin:16px 0;}
.doc-content th,.doc-content td{border:1px solid var(--border);padding:10px 14px;font-size:13.5px;text-align:left;}
.doc-content th{background:var(--wx-green-bg);color:var(--wx-green-deep);}

/* ============ 移动端适配 ============ */
@media (max-width:900px){
  .footer-inner{grid-template-columns:1fr 1fr;gap:28px;}
}
@media (max-width:768px){
  .container{padding:0 16px;}
  .site-header{position:relative;}
  .nav-toggle{display:inline-block;}
  .site-nav{display:none;position:absolute;top:64px;left:0;right:0;background:#fff;border-bottom:1px solid var(--border);flex-direction:column;padding:12px 16px;gap:2px;}
  .site-nav.open{display:flex;}
  .site-nav a{padding:12px 14px;}
  .hero{padding:48px 0 64px;}
  .hero-inner{flex-direction:column;gap:40px;}
  .hero-text h1{font-size:28px;}
  .hero-text h1 em{font-size:17px;}
  .hero-sub{font-size:14.5px;}
  .hero-actions .btn{padding:11px 26px;font-size:14.5px;}
  .hero-visual{order:2;}
  .pay-card{width:230px;padding:20px 18px;}
  .pay-card-qr{width:130px;height:130px;font-size:56px;}
  .pay-card-amount{font-size:26px;}
  .section{padding:48px 0;}
  .section-title{font-size:23px;}
  .section-desc{font-size:14px;margin-bottom:32px;}
  .stats-inner{padding:20px 0;}
  .stat-item b{font-size:22px;}
  .steps{flex-direction:column;gap:8px;}
  .step-line{display:none;}
  .footer-inner{grid-template-columns:1fr;gap:32px;padding:40px 0 28px;}
  .cta{padding:48px 0;}
  .cta h2{font-size:22px;}
  .content-page{padding:32px 0;}
  .api_doc,.doc-content{padding:24px 18px;}
}
