/* ============================================================
   home.css — 首页专属样式（index-trade-blue.html 引用）
   依赖 all.css（公共基础），此处只覆盖首页差异与首页板块。
   ─────────────────────────────────────────────────────────
   ① 首页变量 / 排版覆盖
   ② Hero（背景图 + 统计条）
   ③ 选择理由（who / reasons）
   ④ 六大服务（services，深色区）
   ⑤ 四步流程 + 计数器（overview / ov-counters）
   ⑥ 行业覆盖（trusted）
   ⑦ 三条铁律（commitment / principles）
   ⑧ 服务理念（values / guarantee）
   ⑨ 资讯（news-grid 卡片）
   ⑩ 需求区（help）
   ⑪ 首页专属响应式
   ============================================================ */

/* ---------- ① 首页变量 / 排版覆盖 ---------- */
:root{
  --bg-dark:#111318;--bg-dark2:#1a1d24;--bg-dark3:#22262f;
  --text-muted:#9aa0a8;
}
h2{font-size:32px}
h3{font-size:20px}
p{font-size:15px;line-height:1.8}
.kicker{margin-bottom:14px}
.js .reveal{transform:translateY(32px)}
.js .reveal:nth-child(2){transition-delay:.12s}
.js .reveal:nth-child(3){transition-delay:.24s}
.js .reveal:nth-child(4){transition-delay:.36s}
.js .reveal:nth-child(5){transition-delay:.48s}
.js .reveal:nth-child(6){transition-delay:.6s}
.btn-outline-dark{background:transparent;color:var(--text-dark)!important;border:1.5px solid var(--text-dark)}
.btn-outline-dark:hover{background:var(--text-dark);color:#fff!important}
.btn-primary:hover{background:var(--accent-dark);transform:translateY(-2px);box-shadow:0 12px 36px rgba(0,149,239,.45)}
.btn-outline:hover{border-color:var(--text-light);background:rgba(255,255,255,.08)}
.cta-strip .btn-white:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(0,0,0,.3)}

/* ---------- ② Hero ---------- */
.hero{position:relative;overflow:hidden;background:#0a0d12 url('../images/hero-bg.jpg') center/cover no-repeat;color:var(--text-light);min-height:800px;display:flex;align-items:center;justify-content:center;padding:80px 0;text-align:center}
.hero .container{position:relative;z-index:2;width:100%}
.hero-bg{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,13,18,.55) 0%,rgba(10,13,18,.82) 100%);pointer-events:none}
.hero::before{content:"";position:absolute;inset:0;background-image:radial-gradient(ellipse at 20% 0%,rgba(0,149,239,.18),transparent 50%),radial-gradient(ellipse at 90% 100%,rgba(0,149,239,.1),transparent 50%);pointer-events:none;z-index:1}
.hero h1{font-size:46px;font-weight:800;line-height:1.25;letter-spacing:-1px;margin-bottom:20px}
.hero h1 em{font-style:normal;color:var(--accent)}
.hero-sub{font-size:16px;color:var(--text-muted);max-width:700px;margin:0 auto 36px;line-height:1.9}
.hero-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:56px}
.hero-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--border-dark);border-radius:var(--radius-lg);background:rgba(255,255,255,.03);overflow:hidden}
.hero-stat{padding:28px 16px;border-right:1px solid var(--border-dark)}
.hero-stat:last-child{border-right:none}
.hero-stat-num{font-size:34px;font-weight:800;color:var(--accent);letter-spacing:-1px}
.count{font-variant-numeric:tabular-nums;display:inline-block}
.hero-stat-label{font-size:14px;color:var(--text-muted);margin-top:6px}

/* ---------- ③ 选择理由 ---------- */
.who{padding:90px 0;background:var(--bg-light)}
.who-head{text-align:center;max-width:640px;margin:0 auto 56px}
.reasons{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.reason{background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:36px 28px;position:relative;transition:all .3s var(--ease)}
.reason:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);border-color:var(--accent)}
.reason-num{font-size:42px;font-weight:800;color:var(--border-light);line-height:1;margin-bottom:16px;transition:color .3s}
.reason:hover .reason-num{color:var(--accent)}
.reason h3{font-size:18px;margin-bottom:12px}
.reason p{font-size:14px;color:var(--text-mid)}

/* ---------- ④ 六大服务（深色区） ---------- */
.services{background:var(--bg-dark);color:var(--text-light);padding:90px 0;position:relative}
.services-head{text-align:center;max-width:640px;margin:0 auto 56px}
.services-head .kicker{color:var(--accent)}
.services-head h2{color:#fff}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.service-card{background:var(--bg-dark2);border:1px solid var(--border-dark);border-radius:var(--radius-lg);padding:32px 28px;transition:all .3s var(--ease);position:relative;overflow:hidden}
.service-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.service-card:hover{transform:translateY(-6px);border-color:rgba(0,149,239,.4);background:var(--bg-dark3)}
.service-card:hover::before{transform:scaleX(1)}
.service-num{font-size:15px;font-weight:700;color:var(--accent);letter-spacing:2px;margin-bottom:14px}
.service-card h3{font-size:19px;color:#fff;margin-bottom:6px}
.service-en{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:1.5px;margin-bottom:14px}
.service-card p{font-size:14px;color:var(--text-muted);margin-bottom:18px}
.service-tags{display:flex;flex-wrap:wrap;gap:6px}
.service-tags span{font-size:12px;padding:4px 12px;border-radius:var(--radius-sm);background:rgba(0,149,239,.12);color:var(--accent-light)}

/* ---------- ⑤ 四步流程 + 计数器 ---------- */
.overview{padding:90px 0;background:var(--bg-white)}
.overview-head{text-align:center;max-width:640px;margin:0 auto 56px}
.steps{margin-bottom:60px}
.ov-counters{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;background:#001e32 url('../images/munberbg.jpg') center/cover no-repeat;border-radius:var(--radius-lg);padding:40px 32px;position:relative}
.ov-counters::before{content:"";position:absolute;inset:0;background:rgba(0,30,50,.55);border-radius:var(--radius-lg);pointer-events:none}
.ov-counter{text-align:center;border-right:1px solid var(--border-dark);position:relative;z-index:1}
.ov-counter:last-child{border-right:none}
.ov-num{font-size:38px;font-weight:800;color:var(--accent);letter-spacing:-1px}
.ov-label{font-size:14px;color:var(--text-muted);margin-top:8px}

/* ---------- ⑥ 行业覆盖 ---------- */
.trusted{padding:80px 0;background:var(--bg-light)}
.trusted-inner{background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:56px 48px;text-align:center}
.trusted h2{font-size:28px;margin-bottom:12px}
.trusted .trusted-sub{font-size:15px;color:var(--text-mid);max-width:680px;margin:0 auto 36px}
.industry-tags{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.industry-tags span{font-size:14px;padding:8px 22px;border:1px solid var(--border-light);border-radius:var(--radius-full);color:var(--text-mid);background:var(--bg-light);transition:all .25s}
.industry-tags span:hover{border-color:var(--accent);color:var(--accent);background:#fff}

/* ---------- ⑦ 三条铁律（深色区） ---------- */
.commitment{background:var(--bg-dark);color:var(--text-light);padding:90px 0;position:relative}
.commitment-head{text-align:center;max-width:720px;margin:0 auto 56px}
.commitment-head h2{color:#fff;margin-bottom:16px}
.commitment-head p{color:var(--text-muted)}
.principles{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.principle{background:var(--bg-dark2);border:1px solid var(--border-dark);border-radius:var(--radius-lg);padding:36px 28px;text-align:center;transition:all .3s var(--ease)}
.principle:hover{transform:translateY(-6px);border-color:rgba(0,149,239,.4)}
.principle-icon{width:76px;height:76px;border-radius:50%;background:rgba(0,149,239,.14);display:flex;align-items:center;justify-content:center;margin:0 auto 20px;overflow:hidden}
.principle-icon img{width:48px;height:48px;object-fit:contain}
.principle h3{color:#fff;font-size:19px;margin-bottom:12px}
.principle p{font-size:14px;color:var(--text-muted)}

/* ---------- ⑧ 服务理念（values 已从首页移除，保留样式备用） ---------- */
.values{padding:90px 0;background:var(--bg-white)}
.values-head{text-align:center;max-width:640px;margin:0 auto 56px}
.values-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.value-card{text-align:center;padding:32px 20px;border:1px solid var(--border-light);border-radius:var(--radius-lg);transition:all .3s var(--ease)}
.value-card:hover{box-shadow:var(--shadow-md);transform:translateY(-4px);border-color:var(--accent)}
.value-char{font-size:38px;font-weight:800;color:var(--accent);margin-bottom:12px}
.value-card h3{font-size:18px;margin-bottom:10px}
.value-card p{font-size:14px;color:var(--text-mid)}
.guarantee{background:var(--bg-light);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:40px;margin-top:40px}
.guarantee h3{font-size:20px;margin-bottom:20px;text-align:center}
.guarantee-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.guarantee-item{background:var(--bg-white);border-radius:var(--radius-md);padding:16px 18px;border-left:3px solid var(--accent)}
.guarantee-item strong{display:block;font-size:14px;margin-bottom:4px}
.guarantee-item span{font-size:14px;color:var(--text-mid)}

/* ---------- ⑨ 资讯（首页卡片） ---------- */
.news{padding:80px 0;background:var(--bg-light)}
.news-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:40px}
.news-head h2{font-size:28px}
.news-link{font-size:14px;font-weight:600;color:var(--accent)}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.news-card{background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius-lg);overflow:hidden;transition:all .3s var(--ease)}
.news-card:hover{box-shadow:var(--shadow-md);transform:translateY(-4px)}
.news-thumb{height:150px;background:linear-gradient(135deg,var(--bg-dark2),var(--bg-dark3));position:relative;overflow:hidden}
.news-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .4s var(--ease)}
.news-card:hover .news-thumb img{transform:scale(1.06)}
.news-body{padding:22px}
.news-cat{font-size:14px;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:1px;margin-bottom:8px}
.news-body h3{font-size:16px;margin-bottom:8px;line-height:1.5}
.news-body p{font-size:14px;color:var(--text-mid)}
.news-date{font-size:14px;color:var(--text-mid);margin-top:12px}

/* ---------- ⑩ 需求区 ---------- */
.help{background:var(--bg-dark);color:var(--text-light);padding:80px 0;position:relative}
.help .container{display:grid;grid-template-columns:1.2fr 1fr;gap:48px;align-items:center}
.help h2{color:#fff;font-size:30px;margin-bottom:16px}
.help p{color:var(--text-muted);font-size:15px;margin-bottom:24px}
.help-list{list-style:none;margin-bottom:28px}
.help-list li{color:var(--text-muted);font-size:14px;padding:6px 0;display:flex;align-items:center;gap:10px}
.help-list li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent);flex-shrink:0}
.help-contact{background:var(--bg-dark2);border:1px solid var(--border-dark);border-radius:var(--radius-lg);padding:32px}
.help-contact h3{color:#fff;font-size:18px;margin-bottom:16px;display:flex;align-items:center;gap:10px}
.help-contact h3::before{content:"?";width:28px;height:28px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;font-size:15px;color:#fff;flex-shrink:0}
.help-contact p{font-size:14px;margin-bottom:8px}
.help-contact .phone{font-size:22px;font-weight:800;color:var(--accent);margin:12px 0}

/* ---------- ⑪ 首页专属响应式 ---------- */
@media(max-width:991px){
  .hero h1{font-size:34px}
  .hero-stats{grid-template-columns:repeat(2,1fr)}
  .hero-stat:nth-child(2){border-right:none}
  .hero-stat:nth-child(-n+2){border-bottom:1px solid var(--border-dark)}
  .reasons,.services-grid,.principles,.news-grid{grid-template-columns:1fr}
  .ov-counters{grid-template-columns:1fr}
  .ov-counter{border-right:none;border-bottom:1px solid var(--border-dark);padding-bottom:20px;margin-bottom:20px}
  .ov-counter:last-child{border-bottom:none;margin-bottom:0}
  .values-grid{grid-template-columns:repeat(2,1fr)}
  .guarantee-grid{grid-template-columns:1fr}
  .help .container{grid-template-columns:1fr}
}
@media(max-width:575px){
  .hero{padding:60px 0;min-height:auto}
  .hero h1{font-size:27px}
  .hero-cta{flex-direction:column;align-items:stretch}
  .btn{justify-content:center}
  .who,.services,.overview,.values,.news{padding:60px 0}
  .values-grid{grid-template-columns:1fr}
  .trusted-inner{padding:36px 20px}
  .news-head{flex-direction:column;gap:12px;align-items:flex-start}
}