/*!
 * home-en-guides.css —— 首页「英文采购指南」栏目入口带 + 全站页脚入口链接
 * ---------------------------------------------------------------------------
 * 仅 index.html 引用（页面级隔离）；DOM 由 home-en-guides.js 注入。
 *
 * 宽度口径（重要）：与 .wrap / .hn-bar / .hmc-band / .hb-booth-band 完全一致 ——
 *   max-width:1280px + padding:0 20px + margin:auto。
 *   首页这几条内容块曾经各写各的宽度，宽屏上左右各差 20px，用户一眼就看出
 *   「没铺满、跟别的对不齐」，所以这里照抄，窄屏也不改 padding。
 *
 * 配色：走**冷蓝**，刻意与紧邻的三条区分开 ——
 *   橙（商家群摊位）/ 白（公告）/ 金（会员）之后再来一条同色系会糊成一片，
 *   而「英文内容 / 面向海外」用蓝也语义自洽。
 *
 * 规矩：不写 padding-bottom（手机底栏 96px 净空由别处负责）；不用 space-between 拉开行距。
 */
.heg-band {
  max-width: 1280px;
  margin: 16px auto 0;
  padding: 0 20px;
}
.heg-card {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  gap: 14px 18px;
  align-items: center;
  background-image: linear-gradient(112deg, #fbfcff 0%, #f2f6fd 52%, #e9f0fb 100%);
  border: 1px solid #d6e0f2;
  border-radius: 16px;
  padding: 15px 20px 14px;
  box-shadow: 0 8px 22px rgba(37, 73, 142, .07);
}
.heg-card::before {
  content: '';
  position: absolute;
  left: 0; right: 0; top: 0; height: 3px;
  background: linear-gradient(90deg, #3b6fd4 0%, #2f57a8 55%, #1f3f7d 100%);
}

/* 左侧地球图标 */
.heg-ico {
  width: 48px; height: 48px; border-radius: 13px;
  display: flex; align-items: center; justify-content: center;
  color: #fff; flex: none;
  background-image: linear-gradient(135deg, #4a7de0 0%, #2b4f9c 100%);
}
.heg-ico svg { width: 26px; height: 26px; display: block; }

.heg-body { min-width: 0; }
.heg-tag {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 2px 9px; border-radius: 999px; margin-bottom: 6px;
  background: #e6edfa; color: #2b4f9c;
  font-size: 11px; font-weight: 800; letter-spacing: .04em;
}
.heg-title {
  font-size: 16px; font-weight: 900; letter-spacing: -.01em;
  line-height: 1.35; color: var(--c-ink);
}
.heg-title em { font-style: normal; color: #2b4f9c; }
.heg-sub {
  margin-top: 5px; font-size: 12.5px; line-height: 1.6; color: var(--c-ink-soft);
}
.heg-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.heg-chip {
  padding: 3px 9px; border-radius: 7px;
  background: #fff; border: 1px solid #dbe3f3;
  font-size: 11.5px; font-weight: 600; color: #3a4a68; white-space: nowrap;
}
.heg-chip.more { background: #e6edfa; border-color: #d2ddf3; color: #2b4f9c; }

.heg-acts { display: flex; flex-direction: column; gap: 8px; align-items: stretch; flex: none; }
.heg-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 38px; padding: 0 18px; border-radius: 9px;
  font-size: 13.5px; font-weight: 800; white-space: nowrap; transition: .15s;
}
.heg-btn.primary { background: #2b4f9c; color: #fff; }
.heg-btn.primary:hover { background: #1f3f7d; }
.heg-btn.ghost { background: #fff; color: #2b4f9c; border: 1px solid #c9d6ee; }
.heg-btn.ghost:hover { border-color: #2b4f9c; }

/* ≤900：按钮换到第三行、整行铺开 */
@media (max-width: 900px) {
  .heg-card { grid-template-columns: 48px minmax(0, 1fr); }
  .heg-acts { grid-column: 1 / -1; flex-direction: row; }
  .heg-btn { flex: 1; }
}
@media (max-width: 640px) {
  .heg-band { margin-top: 12px; }
  .heg-card { padding: 14px 16px; gap: 11px 13px; border-radius: 14px; }
  .heg-ico { width: 42px; height: 42px; border-radius: 12px; }
  .heg-ico svg { width: 23px; height: 23px; }
  .heg-title { font-size: 15px; }
  .heg-sub { font-size: 12px; }
  .heg-acts { flex-direction: column; }
  .heg-btn { flex: none; width: 100%; height: 40px; }
}

/* ---------- 页脚入口链接（全站，由同一个 js 追加到 .foot-nav） ---------- */
.foot-nav a.heg-foot-link { position: relative; }