/* =========================================================================
   美彦雾森系统 —— 设计系统（园林雾景 · 墨绿 + 暖金）
   1 令牌  2 基础  3 布局  4 组件  5 页头页尾  6 首页  7 列表/筛选
   8 详情  9 表单  10 其它页面  11 响应式  12 无障碍与动效

   与 v1（工业蓝）的差异：色板换为园林墨绿 + 暖金；标题启用系统宋体；
   首屏改为全幅实景图 + 渐变遮罩；卡片增加图片缩放与金色描边反馈。
   类名保持不变，模板无需改动。
   ========================================================================= */

/* ---------- 1 令牌 ---------- */
:root {
	/* 品牌绿：深林 → 叶绿 */
	--brand-900: #0B3B26;
	--brand-700: #0F5132; /* 白字实心按钮专用（对白 9.2:1） */
	--brand-500: #1A7A4C; /* 链接、图标、选中态 */
	--brand-300: #6FA98C;
	--brand-100: #DCEBE1;
	--brand-050: #EFF6F1;

	/* 暖金：点缀与分隔 */
	--gold-600: #7E6234;
	--gold-500: #B08A4F;
	--gold-300: #D6BE95;
	--gold-100: #F3ECDD;

	/* 中性：暖纸感 */
	--ink-900: #14231B;
	--ink-700: #2C3E33;
	--ink-500: #55665C;
	--ink-400: #5B6A61;
	--bg: #F6F5F0;
	--bg-alt: #EFEEE7;
	--surface: #FFFFFF;
	--line: #E4E1D8;
	--line-dark: rgba(255, 255, 255, .14);

	/* 语义（沿用） */
	--ok: #17794E;
	--warn: #A9741B;
	--err: #B3261E;
	--idle: #C9CED6;

	/* 兼容旧变量名（模板/后台少量引用） */
	--tech-400: var(--gold-300);
	--text-1: var(--ink-900);
	--text-2: var(--ink-500);
	--text-3: var(--ink-400);
	--navy-900: var(--brand-900);

	/* 间距（8px 网格） */
	--sp-1: 8px;
	--sp-2: 16px;
	--sp-3: 24px;
	--sp-4: 32px;
	--sp-5: 40px;
	--sp-6: 48px;
	--sp-8: 64px;
	--sp-10: 80px;
	--sp-12: 96px;

	/* 形状 */
	--r-1: 6px;
	--r-2: 10px;
	--r-3: 16px;
	--shadow-1: 0 1px 2px rgba(20, 35, 27, .05), 0 12px 28px -20px rgba(20, 35, 27, .35);
	--shadow-2: 0 2px 6px rgba(20, 35, 27, .08), 0 28px 48px -28px rgba(20, 35, 27, .45);

	/* 排版 */
	--font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
	--serif: "Songti SC", "STSong", "Source Han Serif SC", "Noto Serif CJK SC", "SimSun", Georgia, serif;
	--font-num: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

	/* 布局 */
	--container: 1240px;
	--gutter: 24px;
	--header-h: 76px;
}

/* ---------- 2 基础 ---------- */
*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
	margin: 0;
	font-family: var(--font);
	font-size: 16px;
	line-height: 1.75;
	color: var(--ink-700);
	background: var(--bg);
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden; /* 防止单行 nowrap 文案把整页撑宽 */
	max-width: 100%;
	overflow-wrap: break-word;
}

img, svg { max-width: 100%; height: auto; }
img { display: block; }
svg.icon { flex: none; vertical-align: middle; }
.icon--inline { display: inline-block; margin-left: 4px; vertical-align: -3px; }

h1, h2, h3, h4 {
	margin: 0 0 12px;
	color: var(--ink-900);
	font-family: var(--serif);
	line-height: 1.3;
	font-weight: 700;
	letter-spacing: .01em;
}
h1 { font-size: clamp(32px, 4.4vw, 54px); }
h2 { font-size: clamp(25px, 3vw, 38px); }
h3 { font-size: 20px; }
h4 { font-size: 17px; }
p { margin: 0 0 16px; }
a { color: var(--brand-500); text-decoration: none; }
a:hover { color: var(--brand-700); text-decoration: underline; }
strong { font-weight: 600; }
ul, ol { margin: 0 0 16px; padding-left: 1.2em; }
li { margin-bottom: 8px; }

:focus-visible {
	outline: 2px solid var(--brand-500);
	outline-offset: 3px;
	border-radius: 3px;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.skip-link {
	position: absolute;
	left: 16px; top: -60px;
	z-index: 999;
	padding: 12px 20px;
	background: var(--brand-700);
	color: #fff;
	border-radius: var(--r-1);
	transition: top .15s ease;
}
.skip-link:focus { top: 12px; color: #fff; text-decoration: none; }

/* ---------- 3 布局 ---------- */
.container {
	width: 100%;
	max-width: var(--container);
	margin: 0 auto;
	padding: 0 var(--gutter);
}
.container--narrow { max-width: 820px; }

.site-main { display: block; }

.section { padding: var(--sp-10) 0; background: var(--bg); }
.section--alt { background: var(--bg-alt); }
.section--forest {
	background: var(--brand-900);
	background-image:
		radial-gradient(120% 90% at 80% 0%, rgba(26, 122, 76, .38) 0%, rgba(11, 59, 38, 0) 60%),
		linear-gradient(180deg, #0B3B26 0%, #082E1E 100%);
	color: rgba(255, 255, 255, .82);
}
.section--forest h2, .section--forest h3, .section--forest .section__title { color: #fff; }
.section--forest .section__desc { color: rgba(255, 255, 255, .72); }
.section--forest .eyebrow { color: var(--gold-300); }
.section--forest .link-more { color: var(--gold-300); }

.section__head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--sp-2);
	margin-bottom: var(--sp-5);
}
.section__head-main { max-width: 720px; }
.section__title { margin: 0 0 10px; }
.section__desc { margin: 0; color: var(--ink-500); font-size: 15px; }

.eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 12px;
	font-family: var(--font);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--gold-600);
}
.eyebrow::before {
	content: "";
	width: 28px;
	height: 1px;
	background: var(--gold-500);
	display: inline-block;
}

.link-more {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 44px;
	font-size: 14px;
	font-weight: 500;
	color: var(--brand-500);
	letter-spacing: .02em;
	white-space: nowrap;
}
.link-more:hover { color: var(--brand-700); text-decoration: none; }
.link-more .icon { transition: transform .2s ease; }
.link-more:hover .icon { transform: translateX(3px); }

.grid { display: grid; gap: var(--sp-3); }
.grid--2 { grid-template-columns: 1fr; }
.grid--3 { grid-template-columns: 1fr; }
.stack { display: grid; gap: var(--sp-2); }
.split { display: grid; gap: var(--sp-6); }
.two-col { display: grid; gap: var(--sp-4); }

/* ---------- 4 组件 ---------- */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 46px;
	padding: 12px 26px;
	border: 1px solid transparent;
	border-radius: var(--r-1);
	background: transparent;
	color: var(--brand-700);
	font: inherit;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: .02em;
	cursor: pointer;
	transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}
.btn:hover { text-decoration: none; }
.btn--primary { background: var(--brand-700); color: #fff; }
.btn--primary:hover { background: var(--brand-900); color: #fff; }
.btn--outline { background: transparent; color: var(--brand-700); border-color: var(--brand-300); }
.btn--outline:hover { border-color: var(--brand-700); background: var(--brand-050); }
.btn--ghost { background: transparent; color: var(--ink-500); border-color: var(--line); }
.btn--ghost:hover { color: var(--ink-900); border-color: var(--ink-400); }
.btn--gold { background: var(--gold-500); color: #fff; }
.btn--gold:hover { background: var(--gold-600); color: #fff; }
.btn--light { background: #fff; color: var(--brand-900); }
.btn--light:hover { background: var(--gold-100); color: var(--brand-900); }
.btn--sm { min-height: 40px; padding: 8px 16px; font-size: 14px; }
.btn--lg { min-height: 54px; padding: 15px 34px; font-size: 16px; }
.btn--block { width: 100%; }
.btn[disabled], .btn.is-loading { opacity: .55; cursor: not-allowed; }
.btn.is-loading::after {
	content: "";
	width: 14px; height: 14px;
	border: 2px solid rgba(255, 255, 255, .45);
	border-top-color: #fff;
	border-radius: 50%;
	animation: my-spin .7s linear infinite;
}
.btn--header { min-height: 40px; padding: 9px 20px; font-size: 14px; }

@keyframes my-spin { to { transform: rotate(360deg); } }

.icon-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px; height: 44px;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--ink-700);
	cursor: pointer;
	transition: background-color .18s ease, color .18s ease;
}
.icon-btn:hover { background: var(--brand-050); color: var(--brand-700); }

.badge {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 3px 9px;
	border-radius: 3px;
	font-size: 11px;
	font-weight: 600;
	line-height: 18px;
	letter-spacing: .06em;
	background: var(--gold-100);
	color: var(--gold-600);
}
.badge--model {
	position: absolute;
	left: 14px; top: 14px;
	background: rgba(11, 59, 38, .88);
	backdrop-filter: blur(4px);
	color: #fff;
}
.badge--ghost { background: rgba(255, 255, 255, .92); color: var(--brand-900); }

.tag {
	display: inline-flex;
	align-items: center;
	height: 26px;
	padding: 0 10px;
	border-radius: 3px;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .02em;
	background: var(--brand-050);
	color: var(--brand-700);
}
.tag--brand { background: var(--brand-100); color: var(--brand-700); }
.tag--client { background: var(--brand-900); color: #fff; }
.tag--ghost { background: #fff; border: 1px solid var(--line); color: var(--ink-500); }
.tag--link:hover { background: var(--brand-100); color: var(--brand-700); text-decoration: none; }

.chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 var(--sp-3); }
.chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 32px;
	padding: 4px 12px;
	border: 1px solid var(--brand-100);
	border-radius: 999px;
	background: #fff;
	color: var(--brand-700);
	font-size: 13px;
}
.chip:hover { background: var(--brand-050); text-decoration: none; }
.chip__x { font-size: 15px; line-height: 1; opacity: .7; }
.chip--clear { border-color: var(--line); color: var(--ink-500); }

.card {
	position: relative;
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--r-2);
	box-shadow: none;
	overflow: hidden;
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.card__link { display: flex; flex-direction: column; height: 100%; color: inherit; }
.card__link:hover { text-decoration: none; }
.card__media {
	position: relative;
	aspect-ratio: 4 / 3;
	background: var(--brand-050);
	overflow: hidden;
}
.card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2, .6, .2, 1); }
.card__body { display: flex; flex-direction: column; gap: 8px; padding: var(--sp-3); flex: 1; }
.card__kicker { margin: 0; font-size: 12px; font-weight: 600; color: var(--gold-600); letter-spacing: .08em; }
.card__title { margin: 0; font-size: 19px; line-height: 1.45; color: var(--ink-900); }
.card__desc { margin: 0; font-size: 14px; line-height: 1.7; color: var(--ink-500); }
.card__meta { display: flex; align-items: center; gap: 10px; font-size: 12px; color: var(--ink-400); }
.card__tags { display: flex; flex-wrap: wrap; gap: 6px; }
.card__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px; height: 46px;
	border-radius: 50%;
	background: var(--brand-050);
	color: var(--brand-700);
	margin-bottom: 6px;
}
.card__foot {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: auto;
	padding-top: 10px;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .04em;
	color: var(--brand-500);
}
.card--post-compact .card__body { padding: var(--sp-2) var(--sp-3); }
.card--post-compact .card__title { font-size: 16px; }

.spec-inline {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
	margin: 6px 0 0;
	padding: 10px 0 0;
	border-top: 1px solid var(--line);
	list-style: none;
}
.spec-inline li { display: flex; flex-direction: column; margin: 0; }
.spec-inline span { font-size: 11px; color: var(--ink-400); }
.spec-inline b { font-size: 14px; color: var(--ink-900); font-variant-numeric: tabular-nums; font-weight: 600; }

.note { font-size: 13px; color: var(--ink-500); margin: 8px 0 0; }
.note--inline { margin: 4px 0 0; }
.note-box {
	padding: var(--sp-2) var(--sp-3);
	border-left: 3px solid var(--gold-500);
	background: var(--gold-100);
	border-radius: 0 var(--r-1) var(--r-1) 0;
	color: var(--ink-700);
	font-size: 14px;
	margin: 0 0 var(--sp-4);
}
.block-title { margin: 0 0 var(--sp-2); font-size: 23px; }
.block-text { margin: 0 0 var(--sp-2); color: var(--ink-500); }
.section-block { margin-bottom: var(--sp-6); }
.bullet-list { list-style: none; padding: 0; margin: 0; }
.bullet-list li { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 10px; color: var(--ink-500); }
.bullet-list--icon .icon { color: var(--brand-500); margin-top: 4px; }

.link-list { list-style: none; padding: 0; margin: 0; }
.link-list li { margin: 0; }
.link-list a { display: block; padding: 9px 0; color: var(--ink-500); font-size: 15px; border-bottom: 1px solid var(--line); }
.link-list a:hover { color: var(--brand-700); }

.breadcrumb { margin: 0 0 var(--sp-3); font-size: 13px; color: var(--ink-400); }
.breadcrumb__list { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.breadcrumb__item { margin: 0; display: inline-flex; align-items: center; gap: 6px; }
.breadcrumb__item + .breadcrumb__item::before { content: "/"; color: var(--gold-300); }
.breadcrumb__item[aria-current] { color: var(--ink-500); }
.breadcrumb a { color: var(--ink-500); }

.pagination { margin: var(--sp-6) 0 0; }
.pagination__list { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin: 0; padding: 0; list-style: none; }
.pagination__item { margin: 0; }
.pagination__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px; min-height: 44px;
	padding: 0 12px;
	border: 1px solid var(--line);
	border-radius: var(--r-1);
	background: #fff;
	color: var(--ink-500);
	font-size: 14px;
}
.pagination__link:hover { border-color: var(--brand-500); color: var(--brand-700); text-decoration: none; }
.pagination__item.is-current .pagination__link { background: var(--brand-700); border-color: var(--brand-700); color: #fff; }
.pagination .dots { color: var(--ink-400); }

.tabs { margin: 0 0 var(--sp-3); }
.tabs__list { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.tabs__item { margin: 0; }
.tabs__item a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 40px;
	padding: 6px 16px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: #fff;
	color: var(--ink-500);
	font-size: 14px;
}
.tabs__item.is-active a { background: var(--brand-700); border-color: var(--brand-700); color: #fff; }
.tabs__count { font-size: 12px; opacity: .75; font-variant-numeric: tabular-nums; }

.empty-state {
	padding: var(--sp-8) var(--sp-3);
	text-align: center;
	background: #fff;
	border: 1px dashed var(--line);
	border-radius: var(--r-2);
}
.empty-state__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 64px; height: 64px;
	margin-bottom: var(--sp-2);
	border-radius: 50%;
	background: var(--brand-050);
	color: var(--brand-700);
}
.empty-state__title { margin: 0 0 8px; font-size: 21px; }
.empty-state__desc { max-width: 520px; margin: 0 auto 20px; color: var(--ink-500); font-size: 15px; }
.empty-state__extra { text-align: center; margin-top: var(--sp-3); }

.faq { border-top: 1px solid var(--line); }
.faq__item { border-bottom: 1px solid var(--line); }
.faq__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 20px 4px;
	font-family: var(--serif);
	font-size: 17px;
	font-weight: 600;
	color: var(--ink-900);
	cursor: pointer;
	list-style: none;
}
.faq__q::-webkit-details-marker { display: none; }
.faq__q::after { content: "+"; font-family: var(--font); font-size: 20px; color: var(--gold-600); transition: transform .2s ease; }
.faq__item[open] .faq__q::after { content: "−"; }
.faq__a { padding: 0 4px 20px; color: var(--ink-500); }
.faq__a p { margin: 0; }

.spec-table {
	width: 100%;
	border-collapse: collapse;
	background: #fff;
	border: 1px solid var(--line);
	font-size: 14px;
}
.spec-table th, .spec-table td { padding: 13px 16px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: top; }
.spec-table thead th { background: var(--brand-050); font-weight: 600; color: var(--brand-900); font-size: 12px; letter-spacing: .06em; }
.spec-table tbody tr:last-child th, .spec-table tbody tr:last-child td { border-bottom: 0; }
.spec-table tbody th { width: 200px; font-weight: 500; color: var(--ink-500); }
.spec-table td { color: var(--ink-900); font-variant-numeric: tabular-nums; }
.spec-table--kv tbody th { width: 150px; }

.spec-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 1px;
	margin: 0;
	padding: 0;
	list-style: none;
	background: var(--line);
	border: 1px solid var(--line);
}
.spec-cards__item { display: flex; flex-direction: column; gap: 4px; padding: 20px; background: #fff; }
.spec-cards__label { font-size: 12px; color: var(--ink-400); letter-spacing: .04em; }
.spec-cards__value { font-family: var(--font); font-size: 23px; font-weight: 700; color: var(--brand-900); font-variant-numeric: tabular-nums; letter-spacing: -.01em; }

.doc-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.doc-list__item { margin: 0; }
.doc-list__link {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 15px 18px;
	background: #fff;
	border: 1px solid var(--line);
	border-radius: var(--r-1);
	color: var(--ink-900);
	font-weight: 500;
}
.doc-list__link:hover { border-color: var(--brand-300); background: var(--brand-050); text-decoration: none; }
.doc-list__meta { margin-left: auto; font-size: 12px; color: var(--ink-400); }

/* ---------- 5 页头 / 页尾 ---------- */
.site-header { position: sticky; top: 0; z-index: 100; }

.topbar { background: var(--brand-900); color: rgba(255, 255, 255, .78); font-size: 12.5px; letter-spacing: .04em; overflow: hidden; }
.topbar__inner { display: flex; align-items: center; min-height: 38px; min-width: 0; }
.topbar__inner > * { min-width: 0; }
.topbar__text { min-width: 0; overflow: hidden; text-overflow: ellipsis; }

.header {
	background: rgba(255, 255, 255, .94);
	backdrop-filter: saturate(180%) blur(10px);
	border-bottom: 1px solid var(--line);
	transition: box-shadow .25s ease, background-color .25s ease;
}
.site-header.is-scrolled .header { box-shadow: 0 12px 24px -22px rgba(20, 35, 27, .5); }
.header__inner { display: flex; align-items: center; gap: var(--sp-3); min-height: var(--header-h); }
.header__actions { display: flex; align-items: center; gap: 10px; margin-left: auto; }

.logo { display: inline-flex; align-items: center; gap: 11px; flex: none; color: var(--brand-700); }
.logo:hover { text-decoration: none; }
.logo__mark { display: inline-flex; }
.logo__text { display: flex; flex-direction: column; line-height: 1.2; }
.logo__name { font-family: var(--serif); font-size: 18px; font-weight: 700; color: var(--brand-900); letter-spacing: .06em; }
.logo__sub { font-size: 10.5px; color: var(--ink-400); letter-spacing: .22em; }

.nav { margin-left: var(--sp-5); }
.nav__list { display: flex; align-items: center; gap: 2px; margin: 0; padding: 0; list-style: none; }
.nav__item { margin: 0; }
.nav__link {
	position: relative;
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 15px;
	color: var(--ink-700);
	font-size: 14.5px;
	font-weight: 500;
	letter-spacing: .02em;
	white-space: nowrap;
}
.nav__link::after {
	content: "";
	position: absolute;
	left: 15px; right: 15px; bottom: 8px;
	height: 1px;
	background: var(--gold-500);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .25s ease;
}
.nav__link:hover { color: var(--brand-700); text-decoration: none; }
.nav__link:hover::after, .nav__link[aria-current="page"]::after { transform: scaleX(1); }
.nav__link[aria-current="page"] { color: var(--brand-700); }

.header__search { border-top: 1px solid var(--line); padding: var(--sp-2) 0; background: #fff; }
.header__burger { display: none; }

/* 主导航有 8 项 + 13 语言切换器：容器宽度有限，桌面端必须收紧，
   否则语言切换器会被挤出容器（德语等长词语言更容易溢出）。 */
.header__inner { gap: 10px; }
.header__actions { flex: none; }
@media (min-width: 1400px) {
	.nav { margin-left: 12px; }
	.nav__link { padding: 0 10px; font-size: 13.5px; letter-spacing: 0; }
	.nav__link::after { left: 10px; right: 10px; }
	.logo__name { font-size: 17px; letter-spacing: .03em; }
	.lang-switch--header .lang-switch__name { display: none; }
	.lang-switch--header .lang-switch__current { padding-left: 10px; padding-right: 10px; }
}
@media (min-width: 1600px) {
	.nav { margin-left: var(--sp-5); }
	.nav__link { padding: 0 15px; font-size: 14.5px; }
	.nav__link::after { left: 15px; right: 15px; }
	.logo__name { font-size: 18px; }
	.lang-switch--header .lang-switch__name { display: inline; }
}

.mobile-nav {
	position: fixed;
	inset: 0;
	z-index: 200;
	display: flex;
	flex-direction: column;
	gap: var(--sp-3);
	padding: var(--sp-3);
	background: var(--bg);
	overflow-y: auto;
}
.mobile-nav[hidden],
.header__search[hidden] { display: none !important; }
.mobile-nav__head { display: flex; align-items: center; justify-content: space-between; }
.mobile-nav__list { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.mobile-nav__list li { margin: 0; }
.mobile-nav__list a {
	display: block;
	padding: 16px 4px;
	font-family: var(--serif);
	font-size: 19px;
	color: var(--ink-900);
	border-bottom: 1px solid var(--line);
}
.mobile-nav__foot { margin-top: auto; display: grid; gap: var(--sp-2); }
.mobile-nav__phone { color: var(--ink-500); font-size: 14px; text-align: center; margin: 0; }

.site-footer { background: var(--brand-900); color: rgba(255, 255, 255, .7); padding: var(--sp-8) 0 0; }
.footer__grid { display: grid; gap: var(--sp-5); grid-template-columns: 1fr; }
.footer__brand .logo__name { color: #fff; }
.footer__brand .logo__sub { color: rgba(255, 255, 255, .55); }
.footer__desc { margin: var(--sp-2) 0; font-size: 14px; line-height: 1.8; max-width: 340px; }
.footer__contact { display: flex; flex-wrap: wrap; gap: 18px; margin: 0 0 10px; font-size: 15px; color: #fff; }
.footer__contact-item { display: inline-flex; align-items: center; gap: 6px; }
.footer__note { font-size: 12px; color: rgba(255, 255, 255, .72); margin: 0; }
.footer__title {
	font-family: var(--serif);
	font-size: 15px;
	letter-spacing: .1em;
	color: #fff;
	margin: 0 0 var(--sp-2);
}
.footer__list { list-style: none; margin: 0; padding: 0; }
.footer__list li { margin: 0 0 11px; }
.footer__list a { color: rgba(255, 255, 255, .72); font-size: 14px; }
.footer__list a:hover { color: #fff; }
.footer__bottom { margin-top: var(--sp-6); border-top: 1px solid var(--line-dark); padding: var(--sp-2) 0; }
.footer__bottom-inner { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; font-size: 12.5px; }
.footer__copy { margin: 0; }
.footer__legal { display: flex; gap: 16px; margin: 0; padding: 0; list-style: none; }
.footer__legal li { margin: 0; }
.footer__legal a { color: rgba(255, 255, 255, .62); }

/* ---------- 6 首页 ---------- */
.hero {
	position: relative;
	isolation: isolate;
	min-height: 620px;
	display: flex;
	align-items: center;
	padding: var(--sp-10) 0;
	overflow: hidden;
	background: var(--brand-900);
}
.hero__bg { position: absolute; inset: 0; z-index: -2; }
.hero__bg img { width: 100%; height: 100%; object-fit: cover; }
.hero__bg::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(90deg, rgba(8, 40, 25, .88) 0%, rgba(8, 40, 25, .62) 48%, rgba(8, 40, 25, .2) 100%),
		linear-gradient(180deg, rgba(8, 40, 25, .55) 0%, rgba(8, 40, 25, 0) 35%, rgba(8, 40, 25, .75) 100%);
}
.hero__inner { display: grid; gap: var(--sp-6); align-items: end; }
.hero__content { max-width: 640px; color: #fff; }
.hero__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 var(--sp-3);
	padding: 6px 14px 6px 12px;
	border: 1px solid rgba(255, 255, 255, .26);
	border-radius: 999px;
	color: rgba(255, 255, 255, .9);
	font-size: 12px;
	letter-spacing: .14em;
	text-transform: uppercase;
}
.hero__eyebrow .icon { color: var(--gold-300); }
.hero__title {
	margin: 0 0 var(--sp-3);
	color: #fff;
	font-size: clamp(34px, 4.6vw, 58px);
	line-height: 1.24;
	letter-spacing: .01em;
	text-shadow: 0 2px 24px rgba(0, 0, 0, .35);
}
.hero__title::after {
	content: "";
	display: block;
	width: 64px;
	height: 2px;
	margin-top: var(--sp-3);
	background: linear-gradient(90deg, var(--gold-300), rgba(214, 190, 149, 0));
}
.hero__sub {
	margin: 0 0 var(--sp-4);
	max-width: 34em;
	color: rgba(255, 255, 255, .84);
	font-size: 16.5px;
	line-height: 1.85;
}
.hero__actions { display: flex; flex-wrap: wrap; gap: 14px; }
.hero__actions .btn--primary { background: #fff; color: var(--brand-900); }
.hero__actions .btn--primary:hover { background: var(--gold-100); color: var(--brand-900); }
.hero__actions .btn--outline { color: #fff; border-color: rgba(255, 255, 255, .45); }
.hero__actions .btn--outline:hover { background: rgba(255, 255, 255, .12); border-color: #fff; color: #fff; }
.hero__plain { margin: var(--sp-3) 0 0; font-size: 13px; color: rgba(255, 255, 255, .62); max-width: 36em; }
.hero__media { position: relative; }
.hero__img { width: 100%; border-radius: var(--r-3); box-shadow: var(--shadow-2); }
.hero__badge {
	position: absolute;
	right: 16px; bottom: -18px;
	display: grid;
	grid-template-columns: auto auto;
	align-items: baseline;
	gap: 2px 4px;
	padding: 14px 18px;
	background: #fff;
	border-radius: var(--r-1);
	box-shadow: var(--shadow-1);
}
.hero__badge-num { font-family: var(--serif); font-size: 30px; font-weight: 700; color: var(--brand-700); line-height: 1; }
.hero__badge-unit { font-size: 13px; color: var(--ink-400); }
.hero__badge-label { grid-column: 1 / -1; font-size: 11px; color: var(--ink-400); letter-spacing: .06em; }

.trust { background: var(--brand-050); border-bottom: 1px solid var(--line); }
.trust__inner { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-2); padding: var(--sp-4) 0; }
.trust__item {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 4px;
	padding: 0 var(--sp-2);
}
.trust__item + .trust__item { border-left: 1px solid var(--line); }
.trust__value {
	font-family: var(--font);
	font-size: 29px;
	font-weight: 700;
	color: var(--brand-900);
	font-variant-numeric: tabular-nums;
	letter-spacing: -.01em;
	line-height: 1.2;
}
.trust__label { font-size: 12.5px; color: var(--ink-500); letter-spacing: .08em; }

.capability {
	display: grid;
	gap: var(--sp-5);
	padding: var(--sp-6);
	background: #fff;
	border: 1px solid var(--line);
}
.capability__head { max-width: 460px; }
.capability__list { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.capability__item {
	display: grid;
	grid-template-columns: 46px 1fr;
	grid-template-rows: auto auto;
	column-gap: 18px;
	align-items: start;
	padding: var(--sp-3) 0;
	border-bottom: 1px solid var(--line);
}
.capability__item:first-child { padding-top: 0; }
.capability__item:last-child { border-bottom: 0; padding-bottom: 0; }
.capability__icon {
	grid-row: 1 / span 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px; height: 46px;
	border-radius: 50%;
	background: var(--brand-050);
	color: var(--brand-700);
}
.capability__title { font-family: var(--serif); font-weight: 700; color: var(--ink-900); font-size: 17px; }
.capability__desc { font-size: 14px; color: var(--ink-500); }

/* ---------- 7 列表 / 筛选 ---------- */
.page-head { padding: var(--sp-8) 0 var(--sp-5); background: var(--bg-alt); border-bottom: 1px solid var(--line); }
.page-head__title { margin: 0 0 10px; }
.page-head__lede { margin: 0; max-width: 760px; color: var(--ink-500); }
.page-head__row { display: flex; gap: var(--sp-2); align-items: flex-start; }
.page-head__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 58px; height: 58px;
	border-radius: 50%;
	background: #fff;
	border: 1px solid var(--brand-100);
	color: var(--brand-700);
	flex: none;
}
.page-head--app .app-intro { margin-top: var(--sp-3); max-width: 780px; color: var(--ink-500); }

.archive-layout { display: grid; gap: var(--sp-4); padding-top: var(--sp-5); padding-bottom: var(--sp-10); }
.archive-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: var(--sp-3);
	padding-bottom: var(--sp-2);
	border-bottom: 1px solid var(--line);
}
.archive-toolbar__left { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.archive-toolbar__count { font-size: 14px; color: var(--ink-500); }
.archive-toolbar__count b { color: var(--ink-900); font-variant-numeric: tabular-nums; }
.archive-toolbar__right { margin-left: auto; }

.filter-toggle { display: inline-flex; }

.filter-panel { background: transparent; border: 0; padding: 0; }
.filter-panel__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--sp-2); }
.filter-panel__title { margin: 0; font-size: 15px; font-family: var(--font); letter-spacing: .1em; color: var(--ink-400); }
.filter-panel__close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px; height: 40px;
	border: 1px solid var(--line);
	border-radius: 50%;
	background: #fff;
	color: var(--ink-500);
	cursor: pointer;
}
.filter-group { border: 0; margin: 0 0 var(--sp-3); padding: 0; border-bottom: 1px solid var(--line); padding-bottom: var(--sp-2); }
.filter-group:last-of-type { border-bottom: 0; }
.filter-group__title { padding: 0; margin-bottom: 10px; font-size: 13px; font-weight: 600; color: var(--ink-900); letter-spacing: .04em; }
.filter-group__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.filter-option {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	min-height: 40px;
	padding: 6px 10px;
	border-radius: var(--r-1);
	color: var(--ink-500);
	font-size: 14px;
}
.filter-option:hover { background: var(--brand-050); color: var(--brand-700); text-decoration: none; }
.filter-option.is-active { background: var(--brand-700); color: #fff; font-weight: 500; }
.filter-option.is-active .filter-option__count { color: rgba(255, 255, 255, .7); }
.filter-option__count { font-size: 12px; color: var(--ink-400); font-variant-numeric: tabular-nums; }
.filter-panel__clear {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	font-size: 13px;
	color: var(--ink-500);
	text-decoration: underline;
	text-underline-offset: 4px;
}

.sort-control { display: inline-flex; border: 1px solid var(--line); border-radius: var(--r-1); overflow: hidden; background: #fff; }
.sort-control__item { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; font-size: 13px; color: var(--ink-500); }
.sort-control__item:hover { text-decoration: none; background: var(--brand-050); color: var(--brand-700); }
.sort-control__item.is-active { background: var(--brand-700); color: #fff; }

.filter-inline { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.filter-inline__label { font-size: 13px; color: var(--ink-400); margin-right: 4px; }
.filter-inline__item { display: inline-flex; align-items: center; min-height: 36px; padding: 0 12px; border-radius: 999px; font-size: 14px; color: var(--ink-500); }
.filter-inline__item:hover { background: var(--brand-050); text-decoration: none; }
.filter-inline__item.is-active { background: var(--brand-700); color: #fff; }

.result-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-2); }
.result-item { margin: 0; }
.result-item__link {
	display: block;
	padding: var(--sp-3);
	background: #fff;
	border: 1px solid var(--line);
	color: inherit;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.result-item__link:hover { border-color: var(--brand-300); box-shadow: var(--shadow-1); text-decoration: none; }
.result-item__type { display: inline-block; margin-bottom: 6px; font-size: 11px; font-weight: 600; letter-spacing: .12em; color: var(--gold-600); }
.result-item__title { margin: 0 0 6px; font-size: 20px; }
.result-item__excerpt { margin: 0; color: var(--ink-500); font-size: 14px; }
.result-item mark, .search-page mark { background: var(--gold-100); color: var(--ink-900); padding: 0 2px; }

/* ---------- 8 详情 ---------- */
.detail { padding: var(--sp-4) 0 var(--sp-10); }
.detail__head { max-width: 860px; margin-bottom: var(--sp-4); }
.detail__model { margin: 0 0 8px; font-size: 12px; font-weight: 600; letter-spacing: .16em; color: var(--gold-600); text-transform: uppercase; }
.detail__title { margin: 0 0 12px; }
.detail__lede { margin: 0 0 14px; color: var(--ink-500); font-size: 17px; line-height: 1.8; }
.detail__meta { display: flex; flex-wrap: wrap; gap: 8px; font-size: 13px; color: var(--ink-400); align-items: center; }
.detail__meta--post { gap: 18px; }
.detail__layout { display: grid; gap: var(--sp-5); }
.detail__main { min-width: 0; }

.gallery { margin-bottom: var(--sp-5); }
.gallery__main { background: var(--bg-alt); border: 1px solid var(--line); overflow: hidden; }
.gallery__img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.gallery__thumbs { display: flex; gap: 8px; margin: 12px 0 0; padding: 0; list-style: none; overflow-x: auto; }
.gallery__thumbs li { margin: 0; flex: none; }
.gallery__thumb { padding: 0; width: 88px; height: 66px; border: 2px solid transparent; overflow: hidden; background: none; cursor: pointer; }
.gallery__thumb img { width: 100%; height: 100%; object-fit: cover; }
.gallery__thumb.is-active { border-color: var(--gold-500); }

.feature-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; border-top: 1px solid var(--line); }
.feature-list__item { display: flex; gap: 18px; padding: var(--sp-3) 0; border-bottom: 1px solid var(--line); }
.feature-list__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px; height: 44px;
	border-radius: 50%;
	background: var(--brand-050);
	color: var(--brand-700);
	flex: none;
}
.feature-list__title { display: block; margin-bottom: 4px; color: var(--ink-900); font-family: var(--serif); font-size: 17px; }
.feature-list__text { margin: 0; font-size: 14px; color: var(--ink-500); }

.app-chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.app-chips li { margin: 0; }
.app-chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 8px 18px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: #fff;
	color: var(--ink-900);
	font-size: 14px;
}
.app-chip:hover { border-color: var(--brand-500); background: var(--brand-050); text-decoration: none; }
.app-chip .icon { color: var(--brand-700); }

.sticky-cta { display: none; }
.sticky-cta__inner {
	position: sticky;
	top: calc(var(--header-h) + 24px);
	padding: var(--sp-3);
	background: var(--brand-050);
	border: 1px solid var(--brand-100);
	border-top: 2px solid var(--gold-500);
}
.sticky-cta__title { margin: 0 0 8px; font-family: var(--serif); font-size: 18px; font-weight: 700; color: var(--brand-900); }
.sticky-cta__note { margin: 0 0 16px; font-size: 13px; color: var(--ink-500); }
.sticky-cta__phone { margin: 14px 0 0; font-size: 13px; color: var(--ink-500); text-align: center; }

.mobile-cta {
	position: fixed;
	left: 0; right: 0; bottom: 0;
	z-index: 90;
	padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
	background: rgba(255, 255, 255, .97);
	border-top: 1px solid var(--line);
	backdrop-filter: blur(8px);
}
.mobile-cta__inner { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.mobile-cta__price { font-size: 14px; font-weight: 600; color: var(--brand-900); }
body.my-detail { padding-bottom: 80px; }

.case-gallery { display: grid; gap: 10px; grid-template-columns: repeat(2, 1fr); margin: 0 0 var(--sp-5); padding: 0; list-style: none; }
.case-gallery__item { margin: 0; overflow: hidden; background: var(--bg-alt); }
.case-gallery__item--wide { grid-column: 1 / -1; }
.case-gallery img { width: 100%; height: 100%; object-fit: cover; }
.case-disclaimer { padding: var(--sp-3); background: var(--bg-alt); border: 1px solid var(--line); font-size: 13px; color: var(--ink-500); }
.case-disclaimer p { margin: 0; }

.toc { padding: var(--sp-3); margin-bottom: var(--sp-4); background: #fff; border: 1px solid var(--line); border-left: 2px solid var(--gold-500); }
.toc__title { margin: 0 0 10px; font-size: 12px; font-weight: 600; color: var(--ink-400); letter-spacing: .12em; }
.toc__list { margin: 0; padding-left: 1.1em; }
.toc__list li { margin-bottom: 7px; font-size: 14px; }

.article-cta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--sp-2);
	margin: var(--sp-5) 0;
	padding: var(--sp-4);
	background: var(--brand-900);
	background-image: radial-gradient(90% 120% at 100% 0%, rgba(26, 122, 76, .5) 0%, rgba(11, 59, 38, 0) 60%);
	color: rgba(255, 255, 255, .85);
}
.article-cta__title { margin: 0 0 4px; font-family: var(--serif); font-size: 19px; color: #fff; }
.article-cta__desc { margin: 0; font-size: 14px; color: rgba(255, 255, 255, .72); }
.article-cta .btn--primary { background: #fff; color: var(--brand-900); }
.article-cta .btn--primary:hover { background: var(--gold-100); }

.entry-content { max-width: 720px; color: var(--ink-700); }
.entry-content > * { max-width: 100%; }
.entry-content h2 { margin-top: var(--sp-5); margin-bottom: var(--sp-2); font-size: 27px; }
.entry-content h2::before {
	content: "";
	display: block;
	width: 34px;
	height: 2px;
	margin-bottom: 12px;
	background: var(--gold-500);
}
.entry-content h3 { margin-top: var(--sp-4); font-size: 20px; }
.entry-content p, .entry-content li { color: var(--ink-700); }
.entry-content ul, .entry-content ol { padding-left: 1.3em; }
.entry-content img { height: auto; }
.entry-content blockquote {
	margin: var(--sp-3) 0;
	padding: 16px 22px;
	border-left: 2px solid var(--gold-500);
	background: #fff;
	color: var(--ink-500);
	font-family: var(--serif);
	font-size: 17px;
}
.entry-content table { width: 100%; border-collapse: collapse; font-size: 14px; }
.entry-content th, .entry-content td { border: 1px solid var(--line); padding: 10px 12px; text-align: left; }
.entry-content th { background: var(--brand-050); }
.entry-content code { background: var(--bg-alt); padding: 2px 6px; border-radius: 3px; font-size: .92em; }
.entry-content--article { max-width: 100%; }

/* ---------- 9 表单 ---------- */
.inquiry-form {
	padding: var(--sp-4);
	background: #fff;
	border: 1px solid var(--line);
	border-top: 2px solid var(--gold-500);
}
.inquiry-form__head { margin-bottom: var(--sp-3); }
.inquiry-form__title { margin: 0 0 6px; font-size: 22px; }
.inquiry-form__note { margin: 0; font-size: 13px; color: var(--ink-400); }
.inquiry-form__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: var(--sp-3); }
.inquiry-form__hint { font-size: 13px; color: var(--ink-400); }

.form-grid { display: grid; gap: var(--sp-2); grid-template-columns: 1fr; }
.field { display: flex; flex-direction: column; gap: 6px; }
.field--full { grid-column: 1 / -1; }
.field label { font-size: 13.5px; font-weight: 500; color: var(--ink-900); letter-spacing: .02em; }
.field .req { color: var(--err); }
.field input[type="text"],
.field input[type="tel"],
.field input[type="email"],
.field input[type="number"],
.field select,
.field textarea {
	width: 100%;
	min-height: 50px;
	padding: 12px 14px;
	border: 1px solid var(--line);
	border-radius: var(--r-1);
	background: #FDFCF9;
	color: var(--ink-900);
	font: inherit;
	font-size: 16px;
	line-height: 1.5;
	transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}
.field textarea { min-height: 130px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus {
	outline: none;
	background: #fff;
	border-color: var(--brand-500);
	box-shadow: 0 0 0 3px rgba(26, 122, 76, .14);
}
.field input[readonly] { background: var(--bg-alt); color: var(--ink-500); }
.field-help { margin: 0; font-size: 12px; color: var(--ink-400); }
.field-error { margin: 0; font-size: 13px; color: var(--err); }
.field.has-error input, .field.has-error select, .field.has-error textarea { border-color: var(--err); }
.field--consent { margin-top: var(--sp-2); }
.checkbox { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; color: var(--ink-500); }
.checkbox input { width: 20px; height: 20px; margin-top: 3px; flex: none; accent-color: var(--brand-700); }

.hp-field { position: absolute; left: -9999px; opacity: 0; height: 0; overflow: hidden; }

.form-error-summary {
	margin-bottom: var(--sp-3);
	padding: 14px 18px;
	border: 1px solid #E7C4C0;
	border-left: 3px solid var(--err);
	background: #FBF1F0;
	color: #8A1F17;
	font-size: 14px;
}
.form-error-summary ul { margin: 8px 0 0; padding-left: 1.2em; }
.form-error-summary a { color: #8A1F17; text-decoration: underline; }
.form-status { margin: 12px 0 0; font-size: 14px; min-height: 20px; }
.form-status.is-error { color: var(--err); }
.form-status.is-success { color: var(--ok); }

.search-form { display: flex; align-items: center; gap: 8px; position: relative; }
.search-form input[type="search"] {
	flex: 1;
	min-height: 50px;
	padding: 12px 16px 12px 46px;
	border: 1px solid var(--line);
	border-radius: var(--r-1);
	background: #FDFCF9;
	font: inherit;
	font-size: 16px;
}
.search-form input[type="search"]:focus { outline: none; background: #fff; border-color: var(--brand-500); box-shadow: 0 0 0 3px rgba(26, 122, 76, .14); }
.search-form__icon { position: absolute; left: 15px; top: 50%; transform: translateY(-50%); color: var(--ink-400); display: inline-flex; }
.search-form--lg input[type="search"] { min-height: 58px; font-size: 17px; }
.search-page__form { max-width: 660px; margin-top: var(--sp-2); }

/* ---------- 10 其它页面 ---------- */
.contact-layout { display: grid; gap: var(--sp-4); padding: var(--sp-5) 0 var(--sp-8); }
.contact-layout__info { display: grid; gap: var(--sp-2); align-content: start; }
.card--info, .card--tip { padding: var(--sp-3); }
.card--info .card__title { font-size: 18px; margin-bottom: var(--sp-2); }
.card--tip { background: var(--brand-050); border-color: var(--brand-100); }
.card__tip { margin: 0; font-size: 13px; color: var(--ink-500); }
.info-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-2); }
.info-list li { display: flex; gap: 12px; margin: 0; font-size: 14px; color: var(--ink-500); }
.info-list strong { color: var(--ink-900); font-weight: 600; font-size: 12.5px; letter-spacing: .04em; }
.info-list__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px; height: 40px;
	border-radius: 50%;
	background: var(--brand-050);
	color: var(--brand-700);
	flex: none;
}
.info-list__note { font-size: 12px; color: var(--ink-400); }
.contact-content { padding-bottom: var(--sp-8); }

.thanks { padding: var(--sp-10) 0; }
.thanks__box { padding: var(--sp-6); background: #fff; border: 1px solid var(--line); border-top: 2px solid var(--gold-500); text-align: center; }
.thanks__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 72px; height: 72px;
	margin-bottom: var(--sp-2);
	border-radius: 50%;
	background: var(--brand-050);
	color: var(--brand-700);
}
.thanks__title { margin: 0 0 12px; }
.thanks__no { display: inline-block; padding: 9px 18px; background: var(--brand-050); color: var(--brand-700); font-size: 15px; }
.thanks__desc { max-width: 520px; margin: var(--sp-2) auto; color: var(--ink-500); }
.thanks__next { margin-top: var(--sp-5); text-align: left; }
.thanks__next-title { font-size: 17px; margin-bottom: var(--sp-2); }
.thanks__links { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.thanks__links li { margin: 0; }
.thanks__privacy { margin: var(--sp-4) 0 0; font-size: 13px; color: var(--ink-400); }

.page-404 { padding: var(--sp-12) 0; text-align: center; }
.page-404__code { margin: 0; font-family: var(--serif); font-size: 88px; font-weight: 700; line-height: 1; color: var(--brand-100); }
.page-404__title { margin: 12px 0; }
.page-404__desc { max-width: 560px; margin: 0 auto var(--sp-4); color: var(--ink-500); }
.page-404__search { max-width: 560px; margin: 0 auto var(--sp-6); text-align: left; }
.page-404__cols { display: grid; gap: var(--sp-4); text-align: left; margin-bottom: var(--sp-5); }
.page-404__sub { font-size: 16px; }
.page-404__actions { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }

.sitemap { padding: var(--sp-5) 0 var(--sp-8); }
.sitemap__grid { display: grid; gap: var(--sp-5); }
.sitemap__title { font-size: 17px; margin-bottom: var(--sp-2); }

.about { padding: var(--sp-5) 0 var(--sp-8); }
.about__hero { margin-bottom: var(--sp-5); overflow: hidden; }
.about__img { width: 100%; aspect-ratio: 21 / 9; object-fit: cover; }
.about__grid { display: grid; gap: var(--sp-5); margin-bottom: var(--sp-8); }
.about__facts { padding: var(--sp-3); background: #fff; border: 1px solid var(--line); border-top: 2px solid var(--gold-500); align-self: start; }
.about__facts .btn { margin-top: var(--sp-2); }
.card--value { padding: var(--sp-3); border-top: 2px solid var(--brand-100); }
.card--value:hover { border-top-color: var(--gold-500); }

.app-layout { display: grid; gap: var(--sp-5); padding: var(--sp-5) 0 var(--sp-8); }
.app-note { margin-top: var(--sp-5); }
.page-section { padding-top: var(--sp-6); padding-bottom: var(--sp-8); }

.cta-bar {
	position: relative;
	isolation: isolate;
	background: var(--brand-900);
	background-image: radial-gradient(90% 130% at 15% 0%, rgba(26, 122, 76, .42) 0%, rgba(11, 59, 38, 0) 62%);
	color: #fff;
	padding: var(--sp-8) 0;
}
.cta-bar__inner { display: grid; gap: var(--sp-3); align-items: center; }
.cta-bar__title { color: #fff; font-size: 27px; margin: 0 0 8px; }
.cta-bar__desc { margin: 0; color: rgba(255, 255, 255, .7); font-size: 14px; }
.cta-bar__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; }
.cta-bar__phone { font-size: 14px; color: rgba(255, 255, 255, .8); letter-spacing: .04em; }
.cta-bar .btn--primary { background: #fff; color: var(--brand-900); }
.cta-bar .btn--primary:hover { background: var(--gold-100); color: var(--brand-900); }

.section--related { padding-bottom: var(--sp-8); }
.blog-grid { margin-bottom: var(--sp-4); }

/* ---------- 11 响应式 ---------- */
@media (min-width: 640px) {
	.form-grid { grid-template-columns: repeat(2, 1fr); }
	.spec-cards { grid-template-columns: repeat(4, 1fr); }
	.grid--2 { grid-template-columns: repeat(2, 1fr); }
	.page-404__cols { grid-template-columns: repeat(2, 1fr); }
	.sitemap__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 768px) {
	:root { --gutter: 32px; }
	.grid--3 { grid-template-columns: repeat(2, 1fr); }
	.footer__grid { grid-template-columns: repeat(2, 1fr); }
	.trust__inner { gap: var(--sp-4); }
	.case-gallery { grid-template-columns: repeat(3, 1fr); }
	.cta-bar__inner { grid-template-columns: 1fr auto; }
}

@media (min-width: 1024px) {
	.hero { min-height: 680px; padding: var(--sp-12) 0; }
	.hero__inner { grid-template-columns: 1fr; }
	.grid--3 { grid-template-columns: repeat(3, 1fr); }
	.grid--2 { grid-template-columns: repeat(2, 1fr); }
	.split { grid-template-columns: 1.35fr 1fr; align-items: start; }
	.capability { grid-template-columns: .85fr 1.15fr; padding: var(--sp-8); }
	.archive-layout { grid-template-columns: 250px 1fr; align-items: start; gap: var(--sp-5); }
	.archive-layout__aside { position: sticky; top: calc(var(--header-h) + 24px); }
	.filter-toggle { display: none; }
	.filter-panel__close { display: none; }
	.two-col { grid-template-columns: repeat(2, 1fr); }
	.contact-layout { grid-template-columns: 380px 1fr; }
	.about__grid { grid-template-columns: 1fr 350px; }
	.footer__grid { grid-template-columns: 1.5fr 1fr 1fr 1fr; }
	.app-layout { grid-template-columns: 1fr 320px; align-items: start; }
	.sitemap__grid { grid-template-columns: repeat(4, 1fr); }
	.detail { padding-top: var(--sp-5); }
}

/* 桌面导航只在 ≥1400px 展开：8 个菜单项 + 语言切换器 + 搜索 + CTA
   在 1240 容器里放不下，窄桌面一律走抽屉，任何语言都不会被裁切。 */
@media (min-width: 1400px) {
	.mobile-nav { display: none !important; }
	.header__burger { display: none; }
}

@media (min-width: 1280px) {
	.detail__layout { grid-template-columns: 1fr 320px; align-items: start; }
	.sticky-cta { display: block; }
	.mobile-cta { display: none; }
	body.my-detail { padding-bottom: 0; }
}

/* 1400px 以下收起桌面导航，改用抽屉（见上方说明） */
@media (max-width: 1399px) {
	.nav { display: none; }
	.header__burger { display: inline-flex; }
}

@media (max-width: 1023px) {
	.btn--header { display: none; }
	:root { --header-h: 64px; }
	.hero { min-height: 520px; }
	.filter-panel {
		position: fixed;
		inset: 0;
		z-index: 200;
		background: var(--bg);
		overflow-y: auto;
		padding: var(--sp-3);
		display: none;
	}
	.filter-panel.is-open { display: block; }
	body.is-locked { overflow: hidden; }
}

@media (max-width: 767px) {
	:root { --gutter: 16px; }
	.section { padding: var(--sp-8) 0; }
	.page-head { padding: var(--sp-6) 0 var(--sp-4); }
	.hero { min-height: 0; padding: var(--sp-8) 0; }
	.hero__title { font-size: 30px; }
	.cta-bar__actions { flex-direction: column; align-items: stretch; }
	.inquiry-form { padding: var(--sp-3); }
	.footer__bottom-inner { flex-direction: column; align-items: flex-start; }
	.trust__value { font-size: 24px; }
}

/* 参数表移动端：转为两行式定义列表，避免横向滚动 */
@media (max-width: 640px) {
	.spec-table thead { display: none; }
	.spec-table, .spec-table tbody, .spec-table tr, .spec-table th, .spec-table td { display: block; width: 100%; }
	.spec-table tr { border-bottom: 1px solid var(--line); padding: 12px 14px; }
	.spec-table tbody tr:last-child { border-bottom: 0; }
	.spec-table th, .spec-table td { border: 0; padding: 2px 0; }
	.spec-table tbody th { font-size: 12px; color: var(--ink-400); }
	.spec-table td { font-size: 15px; }
	.spec-table td[data-label]::before { content: attr(data-label) "："; font-size: 12px; color: var(--ink-400); }
	.spec-cards { grid-template-columns: repeat(2, 1fr); }
	.case-gallery { grid-template-columns: 1fr; }
}


/* ---------- 语言切换器 ---------- */
.lang-switch { position: relative; }
.lang-switch__current {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	min-height: 40px;
	padding: 0 12px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: #fff;
	cursor: pointer;
	list-style: none;
	font-size: 13px;
	color: var(--ink-700);
	white-space: nowrap;
}
.lang-switch__current::-webkit-details-marker { display: none; }
.lang-switch__current:hover { border-color: var(--brand-300); color: var(--brand-700); }
.lang-switch__code { font-weight: 600; letter-spacing: .06em; color: var(--brand-700); }
.lang-switch__name { display: none; }
.lang-switch__caret { font-size: 9px; color: var(--ink-400); }
.lang-switch__list {
	position: absolute;
	right: 0;
	top: calc(100% + 10px);
	z-index: 130;
	min-width: 210px;
	max-height: 340px;
	overflow-y: auto;
	margin: 0;
	padding: 6px;
	list-style: none;
	background: #fff;
	border: 1px solid var(--line);
	box-shadow: var(--shadow-2);
}
.lang-switch__item { margin: 0; }
.lang-switch__item a {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 14px;
	padding: 9px 11px;
	font-size: 13px;
	color: var(--ink-700);
	border-radius: var(--r-1);
}
.lang-switch__item a:hover { background: var(--brand-050); color: var(--brand-700); text-decoration: none; }
.lang-switch__item.is-current a { color: var(--brand-700); font-weight: 600; background: var(--brand-050); }
.lang-switch__native { color: var(--ink-400); font-size: 12px; }
.lang-switch--footer .lang-switch__current { background: transparent; border-color: rgba(255,255,255,.28); color: #fff; }
.lang-switch--footer .lang-switch__code { color: var(--gold-300); }
.lang-switch--footer .lang-switch__caret { color: rgba(255,255,255,.6); }
.lang-switch--footer .lang-switch__list { top: auto; bottom: calc(100% + 10px); right: auto; left: 0; }
.lang-switch--mobile .lang-switch__current { width: 100%; justify-content: center; }
.lang-switch--mobile .lang-switch__list { left: 0; right: auto; width: 100%; position: static; box-shadow: none; margin-top: 8px; }

@media (min-width: 1280px) {
	.lang-switch__name { display: inline; }
}
@media (max-width: 1023px) {
	.lang-switch--header { display: none; }
}


/* =========================================================================
   移动端专项（≤767px 优先，兼顾 768–1023 平板竖屏）
   ========================================================================= */

.mobile-bar {
	display: none;
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 95;
	gap: 10px;
	padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
	background: rgba(255, 255, 255, .97);
	backdrop-filter: blur(10px);
	border-top: 1px solid var(--line);
}
.mobile-bar__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 48px;
	padding: 0 20px;
	font-size: 15px;
	font-weight: 600;
	border-radius: var(--r-1);
	text-decoration: none;
}
.mobile-bar__btn--ghost { flex: 0 0 auto; color: var(--brand-700); border: 1px solid var(--brand-100); background: #fff; }
.mobile-bar__btn--primary { flex: 1; background: var(--brand-700); color: #fff; }
.mobile-bar__btn--primary:hover { color: #fff; text-decoration: none; }

@media (max-width: 1023px) {
	.mobile-bar { display: flex; }
	body { padding-bottom: 76px; }
	body.my-detail { padding-bottom: 76px; }
	/* 详情页自带 CTA 条时，隐藏全站条避免重复 */
	body.my-detail .mobile-bar { display: none; }
	body.my-detail .mobile-cta { display: block; }
}

/* ---------- 移动端排版与组件收紧 ---------- */
@media (max-width: 767px) {
	body { font-size: 15.5px; line-height: 1.72; }

	h1 { font-size: 28px; line-height: 1.32; }
	h2 { font-size: 22px; line-height: 1.35; }
	h3 { font-size: 17px; }
	.block-title { font-size: 19px; }
	.section__title { font-size: 22px; }
	.section__desc { font-size: 14px; }
	.eyebrow { font-size: 11px; letter-spacing: .14em; }

	.container { padding: 0 16px; }
	.section { padding: 40px 0; }
	.section__head { margin-bottom: 20px; }
	.grid { gap: 14px; }

	/* 页头 */
	.header__inner { min-height: 56px; gap: 8px; }
	.logo__name { font-size: 16px; }
	.logo__sub { font-size: 9.5px; letter-spacing: .18em; }
	.logo__mark svg { width: 30px; height: 30px; }
	.topbar__inner { min-height: 32px; }
	.topbar__text { font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; max-width: 100%; }
	.icon-btn { width: 42px; height: 42px; }

	/* 首屏 */
	.hero { padding: 48px 0 40px; min-height: 0; }
	.hero__eyebrow { font-size: 11px; padding: 5px 12px; margin-bottom: 16px; }
	.hero__title { font-size: 27px; margin-bottom: 14px; }
	.hero__title::after { width: 44px; margin-top: 16px; }
	.hero__sub { font-size: 14.5px; line-height: 1.75; margin-bottom: 22px; }
	.hero__actions { flex-direction: column; gap: 10px; margin-bottom: 16px; }
	.hero__actions .btn { width: 100%; }
	.hero__plain { font-size: 12px; line-height: 1.6; }

	/* 信任条：两列 */
	.trust__inner { grid-template-columns: repeat(3, 1fr); gap: 0; padding: 20px 0; }
	.trust__value { font-size: 19px; }
	.trust__label { font-size: 10.5px; }
	.trust__item { padding: 0 6px; }

	/* 卡片：更紧凑、文字两行截断 */
	.card__body { padding: 14px; gap: 6px; }
	.card__title { font-size: 16.5px; line-height: 1.4; }
	.card__desc {
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
		font-size: 13px;
	}
	.card__media { aspect-ratio: 3 / 2; }
	.card__icon { width: 40px; height: 40px; }
	.card__foot { font-size: 13px; padding-top: 6px; }
	.spec-inline { gap: 4px 14px; padding-top: 8px; }
	.spec-inline b { font-size: 13px; }

	/* 列表页工具条 */
	.archive-toolbar { gap: 8px; }
	.archive-toolbar__count { font-size: 13px; }
	.sort-control__item { min-height: 38px; padding: 0 12px; font-size: 12.5px; }

	/* 详情 */
	.detail { padding: 20px 0 32px; }
	.detail__title { font-size: 24px; }
	.detail__lede { font-size: 15px; }
	.gallery__thumbs { gap: 6px; }
	.gallery__thumb { width: 72px; height: 54px; }
	.section-block { margin-bottom: 32px; }
	.feature-list__item { padding: 14px 0; gap: 12px; }
	.feature-list__icon { width: 38px; height: 38px; }
	.feature-list__title { font-size: 15.5px; }

	/* 规格表 -> 定义列表 */
	.spec-cards { grid-template-columns: repeat(2, 1fr); }
	.spec-cards__item { padding: 14px; }
	.spec-cards__value { font-size: 18px; }

	/* FAQ */
	.faq__q { font-size: 15px; padding: 16px 2px; }
	.faq__a { padding: 0 2px 16px; font-size: 14px; }

	/* 表单 */
	.inquiry-form { padding: 18px; border-radius: 0; border-left: 0; border-right: 0; }
	.form-grid { gap: 14px; }
	.field input, .field select, .field textarea { min-height: 50px; font-size: 16px; }
	.inquiry-form__actions { flex-direction: column; align-items: stretch; gap: 10px; }
	.inquiry-form__actions .btn { width: 100%; }
	.inquiry-form__hint { text-align: center; font-size: 12px; }

	/* 页脚 */
	.site-footer { padding-top: 40px; }
	.footer__grid { gap: 24px; }
	.footer__desc { font-size: 13px; }
	.footer__list a { padding: 6px 0; display: inline-block; }

	/* CTA 条 */
	.cta-bar { padding: 36px 0; }
	.cta-bar__title { font-size: 21px; }
	.cta-bar__actions .btn { width: 100%; }

	/* 语言切换器在移动端更紧凑 */
	.lang-switch__current { min-height: 38px; padding: 0 10px; font-size: 12.5px; }
	.lang-switch--mobile .lang-switch__current { min-height: 46px; font-size: 14px; }

	/* 抽屉内语言列表满宽 */
	.mobile-nav { padding: 16px; gap: 20px; }
	.mobile-nav__list a { padding: 14px 2px; font-size: 17px; }

	/* 筛选抽屉：底部固定操作条 */
	.filter-panel { padding: 16px 16px 96px; }
	.filter-panel__foot {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		display: flex;
		gap: 10px;
		padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
		background: rgba(255, 255, 255, .97);
		border-top: 1px solid var(--line);
		backdrop-filter: blur(10px);
	}
	.filter-panel__foot .btn { flex: 1; }
	.filter-panel__foot .btn--ghost { flex: 0 0 auto; }
	.filter-group { margin-bottom: 20px; }
	.filter-option { min-height: 46px; }


	/* 触控目标补足 44px */
	.logo { padding: 8px 2px; }
	.breadcrumb__item a { display: inline-block; padding: 10px 2px; }
	.breadcrumb__list { gap: 2px; }
	.sort-control__item { min-height: 44px; }
	.tag--link, .app-chip { min-height: 40px; }
	.link-more { min-height: 48px; }
	.filter-panel__clear { min-height: 48px; }
	.footer__legal a, .footer__list a { display: inline-block; padding: 6px 0; }

	/* 分页更大点击区 */
	.pagination__link { min-width: 46px; min-height: 46px; }
}

/* 平板竖屏：两列卡片已生效，补一点间距 */
@media (min-width: 768px) and (max-width: 1023px) {
	.section { padding: 56px 0; }
	.hero { min-height: 420px; }
}

/* ---------- 12 无障碍与动效 ---------- */
@media (hover: hover) {
	.card:hover { transform: translateY(-3px); box-shadow: var(--shadow-2); border-color: var(--brand-100); }
	.card:hover .card__media img { transform: scale(1.05); }
	.btn--primary:hover { transform: translateY(-1px); }
	.btn:active { transform: scale(.985); }
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
		scroll-behavior: auto !important;
	}
	.card:hover, .btn--primary:hover { transform: none; }
	.card:hover .card__media img { transform: none; }
}

@media print {
	.site-header, .site-footer, .cta-bar, .mobile-cta, .sticky-cta, .skip-link { display: none !important; }
	body { background: #fff; }
}