/* =========================================================
   waijian.css · 外贸网站建设
   布局特征：深色渐变数据带 + 对照表 + 顶部图标三列卡 + 右图左文
   ========================================================= */

.banner-case{background-image:url('../images/banner-case.jpg')}
.wj-ice{background:var(--c-ice-2)}

/* ---------- 深色数据带 ---------- */
.wj-band{padding:0;background:var(--c-grad);margin-top:-1px}
.wj-band-inner{
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
  padding:52px 20px;text-align:center;
}
.wj-band-item .stat-num{color:#fff;font-size:clamp(30px,3.4vw,46px)}
.wj-band-item .stat-num::after{content:"";display:block}
.wj-band-item span{color:#C9DAF5;font-size:14.5px;margin-top:8px;display:block}

/* ---------- 对照表 ---------- */
.wj-table-wrap{overflow-x:auto;border-radius:var(--radius-lg);box-shadow:var(--shadow)}
.wj-table{width:100%;border-collapse:collapse;background:#fff;min-width:640px}
.wj-table th,.wj-table td{padding:18px 22px;text-align:left;font-size:15px}
.wj-table thead th{background:var(--c-primary);color:#fff;font-size:15.5px}
.wj-table thead th:first-child{border-radius:0}
.wj-table tbody tr{border-bottom:1px solid var(--c-line)}
.wj-table tbody tr:last-child{border-bottom:none}
.wj-table tbody tr:hover{background:var(--c-ice-2)}
.wj-table td:first-child{font-weight:700;color:var(--c-primary);width:130px}
.wj-table td:nth-child(2){color:var(--c-muted)}
.wj-table td:nth-child(3){color:var(--c-text)}

/* ---------- 三列能力卡 ---------- */
.wj-ab-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.wj-ab-card{
  background:#fff;border-radius:var(--radius-lg);padding:38px 28px;text-align:center;
  border-top:4px solid var(--c-accent);box-shadow:var(--shadow);transition:all var(--trans);
}
.wj-ab-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg)}
.wj-ab-ico{
  width:70px;height:70px;margin:0 auto 20px;border-radius:20px;background:var(--c-grad);
  display:flex;align-items:center;justify-content:center;
}
.wj-ab-ico svg{width:34px;height:34px;fill:#fff}
.wj-ab-card h3{font-size:19px;margin-bottom:12px}
.wj-ab-card p{font-size:14.5px;color:var(--c-text-2);line-height:1.9}

/* ---------- 右图左文 ---------- */
.wj-seo-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:60px;align-items:center}
.wj-seo-media img{border-radius:var(--radius-lg);box-shadow:var(--shadow-lg)}
.wj-seo-text h2{font-size:clamp(24px,3vw,34px);margin-bottom:18px}
.wj-seo-text p{color:var(--c-text-2);margin-bottom:16px}
.wj-seo-text a{color:var(--c-accent)}
.wj-ticks{margin:22px 0 28px;display:grid;gap:14px}
.wj-ticks li{background:var(--c-ice-2);border-left:3px solid var(--c-accent);padding:12px 18px;border-radius:0 10px 10px 0;font-size:14.5px;color:var(--c-text-2)}
.wj-ticks b{color:var(--c-primary);margin-right:6px}

/* ---------- 案例 ---------- */
.wj-case-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.wj-case-card{
  background:#fff;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);display:block;transition:all var(--trans);
}
.wj-case-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.wj-case-card img{width:100%}
.wj-case-body{padding:24px 26px 28px}
.wj-case-tag{
  display:inline-block;font-size:12.5px;font-weight:700;color:var(--c-accent);
  background:var(--c-ice);padding:4px 14px;border-radius:999px;margin-bottom:12px;
}
.wj-case-body h3{font-size:19px;margin-bottom:8px}
.wj-case-body p{font-size:14.5px;color:var(--c-text-2)}

/* ---------- 价格提示通栏 ---------- */
.wj-price-box{
  background:var(--c-ice);border-radius:var(--radius-lg);padding:46px 50px;
  display:flex;align-items:center;justify-content:space-between;gap:36px;flex-wrap:wrap;
}
.wj-price-left{max-width:640px}
.wj-price-left h2{font-size:clamp(22px,2.6vw,30px);margin-bottom:14px}
.wj-price-left p{color:var(--c-text-2);font-size:15.5px}
.wj-price-left p a{color:var(--c-accent);font-weight:700;text-decoration:underline}

/* ---------- 互链小卡 ---------- */
.wj-relate-row{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.wj-relate-card{
  background:#fff;border-radius:12px;padding:24px 26px;box-shadow:var(--shadow);
  transition:all var(--trans);display:block;
}
.wj-relate-card:hover{background:var(--c-primary)}
.wj-relate-card:hover h3{color:#fff}
.wj-relate-card:hover p{color:#C9DAF5}
.wj-relate-card h3{font-size:17px;margin-bottom:8px;transition:color var(--trans)}
.wj-relate-card p{font-size:14px;color:var(--c-text-2);transition:color var(--trans)}

.contact-sec{padding-top:0}

/* ---------- 响应式 ---------- */
@media (max-width:1080px){
  .wj-band-inner{grid-template-columns:1fr 1fr;gap:30px}
  .wj-seo-grid{grid-template-columns:1fr;gap:36px}
  .wj-ab-grid{grid-template-columns:1fr}
  .wj-case-grid{grid-template-columns:1fr}
}
@media (max-width:768px){
  .wj-relate-row{grid-template-columns:1fr}
  .wj-price-box{padding:32px 24px}
}