:root {
  /* ===== 集团主色：深海军蓝 ===== */
  --navy-900: #061a2e;
  --navy-800: #0a2540;
  --navy-700: #0e3050;
  --navy-600: #16456e;
  --navy-100: #dce6f0;
  --navy-50: #eef3f9;

  /* ===== 集团点缀色：金铜 ===== */
  --gold-700: #8f7133;
  --gold-600: #a8873f;
  --gold-500: #c8a45c;
  --gold-100: #eadfc4;
  --gold-50: #fbf6ea;

  /* ===== 中性色 ===== */
  --gray-900: #1f2937;
  --gray-600: #5a6675;
  --gray-400: #8d99a8;
  --gray-200: #e4e8ee;
  --gray-100: #f0f3f7;
  --gray-50: #f7f9fc;
  --white: #ffffff;

  /* ===== 强调色派生的浅底 / 描边（随主题一起被覆盖） ===== */
  --accent-soft-1: #fffaf3;
  --accent-soft-2: #ffe1c0;
  --accent-soft-3: #ffd8a8;

  /* ===== 兼容别名 ===== */
  --brand: var(--navy-800);
  --brand-dark: var(--navy-900);
  --accent: var(--gold-500);
  --black: var(--navy-800);
  --dark: var(--navy-900);
  --orange: var(--navy-800);
  --orange-dark: var(--navy-900);
  --orange-light: var(--navy-50);

  --shadow: 0 8px 30px rgba(10, 37, 64, 0.08);
  --shadow-lg: 0 16px 48px rgba(10, 37, 64, 0.14);
  --radius: 12px;
  --radius-sm: 6px;
  /* 全站统一宽度 = 展会中心宽度。
     页头 / 页脚 / 正文都用 .container，所以只改这一处，导航条与内容列就始终落在同一条左基准线上
     （以前是「正文用 .wide 加宽、导航用 .container」，才需要 body.layout-wide 去补导航/页脚）。 */
  --container: 1560px;
  --container-pad: 40px;
  /* 兼容别名：.wide 仍被展会中心引用，取值与上面一致 */
  --container-wide: 1560px;
  --container-wide-pad: 40px;
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: var(--font);
  color: var(--gray-900);
  background: var(--white);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
ul { list-style: none; }
img { max-width: 100%; display: block; }

.container { max-width: var(--container); margin: 0 auto; padding: 0 var(--container-pad); }

/* ============ 顶部导航 ============ */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--black);
  color: var(--white);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
}
.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 72px;
}
.brand {
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 800;
  font-size: 20px;
  letter-spacing: 0.5px;
}
/* 品牌 logo：直接用集团 VI 官方横版组合（图形 + 合遠集團 + EXPOEYE GROUP）
   深色导航条/页脚用 -light 版（白字+品牌橙），浅底场景用 logo-group.png */
.brand img { height: 44px; width: auto; display: block; }
.nav-list { display: flex; align-items: center; gap: 6px; }
.nav-list a {
  display: inline-block;
  padding: 8px 16px;
  border-radius: 6px;
  font-size: 15px;
  color: rgba(255, 255, 255, 0.82);
  transition: all 0.2s;
}
.nav-list a:hover { color: var(--white); background: rgba(255, 255, 255, 0.08); }
.nav-list a.active { color: var(--gold-500); font-weight: 600; }
.nav-toggle {
  display: none;
  background: none;
  border: none;
  color: var(--white);
  font-size: 26px;
  cursor: pointer;
}
.nav-toggle svg { width: 24px; height: 24px; display: block; }

/* ============ 页面标题横幅 ============ */
.page-banner {
  background: linear-gradient(135deg, var(--navy-900) 0%, var(--navy-700) 100%);
  color: var(--white);
  padding: 72px 0;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.page-banner::after {
  content: "";
  position: absolute;
  right: -80px;
  top: -80px;
  width: 280px;
  height: 280px;
  background: radial-gradient(circle, rgba(200, 164, 92, 0.22), transparent 70%);
}
.page-banner h1 { font-size: 40px; font-weight: 800; letter-spacing: 1px; }
.page-banner p { margin-top: 12px; color: rgba(255, 255, 255, 0.72); font-size: 16px; }
.breadcrumb { margin-top: 16px; font-size: 13px; color: rgba(255, 255, 255, 0.5); }
.breadcrumb a { color: var(--gold-500); }

/* ============ Hero ============ */
.hero {
  position: relative;
  background: linear-gradient(135deg, var(--navy-900) 0%, var(--navy-700) 100%);
  color: var(--white);
  overflow: hidden;
}
.hero::before {
  content: "";
  position: absolute;
  right: -120px;
  bottom: -160px;
  width: 520px;
  height: 520px;
  background: radial-gradient(circle, rgba(200, 164, 92, 0.22), transparent 65%);
}
.hero .container { position: relative; z-index: 2; padding-top: 96px; padding-bottom: 120px; }
.hero-eyebrow {
  display: inline-block;
  padding: 6px 16px;
  border: 1px solid rgba(200, 164, 92, 0.6);
  color: var(--gold-500);
  border-radius: 30px;
  font-size: 13px;
  letter-spacing: 2px;
  margin-bottom: 24px;
}
.hero h1 {
  font-size: 54px;
  font-weight: 800;
  line-height: 1.2;
  max-width: 760px;
}
.hero h1 .accent { color: var(--gold-500); }
.hero p.sub {
  margin-top: 22px;
  max-width: 620px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 18px;
}
.hero-actions { margin-top: 36px; display: flex; gap: 16px; flex-wrap: wrap; }
.hero-stats {
  margin-top: 56px;
  display: flex;
  gap: 56px;
  flex-wrap: wrap;
}
.hero-stats .stat b { font-size: 34px; color: var(--gold-500); font-weight: 800; display: block; }
.hero-stats .stat span { color: rgba(255, 255, 255, 0.6); font-size: 14px; }

/* ============ 按钮 ============ */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 13px 28px;
  border-radius: 6px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  border: none;
  transition: all 0.22s;
  white-space: nowrap;
}
.btn-primary { background: var(--gold-500); color: var(--navy-900); }
.btn-primary:hover { background: var(--gold-600); transform: translateY(-2px); box-shadow: 0 8px 20px rgba(168, 135, 63, 0.35); }
.btn-outline { background: transparent; color: var(--white); border: 1px solid rgba(255, 255, 255, 0.4); }
.btn-outline:hover { border-color: var(--gold-500); color: var(--gold-500); }
.btn-dark { background: var(--navy-800); color: var(--white); }
.btn-dark:hover { background: var(--navy-600); }
.btn-sm { padding: 8px 16px; font-size: 13px; }

/* ============ 通用区块 ============ */
.section { padding: 88px 0; }
.section.gray { background: var(--gray-50); }
.section-head { text-align: center; max-width: 640px; margin: 0 auto 56px; }
.section-head .kicker {
  display: inline-block;
  color: var(--gold-600);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  margin-bottom: 12px;
}
.section-head h2 { font-size: 34px; font-weight: 800; }
.section-head p { margin-top: 14px; color: var(--gray-600); }

/* ============ 服务卡片 ============ */
.services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.service-card {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius);
  padding: 36px 28px;
  transition: all 0.25s;
  position: relative;
  overflow: hidden;
}
.service-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 4px;
  background: var(--gold-500);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s;
}
.service-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); border-color: transparent; }
.service-card:hover::before { transform: scaleX(1); }
.service-icon {
  width: 56px; height: 56px;
  border-radius: 10px;
  background: var(--navy-50);
  color: var(--navy-800);
  display: flex; align-items: center; justify-content: center;
  font-size: 26px;
  margin-bottom: 20px;
}
.service-card h3 { font-size: 20px; margin-bottom: 10px; }
.service-card p { color: var(--gray-600); font-size: 14px; }

/* ============ 展会卡片 ============ */
/* 首页「近期展会」：一排四个（展会中心列表另有 .expo-list-section .expo-grid 覆盖，同样是 4 列） */
.expo-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.expo-card {
  background: var(--white);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
  transition: all 0.25s;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--gray-200);
}
.expo-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.expo-cover {
  position: relative;
  height: 170px;
  background: linear-gradient(135deg, var(--navy-800), var(--navy-600));
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
}
.expo-cover img { width: 100%; height: 100%; object-fit: cover; }
.expo-cat {
  position: absolute;
  top: 14px; left: 14px;
  background: var(--orange);
  color: var(--white);
  font-size: 12px;
  font-weight: 600;
  padding: 4px 12px;
  border-radius: 20px;
}
.countdown {
  position: absolute;
  top: 14px; right: 14px;
  background: rgba(6, 26, 46, 0.78);
  border: 1px solid rgba(200, 164, 92, 0.45);
  color: var(--white);
  font-size: 12px;
  font-weight: 600;
  padding: 5px 12px;
  border-radius: 20px;
  backdrop-filter: blur(4px);
}
.countdown.hot { background: var(--gold-500); border-color: var(--gold-500); color: var(--navy-900); }
.countdown.ended { background: rgba(255, 255, 255, 0.2); border-color: rgba(255, 255, 255, 0.28); color: rgba(255, 255, 255, 0.9); }
/* 「停办」用固定暗红：它是状态警示，不跟随主题强调色（否则切主题后"停办"和"报名中"会长得一样） */
.countdown.stopped { background: rgba(176, 40, 32, 0.92); border-color: rgba(176, 40, 32, 0.92); color: var(--white); }
.expo-body { padding: 22px; display: flex; flex-direction: column; gap: 12px; flex: 1; }
.expo-body h3 { font-size: 17px; line-height: 1.45; font-weight: 700; }
.expo-meta { display: flex; flex-wrap: wrap; gap: 16px; color: var(--gray-600); font-size: 13px; }
.expo-meta span { display: inline-flex; align-items: center; gap: 5px; }
.expo-desc {
  color: var(--gray-600);
  font-size: 13.5px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ============ 分类筛选 ============ */
.filter-bar { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-bottom: 44px; }
.filter-tab {
  padding: 10px 22px;
  border-radius: 30px;
  border: 1px solid var(--gray-200);
  background: var(--white);
  color: var(--gray-600);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}
.filter-tab:hover { border-color: var(--orange); color: var(--orange); }
.filter-tab.active { background: var(--black); color: var(--white); border-color: var(--black); }

/* ============ 分页 ============ */
.pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  margin-top: 40px;
}
.pagination:empty { display: none; }
.page-btn {
  padding: 10px 22px;
  border-radius: 30px;
  border: 1px solid var(--gray-200);
  background: var(--white);
  color: var(--gray-600);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}
/* 注意用 --accent（=--gold-500 品牌主色），不要用 --orange ——
   --orange 是遗留别名，实际映射到 --navy-800（炭黑），拿它当强调色会变成黑块 */
.page-btn:hover:not(:disabled) { border-color: var(--accent); color: var(--accent); }
.page-btn:disabled,
.page-btn.is-disabled { opacity: 0.4; cursor: not-allowed; }
/* 页码：真实 <a href> 链接，爬虫可跟（上一页/下一页同样是 <a>，见 ssrPagination） */
.page-num {
  min-width: 38px;
  padding: 8px 12px;
  text-align: center;
  border-radius: 8px;
  border: 1px solid var(--gray-200);
  background: var(--white);
  color: var(--gray-600);
  font-size: 14px;
  font-weight: 600;
  transition: all 0.2s;
}
a.page-num:hover { border-color: var(--accent); color: var(--accent); }
.page-num.is-current {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--navy-900);
  cursor: default;
}
.page-nums { display: flex; align-items: center; gap: 6px; }
.page-info { color: var(--gray-600); font-size: 14px; }

@media (max-width: 640px) {
  .pagination { gap: 10px; flex-wrap: wrap; }
  .page-btn { padding: 8px 14px; font-size: 13px; }
  .page-info { font-size: 13px; }
  /* ⚠️ .page-nums 自己也得能换行：新闻中心有 16 页 = 16 个页码，
     单行排下来 600+px → 直接顶出 375px 屏幕（.pagination 上的 flex-wrap 管不到它内部）。 */
  .page-nums { flex-wrap: wrap; justify-content: center; row-gap: 8px; }
  .page-num { min-width: 32px; padding: 6px 9px; font-size: 13px; }
}
.expo-cat-detail {
  display: inline-block;
  width: fit-content;
  background: var(--orange-light);
  color: var(--orange);
  font-size: 13px;
  font-weight: 700;
  padding: 5px 14px;
  border-radius: 20px;
}
.countdown-inline {
  padding: 4px 12px;
  border-radius: 20px;
  background: var(--gold-500);
  color: var(--navy-900);
  font-size: 13px;
  font-weight: 600;
}
.countdown-inline.hot { background: var(--gold-500); color: var(--navy-900); box-shadow: 0 2px 8px rgba(168, 135, 63, 0.35); }
.countdown-inline.ended { background: var(--gray-200); color: var(--gray-600); }
/* 提高特异性，避免被 .em-row > span:last-child 覆盖（其含 :last-child 伪类，特异性 (0,2,1) 高于 (0,2,0)）*/
.expo-head-meta .countdown-inline { color: var(--navy-900) !important; }
.expo-head-meta .countdown-inline.ended { color: var(--gray-600) !important; }
.expo-status { padding: 4px 14px; border-radius: 20px; font-size: 13px; font-weight: 600; }
.expo-status.open { background: var(--gold-50); color: var(--gold-700); border: 1px solid var(--gold-100); }
.expo-status.ended { background: var(--gray-200); color: var(--gray-600); }
.expo-status.stopped { background: #fbe9e7; color: #b02620; border: 1px solid #f2cdc8; }
.countdown-inline.stopped { background: #fbe9e7; color: #b02620; }
/* 同上：.em-row > span:last-child 特异性更高，得显式压住 */
.expo-head-meta .countdown-inline.stopped { color: #b02620 !important; }
/* 停办声明：放在详情页头部卡片之前，进页面第一眼就能看到 */
.expo-stop-notice {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 20px;
  padding: 14px 18px;
  border-radius: var(--radius);
  background: #fbe9e7;
  border: 1px solid #f2cdc8;
  border-left: 4px solid #b02620;
  color: #8c1d18;
  font-size: 14px;
  line-height: 1.7;
}
.expo-stop-notice svg { flex-shrink: 0; margin-top: 3px; color: #b02620; }
.expo-stop-notice b { color: #b02620; }

/* ============ 新闻 ============ */
/* 两栏：左「新闻列表」+ 右「推荐展会」（随机 10 条）。
   整块限宽 1200px 居中：直接铺满 1560 容器的话左栏会宽到 1180px，正文行太长不好读；
   现在的左栏 ≈ 820px，与改造前的 .news-list(860px) 基本持平，视觉不会跳。 */
.news-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 44px;
  max-width: 1200px;
  margin: 0 auto;
  align-items: start;
}
.news-main { min-width: 0; }
/* 分类 tab 左对齐：右侧多出一栏后，居中的 tab 看起来是「偏」的 */
.news-main .filter-bar { justify-content: flex-start; margin-bottom: 26px; }
/* 列宽交给 .news-layout 管，这里不再自己限宽居中 */
.news-list { max-width: none; margin: 0; }
.news-item {
  display: flex;
  gap: 24px;
  padding: 24px 0;
  border-bottom: 1px solid var(--gray-200);
  align-items: center;
  text-decoration: none;
  color: inherit;
  cursor: pointer;
  transition: padding-left 0.2s;
}
.news-item:hover { padding-left: 8px; }
/* 元信息行：小字日期 + 分类标签（替代原先左侧的黑色日期块） */
.news-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 10px;
}
.news-meta-date {
  font-size: 13px;
  color: var(--gray-400);
  letter-spacing: 0.2px;
  font-variant-numeric: tabular-nums;
}
/* 列表缩略图：定宽 + aspect-ratio，不给 min-height（min-height 会反推最小宽 → 窄屏横向溢出） */
.news-thumb {
  flex-shrink: 0;
  width: 160px;
  aspect-ratio: 4 / 3;
  border-radius: 8px;
  overflow: hidden;
  background: var(--gray-100);
}
.news-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* flex:1 + min-width:0 —— 少了 min-width 长标题会把这一行撑破（flex 项默认 min-width:auto） */
.news-body { flex: 1; min-width: 0; }
.news-item h3 { font-size: 17px; transition: color 0.2s; color: var(--black); }
.news-item h3:hover { color: var(--navy-600); }
.news-item p { color: var(--gray-600); font-size: 14px; margin-top: 6px; line-height: 1.7; }
.news-tip { text-align: center; color: var(--gray-400); padding: 40px 0; font-size: 14px; }
.news-cat {
  display: inline-block;
  font-size: 12px;
  color: var(--orange);
  background: var(--orange-light);
  padding: 2px 10px;
  border-radius: 20px;
}
.news-item:hover .news-cat { background: var(--orange); color: #fff; }

/* ---- 右侧栏「推荐展会」 ---- */
.news-side {
  border: 1px solid var(--gray-200);
  border-radius: 14px;
  background: var(--white);
  padding: 0 18px;
  /* 跟随吸顶页头（.site-header 68px）：滚长列表时侧栏始终在场。
     上下留 20px 呼吸位，别贴着页头 */
  position: sticky;
  top: 88px;
  /* ⚠️ 侧栏**不做内部滚动**（不设 max-height / overflow-y）：
     一是会出现一条自己的滚动条，二是鼠标停在侧栏上滚轮只滚它、页面不动，像「卡住」。
     10 条 ≈ 900px 比常见视口高，全靠 views/news.html 里的 syncSideOffset()
     在页面滚动时逐步上移 side.top 把底部带进视野（纯 CSS 做不到「高度超出视口仍全可见」）。 */
  will-change: top;
}
.news-side-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 17px;
  font-weight: 700;
  color: var(--black);
  padding: 16px 0 14px;
  border-bottom: 1px solid var(--gray-200);
}
/* 标题左侧竖条用主题强调色，不写死颜色（换肤时要跟着变） */
.news-side-title::before {
  content: '';
  flex: 0 0 4px;
  width: 4px;
  height: 18px;
  border-radius: 2px;
  background: var(--accent);
}
.side-expo {
  display: flex;
  gap: 12px;
  padding: 14px 0;
  border-bottom: 1px solid var(--gray-100);
  text-decoration: none;
  color: inherit;
}
.side-expo:last-child { border-bottom: 0; }
/* 定宽 + 定高（不用 aspect-ratio）：侧栏一行就 58px 高，等比反而会把行撑高。
   object-fit 用 contain 而不是 cover：这批展会封面多为白底 logo / 海报，
   方形裁切会把 logo 两侧切掉（CeMAT 的「C」「a」都被切过），contain 完整显示更稳。 */
.side-expo-thumb {
  flex: 0 0 58px;
  width: 58px;
  height: 58px;
  border-radius: 8px;
  overflow: hidden;
  background: var(--gray-50);
  border: 1px solid var(--gray-100);
}
.side-expo-thumb img { width: 100%; height: 100%; object-fit: contain; display: block; }
.side-expo-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.side-expo-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.side-expo-tag {
  font-size: 11px;
  line-height: 1.7;
  padding: 0 6px;
  border-radius: 4px;
  color: var(--gray-600);
  background: var(--gray-100);
  white-space: nowrap;
}
.side-expo-tag.is-hot { color: var(--navy-900); background: var(--accent-soft-2); }
/* 停办红与展会卡片角标同色（#b02620），保持全站一致 */
.side-expo-tag.is-stop { color: #b02620; background: rgba(176, 40, 32, 0.1); }
.side-expo-title {
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.5;
  color: var(--black);
  /* 标题压两行：侧栏一行一个展会，标题长短不一时行高才稳定 */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color 0.2s;
}
.side-expo:hover .side-expo-title { color: var(--navy-600); }
.side-expo-meta { display: flex; flex-wrap: wrap; gap: 3px 10px; font-size: 12px; color: var(--gray-400); }
.side-expo-meta time { font-variant-numeric: tabular-nums; }
.side-expo-meta i { font-style: normal; }
.news-side-more {
  display: block;
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  color: var(--navy-700);
  padding: 12px 0 15px;
  border-top: 1px solid var(--gray-200);
  text-decoration: none;
}
.news-side-more:hover { color: var(--gold-600); }

@media (max-width: 1100px) {
  /* 窄屏改单列：侧栏落到列表下方，两列排卡片比竖着一长条省版面 */
  .news-layout { grid-template-columns: 1fr; gap: 30px; }
  /* 单列后 sticky 会跟着整页飘，取消（JS 也会把 inline top 清掉） */
  .news-side { position: static; top: auto; }
  .news-side-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 22px; }
}

@media (max-width: 640px) {
  .news-side-list { grid-template-columns: 1fr; }
  /* 触屏没有 hover，手指抬起后位移会「粘」住 → 窄屏直接去掉这条位移 */
  .news-item:hover { padding-left: 0; }
  .news-item { flex-wrap: wrap; gap: 14px; align-items: flex-start; padding: 18px 0; }
  /* 缩略图独占一行（order:-1 提到日期块之前）：窄屏里「日期 + 缩略图 + 文字」三方并排会把标题挤成一条竖线 */
  .news-thumb { order: -1; width: 100%; aspect-ratio: 16 / 9; }
  .news-meta { gap: 8px; }
  .news-meta-date { font-size: 12px; }
  .news-item h3 { font-size: 16px; }
  .news-item p { font-size: 13px; }
}

/* 新闻详情 */
.news-article-head h1 { font-size: 26px; line-height: 1.4; font-weight: 800; margin: 14px 0 10px; }
.news-article-meta { color: var(--gray-400); font-size: 13px; margin-bottom: 20px; }
.news-cover { border-radius: var(--radius); overflow: hidden; margin-bottom: 24px; }
.news-cover img { width: 100%; display: block; max-height: 420px; object-fit: cover; }
.news-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 12px;
  margin: 24px 0;
}
.news-gallery img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 6px;
  display: block;
}
.news-article-body {
  color: #333;
  font-size: 15px;
  line-height: 2;
  white-space: pre-wrap;
  word-break: break-word;
}
.news-article-back { margin-top: 32px; padding-top: 20px; border-top: 1px solid var(--gray-200); }

/* 首页新闻卡片 */
/* 首页「新闻中心」：一排四个 */
.home-news-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.home-news-card {
  background: var(--white);
  border-radius: var(--radius);
  border: 1px solid var(--gray-200);
  padding: 24px;
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
}
.home-news-card:hover { transform: translateY(-4px); border-color: var(--gold-500); box-shadow: 0 12px 28px rgba(10, 37, 64, 0.12); }
.home-news-card h3 { font-size: 17px; line-height: 1.5; font-weight: 700; color: var(--black); transition: color 0.2s; }
.home-news-card:hover h3 { color: var(--orange); }
.home-news-card p { color: var(--gray-600); font-size: 14px; line-height: 1.7; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.home-news-card .hn-date { color: var(--gray-400); font-size: 12px; margin-top: auto; padding-top: 12px; border-top: 1px solid var(--gray-200); }
/* 卡片缩略图：负边距顶到卡片内边距外沿（卡片 padding 24px），只做上方圆角。
   ⚠️ 只给 aspect-ratio + width/height:100% —— 再叠加 min-height 会反推最小宽度，
      窄屏（首页新闻是两列）直接横向溢出，这个坑在 .intro-media 上踩过一次。 */
.home-news-card .hn-thumb {
  margin: -24px -24px 0;
  border-radius: var(--radius) var(--radius) 0 0;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: var(--gray-100);
}
.home-news-card .hn-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }


/* ============ 关于/文化 ============ */
.culture-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.culture-item {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius);
  padding: 28px;
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.culture-item .num {
  flex-shrink: 0;
  width: 40px; height: 40px;
  border-radius: 50%;
  background: var(--gold-500);
  color: var(--navy-900);
  display: flex; align-items: center; justify-content: center;
  font-weight: 700;
}
.culture-item h4 { font-size: 16px; margin-bottom: 4px; }
.culture-item p { color: var(--gray-600); font-size: 13.5px; }

/* ============ 合作伙伴 logo ============ */
.partner-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.partner-card {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius);
  padding: 24px 14px 18px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  transition: box-shadow 0.2s, transform 0.2s, border-color 0.2s;
}
.partner-card:hover { border-color: var(--orange); box-shadow: var(--shadow); transform: translateY(-2px); }
.partner-logo {
  width: 100%;
  height: 62px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.partner-logo img {
  max-width: 100%;
  max-height: 62px;
  object-fit: contain;
}
.partner-fallback {
  color: var(--gray-400);
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.5px;
  text-align: center;
}
.partner-name {
  color: var(--gray-600);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.45;
  text-align: center;
  min-height: 36px;
  display: flex;
  align-items: center;
}

/* ============ 合作伙伴 logo（首页 + 集团概况 密排：一排 8 个、最多 3 排）============
   ⚠️ 基础类 .partner-grid 是 5 列，被首页 / 集团概况共用；密排一律用页面独占 id 限定作用域：
   #partners 只在 views/index.html，#honor 只在 views/group.html。
   （views/about.html 无 id、走基础 5 列，但它是死模板：/about 301 → /group，见 server.js:1991。
     改这里要同步改两页，别再只改 #partners。） */
#partners .partner-grid,
#honor .partner-grid { grid-template-columns: repeat(8, 1fr); gap: 14px; }
#partners .partner-card,
#honor .partner-card { padding: 20px 12px 16px; gap: 10px; }
#partners .partner-logo,
#honor .partner-logo { height: 56px; }
#partners .partner-logo img,
#honor .partner-logo img { max-height: 56px; }
#partners .partner-name,
#honor .partner-name { font-size: 12px; min-height: 34px; }
/* 最多 3 排：8 列 × 3 排 = 24 个，第 25 个起不展示（往后台加到 24 家以内都自动兜住） */
#partners .partner-card:nth-child(n+25),
#honor .partner-card:nth-child(n+25) { display: none; }
/* 窄桌面收紧间距，避免 8 列被挤变形 */
@media (max-width: 1200px) and (min-width: 961px) {
  #partners .partner-grid,
  #honor .partner-grid { gap: 10px; }
  #partners .partner-card,
  #honor .partner-card { padding: 14px 8px 12px; }
  #partners .partner-logo,
  #honor .partner-logo { height: 46px; }
  #partners .partner-logo img,
  #honor .partner-logo img { max-height: 46px; }
  #partners .partner-name,
  #honor .partner-name { font-size: 11px; min-height: 30px; }
}
/* 首页：移动端 / 平板不显示（960px 及以下全站切移动端导航，此处同步隐藏） */
@media (max-width: 960px) {
  #partners { display: none; }
}
/* 集团概况页：8 列在窄屏放不下，逐级降级为 3 列 / 2 列（内容不隐藏，只是换行变多） */
@media (max-width: 960px) {
  #honor .partner-grid { grid-template-columns: repeat(3, 1fr); gap: 14px; }
  #honor .partner-card { padding: 20px 10px 16px; gap: 10px; }
  #honor .partner-logo { height: 52px; }
  #honor .partner-logo img { max-height: 52px; }
  #honor .partner-name { font-size: 12px; min-height: 32px; }
}
@media (max-width: 640px) {
  #honor .partner-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  #honor .partner-card { padding: 18px 10px 14px; }
  #honor .partner-logo { height: 50px; }
  #honor .partner-logo img { max-height: 50px; }
  #honor .partner-name { font-size: 11.5px; min-height: 32px; }
}

/* ============ 联系 ============ */
.contact-grid { display: grid; grid-template-columns: 1fr 1.4fr; gap: 40px; align-items: start; }
.contact-info-item {
  display: flex;
  gap: 16px;
  padding: 18px 0;
  border-bottom: 1px solid var(--gray-200);
}
.contact-info-item .ico {
  flex-shrink: 0;
  width: 46px; height: 46px;
  border-radius: 10px;
  background: var(--orange-light);
  color: var(--orange);
  display: flex; align-items: center; justify-content: center;
  font-size: 20px;
}
.contact-info-item b { display: block; font-size: 15px; }
.contact-info-item span { color: var(--gray-600); font-size: 14px; }

.form-card {
  background: var(--white);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 36px;
}
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-field { margin-bottom: 16px; }
.form-field label { display: block; font-size: 14px; font-weight: 600; margin-bottom: 6px; }
.form-field input, .form-field select, .form-field textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--gray-200);
  border-radius: 8px;
  font-size: 14px;
  font-family: inherit;
  transition: border 0.2s;
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus {
  outline: none;
  border-color: var(--orange);
}
.form-field textarea { resize: vertical; min-height: 120px; }
.service-options { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 18px; }
.service-options label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border: 1px solid var(--gray-200);
  border-radius: 30px;
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
}
.service-options input { display: none; }
.service-options label:has(input:checked) { background: var(--orange); color: var(--white); border-color: var(--orange); }

/* ============ 页脚 ============ */
.site-footer { background: var(--black); color: rgba(255, 255, 255, 0.7); padding: 64px 0 0; }
/* 页脚正文：品牌 logo → 公司介绍 → 联系方式，平铺成一排（原来的四个导航列已移除）。
   flex + wrap 而不是 grid：三块的宽度差异很大（logo 是固定宽、介绍是弹性长文、号码是固定宽），
   space-between 让它们自动摊到内容栏两端，窄屏放不下时按 320px 基线换行，不用手写断点。 */
.footer-flat {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 32px 56px;
  padding-bottom: 48px;
}
.footer-flat .footer-brand { flex: 0 0 auto; }
.footer-flat .footer-brand img { height: 52px; width: auto; display: block; }
.footer-intro {
  flex: 1 1 320px;
  min-width: 260px;
  font-size: 14px;
  line-height: 1.95;
  color: rgba(255, 255, 255, 0.7);
}
.footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding: 20px 0;
  font-size: 13px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
}
.footer-bottom a { color: var(--gold-500); }

/* ============ 响应式 ============ */
@media (max-width: 1200px) {
  .partner-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 960px) {
  .services-grid, .expo-grid { grid-template-columns: repeat(2, 1fr); }
  .partner-grid { grid-template-columns: repeat(3, 1fr); }
  .contact-grid { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .hero h1 { font-size: 40px; }
  /* 页脚：三块平铺放不下时按 320px 基线自动换行，这里只收紧间距 */
  .footer-flat { gap: 26px 40px; }
  .nav-list {
    display: none;
    position: absolute;
    top: 72px; left: 0; right: 0;
    background: var(--black);
    flex-direction: column;
    padding: 16px 24px;
    gap: 4px;
  }
  .nav-list.open { display: flex; }
  .nav-toggle { display: block; }
  /* 首页新闻 */
  .home-news-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  /* 首页「近期展会」「新闻中心」移动端保持两列：一排四个 → 两排两个。
     不跟随 services/culture 收成单列。 */
  .services-grid, .culture-grid { grid-template-columns: 1fr; }
  .expo-grid, .home-news-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .hero h1 { font-size: 32px; }
  .section { padding: 56px 0; }
  .page-banner h1 { font-size: 30px; }
  .footer-bottom { justify-content: center; text-align: center; }
}

/* ============ 预订展位 / 咨询搭建 双 CTA（卡片底部）============ */
/* ⚠️ 这组样式是「白底展会卡片里成对出现的描边幽灵按钮」（透明底 + 金边 + 炭黑字）。
   它必须只作用于**不带 .btn 的版本**，所以全部加 :not(.btn) 限定。
   带 .btn/.btn-primary/.btn-dark 的用法是「深色区块里的实底按钮」，两者特异性相同，
   而本组在文件里更靠后 → 不加限定就会把 .btn-primary 的金底覆盖成透明底 + 炭黑字，
   在深色 CTA 区块上整个按钮与背景融成一片（案例页/案例详情页 CTA 栽过。
   历史上已用 `.expo-head-actions .expo-consult-btn` 这类后代选择器打过补丁，
   但根因在这里，逐个补漏不划算）。 */
.expo-book-btn:not(.btn),
.expo-consult-btn:not(.btn) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  min-width: 0;
  padding: 9px 4px;
  border-radius: 6px;
  border: 1px solid var(--gold-500);
  background: transparent;
  color: var(--navy-800);
  font-size: 13.5px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
  line-height: 1.2;
}
.expo-book-btn:not(.btn) { background: var(--gold-500); border-color: var(--gold-500); }
.expo-book-btn:not(.btn):hover { background: var(--gold-600); border-color: var(--gold-600); }
.expo-consult-btn:not(.btn):hover { background: var(--gold-500); border-color: var(--gold-500); }

.expo-card-actions {
  display: flex;
  gap: 8px;
  margin-top: auto;
  padding-top: 6px;
}

.booking-mask {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: 20px;
}
.booking-mask.open { display: flex; }
.booking-modal {
  background: var(--white);
  border-radius: 12px;
  width: 100%;
  max-width: 480px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  animation: bookingIn 0.25s ease;
}
@keyframes bookingIn {
  from { transform: translateY(20px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
.booking-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 24px;
  border-bottom: 1px solid #eee;
}
.booking-head h3 {
  font-size: 20px;
  color: var(--black);
  margin: 0;
}
.booking-head h3::before {
  content: '';
  display: inline-block;
  width: 4px; height: 18px;
  background: var(--orange);
  margin-right: 10px;
  vertical-align: -2px;
  border-radius: 2px;
}
.booking-close {
  border: none;
  background: none;
  font-size: 28px;
  line-height: 1;
  color: #999;
  cursor: pointer;
  padding: 0 4px;
}
.booking-close:hover { color: var(--black); }
#booking-form { padding: 24px; }
.booking-submit { width: 100%; }
.booking-tip {
  margin-top: 12px;
  font-size: 14px;
  text-align: center;
}
#booking-form input[readonly] {
  background: #f5f5f5;
  color: #555;
  cursor: default;
}

/* ============ 文件下载弹窗（留资后下载） ============ */
#download-form input[readonly] {
  background: #f5f5f5;
  color: #555;
  cursor: default;
}
.dl-file-list { display: flex; flex-direction: column; gap: 8px; }
/* 注意：选择器必须压过 .form-field label{display:block}，否则卡片内会被块级化成纵向堆叠 */
.dl-file-list .dl-file-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  margin-bottom: 0;
  border: 1px solid var(--gray-200);
  border-radius: 8px;
  cursor: pointer;
  transition: border-color 0.2s, background 0.2s;
}
.dl-file-item:hover { border-color: var(--gold-500); background: var(--gold-50); }
.dl-file-item input[type="radio"] {
  width: 16px;
  height: 16px;
  flex: none;
  accent-color: var(--gold-600);
}
.dl-file-item:has(input:checked) { border-color: var(--gold-500); background: var(--gold-50); }
.dl-file-ext {
  flex: none;
  width: 44px;
  height: 44px;
  border-radius: 6px;
  background: var(--navy-800);
  color: var(--white);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.5px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dl-file-meta { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.dl-file-meta b {
  font-size: 14px;
  font-weight: 600;
  color: var(--gray-900);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dl-file-meta i { font-style: normal; font-size: 12px; color: var(--gray-400); }
.dl-file-pick { flex: none; font-size: 13px; font-weight: 600; color: var(--gray-400); }
.dl-file-pick i { font-style: normal; }
.dl-file-pick b { display: none; font-weight: 700; color: var(--gold-600); }
.dl-file-item:has(input:checked) .dl-file-pick i { display: none; }
.dl-file-item:has(input:checked) .dl-file-pick b { display: inline; }
/* 无资料空态：说明 + 引导留资（不再是浏览器原生提示） */
.dl-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 22px 18px;
  border: 1px dashed var(--gray-200);
  border-radius: 10px;
  background: var(--gray-50);
  text-align: center;
}
.dl-empty-ico {
  width: 44px;
  height: 44px;
  margin-bottom: 2px;
  border-radius: 50%;
  background: var(--gold-50);
  color: var(--gold-600);
  display: flex;
  align-items: center;
  justify-content: center;
}
.dl-empty b { font-size: 15px; color: var(--gray-900); }
.dl-empty p { margin: 0; font-size: 13px; line-height: 1.7; color: var(--gray-600); max-width: 300px; }
.dl-privacy {
  margin: 10px 0 0;
  font-size: 12px;
  line-height: 1.6;
  color: var(--gray-400);
  text-align: center;
}

/* ============ 前台富文本内容（后台可视化编辑产出） ============ */
.rich-text { line-height: 2; }
.rich-text h2 { font-size: 22px; margin: 14px 0 8px; color: var(--gray-900); }
.rich-text h3 { font-size: 18px; margin: 12px 0 6px; color: var(--gray-900); }
.rich-text p { margin: 0 0 12px; }
.rich-text ul, .rich-text ol { padding-left: 24px; margin: 0 0 12px; }
.rich-text ul { list-style: disc; }
.rich-text ol { list-style: decimal; }
.rich-text blockquote {
  margin: 0 0 12px;
  padding: 8px 16px;
  border-left: 3px solid var(--orange);
  background: var(--orange-light);
  color: var(--gray-600);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
.rich-text img { max-width: 100%; border-radius: var(--radius-sm); }
/* 正文内嵌照片可点击放大（灯箱见 public/js/lightbox.js）。
   只对挂了 data-lightbox 的正文生效：新闻详情页同样是 .rich-text 但没挂属性，行为不变。 */
.rich-text[data-lightbox] img { cursor: zoom-in; }
.rich-text a { color: var(--orange); text-decoration: underline; }
.rich-text strong { font-weight: 700; }
.rich-text em { font-style: italic; }

/* ============ 展会详情页：卡片化分栏布局（参照 txfair 风格） ============ */
.expo-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 28px;
  align-items: start;
}
.expo-detail-main {
  display: flex;
  flex-direction: column;
  gap: 24px;
  min-width: 0;
}
/* 详情页内容卡（限定在详情主列内，避免污染列表页的 .expo-card 卡片） */
.expo-detail-main .expo-card {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 28px 32px;
}
/* 顶部信息卡：两列布局（logo | 信息+按钮） */
.expo-head-card {
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr);
  gap: 28px;
  align-items: start;
}
.expo-head-logo {
  height: 200px;
  border-radius: var(--radius-sm);
  overflow: hidden;
  background: var(--gray-50);
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--gray-200);
}
.expo-head-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.expo-head-info {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.expo-head-info h1 {
  font-size: 24px;
  line-height: 1.35;
  font-weight: 800;
  color: var(--gray-900);
}
.expo-title-en {
  font-size: 15px;
  color: var(--gray-400);
  letter-spacing: 0.5px;
  margin-top: -4px;
}
.expo-head-meta {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 2px;
}
.em-row {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
}
.em-label {
  flex: 0 0 80px;
  color: var(--gray-400);
}
.em-row > span:last-child {
  font-weight: 600;
  color: var(--gray-900);
}
.expo-head-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 8px;
}
.expo-head-actions .btn {
  width: 100%;
  padding: 13px 12px;
  margin-top: 0;
  border: 1px solid transparent;
}
/* 详情页顶部按钮需压过卡片用的 .expo-book-btn 描边样式（后者在文件中靠后） */
.expo-head-actions .expo-book-btn {
  background: var(--gold-500);
  color: var(--navy-900);
  border-color: var(--gold-500);
}
.expo-head-actions .expo-book-btn:hover { background: var(--gold-600); border-color: var(--gold-600); color: var(--navy-900); }
.expo-head-actions .expo-consult-btn {
  background: var(--navy-800);
  color: var(--white);
  border-color: var(--navy-800);
}
.expo-head-actions .expo-consult-btn:hover { background: var(--navy-600); border-color: var(--navy-600); }
/* 有资料文件时：三个 CTA 等宽一行 */
.expo-head-actions.has-file { grid-template-columns: repeat(3, 1fr); }
.expo-head-actions .expo-file-btn {
  background: var(--white);
  color: var(--navy-800);
  border-color: var(--navy-800);
}
.expo-head-actions .expo-file-btn:hover { background: var(--navy-800); color: var(--white); }
.head-contact-body {
  display: flex;
  gap: 14px;
  align-items: center;
}
.head-contact-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.hc-name {
  font-size: 16px;
  font-weight: 700;
  color: var(--gray-900);
  margin-bottom: 4px;
  padding-bottom: 6px;
  border-bottom: 1px dashed var(--accent-soft-3);
}
.hc-line {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--gray-600);
  white-space: nowrap;
}
.hc-ico { font-size: 14px; flex: 0 0 16px; text-align: center; }
.hc-label {
  color: var(--gray-400);
  flex: 0 0 28px;
}
.hc-line a {
  color: var(--gray-900);
  font-weight: 600;
  font-family: 'Roboto Mono', monospace;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.head-contact-qr {
  flex: 0 0 96px;
  width: 96px;
  height: 96px;
  border: 1px solid var(--accent-soft-3);
  border-radius: 4px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.head-contact-qr img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.qr-fallback {
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 4px;
}
.qr-hint {
  display: block;
  margin: 6px 0 0;
  text-align: center;
  font-size: 11px;
  color: var(--gray-500);
  letter-spacing: 0.5px;
}
.side-contact-card .qr-hint,
.expo-detail-side .qr-hint {
  margin-top: 8px;
}
/* 卡片标题：橙色左边条 */
.expo-card-title {
  font-size: 20px;
  font-weight: 700;
  color: var(--gray-900);
  margin-bottom: 18px;
  padding-left: 14px;
  position: relative;
}
.expo-card-title::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 20px;
  border-radius: 2px;
  background: var(--orange);
}
/* 展品范围列表 */
.expo-scope-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px 28px;
}
.expo-scope-list li {
  position: relative;
  padding-left: 20px;
  font-size: 14.5px;
  color: var(--gray-600);
}
.expo-scope-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 9px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--orange);
}
/* 展品照片网格 */
.expo-photos {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.expo-photos img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--radius-sm);
  border: 1px solid var(--gray-200);
}
/* 点击放大（灯箱见 lightbox.js）：只对真实现场照片给「可点」的视觉暗示，
   回退态放的是一张展会 logo（.is-logo），放大没有意义，不给 zoom-in 也不加 data-lightbox */
.expo-photos:not(.is-logo) img { cursor: zoom-in; transition: transform 0.3s, box-shadow 0.3s; }
.expo-photos:not(.is-logo) img:hover { transform: scale(1.02); box-shadow: var(--shadow-lg); }
/* 未上传现场照片时：回退展示展会 logo / 分类封面，单张限宽、完整不裁剪 */
.expo-photos.is-logo {
  grid-template-columns: minmax(0, 220px);
}
.expo-photos.is-logo img {
  object-fit: contain;
  padding: 18px;
  background: var(--white);
}
/* 右侧栏 */
.expo-detail-side {
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: sticky;
  top: 20px;
}
.side-card {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 24px;
}
.side-card-title {
  font-size: 17px;
  font-weight: 700;
  color: var(--gray-900);
  margin-bottom: 18px;
  padding-left: 12px;
  position: relative;
}
.side-card-title::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 18px;
  border-radius: 2px;
  background: var(--orange);
}
/* 相关展会：不另起一套样式，直接复用新闻页右侧「推荐展会」的卡片（.side-expo*，见 522 行附近），
   这样两处侧栏天然一致。这里只负责「侧栏落到全宽之后」的列数 ——
   断点用 960px 而不是新闻页的 1100px：.expo-detail-grid 是 960px 才折成单列，
   960~1100px 之间侧栏还在右侧窄栏里，这时若排双列会挤爆。
   末项分隔线由 .side-expo:last-child 处理，无需重复。
   ⚠️ `.side-related` 这个类名被 server.js 的 relatedBlock 与 views/exhibition.html 的
   render() 两侧同时使用，去掉它会导致「首屏有样式、JS 接管后变样」。 */
@media (max-width: 960px) {
  .side-related { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 22px; }
}
@media (max-width: 640px) {
  .side-related { grid-template-columns: 1fr; }
}

/* 响应式：窄屏折叠为单列 */
@media (max-width: 1100px) {
  .expo-head-card {
    grid-template-columns: 160px minmax(0, 1fr);
  }
  .expo-head-logo { height: 160px; }
}
@media (max-width: 960px) {
  .expo-detail-grid {
    grid-template-columns: 1fr;
  }
  .expo-detail-side {
    position: static;
  }
  .expo-scope-list {
    grid-template-columns: 1fr;
  }
  .expo-photos {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 640px) {
  .expo-head-card {
    grid-template-columns: 1fr;
  }
  .expo-head-logo { height: 180px; }
  .expo-detail-main .expo-card {
    padding: 20px;
  }
  .expo-head-info h1 {
    font-size: 21px;
  }
  .expo-photos {
    grid-template-columns: 1fr;
  }
  /* 移动端：三个 CTA 两行显示，「文件下载」整行 */
  .expo-head-actions.has-file { grid-template-columns: 1fr 1fr; }
  .expo-head-actions.has-file .expo-file-btn { grid-column: 1 / -1; }
}

/* ============ 侧栏「联系销售」卡片（替代原顶部名片）============ */
.side-contact-card {
  background: linear-gradient(180deg, var(--accent-soft-1), #fff);
  border: 1px solid var(--accent-soft-2);
}
.side-contact-card .side-card-title {
  margin-bottom: 14px;
}
.side-contact-card .head-contact-body {
  display: flex;
  flex-direction: column;
  /* 撑满卡片宽度：两位联系人共用同一左边界与同一二维码列（上下对齐） */
  align-items: stretch;
  gap: 16px;
}
/* 单个联系人：左侧信息 + 右侧二维码列；姓名/首行与二维码顶端齐平，上下两块同网格 */
.side-contact-card .hc-person {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}
.side-contact-card .hc-person + .hc-person {
  padding-top: 16px;
  border-top: 1px dashed var(--accent-soft-3);
}
.side-contact-card .hc-qr-col {
  flex: 0 0 96px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.side-contact-card .hc-qr-col .qr-hint {
  margin-top: 6px;
  font-size: 11px;
  color: var(--gray-400);
  white-space: nowrap;
}
.side-contact-card .head-contact-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.side-contact-card .hc-name {
  font-size: 16px;
  font-weight: 700;
  color: var(--gray-900);
  margin-bottom: 4px;
  padding-bottom: 6px;
  border-bottom: 1px dashed var(--accent-soft-3);
}
.side-contact-card .hc-line {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--gray-600);
  white-space: nowrap;
}
.side-contact-card .hc-ico { font-size: 14px; flex: 0 0 16px; text-align: center; }
.side-contact-card .hc-label {
  color: var(--gray-400);
  flex: 0 0 28px;
}
.side-contact-card .hc-line a {
  color: var(--gray-900);
  font-weight: 600;
  font-family: 'Roboto Mono', monospace;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.side-contact-card .head-contact-qr {
  flex: 0 0 96px;
  width: 96px;
  height: 96px;
  border: 1px solid var(--accent-soft-3);
  border-radius: 4px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.side-contact-card .head-contact-qr img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
@media (max-width: 960px) {
  .side-contact-card .head-contact-qr { flex: 0 0 100px; width: 100px; height: 100px; }
}

/* ============================================================
   集团站组件库
   ============================================================ */

/* ---------- 顶部信息条 ---------- */
.util-bar {
  background: var(--navy-900);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  font-size: 13px;
  color: rgba(255, 255, 255, 0.6);
}
.util-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 36px;
  gap: 16px;
}
.util-slogan {
  letter-spacing: 0.6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.util-right { display: flex; align-items: center; gap: 14px; white-space: nowrap; }
.util-right a { display: inline-flex; align-items: baseline; gap: 6px; transition: color 0.2s; }
.util-right a:hover { color: var(--gold-500); }
/* 标签（服务热线 / 手机）弱化，号码用主色，这样并排两个号码时层级清楚 */
.util-right .util-tag { color: rgba(255, 255, 255, 0.55); font-weight: 400; letter-spacing: 0; }
.util-sep { width: 1px; height: 12px; background: rgba(255, 255, 255, 0.16); }
.util-tel,
.util-mobile { color: var(--gold-500); font-weight: 600; letter-spacing: 0.5px; }
.util-tel b,
.util-mobile b { font-weight: 700; }

/* 管理员入口（页头「返回后台」）：未登录时被 main.js 置 hidden 且不占位。
   ⚠️ 必须显式写 [hidden] 规则 —— `.util-right a` 的 display:inline-flex 属于作者样式，
   会盖掉浏览器默认的 `[hidden]{display:none}`，不写就藏不住（会露给所有访客）。 */
.util-right a[hidden],
.util-right span[hidden] { display: none; }
.util-admin { color: rgba(255, 255, 255, 0.72); align-items: center; }
.util-admin svg { width: 13px; height: 13px; }

/* ---------- 头部容器（承载信息条 + 主导航） ---------- */
.site-header {
  background: var(--navy-800);
  box-shadow: 0 2px 16px rgba(6, 26, 46, 0.3);
}
.header-inner { height: 68px; }

/* ---------- 主导航（含二级下拉） ---------- */
.nav-list { display: flex; align-items: center; gap: 2px; }
.nav-item { position: relative; }
.nav-item > a {
  display: block;
  position: relative;
  padding: 10px 16px;
  font-size: 15px;
  color: rgba(255, 255, 255, 0.84);
  border-radius: 6px;
  transition: color 0.2s;
}
.nav-item > a::after {
  content: "";
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 2px;
  height: 2px;
  background: var(--gold-500);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.25s;
}
.nav-item:hover > a { color: var(--white); }
.nav-item:hover > a::after { transform: scaleX(1); }
.nav-item > a.active { color: var(--gold-500); font-weight: 600; }
.nav-item > a.active::after { transform: scaleX(1); }
.caret {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 7px;
  vertical-align: middle;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4.5px solid currentColor;
  opacity: 0.65;
  transition: transform 0.22s;
}
.nav-item.has-drop:hover .caret { transform: rotate(180deg); }
.nav-drop {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(10px);
  min-width: 180px;
  background: var(--white);
  border-top: 3px solid var(--gold-500);
  border-radius: 0 0 10px 10px;
  box-shadow: 0 18px 44px rgba(6, 26, 46, 0.24);
  padding: 14px 8px 8px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.22s, transform 0.22s, visibility 0.22s;
  z-index: 20;
}
.nav-item.has-drop:hover .nav-drop {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}
.nav-drop a {
  display: block;
  padding: 9px 14px;
  font-size: 14px;
  color: var(--gray-900);
  border-radius: 6px;
  transition: background 0.18s, color 0.18s, padding-left 0.18s;
}
.nav-drop a:hover { background: var(--navy-50); color: var(--navy-800); padding-left: 20px; }

/* ---------- 业务板块 ---------- */
.biz-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.biz-card {
  position: relative;
  display: block;
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius);
  padding: 30px 28px 26px;
  transition: transform 0.28s, box-shadow 0.28s, border-color 0.28s;
  overflow: hidden;
}
.biz-card::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 3px;
  background: var(--gold-500);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s;
}
.biz-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); border-color: transparent; }
.biz-card:hover::after { transform: scaleX(1); }
.biz-no {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--gold-600);
}
.biz-icon {
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: var(--navy-50);
  color: var(--navy-800);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  margin: 14px 0 18px;
  transition: background 0.28s, color 0.28s;
}
.biz-card:hover .biz-icon { background: var(--navy-800); color: var(--gold-500); }

/* 核心服务卡（展位预订 / 展台搭建）—— 金边 + 角标 */
.biz-card-feature {
  border-color: var(--gold-500);
  background: linear-gradient(180deg, var(--gold-50) 0%, var(--white) 60%);
}
.biz-card-feature::after { background: var(--gold-500); transform: scaleX(1); }
.biz-flag {
  position: absolute;
  top: 14px;
  right: 14px;
  background: var(--gold-500);
  color: var(--navy-900);
  font-size: 12px;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 20px;
  letter-spacing: 0.4px;
}
.biz-card h3 { font-size: 19px; color: var(--navy-800); margin-bottom: 4px; }
.biz-card h4 {
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: 1.2px;
  color: var(--gray-400);
  text-transform: uppercase;
  margin-bottom: 12px;
}
.biz-card p { color: var(--gray-600); font-size: 14px; line-height: 1.75; }
.biz-more {
  display: inline-block;
  margin-top: 16px;
  font-size: 13px;
  font-weight: 600;
  color: var(--navy-600);
  transition: color 0.2s;
}
.biz-card:hover .biz-more { color: var(--gold-600); }

/* ---------- 数据统计块（集团概况页统计卡） ----------
   ⚠️ 首页原「全球服务网络」深色区块已下线（HTML 已删除），所以这里不再有 .global-band 深底样式；
   .global-grid / .global-item / .global-item b / .global-item span 仍被 views/group.html 的
   .global-grid.is-cards 复用（is-cards 只覆盖了字号与颜色，display/margin/font-size 仍靠这几条），
   不要因为"首页不用了"而顺手删掉。 */
.global-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; }
.global-item { text-align: center; }
.global-item b {
  display: block;
  font-size: 40px;
  font-weight: 800;
  color: var(--gold-500);
  line-height: 1.1;
  letter-spacing: -0.5px;
}
.global-item span { display: block; margin-top: 10px; font-size: 14px; color: rgba(255, 255, 255, 0.66); }

/* 浅底版统计卡（集团概况页，原先是写在标签上的内联色值，换主题不会跟着变，这里收成类） */
.global-grid.is-cards { max-width: 920px; margin: 56px auto 0; gap: 20px; }
.global-grid.is-cards .global-item {
  background: var(--gray-50);
  border: 1px solid var(--gray-200);
  border-radius: 12px;
  padding: 26px 16px;
}
.global-grid.is-cards .global-item b { font-size: 34px; color: var(--navy-800); }
.global-grid.is-cards .global-item span { margin-top: 6px; color: var(--gray-600); }

/* ---------- 集团简介（图文两栏） ---------- */
.intro-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 56px; align-items: center; }
.intro-media {
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--navy-50);
  /* 锁死画框比例：图片是 loading="lazy" 的，不锁的话图未加载时高度不确定，
     图一加载就撑高 → 右侧文字整体下移（CLS）。锁 4:3 后加载前后完全一致。
     换图不必改这里，img 是 object-fit: cover，任意比例都填得满。
     ⚠️ 绝对不要再加 min-height：aspect-ratio 会拿它反推最小宽度
     （340px × 4/3 = 453px），窄屏直接撑破容器造成横向滚动。 */
  aspect-ratio: 4 / 3;
  width: 100%;
  max-width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--gray-200);
}
.intro-media img { width: 100%; height: 100%; object-fit: cover; }
/* 有图时隐藏占位图标：SSR 把 <img> 注入在占位之前，用相邻兄弟选择器互斥，
   不用 :has，也不用把占位标记搬进服务端（模板继续管自己的视觉） */
.intro-media img ~ .intro-placeholder { display: none; }
.intro-media .intro-placeholder { font-size: 84px; opacity: 0.28; }
.intro-body .kicker {
  display: inline-block;
  color: var(--gold-600);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  margin-bottom: 12px;
}
.intro-body h2 { font-size: 32px; font-weight: 800; color: var(--navy-800); line-height: 1.3; }
.intro-body > p { margin-top: 16px; color: var(--gray-600); font-size: 15px; }
.intro-points { margin-top: 26px; display: grid; grid-template-columns: 1fr 1fr; gap: 14px 20px; }
.intro-points li { display: flex; gap: 10px; font-size: 14px; color: var(--gray-900); align-items: flex-start; }
.intro-points li::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gold-500);
  margin-top: 8px;
  flex-shrink: 0;
}

/* ---------- 发展历程时间线 ---------- */
.timeline { position: relative; max-width: 860px; margin: 0 auto; padding-left: 36px; }
.timeline::before {
  content: "";
  position: absolute;
  left: 7px;
  top: 10px;
  bottom: 10px;
  width: 2px;
  background: var(--gray-200);
}
.tl-item { position: relative; padding-bottom: 34px; }
.tl-item:last-child { padding-bottom: 0; }
.tl-item::before {
  content: "";
  position: absolute;
  left: -36px;
  top: 6px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--white);
  border: 3px solid var(--gold-500);
}
.tl-year {
  display: inline-block;
  font-size: 14px;
  font-weight: 800;
  color: var(--navy-800);
  letter-spacing: 1px;
  padding: 3px 14px;
  border-radius: 16px;
  background: rgba(200, 164, 92, 0.16);
}
.tl-title { font-size: 16.5px; font-weight: 700; margin-top: 10px; color: var(--navy-800); }
/* 发展历程中的成员公司 logo（浅底用深色版；深底场景换 -light 版） */
.tl-head { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 10px; }
.tl-head .tl-title { margin-top: 0; }
.tl-logo { height: 28px; width: auto; }
.tl-desc { font-size: 14px; color: var(--gray-600); margin-top: 6px; line-height: 1.88; max-width: 760px; }

/* ---------- 核心优势 ---------- */
.adv-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
.adv-card {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius);
  padding: 30px 24px;
  transition: transform 0.25s, box-shadow 0.25s, border-color 0.25s;
}
.adv-card:hover { border-color: var(--gold-500); box-shadow: var(--shadow); transform: translateY(-4px); }
.adv-icon {
  width: 46px;
  height: 46px;
  border-radius: 10px;
  background: var(--gold-50);
  color: var(--gold-600);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  margin-bottom: 18px;
}
.adv-card h3 { font-size: 17px; color: var(--navy-800); margin-bottom: 8px; }
.adv-card p { font-size: 14px; color: var(--gray-600); line-height: 1.75; }

/* ---------- CTA 行动条 ---------- */
.cta-band {
  background: linear-gradient(135deg, var(--navy-900) 0%, var(--navy-600) 100%);
  border-radius: var(--radius);
  padding: 46px 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  flex-wrap: wrap;
  color: var(--white);
}
.cta-band h3 { font-size: 26px; font-weight: 800; }
.cta-band p { margin-top: 8px; color: rgba(255, 255, 255, 0.7); font-size: 15px; }
.cta-actions { display: flex; gap: 14px; flex-wrap: wrap; }

/* ---------- 集团页脚补充 ---------- */
.site-footer { background: var(--navy-900); }
.footer-net {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 26px;
  padding: 18px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  font-size: 13px;
  color: rgba(255, 255, 255, 0.58);
}
.footer-net b { color: var(--gold-500); font-weight: 600; }
/* 页脚品牌区的联系方式：服务热线（固话）+ 手机号 + 工作时间，纵向排在自己的块里。
   页脚正文是 flex 横排（logo / 介绍 / 这块），所以这里的 margin-top 要归零。 */
.footer-tel { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.footer-flat .footer-tel { margin-top: 0; flex: 0 0 auto; }
.footer-tel a { display: inline-flex; align-items: baseline; gap: 8px; transition: opacity 0.2s; }
.footer-tel a:hover { opacity: 0.8; }
.footer-tel .ft-tag { font-size: 12px; color: rgba(255, 255, 255, 0.5); }
.footer-tel .ft-main b {
  font-size: 22px;
  font-weight: 800;
  color: var(--gold-500);
  letter-spacing: 0.5px;
}
.footer-tel .ft-sub .ft-num {
  font-size: 22px;
  font-weight: 800;
  color: var(--gold-500);
  letter-spacing: 0.5px;
}
.footer-tel .ft-hours { font-size: 12px; color: rgba(255, 255, 255, 0.5); }

/* ---------- 业务板块详情页 ---------- */
.biz-nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-bottom: 8px;
}
.biz-nav a {
  padding: 8px 18px;
  border: 1px solid var(--gray-200);
  border-radius: 30px;
  font-size: 14px;
  color: var(--gray-900);
  transition: border-color 0.2s, color 0.2s, background 0.2s;
}
.biz-nav a:hover { border-color: var(--gold-500); color: var(--navy-800); background: var(--gold-50); }
.biz-detail { max-width: 940px; margin: 0 auto; }
.biz-detail-head { text-align: center; }
.biz-detail-head .biz-no { font-size: 13px; font-weight: 700; letter-spacing: 3px; color: var(--gold-600); }
.biz-detail-head h2 { font-size: 30px; font-weight: 800; color: var(--navy-800); margin-top: 8px; }
.biz-detail-head h4 {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--gray-400);
  margin-top: 8px;
}
.biz-detail-desc {
  max-width: 740px;
  margin: 18px auto 0;
  text-align: center;
  color: var(--gray-600);
  font-size: 15px;
  line-height: 1.85;
}
.biz-feat { margin-top: 34px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px 20px; }
.biz-feat li {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius-sm);
  padding: 15px 18px;
  font-size: 14px;
  color: var(--gray-900);
  line-height: 1.7;
}
.biz-feat li::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gold-500);
  margin-top: 8px;
  flex-shrink: 0;
}

/* 业务详情块底部的双 CTA */
.biz-detail-cta {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 36px;
  padding-top: 28px;
  border-top: 1px dashed var(--gray-200);
}
/* 详情块底部的 .btn-outline / .btn-dark 复用浅底配色（默认 .btn-outline 是给深色 hero 用的白描边）*/
.biz-detail-cta .btn-outline {
  background: var(--white);
  color: var(--navy-800);
  border-color: var(--navy-800);
}
.biz-detail-cta .btn-outline:hover {
  background: var(--navy-800);
  color: var(--white);
  border-color: var(--navy-800);
}
.biz-detail-feature .biz-detail {
  background: var(--white);
  border: 1px solid var(--gold-500);
  border-radius: var(--radius);
  padding: 50px 56px;
  box-shadow: 0 14px 36px rgba(168, 135, 63, 0.10);
}

/* 业务页顶部 banner CTA */
.banner-cta {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 26px;
}

/* ---------- 响应式：集团组件 ---------- */
@media (max-width: 1100px) {
  .util-bar { display: none; }
  .biz-grid { grid-template-columns: repeat(2, 1fr); }
  .adv-grid { grid-template-columns: repeat(2, 1fr); }
  .global-grid { grid-template-columns: repeat(2, 1fr); gap: 34px 24px; }
  .intro-grid { grid-template-columns: 1fr; gap: 36px; }
  .footer-flat { gap: 26px 40px; }

  .nav-list {
    display: none;
    position: absolute;
    top: 68px;
    left: 0;
    right: 0;
    background: var(--navy-900);
    /* 菜单底色与导航条同色系（对比度仅 1.1:1），加一条分隔线让菜单「浮」出来 */
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    flex-direction: column;
    align-items: stretch;
    padding: 12px 20px 20px;
    gap: 2px;
    max-height: calc(100vh - 68px);
    overflow-y: auto;
    box-shadow: 0 18px 40px rgba(6, 26, 46, 0.35);
  }
  .nav-list.open { display: flex; }
  .nav-toggle { display: block; }
  .nav-item > a { padding: 12px 8px; border-radius: 0; }
  .nav-item > a::after { left: 8px; right: auto; width: 26px; bottom: 6px; transform-origin: left; }
  .nav-drop {
    position: static;
    transform: none;
    opacity: 1;
    visibility: visible;
    display: none;
    min-width: 0;
    background: transparent;
    border-top: none;
    border-radius: 0;
    box-shadow: none;
    /* 二级区域：橙色竖线 + 缩进，让「已展开」有明确的视觉锚点，
       不再只靠文字颜色区分（深底深字时整块会糊成一片） */
    border-left: 2px solid rgba(245, 113, 52, 0.55);
    margin: 2px 0 6px 10px;
    padding: 2px 0 6px 12px;
  }
  .nav-item.has-drop.open .nav-drop { display: block; }
  /* 展开中的一级项确定性高亮（触屏 hover 会粘滞，不能依赖它） */
  .nav-item.has-drop.open > a { color: var(--gold-500); font-weight: 600; }
  .nav-item.has-drop.open > a::after { transform: scaleX(1); }
  .nav-drop a { color: rgba(255, 255, 255, 0.88); font-size: 14px; }
  .nav-drop a:hover { background: rgba(255, 255, 255, 0.06); color: var(--gold-500); padding-left: 14px; }
  .nav-item.has-drop:hover .caret { transform: none; }
  .nav-item.has-drop.open .caret { transform: rotate(180deg); }
}

@media (max-width: 640px) {
  .adv-grid, .global-grid { grid-template-columns: 1fr; }
  .intro-points, .biz-feat { grid-template-columns: 1fr; }
  .cta-band { padding: 34px 26px; }
  .cta-band h3 { font-size: 21px; }
  .global-item b { font-size: 32px; }
  /* 移动端页脚：三块竖排（logo / 公司介绍 / 联系方式），顶部汉堡菜单已提供完整导航 */
  .footer-flat {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    padding-bottom: 34px;
  }
  .footer-flat .footer-brand img { height: 44px; }
  /* ⚠️ 竖排时必须把 flex-basis 归零：`.footer-intro` 的 `flex: 1 1 320px` 在 column
     方向上量的是**高度** → 介绍段下面会撑出 320px 的空白。 */
  .footer-intro { flex: 0 0 auto; min-width: 0; font-size: 13.5px; }
  /* 移动端联系方式居中：竖排后 `.footer-tel` 是 fit-content 宽的块（父级 align-items: flex-start），
     只写 align-items: center 只会让号码在自身宽度内居中、整块仍贴左 →
     必须先用 width: 100% 把块撑满内容栏，居中才真正落在页脚中线上。 */
  .footer-tel { width: 100%; align-items: center; text-align: center; }
}

@media (max-width: 380px) {
  .biz-grid { grid-template-columns: 1fr; }
}

/* ============ 品牌线性图标（emoji 统一为 SVG，随容器 color 变色） ============ */
.biz-icon svg { width: 26px; height: 26px; }
.service-icon svg { width: 26px; height: 26px; }
.adv-icon svg { width: 22px; height: 22px; }
.contact-info-item .ico svg { width: 22px; height: 22px; }
.intro-media .intro-placeholder svg { width: 104px; height: 104px; }
.hc-ico { display: inline-flex; align-items: center; }
.hc-ico svg { display: block; }
.expo-meta svg, .expo-head-meta svg, .expo-card .expo-meta svg { vertical-align: -2px; opacity: 0.85; }

/* ============================================================
   展会中心（全宽布局 · 多条件筛选）
   ============================================================ */
.wide { max-width: var(--container-wide); margin: 0 auto; padding: 0 var(--container-wide-pad); }

/* 本页内容列是加宽栏，导航与页脚必须同步加宽 ——
   否则顶部 logo 与下方内容不在同一条左基准线上（1920px 视口下会错开 180px）。
   由 <body class="layout-wide"> 驱动，纯 CSS，SSR 直出即生效（无 JS 也不会错位、无闪动）。 */
body.layout-wide .site-header .container,
body.layout-wide .site-footer .container {
  max-width: var(--container-wide);
  padding-left: var(--container-wide-pad);
  padding-right: var(--container-wide-pad);
}

/* ---------- 全宽 Hero ---------- */
.expo-hero {
  position: relative;
  overflow: hidden;
  padding: 84px 0 100px;
  background:
    radial-gradient(1100px 420px at 82% -20%, rgba(200, 164, 92, 0.20), transparent 62%),
    linear-gradient(135deg, var(--navy-900) 0%, var(--navy-700) 100%);
}
.expo-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
  background-size: 68px 68px;
  pointer-events: none;
}
.expo-hero .wide { position: relative; z-index: 1; }
.expo-hero-grid { display: grid; grid-template-columns: 1.45fr 1fr; gap: 56px; align-items: center; }
.expo-hero-copy .kicker {
  display: inline-block;
  color: var(--gold-500);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
}
.expo-hero-copy h1 {
  color: var(--white);
  font-size: 42px;
  line-height: 1.26;
  margin: 14px 0 18px;
  letter-spacing: -0.3px;
}
.expo-hero-copy h1 em { font-style: normal; color: var(--gold-500); }
.expo-hero-copy p {
  color: rgba(255, 255, 255, 0.72);
  font-size: 15px;
  line-height: 1.8;
  max-width: 580px;
}
.expo-hero-actions { display: flex; gap: 14px; margin-top: 28px; flex-wrap: wrap; }
.expo-hero-meta {
  display: flex;
  gap: 28px;
  margin-top: 26px;
  flex-wrap: wrap;
  color: rgba(255, 255, 255, 0.58);
  font-size: 13.5px;
}
.expo-hero-stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.expo-hero-stats > div {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 12px;
  padding: 20px 22px;
}
.expo-hero-stats b { display: block; font-size: 34px; line-height: 1.1; color: var(--gold-500); }
.expo-hero-stats span { color: rgba(255, 255, 255, 0.68); font-size: 13px; }

/* ---------- 筛选条（浮于 Hero 底边） ---------- */
.expo-filter {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr 1fr auto;
  gap: 16px;
  align-items: end;
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: 14px;
  box-shadow: 0 18px 46px rgba(10, 37, 64, 0.13);
  padding: 22px 24px;
  margin-top: -48px;
}
.ef-field { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.ef-field label { font-size: 12.5px; font-weight: 600; color: var(--gray-600); letter-spacing: 0.2px; }
.ef-field input,
.ef-field select {
  width: 100%;
  height: 44px;
  padding: 0 12px;
  border: 1px solid var(--gray-200);
  border-radius: 8px;
  background: var(--white);
  color: var(--gray-900);
  font-size: 14px;
  font-family: inherit;
  color-scheme: light;
}
.ef-field select {
  appearance: none;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235a6675' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 16px;
  padding-right: 32px;
}
.ef-field input:focus,
.ef-field select:focus { outline: none; border-color: var(--navy-600); box-shadow: 0 0 0 3px rgba(22, 69, 110, 0.10); }
.ef-field input::placeholder { color: var(--gray-400); }
.ef-actions { display: flex; gap: 10px; }
.ef-search {
  height: 44px;
  padding: 0 28px;
  border: none;
  border-radius: 8px;
  background: var(--gold-500);
  color: var(--navy-900);
  font-size: 14.5px;
  font-weight: 700;
  font-family: inherit;
  white-space: nowrap;
  cursor: pointer;
  transition: background 0.2s;
}
.ef-search:hover { background: var(--gold-600); }
.ef-reset {
  height: 44px;
  padding: 0 18px;
  border: 1px solid var(--gray-200);
  border-radius: 8px;
  background: var(--white);
  color: var(--gray-600);
  font-size: 14px;
  font-family: inherit;
  white-space: nowrap;
  cursor: pointer;
  transition: all 0.2s;
}
.ef-reset:hover { border-color: var(--navy-600); color: var(--navy-800); }

/* ---------- 列表 ---------- */
.expo-list-section { padding: 58px 0 92px; }
.expo-list-head { margin-bottom: 28px; }
.expo-list-head h2 { font-size: 28px; color: var(--navy-800); margin-bottom: 6px; }
.expo-list-head p { color: var(--gray-600); font-size: 14px; }
.expo-list-loading, .expo-empty { grid-column: 1 / -1; text-align: center; color: var(--gray-400); padding: 64px 0; }
.expo-empty p { font-size: 15px; margin-bottom: 4px; }
.expo-empty-actions { margin-top: 18px; display: flex; gap: 12px; justify-content: center; }

/* 全宽 4 列网格 */
.expo-list-section .expo-grid { grid-template-columns: repeat(4, 1fr); gap: 24px; }
.expo-card .expo-book-btn { margin-top: auto; }
.expo-cat { background: var(--gold-500); color: var(--navy-900); }

@media (max-width: 1400px) {
  .expo-list-section .expo-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 1180px) {
  .expo-hero { padding: 66px 0 84px; }
  .expo-hero-grid { grid-template-columns: 1fr; gap: 40px; }
  .expo-hero-copy h1 { font-size: 34px; }
  .expo-filter { grid-template-columns: 1fr 1fr; }
  .ef-actions { grid-column: 1 / -1; }
  .ef-search { flex: 1; }
}
@media (max-width: 860px) {
  .container, .wide { padding: 0 20px; }
  body.layout-wide .site-header .container,
  body.layout-wide .site-footer .container { padding-left: 20px; padding-right: 20px; }
  .expo-hero { padding: 56px 0 78px; }
  .expo-hero-copy h1 { font-size: 28px; }
  .expo-hero-stats { gap: 12px; }
  .expo-hero-stats b { font-size: 26px; }
  .expo-hero-stats > div { padding: 16px; }
  .expo-list-section .expo-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .expo-filter { grid-template-columns: 1fr; padding: 18px; margin-top: -36px; }
  .expo-list-section .expo-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .expo-hero-actions .btn, .expo-hero-actions .btn-outline { flex: 1; text-align: center; }
  .expo-list-head { flex-direction: column; align-items: flex-start; }
  .expo-core-grid { grid-template-columns: 1fr; }
}
/* 极窄屏（< 380px）兜底改为 1 列，避免卡片被挤压 */
@media (max-width: 380px) {
  .expo-list-section .expo-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   展位中心页 · 列表头部（左右布局 + 提示文案）
   ============================================================ */
.expo-list-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  flex-wrap: wrap;
}
.expo-list-side { color: var(--gray-600); font-size: 13.5px; }
.expo-list-tip {
  display: inline-block;
  padding: 6px 14px;
  background: var(--gold-50, #fbf6e8);
  color: var(--navy-800);
  border: 1px solid var(--gold-100, #efe2b5);
  border-radius: 20px;
  font-weight: 500;
}

/* ============================================================
   展位中心页 · 底部核心服务区（聚焦展位预订 + 展台搭建）
   ============================================================ */
.expo-core-section {
  padding: 0 0 92px;
}
.expo-core-head { text-align: center; margin-bottom: 36px; }
.expo-core-head .kicker {
  display: inline-block;
  color: var(--gold-500);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  margin-bottom: 10px;
}
.expo-core-head h2 {
  font-size: 28px;
  color: var(--navy-800);
  margin-bottom: 10px;
  letter-spacing: -0.2px;
}
.expo-core-head p {
  color: var(--gray-600);
  font-size: 15px;
  max-width: 640px;
  margin: 0 auto;
}
.expo-core-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 28px;
}
.expo-core-card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: linear-gradient(135deg, var(--navy-900) 0%, var(--navy-700) 100%);
  color: var(--white);
  border-radius: var(--radius);
  padding: 34px 32px;
  overflow: hidden;
  transition: all 0.25s;
}
.expo-core-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 4px;
  background: var(--gold-500);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s;
}
.expo-core-card:hover { transform: translateY(-6px); box-shadow: 0 18px 40px rgba(10, 37, 64, 0.18); }
.expo-core-card:hover::before { transform: scaleX(1); }
.expo-core-icon {
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.08);
  color: var(--gold-500);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
}
.expo-core-icon svg { width: 26px; height: 26px; }
.expo-core-card h3 {
  font-size: 24px;
  color: var(--white);
  margin-bottom: 12px;
}
.expo-core-card p {
  color: rgba(255, 255, 255, 0.72);
  font-size: 14.5px;
  line-height: 1.8;
  margin-bottom: 22px;
}
.expo-core-cta {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 18px;
  background: var(--gold-500);
  color: var(--navy-900);
  border-radius: 8px;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none;
  transition: background 0.2s;
}
.expo-core-cta:hover { background: var(--gold-600); }

/* ============================================================
   展会中心 - 联系方式区块
   ============================================================ */
.expo-contact-section { padding: 8px 0 96px; }
.expo-contact-head { text-align: center; margin-bottom: 32px; }
.expo-contact-head .kicker {
  display: inline-block;
  color: var(--gold-500);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  margin-bottom: 10px;
}
.expo-contact-head h2 {
  font-size: 28px;
  color: var(--navy-800);
  margin-bottom: 10px;
  letter-spacing: -0.2px;
}
.expo-contact-head p {
  color: var(--gray-600);
  font-size: 15px;
  max-width: 640px;
  margin: 0 auto;
}
.expo-contact-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.ec-item {
  display: flex;
  align-items: center;
  gap: 16px;
  background: var(--white);
  border: 1px solid rgba(10, 37, 64, 0.08);
  border-radius: var(--radius);
  padding: 22px 20px;
  text-decoration: none;
  color: inherit;
  transition: all 0.22s;
}
.ec-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 30px rgba(10, 37, 64, 0.12);
  border-color: var(--gold-500);
}
.ec-item:hover .ec-ico { background: var(--gold-500); color: var(--navy-900); }
.ec-ico {
  flex: 0 0 auto;
  width: 46px; height: 46px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--navy-900) 0%, var(--navy-700) 100%);
  color: var(--gold-500);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.22s;
}
.ec-ico svg { width: 22px; height: 22px; }
.ec-text { display: flex; flex-direction: column; min-width: 0; }
.ec-text b {
  font-size: 13px;
  color: var(--gray-500);
  font-weight: 600;
  margin-bottom: 4px;
}
.ec-text span {
  font-size: 15px;
  color: var(--navy-800);
  font-weight: 700;
  word-break: break-all;
}
@media (max-width: 1100px) {
  .expo-contact-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .expo-contact-grid { grid-template-columns: 1fr; }
}


.core-section .section-head { margin-bottom: 40px; }
.core-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 28px; }
.core-card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius);
  padding: 36px 34px;
  overflow: hidden;
  transition: all 0.25s;
}
.core-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 4px;
  background: var(--gold-500);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s;
}
.core-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); border-color: transparent; }
.core-card:hover::before { transform: scaleX(1); }
.core-head { display: flex; align-items: center; gap: 16px; margin-bottom: 18px; }
.core-icon {
  width: 56px;
  height: 56px;
  flex: 0 0 56px;
  border-radius: 14px;
  background: var(--navy-800);
  color: var(--gold-500);
  display: flex;
  align-items: center;
  justify-content: center;
}
.core-icon svg { width: 28px; height: 28px; }
.core-card h3 { font-size: 24px; color: var(--navy-800); margin-bottom: 3px; }
.core-card h4 {
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: 1.2px;
  color: var(--gray-400);
  text-transform: uppercase;
}
.core-card > p { color: var(--gray-600); font-size: 14.5px; line-height: 1.8; margin-bottom: 20px; }
.core-points { list-style: none; padding: 0; margin: 0 0 26px; display: grid; gap: 11px; }
.core-points li { position: relative; padding-left: 22px; color: var(--gray-900); font-size: 14px; line-height: 1.6; }
.core-points li::before {
  content: "";
  position: absolute;
  left: 1px;
  top: 6px;
  width: 11px;
  height: 6px;
  border-left: 2px solid var(--gold-500);
  border-bottom: 2px solid var(--gold-500);
  transform: rotate(-45deg);
}
.core-cta { align-self: flex-start; margin-top: auto; }

@media (max-width: 860px) {
  .core-grid { grid-template-columns: 1fr; gap: 20px; }
  .core-card { padding: 28px 24px; }
}

/* ============================================================
   首页展会检索卡（浮于 Hero 之上，参考 wheego 单行筛选器）
   ============================================================ */
.expo-search-band { position: relative; z-index: 6; margin-top: -66px; }
.expo-search {
  position: relative;
  background: var(--white);
  border-radius: 18px;
  padding: 22px 26px 18px;
  box-shadow: 0 26px 64px rgba(6, 26, 46, 0.22), 0 2px 6px rgba(6, 26, 46, 0.06);
  border: 1px solid rgba(10, 37, 64, 0.06);
}
.es-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: var(--navy-800);
  color: var(--white);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.6px;
  padding: 7px 16px 7px 13px;
  border-radius: 22px;
  margin-bottom: 18px;
}
.es-chip svg { width: 15px; height: 15px; flex: none; }

.es-row { display: flex; align-items: flex-end; gap: 0; flex-wrap: wrap; }
.es-field {
  flex: 1 1 0;
  min-width: 148px;
  padding: 0 20px;
  border-left: 1px solid var(--gray-200);
}
.es-field:first-child { border-left: 0; padding-left: 2px; }
.es-keyword { flex: 1.35 1 0; }
.es-field label {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: var(--navy-800);
  letter-spacing: 0.4px;
  margin-bottom: 8px;
}
.es-field input,
.es-field select {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  font-family: inherit;
  font-size: 14.5px;
  color: var(--gray-900);
  padding: 6px 0;
  line-height: 1.4;
}
.es-field input::placeholder { color: var(--gray-400); }
.es-field select {
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  padding-right: 22px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%235a6675' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 2px center;
}
.es-field input[type="date"] { cursor: pointer; }
.es-field input:focus, .es-field select:focus { color: var(--navy-700); }

.es-submit {
  flex: 0 0 auto;
  margin-left: 22px;
  padding: 16px 38px;
  border: 0;
  border-radius: 12px;
  background: var(--gold-500);
  color: var(--navy-900);
  font-family: inherit;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 1px;
  cursor: pointer;
  transition: background 0.2s, transform 0.2s, box-shadow 0.2s;
  box-shadow: 0 8px 20px rgba(200, 164, 92, 0.34);
}
.es-submit:hover {
  background: var(--gold-600);
  transform: translateY(-1px);
  box-shadow: 0 12px 26px rgba(200, 164, 92, 0.44);
}
.es-submit:active { transform: translateY(0); }

.es-hot {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px dashed var(--gray-200);
  font-size: 13px;
}
.es-hot > span { color: var(--gray-400); font-weight: 600; }
.es-hot-list { display: contents; }
.es-hot a {
  color: var(--gray-600);
  padding: 4px 12px;
  border-radius: 16px;
  background: var(--gray-50);
  transition: 0.18s;
}
.es-hot a:hover { background: var(--navy-50); color: var(--navy-700); }
.es-hot .es-hot-all { background: transparent; color: var(--navy-700); font-weight: 700; padding-left: 0; }

@media (max-width: 1100px) {
  .es-row { flex-wrap: wrap; }
  .es-keyword { flex: 1 1 100%; }
  .es-field { flex: 1 1 40%; padding: 0 16px; }
  .es-field:nth-child(2) { border-left: 0; padding-left: 2px; }
  .es-submit { flex: 1 1 100%; margin: 18px 0 0; }
}
@media (max-width: 640px) {
  .expo-search-band { margin-top: -44px; }
  .expo-search { padding: 18px 18px 14px; border-radius: 14px; }
  .es-row { gap: 0; }
  .es-field {
    flex: 1 1 100%;
    padding: 11px 0;
    border-left: 0;
    border-top: 1px solid var(--gray-200);
  }
  .es-field:first-child { border-top: 0; padding-top: 0; }
  .es-submit { width: 100%; padding: 15px 0; }
  .es-hot { font-size: 12.5px; gap: 8px; }
}

/* ============================================================
   合作伙伴：15 家 logo 墙的移动端收窄（2 列 + 缩小 logo 框）
   ============================================================ */
@media (max-width: 640px) {
  .partner-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .partner-card { padding: 18px 10px 14px; gap: 10px; }
  .partner-logo { height: 50px; }
  .partner-logo img { max-height: 50px; }
  .partner-name { font-size: 11.5px; min-height: 32px; }
  .partner-fallback { font-size: 13.5px; }
}

/* ============================================================
   搭建案例（/cases 列表 + /cases/:id 详情）
   与展会中心同源：深色首屏 + 卡片网格 + 服务端分页。
   差别在卡片比例（4:3 大图，案例以图为主）与详情页的信息侧栏。
   ============================================================ */

/* ---------- 列表页首屏 ---------- */
.case-index-hero {
  background: linear-gradient(135deg, var(--navy-900) 0%, var(--navy-700) 100%);
  color: var(--white);
  padding: 76px 0 68px;
  position: relative;
  overflow: hidden;
}
.case-index-hero::after {
  content: "";
  position: absolute;
  right: -100px;
  top: -120px;
  width: 380px;
  height: 380px;
  background: radial-gradient(circle, rgba(200, 164, 92, 0.2), transparent 70%);
}
.case-index-hero .kicker {
  display: inline-block;
  color: var(--gold-500);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  margin-bottom: 14px;
}
.case-index-hero h1 { font-size: 44px; font-weight: 800; letter-spacing: 1px; }
.case-index-lead { margin-top: 14px; max-width: 700px; color: rgba(255, 255, 255, 0.72); font-size: 16px; }
.case-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 34px; position: relative; z-index: 1; }
.case-stats > div {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 12px;
  padding: 18px 20px;
}
.case-stats b { display: block; font-size: 30px; line-height: 1.1; color: var(--gold-500); }
.case-stats span { color: rgba(255, 255, 255, 0.68); font-size: 13px; }

/* ---------- 列表网格与卡片 ---------- */
/* 4 列 × 3 行 = 每页 12 条（与 server.js: CASE_PAGE_SIZE 对齐，改一处必须同步另一处） */
.case-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.case-card {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
  display: flex;
  flex-direction: column;
  transition: all 0.25s;
}
.case-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.case-cover {
  position: relative;
  aspect-ratio: 4 / 3;
  background: linear-gradient(135deg, var(--navy-800), var(--navy-600));
  overflow: hidden;
}
.case-cover img { width: 100%; height: 100%; object-fit: cover; }
.case-cover-empty {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.42);
}
.case-badge {
  position: absolute;
  left: 14px;
  top: 14px;
  background: var(--accent);
  color: var(--navy-900);
  font-size: 12px;
  font-weight: 700;
  padding: 5px 12px;
  border-radius: 20px;
}
.case-badge-static { position: static; display: inline-block; margin-bottom: 14px; left: auto; top: auto; }
.case-body { padding: 22px 24px 24px; display: flex; flex-direction: column; flex: 1; }
.case-body h3 { font-size: 18px; font-weight: 700; line-height: 1.45; }
.case-meta {
  margin-top: 16px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 12.5px;
  color: var(--gray-400);
}
.case-dot { width: 3px; height: 3px; border-radius: 50%; background: var(--gray-400); display: inline-block; }
.case-more { margin-top: auto; padding-top: 18px; color: var(--accent); font-size: 13.5px; font-weight: 600; }
.case-card:hover .case-more { text-decoration: underline; }
.case-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 70px 20px;
  color: var(--gray-400);
  background: var(--gray-50);
  border: 1px dashed var(--gray-200);
  border-radius: var(--radius);
}

/* ---------- 详情页首屏 ---------- */
.case-hero {
  background: linear-gradient(135deg, var(--navy-900) 0%, var(--navy-700) 100%);
  color: var(--white);
  padding: 46px 0 72px;
  position: relative;
  overflow: hidden;
}
.case-hero::after {
  content: "";
  position: absolute;
  right: -120px;
  top: -140px;
  width: 380px;
  height: 380px;
  background: radial-gradient(circle, rgba(200, 164, 92, 0.18), transparent 70%);
}
.case-crumb { font-size: 13px; color: rgba(255, 255, 255, 0.5); display: flex; gap: 8px; flex-wrap: wrap; align-items: center; position: relative; z-index: 1; }
.case-crumb a { color: var(--gold-500); }
.case-crumb b { color: rgba(255, 255, 255, 0.78); font-weight: 600; }
.case-hero-grid {
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: 48px;
  align-items: center;
  margin-top: 28px;
  position: relative;
  z-index: 1;
}
.case-hero-copy h1 { font-size: 38px; font-weight: 800; line-height: 1.25; }
.case-title-en { margin-top: 8px; color: rgba(255, 255, 255, 0.5); font-size: 14px; letter-spacing: 1px; }
.case-hero-sum { margin-top: 16px; color: rgba(255, 255, 255, 0.74); font-size: 15.5px; max-width: 560px; }
.case-hero-actions { margin-top: 28px; display: flex; gap: 14px; flex-wrap: wrap; }
.case-hero-media {
  border-radius: var(--radius);
  overflow: hidden;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.case-hero-media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.case-hero-media .case-cover-empty { aspect-ratio: 4 / 3; height: auto; }

/* ---------- 详情正文 + 信息侧栏 ---------- */
.case-section { padding: 72px 0; }
.case-section + .case-section { padding-top: 0; }
.case-h2 { font-size: 22px; font-weight: 800; margin-bottom: 22px; }
.case-body-grid { display: grid; grid-template-columns: 1.6fr 1fr; gap: 56px; align-items: start; }
.case-main { font-size: 16px; color: var(--gray-600); line-height: 1.9; }
.case-main p { margin-bottom: 16px; }
.case-main h2 { font-size: 21px; color: var(--gray-900); margin: 28px 0 12px; }
.case-main h3 { font-size: 18px; color: var(--gray-900); margin: 24px 0 10px; }
.case-main ul, .case-main ol { padding-left: 22px; margin-bottom: 16px; }
.case-main ul { list-style: disc; }
.case-main ol { list-style: decimal; }
.case-main li { margin-bottom: 8px; }
.case-main img { border-radius: var(--radius-sm); margin: 18px 0; }
.case-main a { color: var(--gold-600); text-decoration: underline; }
.case-aside {
  background: var(--gray-50);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius);
  padding: 26px 24px;
  position: sticky;
  top: 96px;
}
.case-aside .case-h2 { font-size: 17px; margin-bottom: 16px; }
.case-info { display: grid; grid-template-columns: 1fr; gap: 2px; }
.case-info dt { font-size: 12.5px; color: var(--gray-400); margin-top: 14px; }
.case-info dt:first-of-type { margin-top: 0; }
.case-info dd { font-size: 15px; font-weight: 600; color: var(--gray-900); }

/* ---------- 现场实景图集 ---------- */
.case-gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.cg-item { border-radius: var(--radius); overflow: hidden; background: var(--gray-100); }
.cg-item img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; cursor: zoom-in; transition: transform 0.3s; }
.cg-item:hover img { transform: scale(1.04); }

/* ---------- 相关案例 ---------- */
/* 相关案例同样一行 4 个（与 server.js 里 LIMIT 4 对齐） */
.case-related-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }

/* ---------- 图片灯箱（案例「现场实景」+ 展会「现场照片」共用）----------
   结构与交互全部在 public/js/lightbox.js 里生成：给任意容器加 data-lightbox，
   容器内的 <img> 即可点击放大。⚠️ 别再按页面各写一套内联脚本，
   两处逻辑一旦分叉，改一次样式就要同步两个模板（见 README 的「共用区块」约定）。 */
.img-lightbox {
  position: fixed;
  inset: 0;
  background: rgba(6, 10, 16, 0.92);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}
.img-lightbox[hidden] { display: none; }
.img-lightbox img {
  max-width: min(1200px, 90vw);
  max-height: 86vh;
  width: auto;
  object-fit: contain;
  border-radius: 6px;
  cursor: zoom-out;
}
.il-close, .il-prev, .il-next {
  position: absolute;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.22);
  color: var(--white);
  cursor: pointer;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  transition: background 0.2s, border-color 0.2s, transform 0.2s;
}
/* 图标用内联 SVG：尺寸与描边由 CSS 统一控制，各系统渲染一致 */
.il-close svg, .il-prev svg, .il-next svg { width: 22px; height: 22px; display: block; }
.il-close:hover, .il-prev:hover, .il-next:hover {
  background: var(--gold-500);
  border-color: var(--gold-500);
  color: var(--navy-900);
}
.il-close { top: 24px; right: 28px; }
.il-prev { left: 28px; top: 50%; transform: translateY(-50%); }
.il-next { right: 28px; top: 50%; transform: translateY(-50%); }
.il-prev:active { transform: translateY(-50%) scale(0.94); }
.il-next:active { transform: translateY(-50%) scale(0.94); }
.il-count {
  position: absolute;
  bottom: 26px;
  left: 50%;
  transform: translateX(-50%);
  color: rgba(255, 255, 255, 0.72);
  font-size: 13px;
  letter-spacing: 1px;
}
body.lb-open { overflow: hidden; }
/* 窄屏：按钮收到 40px 并贴边，避免两个圆形按钮压在大图上（图宽 ~90vw 时左右各只剩十几像素） */
@media (max-width: 640px) {
  .il-close, .il-prev, .il-next { width: 40px; height: 40px; }
  .il-close svg, .il-prev svg, .il-next svg { width: 19px; height: 19px; }
  .il-close { top: 14px; right: 14px; }
  .il-prev { left: 10px; }
  .il-next { right: 10px; }
  .il-count { bottom: 16px; font-size: 12px; }
}

/* ---------- 响应式 ---------- */
@media (max-width: 1100px) {
  .case-grid { grid-template-columns: repeat(2, 1fr); }
  .case-related-grid { grid-template-columns: repeat(2, 1fr); }
  .case-gallery { grid-template-columns: repeat(2, 1fr); }
  .case-stats { grid-template-columns: repeat(2, 1fr); }
  .case-hero-grid { grid-template-columns: 1fr; gap: 32px; }
  .case-body-grid { grid-template-columns: 1fr; gap: 36px; }
  .case-aside { position: static; }
  .case-index-hero h1 { font-size: 36px; }
  .case-hero-copy h1 { font-size: 32px; }
}

@media (max-width: 640px) {
  .case-grid, .case-related-grid, .case-gallery { grid-template-columns: 1fr; }
  .case-index-hero { padding: 52px 0 46px; }
  .case-index-hero h1 { font-size: 30px; }
  .case-index-lead { font-size: 15px; }
  .case-stats { gap: 12px; margin-top: 26px; }
  .case-stats b { font-size: 24px; }
  .case-hero { padding: 30px 0 46px; }
  .case-hero-copy h1 { font-size: 26px; }
  .case-hero-sum { font-size: 14.5px; }
  .case-section { padding: 46px 0; }
  .case-body { padding: 18px 18px 20px; }
  .case-body h3 { font-size: 17px; }
  .case-main { font-size: 15.5px; line-height: 1.85; }
}

/* ============================================================
   浅色主题覆盖：白底黑字 + 品牌橙高亮（theme-light）
   仅覆盖导航/信息条/hero/页脚等深色区块，正文卡片本来就是白底，不动。
   ============================================================ */
.theme-light .util-bar {
  background: var(--white);
  border-bottom-color: var(--gray-200);
  color: var(--gray-600);
}
.theme-light .util-right a { color: var(--navy-800); }
.theme-light .util-right a:hover { color: var(--gold-500); }
.theme-light .util-right .util-tag { color: var(--gray-500); }
.theme-light .util-right .util-tel,
.theme-light .util-right .util-mobile { color: var(--gold-600); }
.theme-light .util-sep { background: var(--gray-300); }
.theme-light .util-right .util-admin { color: var(--navy-700); }

.theme-light .site-header {
  background: var(--white);
  color: var(--navy-900);
  box-shadow: 0 2px 16px rgba(23, 18, 17, 0.08);
}
.theme-light .nav-item > a { color: rgba(23, 18, 17, 0.78); }
.theme-light .nav-item:hover > a { color: var(--navy-900); background: rgba(23, 18, 17, 0.04); }
.theme-light .nav-item > a.active { color: var(--gold-500); }
.theme-light .nav-toggle { color: var(--navy-800); }
.theme-light .nav-drop { box-shadow: 0 18px 44px rgba(23, 18, 17, 0.14); }
.theme-light .nav-drop a { color: var(--navy-800); }
.theme-light .nav-drop a:hover { background: var(--gray-50); color: var(--gold-600); }

.theme-light .hero {
  background: var(--white);
  color: var(--navy-900);
}
.theme-light .hero::before { display: none; }
.theme-light .hero-eyebrow {
  border-color: var(--gold-500);
  color: var(--gold-600);
}
.theme-light .hero p.sub { color: var(--gray-600); }
.theme-light .hero-stats .stat b { color: var(--gold-500); }
.theme-light .hero-stats .stat span { color: var(--gray-500); }

.theme-light .btn-primary {
  background: var(--gold-500);
  color: var(--white);
}
.theme-light .btn-primary:hover { background: var(--gold-600); }
.theme-light .btn-outline {
  background: transparent;
  color: var(--navy-800);
  border-color: rgba(23, 18, 17, 0.28);
}
.theme-light .btn-outline:hover {
  border-color: var(--gold-500);
  color: var(--gold-500);
}

.theme-light .site-footer {
  background: var(--gray-50);
  color: var(--gray-600);
}
.theme-light .footer-intro { color: var(--gray-600); }
.theme-light .footer-bottom {
  border-top-color: var(--gray-200);
  color: var(--gray-500);
}
.theme-light .footer-bottom a { color: var(--gold-600); }
.theme-light .footer-tel .ft-tag,
.theme-light .footer-tel .ft-hours { color: var(--gray-500); }

/* ⚠️ 断点必须是 1100px，不能写 960px：
   汉堡菜单（.nav-list 变成下拉面板）从 ≤1100px 就开始了（见前面 @media (max-width:1100px)），
   而这一组浅色覆盖原本写的是 960px → 961~1100px（常见平板横屏 1024 / 992）出现
   「炭黑面板 + 浅色主题的深色文字」= 菜单整块看不见，只有 active 项（橙色）能看见。 */
@media (max-width: 1100px) {
  .theme-light .nav-list {
    background: var(--white);
    border-top: 1px solid var(--gray-200);
    box-shadow: 0 18px 44px rgba(23, 18, 17, 0.12);
  }
  .theme-light .nav-list a { color: var(--navy-800); }
  .theme-light .nav-list a:hover { color: var(--gold-500); background: var(--gray-50); }
  .theme-light .nav-drop {
    position: static;
    transform: none;
    opacity: 1;
    visibility: visible;
    background: var(--gray-50);
    box-shadow: none;
    border-top: none;
    border-radius: 0;
    padding: 0;
  }
}

/* ============================================================
   浅色主题补漏：内页「页面头部」
   背景：上面那组覆盖只处理了首页 .hero，内页横幅仍是炭黑渐变
   （.page-banner / .expo-hero / .case-index-hero / .case-hero），
   于是出现「白色导航条 + 黑色页头」的割裂，与首页浅色 hero 不一致。
   这里把四个页面头部一并改成白底浅灰渐变，文字改深色，保留品牌橙点缀。
   ============================================================ */
.theme-light .page-banner {
  background: linear-gradient(135deg, var(--white) 0%, var(--gray-50) 100%);
  color: var(--navy-900);
  border-bottom: 1px solid var(--gray-200);
}
.theme-light .page-banner::after {
  background: radial-gradient(circle, rgba(245, 113, 52, 0.14), transparent 70%);
}
.theme-light .page-banner p { color: var(--gray-600); }
.theme-light .breadcrumb { color: var(--gray-500); }
.theme-light .breadcrumb a { color: var(--gold-600); }

.theme-light .expo-hero {
  background:
    radial-gradient(1100px 420px at 82% -20%, rgba(245, 113, 52, 0.12), transparent 62%),
    linear-gradient(135deg, var(--white) 0%, var(--gray-50) 100%);
}
.theme-light .expo-hero::after {
  background-image:
    linear-gradient(rgba(23, 18, 17, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(23, 18, 17, 0.045) 1px, transparent 1px);
}
.theme-light .expo-hero-copy .kicker { color: var(--gold-600); }
.theme-light .expo-hero-copy h1 { color: var(--navy-900); }
.theme-light .expo-hero-copy p { color: var(--gray-600); }
.theme-light .expo-hero-meta { color: var(--gray-500); }
.theme-light .expo-hero-stats > div {
  background: var(--white);
  border-color: var(--gray-200);
  box-shadow: var(--shadow);
}
.theme-light .expo-hero-stats span { color: var(--gray-500); }

.theme-light .case-index-hero {
  background: linear-gradient(135deg, var(--white) 0%, var(--gray-50) 100%);
  color: var(--navy-900);
}
.theme-light .case-index-hero::after {
  background: radial-gradient(circle, rgba(245, 113, 52, 0.14), transparent 70%);
}
.theme-light .case-index-hero .kicker { color: var(--gold-600); }
.theme-light .case-index-lead { color: var(--gray-600); }
.theme-light .case-stats > div {
  background: var(--white);
  border-color: var(--gray-200);
  box-shadow: var(--shadow);
}
.theme-light .case-stats span { color: var(--gray-500); }

.theme-light .case-hero {
  background: linear-gradient(135deg, var(--white) 0%, var(--gray-50) 100%);
  color: var(--navy-900);
}
.theme-light .case-hero::after {
  background: radial-gradient(circle, rgba(245, 113, 52, 0.12), transparent 70%);
}
.theme-light .case-crumb { color: var(--gray-500); }
.theme-light .case-crumb a { color: var(--gold-600); }
.theme-light .case-crumb b { color: var(--navy-700); }
.theme-light .case-title-en { color: var(--gray-500); }
.theme-light .case-hero-sum { color: var(--gray-600); }
.theme-light .case-hero-media {
  background: var(--gray-100);
  border-color: var(--gray-200);
}
.theme-light .case-cover-empty { color: var(--gray-400); }

/* ============================================================
   浅色主题补漏：CTA 行动条（.cta-band）内的按钮
   背景：.cta-band 在浅色模式下**保持炭黑渐变**（做浅色页面的深色锚点，
   与 .btn-dark / 图标块属于同一类「黑橙点缀」）。但上面那条全局
   `.theme-light .btn-outline { color: var(--navy-800) }` 是按「浅底」写的，
   落到深色行动条里就变成「黑底黑字」——按钮直接看不见（实测对比度 1.1）。
   这里按「深色底」把两个按钮还原成原设计的配色：
   · 描边按钮 → 白字白边（hover 转品牌橙）
   · 实底按钮 → 深字橙底（原 .btn-primary 就是炭黑字，浅色主题改白字后
     对比度只有 2.9，低于 WCAG 3.0；还原成炭黑字后 6.5，也与其他深色块一致）
   ============================================================ */
.theme-light .cta-band .btn-outline {
  background: transparent;
  color: var(--white);
  border-color: rgba(255, 255, 255, 0.42);
}
.theme-light .cta-band .btn-outline:hover {
  background: transparent;
  border-color: var(--gold-500);
  color: var(--gold-500);
}
.theme-light .cta-band .btn-primary { color: var(--navy-900); }