/* ===========================================================================
   Typography Tokens — 英文站排版字号体系（bcpac-en）
   ---------------------------------------------------------------------------
   字体栈：
     优先   Inter
     备选   Helvetica Neue → Helvetica → Arial → Roboto → sans-serif

   字号分级：
     Banner 主标题  42–48px
     一级标题 (H1)  36px
     二级标题 (H2)  28–32px
     正文           16px
     辅助说明       14px

   行高：
     英文正文 1.6（区别于日文站 1.75）
     大标题   1.15–1.25
     副标题   1.3–1.35

   字重分级（不要全站加粗）：
     Banner   700  Bold
     H1       600  Semibold
     H2       500  Medium
     Body     400  Regular
     Caption  400  Regular（颜色变灰区分层级，而非加粗）
     Nav      500  Medium

   响应式三档（与日文站对齐的断点 768 / 1024）：
     PC      ≥1024px      Banner 48 / H1 36 / H2 32 / Body 16 / Caption 14
     平板    768–1023px   Banner 36 / H1 30 / H2 26 / Body 16 / Caption 14
     手机    ≤767px       Banner 28 / H1 22 / H2 20 / Body 15 / Caption 12
   =========================================================================== */

:root {
	--font-en: "Inter", "Helvetica Neue", Helvetica, Arial, Roboto, sans-serif;

	--fs-banner: 48px;
	--fs-h1: 36px;
	--fs-h2: 32px;
	--fs-body: 16px;
	--fs-caption: 14px;

	--lh-display: 1.15;
	--lh-heading: 1.3;
	--lh-body: 1.6;

	--ls-display: .005em;
	--ls-heading: .01em;
	--ls-body: .01em;

	--fw-banner: 700;
	--fw-h1: 600;
	--fw-h2: 500;
	--fw-body: 400;
	--fw-caption: 400;
	--fw-nav: 500;

	--color-caption: #8a8a8a;
}

/* 平板 768–1023px：标题收口，正文不变 */
@media screen and (max-width: 1023px) {
	:root {
		--fs-banner: 36px;
		--fs-h1: 30px;
		--fs-h2: 26px;
	}
}

/* 手机 ≤767px：全层级再收口；行距字距同步收紧 */
@media screen and (max-width: 767px) {
	:root {
		--fs-banner: 28px;
		--fs-h1: 22px;
		--fs-h2: 20px;
		--fs-body: 15px;
		--fs-caption: 12px;

		--lh-display: 1.2;
		--lh-heading: 1.35;
		--lh-body: 1.55;
	}
}

/* ---------- 语义化排版类（推荐写新页面 / 新区块时使用） ---------- */

.t-banner {
	font-family: var(--font-en);
	font-size: var(--fs-banner);
	line-height: var(--lh-display);
	font-weight: var(--fw-banner);
	letter-spacing: var(--ls-display);
}

.t-h1 {
	font-family: var(--font-en);
	font-size: var(--fs-h1);
	line-height: var(--lh-heading);
	font-weight: var(--fw-h1);
	letter-spacing: var(--ls-heading);
}

.t-h2 {
	font-family: var(--font-en);
	font-size: var(--fs-h2);
	line-height: var(--lh-heading);
	font-weight: var(--fw-h2);
	letter-spacing: var(--ls-heading);
}

.t-body {
	font-family: var(--font-en);
	font-size: var(--fs-body);
	line-height: var(--lh-body);
	font-weight: var(--fw-body);
	letter-spacing: var(--ls-body);
}

.t-caption {
	font-family: var(--font-en);
	font-size: var(--fs-caption);
	line-height: var(--lh-body);
	font-weight: var(--fw-caption);
	letter-spacing: var(--ls-body);
	color: var(--color-caption);
}

/* ---------- 字重工具类（分级使用，避免全站加粗） ---------- */

.fw-regular  { font-weight: 400; }
.fw-medium   { font-weight: 500; }
.fw-semibold { font-weight: 600; }
.fw-bold     { font-weight: 700; }

/* ---------- 字号工具类：补齐项目原有 .u-fzNN 系列（已有 10–30，这里补 32/36/42/48） ----------
   - PC 用 px + rem 双声明，沿用项目惯例（html: 62.5% => 1rem = 10px）
   - 平板 / 手机按 token 阶梯同步收口
*/

.u-fz32 { font-size: 32px; font-size: 3.2rem; }
.u-fz36 { font-size: 36px; font-size: 3.6rem; }
.u-fz42 { font-size: 42px; font-size: 4.2rem; }
.u-fz48 { font-size: 48px; font-size: 4.8rem; }

@media screen and (max-width: 1023px) {
	.u-fz32 { font-size: 26px; font-size: 2.6rem; }
	.u-fz36 { font-size: 30px; font-size: 3.0rem; }
	.u-fz42 { font-size: 32px; font-size: 3.2rem; }
	.u-fz48 { font-size: 36px; font-size: 3.6rem; }
}

@media screen and (max-width: 767px) {
	.u-fz32 { font-size: 20px; font-size: 2.0rem; }
	.u-fz36 { font-size: 22px; font-size: 2.2rem; }
	.u-fz42 { font-size: 24px; font-size: 2.4rem; }
	.u-fz48 { font-size: 28px; font-size: 2.8rem; }
}