/*
Theme Name:        AERIS B2B
Theme URI:         https://example.com/aeris-b2b
Author:            AERIS B2B
Description:       B2B 工厂独立站主题（吹风机/卷发棒/小风扇/3C 配件）。面向欧美采购商：工厂实力与 OEM/ODM 能力展示、产品目录与规格表、多语言（Polylang）、SEO 框架、询盘转化、GDPR 就绪（Cookie 同意 + 法律页）。
Version:           1.0.0
Requires PHP:      8.1
License:           GPL-3.0-or-later
License URI:       https://www.gnu.org/licenses/gpl-3.0.html
Text Domain:       aeris-b2b
Tags:              custom-menu, translation-ready, custom-logo, html5, block-styles, wide-blocks

设计方向：Industrial Editorial（精密工业编辑风）
三旋钮：VARIANCE 6 / MOTION 5 / DENSITY 4（首页 3，列表 5）
零外部请求：系统字体栈（禁 Google Fonts，规避 GDPR 风险）、SVG 自绘、无 CDN 依赖
*/

/* ==========================================================================
   1. 设计 Token（三级：原始 → 语义 → 组件）
   ========================================================================== */
:root {
	/* 原始 Token — 色彩 */
	--c-navy-900: #0b1220;
	--c-navy-800: #141d2e;
	--c-navy-700: #1b2432;
	--c-slate-600: #3d4a5c;
	--c-slate-500: #4a5568;
	--c-slate-400: #6b7789;
	--c-slate-200: #c9d2e0;
	--c-slate-100: #e3e8f0;
	--c-slate-50: #f4f6fa;
	--c-slate-25: #fafbfd;
	--c-white: #ffffff;
	--c-blue-700: #0b3e99;
	--c-blue-600: #1155cc;
	--c-blue-100: #e6eeff;
	--c-orange-600: #e1520a;
	--c-orange-500: #ff6b1a;
	--c-orange-100: #fff1e6;
	--c-green-600: #1a7f5a;
	--c-green-100: #e6f4ee;

	/* 语义 Token */
	--ink: var(--c-navy-900);
	--ink-soft: var(--c-navy-700);
	--paper: var(--c-white);
	--surface-muted: var(--c-slate-50);
	--surface-alt: var(--c-slate-25);
	--line: var(--c-slate-100);
	--line-strong: var(--c-slate-200);
	--text: var(--c-slate-600);
	--text-strong: var(--c-navy-800);
	--text-muted: var(--c-slate-400);
	--primary: var(--c-blue-600);
	--primary-dark: var(--c-blue-700);
	--primary-soft: var(--c-blue-100);
	--accent: var(--c-orange-500);
	--accent-dark: var(--c-orange-600);
	--accent-soft: var(--c-orange-100);
	--success: var(--c-green-600);
	--success-soft: var(--c-green-100);

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

	/* 字体 */
	--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "PingFang SC", "Microsoft YaHei", sans-serif;
	--fs-12: 0.75rem;
	--fs-14: 0.875rem;
	--fs-16: 1rem;
	--fs-18: 1.125rem;
	--fs-20: 1.25rem;
	--fs-24: 1.5rem;
	--fs-32: 2rem;
	--fs-40: 2.5rem;
	--fs-48: 3rem;
	--lh-body: 1.6;
	--lh-tight: 1.2;

	/* 圆角 / 阴影 / 动效 */
	--r-sm: 4px;
	--r-md: 8px;
	--r-pill: 999px;
	--shadow-1: 0 1px 2px rgba(11, 18, 32, 0.06);
	--shadow-2: 0 8px 24px rgba(11, 18, 32, 0.1);
	--shadow-3: 0 16px 48px rgba(11, 18, 32, 0.14);
	--ease: cubic-bezier(0.4, 0, 0.2, 1);
	--dur: 200ms;

	/* 布局 */
	--maxw: 1200px;
	--maxw-narrow: 780px;
	--header-h: 72px;

	/* 组件 Token */
	--btn-px: var(--s-6);
	--btn-py: var(--s-3);
	--card-pad: var(--s-6);
	--card-radius: var(--r-md);
}

/* ==========================================================================
   2. Reset / Base
   ========================================================================== */
*,
*::before,
*::after {
	box-sizing: border-box;
}

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

body {
	margin: 0;
	background: var(--paper);
	color: var(--text);
	font-family: var(--font-sans);
	font-size: var(--fs-16);
	line-height: var(--lh-body);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0 0 var(--s-4);
	color: var(--text-strong);
	font-weight: 700;
	line-height: var(--lh-tight);
	letter-spacing: -0.01em;
}

h1 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; }
h2 { font-size: clamp(1.5rem, 3vw, 2rem); }
h3 { font-size: var(--fs-24); }
h4 { font-size: var(--fs-20); }
h5 { font-size: var(--fs-18); }

p { margin: 0 0 var(--s-4); }
p:last-child { margin-bottom: 0; }

a {
	color: var(--primary);
	text-decoration: none;
	transition: color var(--dur) var(--ease);
}

a:hover { color: var(--primary-dark); }

img,
svg {
	max-width: 100%;
	height: auto;
	display: block;
}

ul,
ol { margin: 0 0 var(--s-4); padding-left: 1.25em; }

button,
input,
select,
textarea {
	font: inherit;
	color: inherit;
}

:focus-visible {
	outline: 2px solid var(--primary);
	outline-offset: 2px;
}

.sr-only {
	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 {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 1000;
	background: var(--ink);
	color: var(--paper);
	padding: var(--s-3) var(--s-5);
}

.skip-link:focus {
	left: var(--s-4);
	top: var(--s-4);
	color: var(--paper);
}

/* ==========================================================================
   3. 布局工具
   ========================================================================== */
.container {
	width: 100%;
	max-width: var(--maxw);
	margin: 0 auto;
	padding: 0 var(--s-6);
}

.container--narrow { max-width: var(--maxw-narrow); }

.section { padding: var(--s-20) 0; }
.section--muted { background: var(--surface-muted); }
.section--tight { padding: var(--s-12) 0; }
.section--ink { background: var(--ink); color: var(--c-slate-200); }
.section--ink h2,
.section--ink h3 { color: var(--paper); }

.section__head {
	max-width: 720px;
	margin-bottom: var(--s-10);
}

.section__eyebrow {
	display: inline-block;
	margin-bottom: var(--s-3);
	color: var(--accent);
	font-size: var(--fs-12);
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.section__title { margin-bottom: var(--s-3); }
.section__lead { color: var(--text-muted); font-size: var(--fs-18); }

.grid {
	display: grid;
	gap: var(--s-6);
}

.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.stack > * + * { margin-top: var(--s-4); }

.hairline {
	height: 1px;
	background: var(--line);
	border: 0;
	margin: 0;
}

/* ==========================================================================
   4. 按钮 / 徽标 / 卡片
   ========================================================================== */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--s-2);
	padding: var(--btn-py) var(--btn-px);
	border: 1px solid transparent;
	border-radius: var(--r-sm);
	font-size: var(--fs-16);
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	cursor: pointer;
	transition: background-color var(--dur) var(--ease), color var(--dur) var(--ease), border-color var(--dur) var(--ease), transform var(--dur) var(--ease);
}

.btn:disabled { opacity: 0.55; cursor: not-allowed; }

.btn--primary {
	background: var(--accent);
	color: var(--paper);
}

.btn--primary:hover {
	background: var(--accent-dark);
	color: var(--paper);
	transform: translateY(-1px);
}

.btn--navy {
	background: var(--ink);
	color: var(--paper);
}

.btn--navy:hover { background: var(--ink-soft); color: var(--paper); }

.btn--outline {
	background: transparent;
	border-color: var(--line-strong);
	color: var(--text-strong);
}

.btn--outline:hover {
	border-color: var(--ink);
	color: var(--ink);
}

.btn--ghost-light {
	background: transparent;
	border-color: rgba(255, 255, 255, 0.35);
	color: var(--paper);
}

.btn--ghost-light:hover {
	background: rgba(255, 255, 255, 0.1);
	border-color: var(--paper);
	color: var(--paper);
}

.btn--lg { padding: var(--s-4) var(--s-8); font-size: var(--fs-18); }
.btn--block { width: 100%; }

.btn-row {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-3);
	align-items: center;
}

.badge {
	display: inline-flex;
	align-items: center;
	gap: var(--s-1);
	padding: 2px var(--s-2);
	border-radius: var(--r-sm);
	background: var(--surface-muted);
	border: 1px solid var(--line);
	color: var(--text-muted);
	font-size: var(--fs-12);
	font-weight: 600;
	letter-spacing: 0.02em;
}

.badge--ok { background: var(--success-soft); border-color: transparent; color: var(--success); }
.badge--primary { background: var(--primary-soft); border-color: transparent; color: var(--primary-dark); }
.badge--accent { background: var(--accent-soft); border-color: transparent; color: var(--accent-dark); }

.chip {
	display: inline-block;
	padding: var(--s-1) var(--s-3);
	border: 1px solid var(--line);
	border-radius: var(--r-pill);
	background: var(--paper);
	color: var(--text-muted);
	font-size: var(--fs-12);
	white-space: nowrap;
}

.card {
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: var(--card-radius);
	padding: var(--card-pad);
	box-shadow: var(--shadow-1);
	transition: box-shadow var(--dur) var(--ease), transform var(--dur) var(--ease), border-color var(--dur) var(--ease);
}

.card--hover:hover {
	box-shadow: var(--shadow-2);
	transform: translateY(-2px);
	border-color: var(--line-strong);
}

/* ==========================================================================
   5. 页头 / 导航 / 语言切换
   ========================================================================== */
.site-header {
	position: sticky;
	top: 0;
	z-index: 900;
	background: rgba(255, 255, 255, 0.94);
	backdrop-filter: saturate(180%) blur(8px);
	border-bottom: 1px solid var(--line);
}

.header-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--s-6);
	min-height: var(--header-h);
}

.brand {
	display: inline-flex;
	align-items: center;
	gap: var(--s-3);
	color: var(--ink);
	font-weight: 800;
	letter-spacing: 0.02em;
}

.brand:hover { color: var(--ink); }

.brand__mark {
	width: 34px;
	height: 34px;
	flex: 0 0 auto;
}

.brand__name { font-size: var(--fs-20); }

.brand__sub {
	display: block;
	font-size: var(--fs-12);
	font-weight: 500;
	letter-spacing: 0.08em;
	color: var(--text-muted);
	text-transform: uppercase;
}

.nav {
	display: flex;
	align-items: center;
	gap: var(--s-2);
}

.nav > ul {
	display: flex;
	align-items: center;
	gap: var(--s-1);
	list-style: none;
	margin: 0;
	padding: 0;
}

.nav li { position: relative; }

.nav a {
	display: block;
	padding: var(--s-2) var(--s-3);
	border-radius: var(--r-sm);
	color: var(--text-strong);
	font-size: var(--fs-14);
	font-weight: 600;
}

.nav a:hover { background: var(--surface-muted); color: var(--primary); }
.nav .current-menu-item > a { color: var(--primary); }

.header-actions {
	display: flex;
	align-items: center;
	gap: var(--s-3);
}

/* 语言切换 */
.lang-switch { position: relative; }

.lang-switch__toggle {
	display: inline-flex;
	align-items: center;
	gap: var(--s-2);
	padding: var(--s-2) var(--s-3);
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: var(--r-sm);
	color: var(--text-strong);
	font-size: var(--fs-14);
	font-weight: 600;
	cursor: pointer;
}

.lang-switch__toggle:hover { border-color: var(--line-strong); }

.lang-switch__toggle svg { width: 14px; height: 14px; }

.lang-switch__list {
	position: absolute;
	top: calc(100% + var(--s-2));
	right: 0;
	min-width: 176px;
	margin: 0;
	padding: var(--s-2);
	list-style: none;
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	box-shadow: var(--shadow-2);
	display: none;
	z-index: 950;
}

.lang-switch__list.is-open { display: block; }
.lang-switch__list li { margin: 0; }

.lang-switch__list a,
.lang-switch__list span {
	display: block;
	padding: var(--s-2) var(--s-3);
	border-radius: var(--r-sm);
	color: var(--text-strong);
	font-size: var(--fs-14);
}

.lang-switch__list a:hover { background: var(--surface-muted); color: var(--primary); }
.lang-switch__list .is-current { color: var(--primary); font-weight: 700; }

/* 移动端抽屉 */
.nav-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background: transparent;
	border: 1px solid var(--line);
	border-radius: var(--r-sm);
	cursor: pointer;
}

.nav-toggle__bar,
.nav-toggle__bar::before,
.nav-toggle__bar::after {
	display: block;
	width: 18px;
	height: 2px;
	background: var(--ink);
	content: "";
	position: relative;
}

.nav-toggle__bar::before { position: absolute; top: -6px; }
.nav-toggle__bar::after { position: absolute; top: 6px; }

/* ==========================================================================
   6. Hero / 首页区块
   ========================================================================== */
.hero {
	position: relative;
	overflow: hidden;
	background: linear-gradient(140deg, var(--c-navy-900) 0%, var(--c-navy-700) 55%, var(--c-blue-700) 100%);
	color: var(--c-slate-200);
}

.hero__bg {
	position: absolute;
	inset: 0;
	opacity: 0.5;
	pointer-events: none;
}

.hero__inner {
	position: relative;
	display: grid;
	grid-template-columns: 1.05fr 0.95fr;
	gap: var(--s-16);
	align-items: center;
	padding: var(--s-24) 0 var(--s-20);
}

.hero__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: var(--s-2);
	padding: var(--s-1) var(--s-3);
	margin-bottom: var(--s-5);
	border: 1px solid rgba(255, 255, 255, 0.28);
	border-radius: var(--r-pill);
	color: var(--paper);
	font-size: var(--fs-12);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.hero__title {
	color: var(--paper);
	font-size: clamp(2.25rem, 5vw, 3.5rem);
	font-weight: 800;
	letter-spacing: -0.02em;
	margin-bottom: var(--s-5);
}

.hero__title em {
	color: var(--accent);
	font-style: normal;
}

.hero__lead {
	max-width: 56ch;
	margin-bottom: var(--s-8);
	color: rgba(255, 255, 255, 0.78);
	font-size: var(--fs-18);
}

.hero__art {
	position: relative;
	justify-self: end;
	max-width: 460px;
}

.hero__stats {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0;
	margin-top: var(--s-12);
	border-top: 1px solid rgba(255, 255, 255, 0.18);
	padding-top: var(--s-6);
}

.hero__stat strong {
	display: block;
	color: var(--paper);
	font-size: var(--fs-32);
	font-weight: 800;
	line-height: 1.1;
}

.hero__stat span {
	color: rgba(255, 255, 255, 0.65);
	font-size: var(--fs-12);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* 实力指标 */
.stat-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1px;
	background: var(--line);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	overflow: hidden;
}

.stat {
	background: var(--paper);
	padding: var(--s-8) var(--s-6);
	text-align: left;
}

.stat__num {
	display: block;
	color: var(--ink);
	font-size: var(--fs-40);
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.02em;
}

.stat__num sup {
	font-size: 0.5em;
	font-weight: 700;
	vertical-align: super;
}

.stat__label {
	display: block;
	margin-top: var(--s-2);
	color: var(--text-muted);
	font-size: var(--fs-14);
}

/* 品类卡片 */
.cat-card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: var(--s-3);
	padding: var(--s-6);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	background: var(--paper);
	color: inherit;
}

.cat-card:hover {
	border-color: var(--primary);
	color: inherit;
	box-shadow: var(--shadow-2);
}

.cat-card__art {
	height: 132px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--surface-alt);
	border-radius: var(--r-sm);
}

.cat-card__art svg { height: 108px; width: auto; }

.cat-card__title {
	margin: 0;
	font-size: var(--fs-18);
	font-weight: 700;
}

.cat-card__title::after {
	content: "";
	display: block;
	width: 28px;
	height: 2px;
	margin-top: var(--s-2);
	background: var(--accent);
}

.cat-card__meta {
	color: var(--text-muted);
	font-size: var(--fs-14);
}

/* OEM/ODM 流程时间线 */
.process {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: var(--s-4);
	counter-reset: step;
}

.process__item {
	position: relative;
	padding-top: var(--s-8);
	border-top: 2px solid var(--line);
	counter-increment: step;
}

.process__item::before {
	content: "0" counter(step);
	position: absolute;
	top: var(--s-3);
	left: 0;
	color: var(--accent);
	font-size: var(--fs-12);
	font-weight: 800;
	letter-spacing: 0.08em;
}

.process__item h4 { margin-bottom: var(--s-2); font-size: var(--fs-16); }
.process__item p { color: var(--text-muted); font-size: var(--fs-14); }

/* 认证徽标 */
.cert-row {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-4);
	align-items: center;
}

.cert {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 96px;
	height: 56px;
	padding: 0 var(--s-4);
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: var(--r-sm);
	color: var(--text-strong);
	font-size: var(--fs-14);
	font-weight: 700;
	letter-spacing: 0.04em;
}

/* FAQ 折叠 */
.faq { border-top: 1px solid var(--line); }

.faq__item { border-bottom: 1px solid var(--line); }

.faq__q {
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: space-between;
	gap: var(--s-4);
	padding: var(--s-5) 0;
	background: none;
	border: 0;
	color: var(--text-strong);
	font-size: var(--fs-18);
	font-weight: 600;
	text-align: left;
	cursor: pointer;
}

.faq__q::after {
	content: "+";
	flex: 0 0 auto;
	color: var(--accent);
	font-size: var(--fs-24);
	font-weight: 700;
	line-height: 1;
}

.faq__item.is-open .faq__q::after { content: "\2212"; }

.faq__a {
	display: none;
	padding: 0 0 var(--s-5);
	color: var(--text-muted);
	max-width: 74ch;
}

.faq__item.is-open .faq__a { display: block; }

/* ==========================================================================
   7. 产品：列表 / 详情 / 规格表
   ========================================================================== */
.product-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--s-6);
}

.product-card {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	transition: box-shadow var(--dur) var(--ease), transform var(--dur) var(--ease);
}

.product-card:hover {
	box-shadow: var(--shadow-2);
	transform: translateY(-2px);
}

.product-card__media {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 200px;
	background: var(--surface-alt);
	border-bottom: 1px solid var(--line);
}

.product-card__media svg { max-height: 156px; width: auto; }

.product-card__body {
	display: flex;
	flex-direction: column;
	gap: var(--s-2);
	flex: 1 1 auto;
	padding: var(--s-5);
}

.product-card__cat {
	color: var(--accent);
	font-size: var(--fs-12);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.product-card__title {
	margin: 0;
	font-size: var(--fs-18);
	font-weight: 700;
}

.product-card__title a { color: var(--text-strong); }
.product-card__title a:hover { color: var(--primary); }

.product-card__sku {
	color: var(--text-muted);
	font-size: var(--fs-12);
	font-variant-numeric: tabular-nums;
}

.product-card__specs {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-2);
}

.product-card__excerpt {
	color: var(--text-muted);
	font-size: var(--fs-14);
	margin: 0;
}

.product-card__foot {
	margin-top: auto;
	padding-top: var(--s-4);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--s-3);
}

.product-single {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--s-16);
	align-items: start;
}

.product-gallery {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: var(--s-12);
	background: var(--surface-alt);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
}

.product-gallery svg { max-height: 320px; width: auto; }

.spec-table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--fs-14);
}

.spec-table th,
.spec-table td {
	padding: var(--s-3) var(--s-4);
	border-bottom: 1px solid var(--line);
	text-align: left;
	vertical-align: top;
}

.spec-table th {
	width: 38%;
	color: var(--text-muted);
	font-weight: 600;
	background: var(--surface-alt);
}

.spec-table tr:last-child th,
.spec-table tr:last-child td { border-bottom: 0; }

.feature-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.feature-list li {
	position: relative;
	padding-left: var(--s-6);
	margin-bottom: var(--s-2);
}

.feature-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.55em;
	width: 8px;
	height: 8px;
	border-radius: 2px;
	background: var(--accent);
}

/* 面包屑 */
.breadcrumb {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-2);
	align-items: center;
	padding: var(--s-4) 0;
	color: var(--text-muted);
	font-size: var(--fs-12);
	list-style: none;
	margin: 0;
}

.breadcrumb li { margin: 0; }
.breadcrumb a { color: var(--text-muted); }
.breadcrumb a:hover { color: var(--primary); }
.breadcrumb li + li::before { content: "/"; margin-right: var(--s-2); color: var(--line-strong); }

/* 归档筛选条 */
.filter-bar {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-2);
	margin-bottom: var(--s-8);
}

.filter-bar a {
	padding: var(--s-2) var(--s-4);
	border: 1px solid var(--line);
	border-radius: var(--r-pill);
	color: var(--text-strong);
	font-size: var(--fs-14);
	font-weight: 600;
}

.filter-bar a:hover { border-color: var(--primary); color: var(--primary); }
.filter-bar .is-active { background: var(--ink); border-color: var(--ink); color: var(--paper); }

/* ==========================================================================
   8. 询盘 / 表单 / 浮动 CTA
   ========================================================================== */
.inquiry {
	display: grid;
	grid-template-columns: 0.9fr 1.1fr;
	gap: var(--s-12);
	align-items: start;
}

.inquiry__aside .card + .card { margin-top: var(--s-4); }

.contact-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.contact-list li {
	display: flex;
	align-items: baseline;
	gap: var(--s-3);
	padding: var(--s-3) 0;
	border-bottom: 1px dashed var(--line);
}

.contact-list li:last-child { border-bottom: 0; }

.contact-list dt,
.contact-list strong {
	flex: 0 0 96px;
	color: var(--text-muted);
	font-size: var(--fs-14);
	font-weight: 600;
}

.form-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--s-4);
}

.field {
	display: flex;
	flex-direction: column;
	gap: var(--s-2);
}

.field--full { grid-column: 1 / -1; }

.field label {
	color: var(--text-strong);
	font-size: var(--fs-14);
	font-weight: 600;
}

.field input,
.field select,
.field textarea {
	width: 100%;
	padding: var(--s-3) var(--s-4);
	background: var(--paper);
	border: 1px solid var(--line-strong);
	border-radius: var(--r-sm);
	font-size: var(--fs-16);
	transition: border-color var(--dur) var(--ease);
}

.field input:focus,
.field select:focus,
.field textarea:focus {
	border-color: var(--primary);
	outline: none;
	box-shadow: 0 0 0 3px var(--primary-soft);
}

.field textarea { min-height: 128px; resize: vertical; }

.field__hint { color: var(--text-muted); font-size: var(--fs-12); }

.consent-row {
	display: flex;
	gap: var(--s-3);
	align-items: flex-start;
	font-size: var(--fs-14);
	color: var(--text-muted);
}

.consent-row input { margin-top: 4px; }

/* CF7 适配 */
.wpcf7 { max-width: 100%; }
.wpcf7 label { display: block; margin-bottom: var(--s-2); font-weight: 600; font-size: var(--fs-14); color: var(--text-strong); }
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="url"],
.wpcf7 input[type="file"],
.wpcf7 select,
.wpcf7 textarea { width: 100%; padding: var(--s-3) var(--s-4); border: 1px solid var(--line-strong); border-radius: var(--r-sm); font-size: var(--fs-16); background: var(--paper); }
.wpcf7 textarea { min-height: 132px; }
.wpcf7 input:focus, .wpcf7 textarea:focus, .wpcf7 select:focus { border-color: var(--primary); outline: none; box-shadow: 0 0 0 3px var(--primary-soft); }
.wpcf7 .wpcf7-submit { background: var(--accent); color: var(--paper); border: 0; border-radius: var(--r-sm); padding: var(--s-3) var(--s-8); font-weight: 600; font-size: var(--fs-16); cursor: pointer; }
.wpcf7 .wpcf7-submit:hover { background: var(--accent-dark); }
.wpcf7 .wpcf7-submit:disabled { opacity: 0.6; cursor: progress; }
.wpcf7-not-valid-tip { color: #b3261e; font-size: var(--fs-12); margin-top: 4px; }
.wpcf7-response-output { margin: var(--s-4) 0 0; padding: var(--s-3) var(--s-4); border-radius: var(--r-sm); font-size: var(--fs-14); }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output { background: #fdecea; border: 1px solid #f5c2c0; color: #8c1d18; }
.wpcf7 form.sent .wpcf7-response-output { background: var(--success-soft); border: 1px solid transparent; color: var(--success); }
.wpcf7-spinner { display: none; }
.aeris-field { margin-bottom: var(--s-4); }
.aeris-field--half { display: inline-block; width: calc(50% - var(--s-2)); vertical-align: top; }
.aeris-field--half + .aeris-field--half { margin-left: var(--s-4); }

/* 浮动 CTA（WhatsApp / 邮件 / 询盘） */
.float-cta {
	position: fixed;
	right: var(--s-5);
	bottom: var(--s-5);
	z-index: 800;
	display: flex;
	flex-direction: column;
	gap: var(--s-2);
}

.float-cta__btn {
	display: inline-flex;
	align-items: center;
	gap: var(--s-2);
	padding: var(--s-2) var(--s-4);
	border-radius: var(--r-pill);
	background: var(--ink);
	color: var(--paper);
	font-size: var(--fs-12);
	font-weight: 700;
	letter-spacing: 0.02em;
	box-shadow: var(--shadow-2);
	text-decoration: none;
}

.float-cta__btn:hover { color: var(--paper); transform: translateY(-1px); }
.float-cta__btn--wa { background: #128c7e; }
.float-cta__btn--mail { background: var(--primary); }
.float-cta__btn svg { width: 16px; height: 16px; }
.float-cta__label { display: none; }

@media (min-width: 900px) {
	.float-cta__label { display: inline; }
}

/* ==========================================================================
   9. Cookie 同意横幅（GDPR）
   ========================================================================== */
.cookie-banner {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1000;
	display: none;
	padding: var(--s-5);
	background: var(--paper);
	border-top: 1px solid var(--line-strong);
	box-shadow: 0 -8px 32px rgba(11, 18, 32, 0.12);
}

.cookie-banner.is-visible { display: block; }

.cookie-banner__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--s-5);
	max-width: var(--maxw);
	margin: 0 auto;
}

.cookie-banner__text { flex: 1 1 420px; font-size: var(--fs-14); color: var(--text); }
.cookie-banner__text a { text-decoration: underline; }

.cookie-banner__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-2);
}

.cookie-banner__actions .btn { padding: var(--s-2) var(--s-5); font-size: var(--fs-14); }

/* 管理入口（页脚常驻，便于随时改同意） */
.cookie-manage {
	background: none;
	border: 0;
	padding: 0;
	color: inherit;
	font-size: inherit;
	text-decoration: underline;
	cursor: pointer;
}

/* ==========================================================================
   10. 页脚
   ========================================================================== */
.site-footer {
	background: var(--ink);
	color: var(--c-slate-200);
	font-size: var(--fs-14);
}

.site-footer a { color: var(--c-slate-200); }
.site-footer a:hover { color: var(--paper); }

.footer-main {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1fr;
	gap: var(--s-10);
	padding: var(--s-16) 0 var(--s-10);
}

.footer-brand .brand { color: var(--paper); margin-bottom: var(--s-4); }
.footer-brand .brand__sub { color: var(--c-slate-400); }
.footer-brand p { color: var(--c-slate-400); max-width: 40ch; }

.footer-col h4 {
	margin-bottom: var(--s-4);
	color: var(--paper);
	font-size: var(--fs-12);
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.footer-col ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.footer-col li { margin-bottom: var(--s-2); }

.footer-legal {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--s-4);
	padding: var(--s-5) 0;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	color: var(--c-slate-400);
	font-size: var(--fs-12);
}

.footer-legal ul {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-4);
	list-style: none;
	margin: 0;
	padding: 0;
}

/* ==========================================================================
   11. 内容排版（正文页 / 法务页）
   ========================================================================== */
.entry {
	max-width: 74ch;
	font-size: var(--fs-16);
}

.entry h2 { margin-top: var(--s-10); font-size: var(--fs-24); }
.entry h3 { margin-top: var(--s-8); font-size: var(--fs-18); }
.entry ul, .entry ol { margin-bottom: var(--s-5); }
.entry li { margin-bottom: var(--s-2); }
.entry table { width: 100%; border-collapse: collapse; margin-bottom: var(--s-5); font-size: var(--fs-14); }
.entry th, .entry td { padding: var(--s-3); border: 1px solid var(--line); text-align: left; }
.entry th { background: var(--surface-alt); }

.page-header {
	padding: var(--s-12) 0 var(--s-8);
	background: var(--surface-muted);
	border-bottom: 1px solid var(--line);
}

.page-header h1 { margin-bottom: var(--s-3); }
.page-header p { color: var(--text-muted); font-size: var(--fs-18); margin: 0; max-width: 68ch; }

.notice {
	padding: var(--s-4) var(--s-5);
	border: 1px solid var(--c-orange-100);
	border-left: 3px solid var(--accent);
	background: var(--accent-soft);
	border-radius: var(--r-sm);
	font-size: var(--fs-14);
	color: var(--c-slate-600);
}

/* CTA 条 */
.cta-strip {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--s-6);
	padding: var(--s-12);
	background: var(--primary-soft);
	border: 1px solid var(--c-blue-100);
	border-radius: var(--r-md);
}

.cta-strip h2 { margin: 0 0 var(--s-2); font-size: var(--fs-24); }
.cta-strip p { margin: 0; color: var(--text); max-width: 56ch; }

/* 404 */
.notfound { padding: var(--s-24) 0; text-align: center; }
.notfound h1 { color: var(--accent); }

/* ==========================================================================
   12. 入场动效（MOTION 5）+ 无障碍降级
   ========================================================================== */
.reveal {
	opacity: 0;
	transform: translateY(12px);
	transition: opacity 420ms var(--ease), transform 420ms var(--ease);
}

.reveal.is-in {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
	}
	.reveal { opacity: 1; transform: none; }
}

/* ==========================================================================
   13. 响应式
   ========================================================================== */
@media (max-width: 1080px) {
	.hero__inner { grid-template-columns: 1fr; gap: var(--s-10); padding: var(--s-16) 0; }
	.hero__art { justify-self: start; max-width: 380px; }
	.process { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.footer-main { grid-template-columns: 1fr 1fr; gap: var(--s-8); }
	.inquiry { grid-template-columns: 1fr; }
	.product-single { grid-template-columns: 1fr; gap: var(--s-8); }
}

@media (max-width: 860px) {
	.nav-toggle { display: inline-flex; }
	.nav {
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background: var(--paper);
		border-bottom: 1px solid var(--line);
		padding: var(--s-4) var(--s-6);
		box-shadow: var(--shadow-2);
	}
	.nav.is-open { display: block; }
	.nav > ul { flex-direction: column; align-items: stretch; gap: 0; }
	.nav a { padding: var(--s-3) 0; border-bottom: 1px solid var(--line); }
	.site-header { position: relative; }
	.header-bar { position: relative; }
	.stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.process { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.hero__stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-3); }
}

@media (max-width: 600px) {
	:root { --s-20: 56px; --s-16: 40px; --s-12: 32px; }
	.container { padding: 0 var(--s-4); }
	.product-grid { grid-template-columns: 1fr; }
	.stat-grid { grid-template-columns: 1fr; }
	.grid--2, .grid--3, .grid--4 { grid-template-columns: 1fr; }
	.process { grid-template-columns: 1fr; }
	.form-grid { grid-template-columns: 1fr; }
	.aeris-field--half { display: block; width: 100%; }
	.aeris-field--half + .aeris-field--half { margin-left: 0; }
	.hero__stats { grid-template-columns: 1fr; gap: var(--s-2); }
	.footer-main { grid-template-columns: 1fr; }
	.float-cta { right: var(--s-3); bottom: var(--s-3); }
	.cookie-banner__inner { flex-direction: column; align-items: stretch; }
	.cookie-banner__actions { flex-direction: column; align-items: stretch; }
	.cookie-banner__actions .btn { width: 100%; }

	/* 页头：窄屏隐藏 CTA（浮窗/抽屉菜单仍有询盘入口）与副标题，避免一行挤爆导致横向滚动 */
	.header-bar { flex-wrap: wrap; }
	.header-actions .btn { display: none; }
	.brand__sub { display: none; }
	.hero__title { font-size: clamp(1.75rem, 7.5vw, 2.25rem); }
}
