/* ==========================================================================
   Altarmala · 设计令牌（与 theme.json 同步，双写保持同步）
   本文件是前端 PHP 模板的 CSS 变量唯一真源；theme.json 是编辑器侧真源。

   断点体系（v1.4.0 收敛为 4 档，自上而下 max-width）：
     1439px  桌面标准     容器 1160 / gutter 24 / 商品 4 列
     1199px  小桌面·平板横屏 容器 100% / gutter 24 / 商品 3 列
      899px  平板竖屏     容器 100% / gutter 20 / 商品 2 列
      599px  手机        容器 100% / gutter 16 / 商品 2 列
   除上述 4 档外只剩 prefers-reduced-motion 与 print。
   ========================================================================== */

:root {
	/* 12 色 */
	--am-primary:#1f3b34;
	--am-primary-deep:#162b26;
	--am-gold:#b08d57;
	--am-gold-deep:#96763f;
	--am-gold-text:#8a6a35; /* 价格文字与金底按钮底色：白字/纸底对比度 >=4.5（AA） */
	--am-gold-soft:#d8c09a;
	--am-ivory:#f6f2e9;
	--am-paper:#fffdf9;
	--am-ink:#26221c;
	--am-muted:#6b6252;
	--am-footer-muted:rgba(255, 253, 249, 0.7); /* 页脚次要文字统一透明度（v1.5.2 收编 74/68/72% 硬编码） */
	--am-line:#e6dfd0;
	--am-wa:#1faa59;
	--am-wa-deep:#17854a;

	/* 中性扩展色（v1.4.0：把散落的硬编码收编为令牌）
	   line-soft 浅底 / line-strong 深一档线 / stone 深底上的次级文字 / alert 库存与错误提示 */
	--am-line-soft:#f2eee2;
	--am-line-strong:#cfc9b8;
	--am-stone:#b9b3a0;
	--am-alert:#a8562f;
	/* 材质 / 氛围色（v1.4.7：仅用于 section 背景、overlay、摄影衬托，不进入按钮 / 正文核心交互色） */
	--am-clay:#a9764f;
	--am-cedar:#5a4632;
	--am-mist:#ece7dc;
	--am-gold-bright:#c9a36a;

	/* 圆角 */
	--am-radius-pill:999px;
	--am-radius-card:16px;
	--am-radius-block:24px;
	--am-radius-input:8px;

	/* 结构与间距 */
	--am-container:1160px;
	--am-container-wide:1360px; /* 编辑式宽幅：Hero / 精选块 */
	--am-gutter:24px;
	--am-section-gap:88px;
	--am-section-gap-mobile:56px;

	/* 顶栏高度（v1.2.0 单行三区）：未滚动 64 / 滚动收缩后 52 / 移动端 56 */
	--am-header-h:64px;
	--am-header-h-condensed:52px;
	--am-header-h-mobile:56px;

	/* 字体 */
	--am-font-body: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", system-ui, -apple-system, sans-serif;
	--am-font-serif: "Songti SC", "Source Han Serif SC", "Noto Serif SC", Georgia, "Times New Roman", serif;

	/* 字号阶梯（v1.4.0 模块化，8pt 对齐） */
	--am-fs-xs:12px;   /* 元信息 / 脚注 / 角标 */
	--am-fs-sm:13px;   /* 卡片次要信息 / 导航 / 按钮小号 */
	--am-fs-base:16px; /* 正文 */
	--am-fs-md:18px;   /* 卡片标题 / 引导句 */
	--am-fs-lg:22px;   /* 区块小标题 */
	--am-fs-xl:32px;   /* 区块标题 */
	--am-fs-2xl:48px;  /* Hero 标题 */

	/* 阴影（克制，仅卡片 hover 使用） */
	--am-shadow-card: 0 6px 18px rgba(31, 59, 52, .08);
	--am-shadow-card-hover: 0 10px 26px rgba(31, 59, 52, .13);

	/* 动效（v1.4.0：统一缓出曲线，替代各处的 ease） */
	--am-ease: cubic-bezier(.22, .61, .36, 1);
	--am-transition: .2s var(--am-ease);
}

/* ---------- 令牌在 body 上的落地（PHP 模板侧） ---------- */
html {
	overflow-x: clip; /* 横向溢出兜底（clip 不破坏 sticky，hidden 会） */
	scroll-padding-top: 72px; /* 锚点跳转避开 sticky 顶栏 */
}
/* 锚点目标统一预留顶栏高度（此前为 auto，锚点跳转会被顶栏遮住） */
a[target],
[id] { scroll-margin-top: 72px; }
body.am-body {
	background: var(--am-paper);
	color: var(--am-ink);
	font-family: var(--am-font-body);
	font-size: var(--am-fs-base);
	padding-top: 0;
	overflow-x: clip;
}

/* ---------- 容器（与 style.css 保持一致，供编辑器与区块复用） ---------- */
.am-container {
	width: 100%;
	max-width: var(--am-container);
	margin-inline: auto;
	padding-inline: var(--am-gutter);
}

/* ---------- 区块间距 ---------- */
.am-section {
	padding-block: var(--am-section-gap);
}
.am-section--ivory { background: var(--am-ivory); }
.am-section--deep { background: var(--am-primary-deep); color: var(--am-line-soft); }
.am-section--editorial { padding-block: 96px; }

/* ---------- 栅格 ---------- */
.am-grid {
	display: grid;
	gap: var(--am-gutter);
}
.am-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.am-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.am-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.am-grid--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }

/* ---------- 语义色工具类 ---------- */
.am-text-primary { color: var(--am-primary); }
.am-text-gold { color: var(--am-gold); }
.am-text-gold-deep { color: var(--am-gold-deep); }
.am-text-muted { color: var(--am-muted); }
.am-bg-ivory { background: var(--am-ivory); }
.am-bg-deep { background: var(--am-primary-deep); color: var(--am-line-soft); }

/* ---------- 分区标题 ---------- */
.am-heading {
	text-align: center;
	margin-bottom: 40px;
}
.am-heading__eyebrow {
	display: block;
	font-size: var(--am-fs-sm);
	letter-spacing: .18em;
	color: var(--am-gold);
	margin-bottom: 10px;
}
.am-heading__title {
	font-family: var(--am-font-serif);
	font-size: var(--am-fs-xl);
	font-weight: 600;
	color: var(--am-primary);
	margin: 0 0 10px;
}
.am-heading__sub {
	color: var(--am-muted);
	font-size: var(--am-fs-base);
	margin: 0;
}
/* 分区标题金线装饰（东方器物美学：细金线 + 中心菱点） */
.am-heading__title { position: relative; }
.am-heading__title::after {
	content: "";
	display: block;
	width: 66px;
	height: 11px;
	margin: 16px auto 0;
	background:
		radial-gradient(circle, var(--am-gold) 0 2.4px, transparent 3px) center/11px 11px no-repeat,
		linear-gradient(90deg, transparent, var(--am-line-strong) 22%, var(--am-line-strong) 78%, transparent) center/100% 1px no-repeat;
}

/* 标题均衡断行：消除「只做你的那一串」式孤字换行（现代浏览器支持，不支持则忽略） */
.am-heading__title,
.am-hero__title,
.am-promise__t,
.am-product-card__title,
.woocommerce-loop-product__title,
.am-product-card h2,
.am-product-card h3 { text-wrap: balance; }

/* ---------- 滚动进入动效（v1.4.0）：由 JS 加 .am-reveal，无 JS 时内容照常显示 ---------- */
.am-reveal {
	opacity: 0;
	transform: translateY(12px);
	transition: opacity .5s var(--am-ease), transform .5s var(--am-ease);
}
.am-reveal.is-revealed {
	opacity: 1;
	transform: none;
}

/* 卡片网格错落入场：按子项序号加 transition-delay（上限 120ms），形成节奏感；reduced-motion 下由全局守卫关闭 */
@media (prefers-reduced-motion: no-preference) {
	ul.products > li.am-reveal:nth-child(1) { transition-delay: 0ms; }
	ul.products > li.am-reveal:nth-child(2) { transition-delay: 30ms; }
	ul.products > li.am-reveal:nth-child(3) { transition-delay: 60ms; }
	ul.products > li.am-reveal:nth-child(4) { transition-delay: 90ms; }
	ul.products > li.am-reveal:nth-child(n+5) { transition-delay: 120ms; }
}

/* ---------- 响应式（4 档断点） ---------- */
/* ≤1199px：小桌面 / 平板横屏 */
@media (max-width: 1199px) {
	:root {
		--am-gutter: 24px;
		--am-section-gap: 72px;
	}
}

/* ≤899px：平板竖屏 */
@media (max-width: 899px) {
	:root {
		--am-gutter: 20px;
		--am-section-gap: var(--am-section-gap-mobile);
	}
	.am-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.am-grid--5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ≤599px：手机 —— 标题阶梯整体降一档（Hero 40→32 / 区块标题 28→24） */
@media (max-width: 599px) {
	:root {
		--am-gutter: 16px;
		--am-fs-2xl: 32px;
		--am-fs-xl: 24px;
	}
	.am-grid--2,
	.am-grid--3 { grid-template-columns: minmax(0, 1fr); }
	/* 商品类四/五列栅格在手机端保持双列/三列，避免单列堆叠过长（如首页定制区 8 卡单列近 4600px） */
	.am-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.am-grid--5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.am-heading { margin-bottom: 28px; }
}

/* ---------- 编辑器侧（区块编辑器内容区） ---------- */
.editor-styles-wrapper {
	font-family: var(--am-font-body);
	color: var(--am-ink);
}