/* =====================================================================
   SDM 2026 主题主样式
   配色/气质沿袭旧帝国站，布局用现代 Flexbox/Grid 重构，命名采用 BEM 风格
   ===================================================================== */

/* ---------- 设计变量 ---------- */
:root {
	/* 品牌色 */
	--c-red: #d7342e;          /* 主红（导航高亮/顶边） */
	--c-pill: #dd514c;         /* 分类药丸红 */
	--c-orange: #ee7800;       /* 强调橙（热度/标签激活） */
	--c-phone: #ff6700;        /* 电话橙 */
	--c-link: #3b8dbd;         /* 蓝链接 */

	/* 中性色 */
	--text: #5a5a5a;
	--text-dark: #333;
	--text-muted: #888;
	--text-light: #a0a0a0;
	--line: #e5e5e5;
	--bg-muted: #f5f5f5;
	--bg-footer: #f7f7f7;
	--white: #fff;

	/* 结构 */
	--container: 1400px;
	--header-h: 68px;      /* 滚动后收缩高度 */
	--header-h-lg: 88px;   /* 页面顶部初始高度 */
	--shadow-card: 0 8px 30px rgba(0, 0, 0, .10);

	/* 各区域容器宽度（可单独调节；max-width 为上限，窄屏会自动收窄） */
	--w-cats: 1400px;      /* 项目分类 */
	--w-featured: 1400px;  /* 热门项目推荐 */
	--w-news: 1400px;      /* 资讯 */
	--w-contact: 1400px;   /* 底部联系 */
	/* 内页各区块宽度集中在各自页面段落首部的 :root 中定义 */

	--font-base: "Microsoft YaHei", "PingFang SC", "Helvetica Neue", Tahoma, Arial, sans-serif;
}

/* ---------- Reset / 基础 ---------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; overflow-x: clip; }
body {
	font-family: var(--font-base);
	font-size: 16px;
	color: var(--text);
	background: var(--white);
	line-height: 1.75;
	overflow-x: clip;
}
img { max-width: 100%; height: auto; display: block; }
ul { list-style: none; }
a { color: var(--c-link); text-decoration: none; }
a:hover { color: var(--c-red); }

/* 可访问性工具类 */
.screen-reader-text {
	position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.skip-link:focus {
	position: absolute; left: 8px; top: 8px; z-index: 9999; padding: 8px 14px;
	background: var(--c-red); color: #fff; clip: auto; width: auto; height: auto;
}

/* ---------- 顶部广告条 ---------- */
.announce-bar {
	width: 100%; height: 42px;
	display: flex; align-items: center; justify-content: center; gap: 6px;
	background: var(--c-red); color: #fff;
	font-size: 15px; line-height: 1;
}
.announce-bar__fire { flex-shrink: 0; animation: fire-bounce .8s ease-in-out infinite alternate; }
@keyframes fire-bounce {
	0%   { transform: translateY(0); }
	100% { transform: translateY(-3px); }
}
/* 减少动态效果偏好：关闭平滑滚动与动画 */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.announce-bar__fire { animation: none; }
	* { transition-duration: .01ms !important; }
}

/* 主体容器 */
.site-container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 20px; }

/* ---------- 顶栏 ---------- */
.site-header {
	position: sticky; top: 0; z-index: 999;
	width: 100%; height: var(--header-h-lg);
	background: var(--white);
	border-bottom: 1px solid #ee7801;
	transition: height .25s ease, box-shadow .25s ease;
}
/* 滚动后收缩贴顶 */
.site-header.is-scrolled {
	height: var(--header-h);
	box-shadow: 0 2px 10px rgba(0, 0, 0, .06);
}
.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 100%;
	padding: 0;
}
.site-brand img { width: 240px; height: auto; }

/* 导航 */
.site-nav { margin-left: auto; }
.site-nav__menu { display: flex; gap: 6px; }
.site-nav__menu a {
	display: block; padding: 0 20px; height: 44px; line-height: 44px;
	color: var(--text-dark); font-size: 16px; text-align: center;
	transition: background .2s, color .2s;
}
.site-nav__menu a:hover,
.site-nav__menu .current-menu-item > a { background: var(--c-red); color: #fff; }

/* 二级下拉：父项无链接（label），hover 展开，风格与主导航一致（红块白字） */
.menu-item-has-children { position: relative; }
.site-nav__label {
	display: flex; align-items: center; gap: 8px;
	padding: 0 20px; height: 44px;
	color: var(--text-dark); font-size: 16px; cursor: pointer;
}
.menu-item-has-children:hover .site-nav__label { background: var(--c-red); color: #fff; }
.site-nav__caret {
	width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent;
	border-top: 5px solid currentColor; transition: transform .2s;
}
.menu-item-has-children:hover .site-nav__caret { transform: rotate(180deg); }
.site-nav__submenu {
	position: absolute; top: 100%; left: 0; z-index: 99;
	min-width: 128px; margin: 0; padding: 0; list-style: none;
	background: var(--white);
	border-top: 2px solid var(--c-red);
	box-shadow: 0 8px 20px rgba(0, 0, 0, .12);
	opacity: 0; visibility: hidden; transform: translateY(6px);
	transition: opacity .2s, transform .2s, visibility .2s;
}
.menu-item-has-children:hover .site-nav__submenu {
	opacity: 1; visibility: visible; transform: translateY(0);
}
.site-nav__submenu a {
	display: block; height: 42px; line-height: 42px;
	padding: 0 22px; font-size: 15px; text-align: left;
	white-space: nowrap;
}
/* 当前分类高亮：子项由 .current-menu-item > a 规则覆盖，父项（分组标题）同款红块白字 */
.site-nav__menu .current-menu-ancestor > .site-nav__label { background: var(--c-red); color: #fff; }

/* 移动端汉堡按钮 */
.nav-toggle {
	display: none; flex-direction: column; justify-content: center; gap: 5px;
	width: 42px; height: 42px; border: none; background: transparent; cursor: pointer;
}
.nav-toggle__bar { width: 22px; height: 3px; background: var(--c-red); margin: 0 auto; }

/* 抽屉关闭按钮：仅移动端显示，PC 隐藏避免出现“小圆点” */
.site-nav__close { display: none; border: none; background: transparent; cursor: pointer; }

/* 主区跟随 sticky 顶栏，无需手动补偿 */

/* ---------- Banner（单图） ---------- */
.hero__img { display: block; width: 100%; height: auto; object-fit: cover; }

/* ---------- 项目分类 ---------- */
.section-cats { max-width: var(--w-cats); margin: 0 auto; padding: 64px 0 72px; }
.cat-list {
	display: grid;
	grid-template-columns: repeat(10, 1fr);
	gap: 12px;
}
.cat-list a {
	display: flex; align-items: center; justify-content: center;
	height: 54px; padding: 0 8px;
	background: var(--white); color: var(--c-red);
	border: 1px solid var(--c-red); border-radius: 12px;
	font-size: 16px; text-align: center;
	transition: all .2s ease;
}
.cat-list a:hover {
	background: var(--c-red); color: #fff;
	border-color: var(--c-red);
	transform: translateY(-2px);
	box-shadow: var(--shadow-card);
}

/* ---------- 版块标题 ---------- */
.section-featured {
	width: 100%; max-width: none;
	background: var(--bg-muted);
	padding: 80px max(calc((100% - var(--w-featured)) / 2), 20px) 90px;
}

.section-heading {
	display: flex; align-items: center; gap: 14px;
	margin-bottom: 36px; padding-bottom: 18px;
	border-bottom: 2px solid var(--line);
}
.section-heading__title { font-size: 30px; color: var(--text-dark); font-weight: 700; }
.section-heading__sub {
	padding: 4px 0; border-top: 3px solid var(--c-red);
	color: var(--text-muted); font-size: 15px;
}
/* 居中标题变体 */
.section-heading--center {
	flex-direction: column; gap: 12px; text-align: center;
	border-bottom: none; padding-bottom: 32px; position: relative;
	margin-bottom: 36px;
}
.section-heading--center::after {
	content: ""; position: absolute; left: 50%; bottom: 8px;
	transform: translateX(-50%);
	width: 56px; height: 3px; background: var(--c-red);
}
.section-heading--center .section-heading__title { font-size: 32px; }

/* ---------- 热门项目 ---------- */
.project-grid {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 32px 28px;
}
.project-card {
	display: block; background: var(--white);
	border: 1px solid var(--line);
	overflow: hidden;
	transition: transform .2s ease, box-shadow .2s ease;
}
.project-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--shadow-card);
}
.project-card__thumb { width: 100%; aspect-ratio: 218 / 120; object-fit: cover; }
.project-card__title {
	font-size: 18px; font-weight: 500; text-align: center;
	color: #444; padding: 20px 12px 8px;
}
.project-card__meta {
	display: block; text-align: center; color: var(--text-muted);
	font-size: 15px; padding-bottom: 18px;
}
.project-card__meta b { color: var(--c-orange); font-weight: 500; }

/* ---------- 资讯 Tabs（现代分段控件） ---------- */
.section-news { max-width: var(--w-news); padding: 80px 20px 90px; }

.news-tabs { text-align: center; }
.news-tabs__nav {
	display: inline-flex; gap: 4px; padding: 5px;
	background: var(--bg-muted); border-radius: 12px; border: 1px solid var(--line);
	margin-bottom: 36px;
}
.news-tabs__tab {
	padding: 12px 32px; font-size: 16px; font-weight: 400; color: var(--text-muted);
	background: transparent; border: none; cursor: pointer;
	border-radius: 8px; transition: all .2s ease;
}
.news-tabs__tab:hover { color: var(--c-red); }
.news-tabs__tab.is-active {
	background: var(--c-red); color: #fff; font-weight: 500;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
}

.news-tabs__panel { display: none; }
.news-tabs__panel.is-active { display: block; }
.news-tabs__panels { text-align: left; }

.news-list {
	display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px 40px;
}
.news-list__item {
	display: flex; align-items: center; justify-content: space-between;
	padding: 15px 10px;
	border-bottom: 1px solid var(--line);
	transition: background .2s ease;
}
.news-list__item::before { display: none; }
.news-list__item a {
	flex: 1; min-width: 0; color: var(--text); font-size: 16px;
	overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}
.news-list__arrow {
	color: var(--c-pill); font-size: 18px; margin-left: 12px; flex: none;
}
.news-list__item:hover { background: var(--bg-muted); }
.news-list__item a:hover { color: var(--c-red); }

/* ---------- 底部联系方式（现代卡片） ---------- */
.contact-section {
	width: 100%; max-width: none;
	background: #ececec;
	padding: 90px max(calc((100% - var(--w-contact)) / 2), 20px) 90px;
}
.contact-section__grid {
	display: grid; grid-template-columns: minmax(0, 1fr) 460px; gap: 48px; align-items: start;
}

.contact-guide {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px;
}
.contact-guide__col h4 {
	display: inline-block; position: relative;
	font-size: 16px; font-weight: 400; color: var(--text-dark);
	margin-bottom: 14px; padding-bottom: 8px;
}
.contact-guide__col h4::after {
	content: ""; position: absolute; left: 0; bottom: 0;
	width: 26px; height: 2px; background: var(--c-red);
}
.contact-guide__col li { line-height: 2.1; }
.contact-guide__col a {
	display: inline-block;
	color: var(--text-muted); font-size: 14px; transition: all .2s ease;
}
.contact-guide__col a:hover { background: var(--c-red); color: #fff; }

.contact-info {
	background: transparent; border: none;
	border-radius: 0; padding: 0; box-shadow: none;
}
.contact-info__title { font-size: 16px; color: var(--text-dark); margin-bottom: 18px; font-weight: 400; }
.contact-info__body { display: flex; align-items: center; gap: 24px; }
.contact-info__qr { width: 160px; height: 160px; object-fit: cover; border-radius: 8px; }
.contact-info__phones {
	border-left: 1px solid var(--line); padding-left: 24px;
	display: flex; flex-direction: column; justify-content: center; gap: 4px;
}
.contact-info__phone { font-size: 28px; line-height: 1.4; color: var(--c-phone); font-weight: 700; }
.contact-info__phone span { font-size: 13px; color: var(--text-muted); font-weight: 400; }
.contact-info__hours { font-size: 14px; color: var(--text); }

/* ---------- 页脚（现代深色） ---------- */
.site-footer { background: #232323; padding: 52px 0 42px; }
.site-footer__inner p {
	font-size: 14px; color: #9a9a9a; text-align: center; line-height: 1.8;
}
.site-footer__inner a {
	color: #888; display: inline-block;
	transition: all .2s ease;
}
.site-footer__inner a:hover { background: var(--c-red); color: #fff; }
.site-footer__links { color: #858585 !important; }
.site-footer__links a { margin: 0 6px; }

/* ---------- 回到顶部（PC + 移动端） ---------- */
.back-to-top {
	position: fixed; right: 20px; bottom: 70px; z-index: 999;
	width: 48px; height: 48px; border: none; border-radius: 50%;
	background: var(--c-red); color: #fff; cursor: pointer;
	display: flex; align-items: center; justify-content: center;
	opacity: 0; visibility: hidden;
	box-shadow: 0 4px 14px rgba(215, 52, 46, .35);
	transition: opacity .3s ease, visibility .3s ease, transform .2s ease;
}
.back-to-top svg { width: 22px; height: 22px; }
.back-to-top:hover { transform: translateY(-3px); }
.back-to-top.is-visible { opacity: 1; visibility: visible; }

/* ---------- 移动端底部吸底导航（仅手机端显示） ---------- */
.bar-nav {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 998;
	display: none;
	background: var(--c-red);
	padding: 3px 0 calc(3px + env(safe-area-inset-bottom));
}
.bar-nav__link {
	flex: 1; display: flex; flex-direction: column;
	align-items: center; justify-content: center;
	color: rgba(255, 255, 255, .85); font-size: 13px; padding: 8px 0;
}
.bar-nav__link svg { width: 30px; height: 30px; margin-bottom: 3px; }
.bar-nav__link.is-active { color: #fff; }

/* ---------- 响应式 ---------- */
@media (max-width: 900px) {
	.nav-toggle { display: flex; }
	.site-nav {
		position: fixed; top: 0; right: 0; width: 78%; max-width: 300px;
		height: 100vh; background: var(--white); z-index: 991;
		transform: translateX(100%); transition: transform .25s ease;
		overflow-y: auto;
	}
	/* 阴影仅在打开时出现，避免闭合状态投影渗入右侧可视区 */
	.site-nav.is-open { transform: translateX(0); box-shadow: -4px 0 20px rgba(0, 0, 0, .12); }
	.site-nav__close {
		position: absolute; top: 14px; right: 14px;
		width: 36px; height: 36px; border: none; background: transparent;
		cursor: pointer; display: block; z-index: 2;
	}
	.site-nav__close span {
		position: absolute; left: 9px; right: 9px; top: 17px; height: 2px;
		background: var(--text-dark);
	}
	.site-nav__close span:nth-child(1) { transform: rotate(45deg); }
	.site-nav__close span:nth-child(2) { transform: rotate(-45deg); }


	.site-nav__overlay {
		position: fixed; inset: 0; z-index: 990;
		background: rgba(0, 0, 0, .5);
		opacity: 0; visibility: hidden;
		transition: opacity .25s ease, visibility .25s ease;
	}
	.site-nav.is-open ~ .site-nav__overlay { opacity: 1; visibility: visible; }
	.site-nav__menu {
		flex-direction: column; gap: 0;
		padding: calc(var(--header-h-lg) + 12px) 0 24px;
	}
	.site-nav__menu a {
		display: block; padding: 15px 22px; height: auto; line-height: 1.4;
		text-align: left; font-size: 16px; color: var(--text-dark);
		border-bottom: 1px solid var(--line); background: transparent;
	}
	.site-nav__menu a:hover,
	.site-nav__menu .current-menu-item > a { background: var(--c-red); color: #fff; }

	/* 抽屉内二级菜单：静态展开（无 hover），父项标题 + 缩进子项 */
	.menu-item-has-children { position: static; }
	.site-nav__label {
		display: flex; height: auto; padding: 15px 22px;
		font-size: 16px; line-height: 1.4;
		border-bottom: 1px solid var(--line);
	}
	.menu-item-has-children:hover .site-nav__label { background: transparent; color: var(--text-dark); }
	.site-nav__caret { margin-left: auto; border-top-width: 6px; }
	.menu-item-has-children:hover .site-nav__caret { transform: none; }
	.site-nav__submenu {
		position: static; opacity: 1; visibility: visible; transform: none;
		box-shadow: none; border-top: none;
		min-width: 0; background: var(--bg-muted);
	}
	.site-nav__submenu a {
		height: auto; padding: 13px 22px 13px 38px; font-size: 15px;
		border-bottom: 1px solid var(--line);
		background: transparent;
	}
	.site-nav__submenu a:hover { background: var(--c-red); color: #fff; }

	.contact-section__grid { grid-template-columns: minmax(0, 1fr); }
	.contact-guide { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.news-list { grid-template-columns: minmax(0, 1fr); }
	.cat-list { grid-template-columns: repeat(4, 1fr); }
	.project-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 480px) {
	/* 移动端顶栏：默认较高，滚动后变矮 */
	.site-header { height: 66px; }
	.site-header.is-scrolled { height: 58px; box-shadow: 0 2px 8px rgba(0, 0, 0, .06); }
	.site-header .site-container { padding: 0 10px; }
	.announce-bar { padding: 0 10px; }
	.site-nav__menu { padding-top: calc(66px + 8px); }
	.site-brand img { width: 190px; }
	.contact-guide { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
	.contact-info__title { text-align: center; }
	.contact-info__body { flex-direction: column; align-items: center; text-align: center; }
	.contact-info__phones { border-left: none; padding-left: 0; }
	/* 手机端仅显示添加微信，隐藏热门项目/站内导航/培训实景 */
	.contact-guide--hidden-mobile { display: none; }
	/* 底部内边距由 JS 动态测量吸底导航高度后设置，避免固定值叠加重叠 */
	.bar-nav { display: flex; }
	/* 回到顶部在手机端避让底部导航条 */
	.back-to-top { right: 14px; bottom: 72px; width: 42px; height: 42px; }
	.cat-list { grid-template-columns: repeat(3, 1fr); gap: 10px; }
	.cat-list a { height: 44px; padding: 0 6px; font-size: 15px; border-radius: 10px; }
	.section-cats { padding: 28px 14px 40px; }
	.project-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }
	.section-featured { padding-left: 16px; padding-right: 16px; }
	.section-heading__title { font-size: 24px; }
}

/* =====================================================================
   内页通用结构说明
   ---------------------------------------------------------------------
   以下 6 个内页均采用「区块全宽 + 内层 __inner 限宽」结构：
   - 外层区块（如 .wa-breadcrumb / .wa-main）宽度 100%，可自由加全宽背景色；
   - 内层 __inner 通过各页面的 CSS 变量（--w-xx-xxx）独立控制最大宽度；
   - 每页的 CSS 集中在同一段内（含响应式），互不复用非公共样式。
   ===================================================================== */

/* =====================================================================
   文章列表页 (wa-) — 参考旧帝国站 cjwt 列表页
   ===================================================================== */
/* 宽度变量：各区块宽度可单独调节 */
:root {
	--w-wa-breadcrumb: 1400px;   /* 面包屑内容宽度 */
	--w-wa-main: 1400px;         /* 主体内容宽度 */
	--w-wa-side: 300px;          /* 右侧推荐栏宽度 */
}

/* 页面背景（挂在 <main> 上的全宽修饰类） */
.wa-page { background: var(--bg-muted); }

/* 面包屑：全宽区块 + 内层限宽 */
.wa-breadcrumb { padding: 30px 0 0 0; }
.wa-breadcrumb__inner { max-width: var(--w-wa-breadcrumb); margin: 0 auto; padding: 0; font-size: 14px; color: #8c8c8c; }
.wa-breadcrumb__inner a { color: #8c8c8c; }
.wa-breadcrumb__inner a:hover { color: var(--c-orange); }
.wa-breadcrumb__sep { margin: 0 8px; color: #8c8c8c; }

/* 主体：全宽区块 + 内层限宽 */
.wa-main__inner { max-width: var(--w-wa-main); margin: 0 auto; padding: 32px 0 64px; }

/* 两列布局 */
.wa-layout { display: grid; grid-template-columns: minmax(0, 1fr) var(--w-wa-side); gap: 24px; align-items: start; }
.wa-col { min-width: 0; background: #fff; }

/* 栏目标题（左列顶部） */
.wa-page-header { padding: 20px 24px; text-align: center; }
.wa-page-header__title { font-size: 36px; color: #333; font-weight: 400; line-height: 1.4; }

/* 文章卡片：左图右文 */
.wa-card {
	display: flex; gap: 24px;
	padding: 36px 24px;
	border-top: 1px solid #f5f5f5;
}
.wa-card__thumb {
	flex-shrink: 0; width: 200px; height: 120px;
	background: var(--bg-muted); overflow: hidden;
}
.wa-card__thumb img { width: 100%; height: 100%; object-fit: cover; }
.wa-card__body { flex: 1; min-width: 0; }
.wa-card__title { font-size: 18px; font-weight: 400; margin-bottom: 12px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.wa-card__title a { color: #333; }
.wa-card__title a:hover { color: var(--c-orange); }
.wa-card__excerpt { font-size: 15px; color: #8c8c8c; line-height: 1.8; margin-bottom: 14px; min-height: 48px; overflow: hidden; }
.wa-card__meta { font-size: 14px; color: #8c8c8c; display: flex; gap: 14px; align-items: center; line-height: 1.6; }
.wa-card__more { margin-left: auto; color: var(--c-orange); font-size: 13px; font-weight: 400; }

/* 右侧推荐 */
.wa-sidebar__title {
	font-size: 17px; font-weight: 500; color: var(--c-orange);
	padding: 18px 24px; line-height: 1.4;
	border-bottom: 1px solid #f5f5f5;
}
.wa-sidebar__list { list-style: none; padding: 6px 20px 16px; }
.wa-sidebar__item { border-bottom: 1px dashed #e5e5e5; }
.wa-sidebar__item:last-child { border-bottom: none; }
.wa-sidebar__item a {
	display: block; padding: 14px 0; font-size: 15px; color: #5a5a5a;
	line-height: 1.5; transition: color .2s;
}
.wa-sidebar__item a:hover { color: var(--c-orange); }
.wa-sidebar__empty { font-size: 14px; color: #8c8c8c; padding: 20px; }

/* 分页 */
.wa-pagination { padding: 40px 20px; text-align: center; }
.wa-pagination .page-numbers {
	display: inline-block; padding: 6px 12px; margin: 0 3px;
	font-size: 14px; color: #5a5a5a; border: 1px solid #e5e5e5;
	transition: all .2s;
}
.wa-pagination .page-numbers:hover { border-color: var(--c-orange); color: var(--c-orange); }
.wa-pagination .page-numbers.current { background: var(--c-orange); color: #fff; border-color: var(--c-orange); }
.wa-empty { text-align: center; color: #8c8c8c; padding: 60px 0; font-size: 15px; }

/* 响应式 */
@media (max-width: 900px) {
	.wa-layout { grid-template-columns: minmax(0, 1fr); }
	.wa-col--side { order: 2; }
}
@media (max-width: 480px) {
	.wa-breadcrumb__inner { padding: 0 12px; }
	.wa-main__inner { padding: 10px 12px 64px; }
	.wa-card { padding: 20px 12px; gap: 12px; }
	.wa-card__thumb { width: 120px; height: 90px; }
	.wa-card__title { white-space: normal; height: auto; line-height: 1.4; }
	.wa-card__excerpt { min-height: 0; }
	.wa-page-header__title { font-size: 20px; padding: 14px 0; line-height: 1.4; }
}

/* =====================================================================
   文章内容页 (ws-) — 风格对齐 wa- 列表页
   ===================================================================== */
/* 宽度变量：各区块宽度可单独调节 */
:root {
	--w-ws-breadcrumb: 1400px;   /* 面包屑内容宽度 */
	--w-ws-main: 1400px;         /* 主体内容宽度 */
	--w-ws-side: 300px;          /* 右侧推荐栏宽度 */
}

/* 页面背景（挂在 <main> 上的全宽修饰类） */
.ws-page { background: var(--bg-muted); }

/* 面包屑：全宽区块 + 内层限宽 */
.ws-breadcrumb { padding: 20px 0; }
.ws-breadcrumb__inner { max-width: var(--w-ws-breadcrumb); margin: 0 auto; padding: 0; font-size: 14px; color: #8c8c8c; }
.ws-breadcrumb__inner a { color: #8c8c8c; }
.ws-breadcrumb__inner a:hover { color: var(--c-orange); }
.ws-breadcrumb__sep { margin: 0 8px; color: #8c8c8c; }

/* 主体：全宽区块 + 内层限宽 */
.ws-main__inner { max-width: var(--w-ws-main); margin: 0 auto; padding: 24px 0 64px; }

/* 两列布局 */
.ws-layout { display: grid; grid-template-columns: minmax(0, 1fr) var(--w-ws-side); gap: 24px; align-items: start; }
.ws-col { min-width: 0; background: #fff; }

/* 文章标题区 */
.ws-page-header { padding: 48px 42px 30px; border-top: 1px solid #f5f5f5; }
.ws-page-header__title { font-size: 32px; font-weight: 500; color: #333; line-height: 1.5; margin: 0 0 22px; }
.ws-page-header__meta { font-size: 14px; color: #8c8c8c; display: flex; gap: 18px; flex-wrap: wrap; }
.ws-page-header__cat { color: var(--c-orange); }

/* 正文 */
.ws-page-body { padding: 0 42px 28px; font-size: 18px; line-height: 1.9; color: #333; }
.ws-page-body p { margin-bottom: 1.4em; }
.ws-page-body img { max-width: 100% !important; height: auto !important; margin: 12px 0; }
.ws-page-body h2 { font-size: 20px; color: #333; margin: 1.4em 0 .6em; font-weight: 500; }
.ws-page-body h3 { font-size: 18px; color: #333; margin: 1.4em 0 .6em; font-weight: 500; }
.ws-page-body ul, .ws-page-body ol { padding-left: 1.6em; margin-bottom: 1.2em; }
.ws-page-body li { margin-bottom: .4em; }
.ws-page-body blockquote {
	border-left: 3px solid var(--c-orange);
	background: #fafafa; color: #666;
	padding: 12px 16px; margin: 1em 0;
}
.ws-page-body a { color: var(--c-orange); }
.ws-page-body a:hover { text-decoration: underline; }

/* 上下篇 */
.ws-page-nav {
	display: flex;
	padding: 28px 24px; border-top: 1px solid #f5f5f5;
	font-size: 14px; color: #5a5a5a;
}
.ws-page-nav > div {
	flex: 1 1 50%;
	min-width: 0;
}
.ws-page-nav__prev { text-align: left; }
.ws-page-nav__next { text-align: right; }
.ws-page-nav a { color: #5a5a5a; max-width: 100%; }
.ws-page-nav a:hover { color: var(--c-orange); }

/* 右侧推荐 */
.ws-sidebar__title {
	font-size: 18px; font-weight: 500; color: var(--c-orange);
	padding: 18px 20px 16px; line-height: 1.4;
	border-bottom: 1px solid #f5f5f5;
}
.ws-sidebar__list { list-style: none; padding: 6px 20px 16px; }
.ws-sidebar__item { border-bottom: 1px dashed #e5e5e5; }
.ws-sidebar__item:last-child { border-bottom: none; }
.ws-sidebar__item a {
	display: block; padding: 10px 0; font-size: 16px; color: #5a5a5a;
	line-height: 1.8; transition: color .2s;
}
.ws-sidebar__item a:hover { color: var(--c-orange); }
.ws-sidebar__empty { font-size: 14px; color: #8c8c8c; padding: 20px; }

/* 响应式 */
@media (max-width: 900px) {
	.ws-layout { grid-template-columns: minmax(0, 1fr); }
	.ws-col--side { order: 2; }
	.ws-page-header__title { font-size: 24px; }
}
@media (max-width: 480px) {
	.ws-breadcrumb__inner { padding: 0 12px; }
	.ws-main__inner { padding: 10px 12px 64px; }
	.ws-page-header__title { font-size: 20px; }
	.ws-page-header { padding: 30px 20px 18px; }
	.ws-page-body { padding: 0 14px 24px; }
}

/* =====================================================================
   小吃项目列表页 (xca-) — 参考旧帝国站 product/ 风格
   ===================================================================== */
/* 宽度变量：各区块宽度可单独调节 */
:root {
	--w-xca-breadcrumb: 1400px;  /* 面包屑内容宽度 */
	--w-xca-tags: 1400px;        /* 标签栏内容宽度 */
	--w-xca-main: 1400px;        /* 主体内容宽度 */
}

/* 页面背景（挂在 <main> 上的全宽修饰类） */
.xca-page { background: var(--bg-muted); }

/* 面包屑：全宽区块 + 内层限宽 */
.xca-breadcrumb { padding: 20px 0 0 0; }
.xca-breadcrumb__inner { max-width: var(--w-xca-breadcrumb); margin: 0 auto; padding: 0; font-size: 14px; color: #8c8c8c; }
.xca-breadcrumb__inner a { color: #8c8c8c; }
.xca-breadcrumb__inner a:hover { color: var(--c-orange); }
.xca-breadcrumb__sep { margin: 0 8px; color: #8c8c8c; }

/* 标签栏：全宽区块，白色卡片在内层 — 参考旧站 .xmfl */
.xca-tags { margin-bottom: 20px; }
.xca-tags__inner {
	max-width: var(--w-xca-tags); margin: 0 auto;
	/* background: #fff;  */
	padding: 24px 0;
	/* border-top: 1px solid var(--c-red); */
}
.xca-tags__list { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; list-style: none; }
.xca-tags__item { width: auto; }
.xca-tags__item a {
	display: inline-block; min-width: 130px; padding: 0 12px;
	height: 38px; line-height: 38px; text-align: center;
	font-size: 15px; font-weight: 500;
	color: var(--c-orange); border: 1px solid var(--c-orange);
	border-radius: 19px; transition: background .2s, color .2s;
	background-color: #fff;
}
.xca-tags__item a:hover,
.xca-tags__item.is-active a {
	color: #fff; background: var(--c-pill); border-color: var(--c-pill);
}

/* 主体：全宽区块 + 内层限宽（卡片直接落在灰色页面上） */
.xca-main__inner { max-width: var(--w-xca-main); margin: 0 auto; padding: 32px 0 64px; }

/* 页面标题（h1，与面包屑之间） */
.xca-page-header__inner { max-width: var(--w-xca-main); margin: 0 auto; padding: 0 20px; }
.xca-page-header__title {
	padding: 20px 0; line-height: 1.4; margin: 0;
	text-align: center;
	font-size: 36px; font-weight: 400; 
}

/* 卡片网格 — 参考旧站 .xcxm li */
.xca-grid {
	display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 32px 28px; list-style: none; margin: 0 0 12px; padding: 0;
}
.xca-grid__item {
	background: #fff; overflow: hidden;
	transition: box-shadow .2s, transform .2s;
}
.xca-grid__item:hover {
	box-shadow: 0 5px 30px rgba(0, 0, 0, .10);
	transform: translate3d(0, -2px, 0);
}
.xca-grid__item a { display: block; height: 100%; }
.xca-grid__thumb,
.xca-grid__thumb-empty {
	display: block; width: 100%; height: 160px; object-fit: cover;
}
.xca-grid__thumb-empty {
	background: #eee; display: flex; align-items: center; justify-content: center;
	color: #a0a0a0; font-size: 12px;
}
.xca-grid__title {
	line-height: 1.6; text-align: center;
	font-size: 18px; font-weight: 400; margin: 14px 12px 14px; color: #333;
}
.xca-grid__views {
	display: block; line-height: 1.4; text-align: center;
	font-size: 13px; color: #333; padding: 0 0 16px;
}
.xca-grid__views b { color: var(--c-orange); font-weight: 500; }

/* 分页 */
.xca-pagination { margin-top: 32px; text-align: center; }
.xca-pagination .page-numbers {
	display: inline-block; padding: 6px 12px; margin: 0 3px;
	font-size: 14px; color: #5a5a5a; border: 1px solid #e5e5e5; transition: all .2s;
}
.xca-pagination .page-numbers:hover { border-color: var(--c-orange); color: var(--c-orange); }
.xca-pagination .page-numbers.current { background: var(--c-orange); color: #fff; border-color: var(--c-orange); }
.xca-empty { text-align: center; color: #8c8c8c; padding: 60px 0; font-size: 15px; }

/* 响应式 */
@media (max-width: 1100px) {
	.xca-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
	.xca-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
}
@media (max-width: 480px) {
	.xca-breadcrumb__inner { padding: 0 12px; }
	.xca-page-header__inner { padding: 0 12px; }
	.xca-page-header__title { font-size: 20px; padding: 14px 0; line-height: 1.4; }
	.xca-tags__inner { padding: 14px 10px; }
	.xca-tags__list { gap: 8px; }
	.xca-tags__item { width: calc((100% - 16px) / 3); }
	.xca-tags__item a { width: 100%; min-width: 0; padding: 0 4px; }
	.xca-main__inner { padding: 0 12px 64px; }
	.xca-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
}

/* =====================================================================
   小吃项目内容页 (xcs-) — 参考旧帝国站 product/454.html
   ===================================================================== */
/* 宽度变量：各区块宽度可单独调节 */
:root {
	--w-xcs-breadcrumb: 1400px;  /* 面包屑内容宽度 */
	--w-xcs-hero: 1400px;        /* Hero 信息区内容宽度 */
	--w-xcs-main: 1400px;        /* 主体内容宽度 */
	--w-xcs-side: 280px;         /* 右侧栏宽度 */
}

/* 页面背景（挂在 <main> 上的全宽修饰类） */
.xcs-page { background: var(--bg-muted); }

/* 面包屑：全宽区块 + 内层限宽 */
.xcs-breadcrumb { padding: 20px 0; }
.xcs-breadcrumb__inner { max-width: var(--w-xcs-breadcrumb); margin: 0 auto;font-size: 14px; color: #8c8c8c; }
.xcs-breadcrumb__inner a { color: #8c8c8c; }
.xcs-breadcrumb__inner a:hover { color: var(--c-orange); }
.xcs-breadcrumb__sep { margin: 0 8px; color: #8c8c8c; }

/* Hero 信息区（旧站 atop）：主图 + 参数 + 联系卡，全宽区块，白卡在内层 */
.xcs-hero { margin-bottom: 20px; }
.xcs-hero__inner {
	max-width: var(--w-xcs-hero); margin: 0 auto;
	background: #fff; padding: 10px 42px 32px;
	/* border-top: 1px solid var(--c-red);  */
	overflow: hidden;
}
.xcs-hero__title {
	padding: 24px 0; line-height: 1.4; font-size: 28px; font-weight: 500;
	color: #333; margin: 0;
}
.xcs-hero__body { display: flex; gap: 36px; align-items: flex-start; }
.xcs-hero__thumb { width: 500px; max-width: 50%; flex-shrink: 0; }
.xcs-hero__thumb img { width: 100%; height: 300px; object-fit: cover; display: block; }
.xcs-hero__thumb-empty {
	width: 100%; height: 300px; background: #eee;
	display: flex; align-items: center; justify-content: center;
	color: #a0a0a0; font-size: 14px;
}
.xcs-hero__info { flex: 1; min-width: 0; }
.xcs-hero__info-title {
	font-size: 21px; font-weight: 500; line-height: 1.4;
	padding: 0 20px 16px; margin: 0 0 4px; color: #333;
}
.xcs-hero__list { list-style: none; margin: 0; padding: 0; }
.xcs-hero__row {
	font-size: 16px; font-weight: 400; line-height: 1.6;
	padding: 9px 20px; color: #333;
}
.xcs-hero__row span { color: #8c8c8c; font-weight: 500; margin-right: 4px; }
.xcs-hero__row a { color: var(--c-orange); font-weight: 500; transition: color .2s ease, background .2s ease; }
.xcs-hero__row a:hover { color: #fff; background: var(--c-orange); text-decoration: none; }
.xcs-hero__row--alt { background: var(--bg-muted); }
.xcs-hero__row b { color: var(--c-orange); font-weight: 500; }

/* 右侧联系卡（旧站 tcon） */
.xcs-hero__contact {
	width: 160px; flex-shrink: 0;
	margin-left: 10px; padding-left: 10px;
	border-left: 1px solid #f5f5f5;
}
.xcs-hero__contact img { width: 100%; height: auto; display: block; }

/* 主体两列：全宽区块 + 内层限宽 */
.xcs-main__inner { max-width: var(--w-xcs-main); margin: 0 auto; padding: 0 0 64px; }
.xcs-layout { display: grid; grid-template-columns: minmax(0, 1fr) var(--w-xcs-side); gap: 20px; }
.xcs-col { min-width: 0; }
.xcs-col--side { display: flex; flex-direction: column; gap: 20px; }

/* 正文（培训详情） */
.xcs-content { background: #fff; padding: 34px 42px; margin-bottom: 24px; }
.xcs-content__title {
	font-size: 22px; font-weight: 500; line-height: 1.6; color: #ee7801;
	margin-bottom: 24px; padding-bottom: 14px;
	border-bottom: 1px solid #f5f5f5;
}
.xcs-content__body { font-size: 16px; line-height: 1.8; color: #333; }
.xcs-content__body img { max-width: 100%; height: auto; margin: 12px 0; }
.xcs-content__body p { margin-bottom: 1.2em; }
.xcs-content__body a { color: var(--c-orange); }
.xcs-content__body a:hover { text-decoration: underline; }

/* 相关项目 */
.xcs-related { background: #fff; padding-bottom: 20px; }
.xcs-related__title {
	font-size: 18px; font-weight: 500; color: #ee7801;
	padding: 22px 32px; margin: 0;
	border-bottom: 1px solid #f5f5f5;
}
.xcs-related__grid {
	list-style: none; display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px;
	padding: 16px 32px; margin: 0;
}
.xcs-related__item {
	padding: 6px;
	transition: box-shadow .2s, transform .2s;
}
.xcs-related__item:hover {
	box-shadow: 0 5px 30px rgba(0, 0, 0, .10);
	transform: translate3d(0, -2px, 0);
}
.xcs-related__item a { display: block; text-align: center; }
.xcs-related__thumb { width: 100%; height: 150px; object-fit: cover; display: block; }
.xcs-related__thumb-empty { width: 100%; height: 130px; background: #eee; margin-bottom: 10px; }
.xcs-related__name {
	display: block; line-height: 1.4; padding: 10px 4px 12px;
	font-size: 14px; color: #333;
}

/* 右侧栏 */
.xcs-side { background: #fff; padding: 26px 14px; }
.xcs-side__tags { list-style: none; padding: 0; margin: 0; }
.xcs-side__tag-item { display: inline-block; margin: 5px 10px; }
.xcs-side__tag-item a {
	display: inline-block; min-width: 96px; padding: 0 10px;
	height: 36px; line-height: 36px; text-align: center;
	font-size: 14px; font-weight: 500;
	color: var(--c-orange); border: 1px solid var(--c-orange);
	border-radius: 18px;
}
.xcs-side__tag-item a:hover { color: #fff; background: var(--c-pill); }

/* 响应式 */
@media (max-width: 1100px) {
	.xcs-hero__thumb { width: 45%; }
}
@media (max-width: 900px) {
	.xcs-hero__body { flex-direction: column; }
	.xcs-hero__thumb { width: 100%; max-width: none; height: 220px; }
	.xcs-hero__contact {
		width: 140px; margin-left: 0; padding-left: 0; border-left: none;
		margin-top: 16px;
	}
	.xcs-layout { grid-template-columns: minmax(0, 1fr); }
	.xcs-related__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 480px) {
	.xcs-breadcrumb__inner { padding: 0 12px; }
	.xcs-hero__inner { padding: 0 12px 18px; }
	.xcs-hero__title { height: auto; padding: 18px 0; line-height: 1.4; font-size: 18px; }
	.xcs-hero__thumb img, .xcs-hero__thumb-empty { height: 200px; }
	.xcs-hero__contact { display: none; }
	.xcs-hero__info { width: 100%; flex: 1 1 100%; }
	.xcs-main__inner { padding: 0 12px 64px; }
	.xcs-content { padding: 24px 14px; }
	.xcs-related__title { padding: 18px 14px; }
	.xcs-related__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 12px 14px 20px; }
	.xcs-side__tags { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
	.xcs-side__tag-item { margin: 0; }
	.xcs-side__tag-item a { width: 100%; min-width: 0; padding: 0 4px; }
}

/* =====================================================================
   图片列表页 (ta-) — 单列卡片网格，参考旧帝国站 /zzry/
   ===================================================================== */
/* 宽度变量：各区块宽度可单独调节 */
:root {
	--w-ta-breadcrumb: 1400px;   /* 面包屑内容宽度 */
	--w-ta-main: 1400px;         /* 主体（标题+网格）内容宽度 */
	--w-ta-pagination: 1400px;   /* 分页内容宽度 */
}

/* 页面背景（挂在 <main> 上的全宽修饰类） */
.ta-page { background: var(--bg-muted); }

/* 面包屑：全宽区块 + 内层限宽 */
.ta-breadcrumb { padding: 20px 0 0 0; }
.ta-breadcrumb__inner { max-width: var(--w-ta-breadcrumb); margin: 0 auto; padding: 0; font-size: 14px; color: #8c8c8c; }
.ta-breadcrumb__inner a { color: #8c8c8c; }
.ta-breadcrumb__inner a:hover { color: var(--c-orange); }
.ta-breadcrumb__sep { margin: 0 8px; color: #8c8c8c; }

/* 主体：全宽区块，白色卡盒在内层（旧站 .list-tuwen） */
.ta-main { margin-bottom: 20px;padding: 20px 0; }
.ta-main__inner { max-width: var(--w-ta-main); margin: 0 auto; background: #fff; }
.ta-page-header { padding: 20px 24px; line-height: 1.4; text-align: center; }
.ta-page-header__title { font-size: 36px; font-weight: 400; color: #333; margin: 0; }

/* 卡片网格（旧站 .list-tuwen ul）：4 列 + 上浮投影 hover */
.ta-grid {
	display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 28px 24px; list-style: none; margin: 0; padding: 24px 20px;
}
.ta-grid__item {
	background: #fff; overflow: hidden;
	transition: box-shadow .2s, transform .2s;
}
.ta-grid__item:hover {
	box-shadow: 0 5px 30px rgba(0, 0, 0, .10);
	transform: translate3d(0, -2px, 0);
}
.ta-grid__item a { display: block; text-align: center; height: 100%; }
.ta-grid__thumb,
.ta-grid__thumb-empty {
	width: 100%; height: 240px; object-fit: cover; display: block;
}
.ta-grid__thumb-empty {
	background: #eee; display: flex; align-items: center; justify-content: center;
	color: #a0a0a0; font-size: 12px;
}
.ta-grid__title {
	line-height: 1.6; text-align: center;
	font-size: 18px; font-weight: 400; color: #ee7800;
	margin: 14px 12px 14px;
}
.ta-empty { text-align: center; color: #8c8c8c; padding: 60px 0; font-size: 15px; }

/* 分页：全宽区块 + 内层限宽 */
.ta-pagination { padding: 10px 0 20px; }
.ta-pagination__inner { max-width: var(--w-ta-pagination); margin: 0 auto; padding: 0 20px; text-align: center; }
.ta-pagination .page-numbers {
	display: inline-block; padding: 6px 12px; margin: 0 3px;
	font-size: 14px; color: #5a5a5a; border: 1px solid #e5e5e5; transition: all .2s;
}
.ta-pagination .page-numbers:hover { border-color: var(--c-orange); color: var(--c-orange); }
.ta-pagination .page-numbers.current { background: var(--c-orange); color: #fff; border-color: var(--c-orange); }

/* 响应式 */
@media (max-width: 1100px) {
	.ta-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px 28px; }
}
@media (max-width: 900px) {
	.ta-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px 20px; }
}
@media (max-width: 480px) {
	.ta-breadcrumb__inner { padding: 0 12px; }
	.ta-page-header__title { font-size: 20px; padding: 14px 0; line-height: 1.4; }
	.ta-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 14px 12px; }
	.ta-grid__thumb,
	.ta-grid__thumb-empty { height: 180px; }
	.ta-pagination__inner { padding: 0 12px; }
}

/* =====================================================================
   图片内容页 (ts-) — 参考旧帝国站 /zzry/360.html 的 .con-tit + .con-main
   ===================================================================== */
/* 宽度变量：各区块宽度可单独调节 */
:root {
	--w-ts-breadcrumb: 1400px;   /* 面包屑内容宽度 */
	--w-ts-main: 1400px;         /* 主体（标题+正文）内容宽度 */
	--w-ts-related: 1400px;      /* 底部同栏目推荐内容宽度 */
}

/* 页面背景（挂在 <main> 上的全宽修饰类） */
.ts-page { background: var(--bg-muted); padding-bottom: 20px;}

/* 面包屑：全宽区块 + 内层限宽 */
.ts-breadcrumb { padding: 20px 0; }
.ts-breadcrumb__inner { max-width: var(--w-ts-breadcrumb); margin: 0 auto; padding: 0; font-size: 14px; color: #8c8c8c; }
.ts-breadcrumb__inner a { color: #8c8c8c; }
.ts-breadcrumb__inner a:hover { color: var(--c-orange); }
.ts-breadcrumb__sep { margin: 0 8px; color: #8c8c8c; }

/* 主体：全宽区块，白色卡盒在内层 */
.ts-main { margin-bottom: 20px; }
.ts-main__inner { max-width: var(--w-ts-main); margin: 0 auto; background: #fff; }

/* 标题区（旧站 .con-tit） */
.ts-page-header { padding: 30px 26px 20px; border-bottom: 1px solid #f0f0f0; text-align: center; }
.ts-page-header__title { font-size: 28px; font-weight: 400; color: #333; line-height: 1.5; margin: 0 0 10px; }
.ts-page-header__meta { font-size: 13px; color: #8c8c8c; display: flex; justify-content: center; gap: 30px; flex-wrap: wrap; }

/* 正文（旧站 .con-main） */
.ts-body { font-size: 16px; line-height: 1.9; color: #333; padding: 26px; }
/* 强制覆盖旧站内联 style 的 width/height，防止正文图片畸形 */
.ts-body img {
	max-width: 100% !important;
	width: auto !important;
	height: auto !important;
	object-fit: contain;
	display: block;
	margin: 12px auto;
}
.ts-body p { margin-bottom: 1.2em; }
.ts-body a { color: var(--c-orange); }
.ts-body a:hover { text-decoration: underline; }

/* 底部同栏目推荐：全宽区块，白色卡盒在内层，卡片式（与图片列表页卡片风格一致） */
.ts-related { margin-bottom: 20px; }
.ts-related__inner { max-width: var(--w-ts-related); margin: 0 auto; background: #fff; }
.ts-related__title {
	padding: 18px 24px; line-height: 1.4;
	font-size: 19px; font-weight: 500; color: #ee7801; margin: 0;
}
.ts-related__grid {
	display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 28px 24px; list-style: none; margin: 0; padding: 24px 24px;
}
.ts-related__item {
	background: #fff; overflow: hidden;
	transition: box-shadow .2s, transform .2s;
}
.ts-related__item:hover {
	box-shadow: 0 5px 30px rgba(0, 0, 0, .10);
	transform: translate3d(0, -2px, 0);
}
.ts-related__item a { display: block; text-align: center; height: 100%; }
.ts-related__thumb,
.ts-related__thumb-empty {
	width: 100%; height: 220px; object-fit: cover; display: block;
}
.ts-related__thumb-empty {
	background: #eee; display: flex; align-items: center; justify-content: center;
	color: #a0a0a0; font-size: 12px;
}
.ts-related__name {
	line-height: 1.4; text-align: center;
	font-size: 14px; font-weight: 400; color: #ee7800;
	margin: 10px 4px 12px;
}

/* 响应式 */
@media (max-width: 1100px) {
	.ts-related__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px 28px; }
}
@media (max-width: 900px) {
	.ts-related__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px 20px; }
}
@media (max-width: 480px) {
	.ts-breadcrumb__inner { padding: 0 12px; }
	.ts-page-header { padding: 16px 12px 12px; }
	.ts-page-header__title { font-size: 20px; }
	.ts-body { padding: 14px 12px 20px; }
	.ts-related__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 14px; padding: 2px 12px; }
	.ts-related__thumb, .ts-related__thumb-empty { height: 130px; }
}


/* =====================================================================
   大屏适配：≥1600px 时把主要内容宽度从 1400px 加到 1600px
   仅影响大屏/1920 显示器，其它断点保持不变
   ===================================================================== */
@media (min-width: 1600px) {
	:root {
		--container: 1500px;
		--w-featured: 1500px;
		--w-cats: 1500px;
		--w-news: 1500px;
		--w-contact: 1500px;

		--w-wa-breadcrumb: 1500px;
		--w-wa-main: 1500px;
		--w-wa-side: 400px;

		--w-ws-breadcrumb: 1500px;
		--w-ws-main: 1500px;
		--w-ws-side: 400px;

		--w-xca-breadcrumb: 1500px;
		--w-xca-tags: 1500px;
		--w-xca-main: 1500px;

		--w-xcs-breadcrumb: 1500px;
		--w-xcs-hero: 1500px;
		--w-xcs-main: 1500px;

		--w-ta-breadcrumb: 1500px;
		--w-ta-main: 1500px;
		--w-ta-pagination: 1500px;

		--w-ts-breadcrumb: 1500px;
		--w-ts-main: 1500px;
		--w-ts-related: 1500px;
	}
}


/* =====================================================================
   404 页面
   ===================================================================== */
.error-404-page {
	min-height: 60vh;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--bg-muted);
	padding: 80px 20px;
}
.error-404__container {
	max-width: 640px;
	width: 100%;
	margin: 0 auto;
	text-align: center;
	background: var(--white);
	padding: 60px 40px;
	box-shadow: var(--shadow-card);
}
.error-404__code {
	font-size: 80px;
	line-height: 1;
	color: var(--c-red);
	font-weight: 700;
	margin: 0;
}
.error-404__title {
	font-size: 28px;
	color: var(--text-dark);
	margin: 20px 0 12px;
}
.error-404__desc {
	font-size: 16px;
	color: var(--text-muted);
	line-height: 1.8;
	margin-bottom: 30px;
}
.error-404__btn {
	display: inline-block;
	padding: 12px 32px;
	background: var(--c-red);
	color: #fff;
	font-size: 16px;
	border-radius: 6px;
	transition: background .2s, transform .2s;
}
.error-404__btn:hover {
	background: var(--c-orange);
	color: #fff;
	transform: translateY(-2px);
}

@media (max-width: 480px) {
	.error-404__container {
		padding: 40px 20px;
	}
	.error-404__code {
		font-size: 60px;
	}
	.error-404__title {
		font-size: 22px;
	}
}


/* =====================================================================
   电脑端图片高度统一为 200px（手机端保持原样）
   ===================================================================== */
@media (min-width: 481px) {
	.project-card__thumb {
		height: 200px;
	}
	.xca-grid__thumb,
	.xca-grid__thumb-empty {
		height: 200px;
	}
	.xcs-related__thumb,
	.xcs-related__thumb-empty {
		height: 200px;
	}
}