/* ============================================================
   LAKEFOX — base.css
   设计令牌 + 全局基础 + 通用工具类（手写，零框架依赖）
   设计权威：DESIGN-SPEC.md（版本 G「墨玉朱砂」，值取自 spec-g.html §13）
   设计规则：spec-g.html（对比度红线 §2 / 触摸目标 ≥44px §07 /
              焦点环可见 / RTL 逻辑属性 §04 / reduced-motion §08）
   约定：组件内禁止裸 hex，一律 var() 引用；渐变端点须注释来源
   ============================================================ */

/* ---------- 1. 设计令牌 ---------- */
:root {
  /* ============ G 版规范令牌（spec-g.html §13「墨玉朱砂」，权威值不得改动） ============ */
  /* 主色阶 · 墨玉绿 */
  --pri: #173A40;   /* 墨玉主色 — Logo/页签选中/重点数字/标题 */
  --pri2: #265057;  /* 松烟绿 — eyebrow 眉题/次级强调 */
  --pri3: #3D7078;  /* 青瓷绿 — 插画辅助/光柱/渐变亮色 */
  --deep: #102529;  /* 深潭 — 深色悬浮态/渐变中间色 */
  --dark: #0B1A1D;  /* 深渊墨 — 英雄区/CTA 深色底/商店徽章 */
  /* 强调色 · 朱砂红 */
  --acc: #C8432B;   /* 朱砂 — 全部 CTA/强调数字/链接下划线/选中态 */
  --acc-hi: #DE6248; /* 亮朱 — 按钮 hover/深底强调文字 */
  --acc-soft: #F6D9CF; /* 朱砂雾 — 标签底/hover 衬底 */
  /* 中性色 */
  --bg: #FFFFFF;    /* 页面白 — 表面/卡片（spec-g §13 权威） */
  --page: #F4F4F2;  /* 页面底色（v7.html 实测米白：body/页脚；spec-g 增补，见 DESIGN-SPEC §2.0 注） */
  --gray: #E2E3E1;  /* 线灰 — 描边/输入框边/登录钮 */
  --ink: #15211F;   /* 墨黑 — 正文主文字 */
  --soft: #F3F4F4;  /* 浅灰区块 — 交替 section/促销卡/箭头钮 */
  --thead: #EBECEC; /* 表头灰 — 表格表头行 */
  /* 语义色 */
  --up: #1D9E6F;    /* 涨 · 青碧 — 涨幅/正向指标/LED 绿灯 */
  --up-hi: #2FBF8F; /* 涨 · 亮青碧（深底 K 线光柱/闪烁，spec-g §06 v7 规格） */
  /* == 科技质感装饰层（v2.2：发光/发丝线端点，rgba 注释来源，禁组件直写） == */
  --glow-acc: rgba(200, 67, 43, 0.25); /* 朱砂光晕（--acc 透明化） */
  --glow-up: rgba(47, 191, 143, 0.2); /* 青碧光晕（--up-hi 透明化） */
  --glow-pri: rgba(23, 58, 64, 0.3); /* 墨玉光晕（--pri 透明化） */
  --hairline: rgba(20, 30, 34, 0.08); /* 发丝线基底（墨影透明化） */
  --down: #C8432B;  /* 跌 · 朱砂（警示沿用朱砂系，不另造红色） */
  /* 层级文字（G §03 排印语义） */
  --ink-2: #5F6A6E; /* 次要文字 — 段落说明/页脚链接 */
  --ink-3: #7C8589; /* 弱化文字（G§03 辅助/注释/占位符；白底 ≈4.9:1 ✓ 12.5px AA） */
  --ink-body: #4D585C; /* 正文段落色（spec-g §03 正文 15px/1.95 #4D585C） */
  /* 字体与动效 */
  /* G 数字/代码字体；末尾挂 CJK/西里尔/阿拉伯自托管族，避免中文等非拉丁字形落到系统等宽字体
     （无 CJK 系统字体的环境会渲染成方框） */
  --num-font: 'IBM Plex Mono', 'Archivo', 'Noto Sans SC', 'Noto Sans', monospace;
  --ease: cubic-bezier(0.22, 1, 0.36, 1); /* G 唯一缓动曲线（§08），禁用其他 */

  /* == 主题语义层（以上述 G 令牌为值来源；组件可引用语义层或 G 令牌，禁裸 hex） == */
  --bg-white: var(--bg);
  --bg-dark: var(--dark);
  --bg-gray: var(--soft);
  --text-primary: var(--ink);
  --text-inverse: #FFFFFF;
  --text-secondary: var(--ink-2);

  /* == 语义组件令牌（对比度锁定配对，spec-g.html §07 实测） ==
     #C8432B 朱砂底 → 白字 ≈4.9:1 ✓（btn-reg/btn-acc 14-15px 粗体 AA）
     #C8432B 朱砂底 → 深字 #0B1A1D ≈4.4:1 ✓（btn-hero 深底场景规格）
     #E2E3E1 线灰底 → 墨黑 ≈13:1 ✓（btn-login 次行动） */
  --button-primary-bg: var(--acc);
  --button-primary-label: var(--text-inverse);
  --button-secondary-bg: var(--gray);
  --button-secondary-label: var(--ink);
  /* 数据/行情模块：深底白字 + 亮朱强调（spec-g §07 深底场景规格） */
  --data-bg: var(--pri);
  --data-text: var(--text-inverse);
  /* 页脚：v7 米白底页脚（页面底色同源），文字/链接步行 --ink-2 */
  --footer-bg: var(--page);
  --footer-text: var(--ink-2);

  /* 朱砂使用边界（spec-g §02 克制点睛）：仅限 CTA/关键数字/链接下划线/选中态；
     单屏朱砂面积 ≤5%；禁止正文小字用朱砂（正文一律 --ink） */

  /* == 间距（4px/8px 体系，ui-ux-pro-max §5 spacing-scale；G§04 常用 8/12/14/16/20/22/26/34/44/52/56） == */
  --space-1: 0.25rem;  /* 4px */
  --space-2: 0.5rem;   /* 8px */
  --space-3: 0.75rem;  /* 12px */
  --space-4: 1rem;     /* 16px */
  --space-5: 1.25rem;  /* 20px */
  --space-6: 1.5rem;   /* 24px */
  --space-7: 1.75rem;  /* 28px */
  --space-8: 2rem;     /* 32px */
  --space-9: 2.25rem;  /* 36px */
  --space-10: 2.5rem;  /* 40px */
  --space-11: 2.75rem; /* 44px */
  --space-12: 3rem;    /* 48px */

  /* == 圆角（G§05 五档：999 胶囊 / 24 图标座 / 16-20 卡片 / 8-12 小元素） == */
  --radius-sm: 0.5rem;    /* 8px — 小标签/二维码座/分页 */
  --radius-base: 0.75rem; /* 12px — 输入框/浮件/内嵌元素 */
  --radius-card: 1.125rem; /* 18px — 卡片/表格（G 16-20px 档） */
  --radius-icon: 1.5rem;  /* 24px — 特性图标座（G 24px 档） */
  --radius-pill: 999px;   /* 胶囊按钮/标签/页签（G 999px 档，禁直角按钮） */

  /* == 阴影（G§05 四级：L0 平贴 / L1 浮起 / L2 强调 / L3 浮卡）
     墨影 rgba(20,30,34,·) / 朱砂影 rgba(200,67,43,·) / 深影 rgba(10,20,24,·) 均为令牌透明化 */
  --shadow-card: 0 2px 10px rgba(20, 30, 34, 0.04);   /* L0 — 促销卡/徽章卡默认 */
  --shadow-lift: 0 18px 40px rgba(20, 30, 34, 0.1);   /* L1 — 卡片 hover（配 translateY(-6px)） */
  --shadow-acc: 0 8px 22px rgba(200, 67, 43, 0.33);   /* L2 — 朱砂按钮/箭头钮投影 */
  --shadow-acc-strong: 0 10px 28px rgba(200, 67, 43, 0.55); /* L2+ — 深底 CTA/聊天浮钮 */
  --shadow-float: 0 24px 60px rgba(10, 20, 24, 0.2);  /* L3 — 设备样机/悬浮数据卡 */

  /* == 字号阶梯（实测 22 个 CSS 文件语义层归纳；组件级字号一律引用这些令牌，禁止裸 rem） == */
  --text-1: 0.75rem;   /* 12px — 徽章 */
  --text-2: 0.8125rem; /* 13px — 元信息（页脚法务/公司/版权、行情表头） */
  --text-3: 0.875rem;  /* 14px — 辅助说明（日期/标签/注释/眉题，最大簇） */
  --text-4: 0.9375rem; /* 15px — 卡片正文/导航/栏目标题 */
  --text-5: 1rem;      /* 16px — 正文基线/表单输入（≥16px 防 iOS 聚焦缩放） */
  --text-6: 1.125rem;  /* 18px — 导语/卡片标题 */
  --text-7: 1.375rem;  /* 22px — 正文内小标题/展示小标题 */
  --text-8: 1.5rem;    /* 24px — 品牌展示（页脚品牌名） */
  --text-9: 2rem;      /* 32px — 装饰数字（步骤序号） */
  --text-h1: clamp(2.5rem, 5.2vw, 4.5rem);             /* 40→72px 英雄区主标题 G§03 H1/900/lh1.14 */
  --text-h2: clamp(1.75rem, 3.2vw, 2.75rem);           /* 28→44px 区块标题 G§03 H2/900/lh1.25 */
  --text-h3: clamp(1.125rem, 1rem + 0.4vw, 1.375rem);  /* 18→22px 卡片标题 G§03 H3/800 */
  --text-h4: clamp(1.125rem, 1rem + 0.5vw, 1.375rem);  /* 18→22px 小标题 */
  --text-h5: 1.125rem; /* 18px */
  --text-h6: 1rem;     /* 16px */
  --text-display: clamp(4rem, 12vw, 7rem); /* 64→112px 展示数字（错误页状态码） */

  /* == 行高阶梯（G§03：H1 1.14 见 §3 单独声明；正文段落 1.9-1.95 → --leading-relaxed） == */
  --leading-none: 1;       /* 单行展示（logo 标记/大数字） */
  --leading-heading: 1.25; /* H2/H3 统一（G§03） */
  --leading-snug: 1.5;     /* 紧凑（徽章/元信息/输入框） */
  --leading-body: 1.75;    /* 正文基线（UI 控件安全值；段落呼吸见 relaxed） */
  --leading-relaxed: 1.95; /* 长文正文（G§03 正文 lh1.9-1.95/合规文本 2.05） */
  --leading-rtl: 1.75;     /* [dir=rtl] 长文（阿拉伯扩展字形） */

  /* == 字距 == */
  --tracking-subtle: 0.04em; /* logo/展示数字 */
  --tracking-caps: 0.1em;    /* 眉题与大写标签 */
  --tracking-wide: 0.2em;    /* 深底小字号大写徽章 */

  /* == 区块节奏与行长（--spacing-scale 由 theme.liquid 注入为无符号数值，后台「间距缩放」滑块在此生效） == */
  --section-pad: calc(4.375rem * var(--spacing-scale));      /* 70px 区块移动端基线（v7/G§09：≤820 sec 70px 0） */
  --section-pad-lg: calc(6rem * var(--spacing-scale));       /* 96px 区块桌面端（768px+），原 4.5rem/72px */
  --section-pad-hero: calc(8rem * var(--spacing-scale));     /* 128px hero 桌面端，原 6rem/96px */
  --measure-intro: 60ch; /* 引言/副标题行长（规范 §三 桌面 60-75ch） */
  --measure-long: 68ch;  /* 长文正文行长（文章/合规/FAQ 答案） */

  /* == 动效令牌（G§08：微交互 .2-.25s / 按钮卡片 .3-.35s / 滚动显现 .8s / 循环 ≥1.9s） == */
  --duration-fast: 150ms; /* 微交互 — 链接变色/图标钮/页脚链接 */
  --duration-base: 200ms; /* 通用状态过渡（G 微交互上限 .25s 档） */
  --duration-slow: 300ms; /* 按钮/卡片上浮（G .3-.35s 档） */
  --duration-reveal: 800ms; /* 滚动显现（G§08 .rev→in .8s） */
  --ease-out: var(--ease); /* G 唯一缓动 cubic-bezier(.22,1,.36,1)，全部过渡/动画共用（§08） */

  /* == 布局（--page-width 由 theme.liquid 按 settings 注入，勿在此重复定义） == */
  --breakpoint-tablet: 768px;
  --breakpoint-desktop: 1024px;
}

/* ---------- 2. 基础重置（最小集） ---------- */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  -moz-tab-size: 4;
  tab-size: 4;
  -webkit-tap-highlight-color: transparent;
}

body {
  margin: 0;
  font-family: var(--font-body-family), system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: var(--text-5); /* 16px 基础字号（ui-ux-pro-max §6 readable-font-size） */
  font-style: var(--font-body-style);
  font-weight: var(--font-body-weight);
  line-height: var(--leading-body);
  /* scheme 变量优先（theme.liquid 按 color_scheme 输出），缺失时回退品牌 11 色 */
  color: var(--color-foreground, var(--text-primary));
  background-color: var(--color-background, var(--page)); /* scheme 优先，兜底 v7 页面底色 */
  -webkit-font-smoothing: antialiased;
}

/* ---------- 3. 排版（标题字阶） ---------- */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-heading-family), system-ui, sans-serif; /* G 标题：Archivo/Noto Sans SC（衬线禁用） */
  font-style: var(--font-heading-style);
  font-weight: var(--font-heading-weight);
  line-height: var(--leading-heading);
  margin-block: 0; /* 逻辑 margin */
  color: inherit;
}

/* 字阶（clamp 流体缩放，G§03 字号档位） */
h1 { font-size: var(--text-h1); line-height: 1.14; } /* 40→72px · 英雄区 H1（G§03） */
h2 { font-size: var(--text-h2); } /* 28→44px */
h3 { font-size: var(--text-h3); } /* 18→22px */
h4 { font-size: var(--text-h4); } /* 18→22px */
h5 { font-size: var(--text-h5); } /* 18px */
h6 { font-size: var(--text-h6); } /* 16px */

p {
  margin-block: 0;
}

a {
  color: inherit;
}

img {
  max-width: 100%;
  height: auto;
}

/* 文本工具（逻辑对齐，RTL 自动镜像） */
.lf-text-start { text-align: start; }
.lf-text-end { text-align: end; }
.lf-text-center { text-align: center; }
.lf-text-secondary { color: var(--text-secondary); }

/* 眉题 eyebrow（G§03：12.5/800/字距 .26em/--pri2 松烟绿，浅底 section 眉题） */
.lf-eyebrow {
  display: inline-block;
  font-size: 0.78125rem; /* 12.5px（G§03） */
  font-weight: 800;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--pri2);
}

/* 眉题深底变体（hero-tag 同族）：深底上强调文字用亮朱 --acc-hi（G§03 深底场景） */
.lf-eyebrow--inverse {
  color: var(--acc-hi);
}

/* ---------- 4. 焦点可见环（可见性优先，朱砂与主/辅背景均 ≥3:1） ---------- */
:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: 2px;
}

/* ---------- 5. 触摸目标体系（客户 2026-08：统一 36px） ----------
   lf-btn / lf-nav__link / 全部 lf-lang-* 控件 */
.lf-btn,
.lf-nav__link,
.lf-lang-switcher,
.lf-lang-button,
.lf-lang-select {
  min-height: 36px;
}

/* ---------- 6. 内容宽度容器（保留任务 1，改逻辑 padding） ---------- */
/* 内容容器（v7.html .wrap：max-width 1240px / padding-inline 32px；≤820 收缩为 20px）。
   --page-width 为后台滑块（默认 1240），上限锁定 1240 —— G§04 容器权威值，禁拉宽到全屏 */
.lf-container {
  max-width: min(var(--page-width, 1240px), 1240px);
  margin-inline: auto; /* 水平居中（对称场景逻辑写法） */
  padding-inline: 32px; /* RTL 自动镜像 */
}

@media (max-width: 820px) {
  .lf-container {
    padding-inline: 20px;
  }
}

/* ---------- 7. 组件基础（对比度规范落地） ---------- */

/* 按钮基类（朱砂底白字 / 线灰底墨黑字，G§07 按钮体系，对比度见令牌注释） */
.lf-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: 36px; /* 客户 2026-08：全局按钮高度 */
  padding-inline: var(--space-6);
  padding-block: var(--space-3);
  border: 0;
  border-radius: var(--radius-pill);
  font-family: inherit;
  font-size: inherit;
  font-weight: 600;
  line-height: inherit;
  text-decoration: none;
  cursor: pointer;
  transition: background-color var(--duration-fast) var(--ease-out),
    box-shadow var(--duration-fast) var(--ease-out),
    transform var(--duration-fast) var(--ease-out);
}

/* 主按钮：朱砂底白字（≈4.9:1 ✓，G§07 btn-reg/btn-acc 规格） */
.lf-btn--primary {
  background: var(--button-primary-bg);
  color: var(--button-primary-label);
}

.lf-btn--primary:hover {
  background: var(--acc-hi); /* G hover 三件套：变亮 + 上浮 + 品牌色投影（§07） */
  box-shadow: var(--shadow-acc);
  transform: translateY(-2px);
}

/* 次按钮：线灰底墨黑字（≈13:1 ✓，G§07 btn-login 规格；hover 转朱砂雾衬底） */
.lf-btn--secondary {
  background: var(--button-secondary-bg);
  color: var(--button-secondary-label);
}

.lf-btn--secondary:hover {
  background: var(--acc-soft);
  box-shadow: var(--shadow-lift);
  transform: translateY(-1px);
}

/* 大号主 CTA（spec-g §07 btn-acc 规格：15/700 · 14px 30px · 朱砂影 .33） */
.lf-btn--lg {
  font-size: var(--text-4);
  font-weight: 700;
  padding-block: 14px;
  padding-inline: 30px;
  box-shadow: var(--shadow-acc);
}

/* 科技质感通用按钮装饰（v2.2）：表面微渐变 + hover 光晕环。
   用于朱砂 CTA（hero/cta/tabs/app）；rhythm 不动、对比度配对不变（光晕仅在 hover 展开）。 */
.lf-btn--glow {
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.12), transparent 55%); /* 高光微渐变（白透明化，端点注释来源） */
}

.lf-btn--glow:hover {
  box-shadow: var(--shadow-acc-strong), 0 0 0 6px rgba(200, 67, 43, 0.12); /* 朱砂光晕环（--acc 透明化） */
}

/* 数据/行情模块：墨玉底白字 + 亮朱强调（G§07 深底场景规格） */
.lf-data {
  background: var(--data-bg);
  color: var(--data-text);
}

/* 页脚：G 版白底页脚 + 次要色文字（spec-g §07） */
.lf-footer {
  background: var(--footer-bg);
  color: var(--footer-text);
}

/* ---------- 7b. 共享组件基类（跨 section 复用，禁止在 section 内重复定义） ---------- */

/* Outline 按钮：DESIGN-SPEC §5.1 第四变体（从 section-platforms.css / section-funding.css 上提，
   声明与既有定义逐字一致：透明底 + 1px 前景边框 + 前景文字，hover 填充暖灰卡底 + 上浮） */
.lf-btn--outline {
  background: transparent;
  border: 1px solid var(--color-foreground, var(--text-primary));
  color: var(--color-foreground, var(--text-primary));
}

.lf-btn--outline:hover {
  background: var(--color-card-background, var(--bg-gray));
  box-shadow: var(--shadow-lift);
  transform: translateY(-1px);
}

/* Link 按钮：G§07 链接 = 下划线 + hover 变朱砂（§02 链接下划线用朱砂）。
   三种修饰符场景：默认深字→hover 朱砂；--accent 朱砂→hover 深字；--bare 无下划线（卡片内链接） */
.lf-btn--link {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  min-height: 44px; /* 触摸目标 ≥44px */
  padding-block: var(--space-2);
  border: 0;
  background: none;
  font-family: inherit;
  font-size: inherit;
  font-weight: 600;
  line-height: inherit;
  color: var(--color-foreground, var(--text-primary));
  text-decoration: underline;
  text-underline-offset: 4px;
  cursor: pointer;
  transition: color var(--duration-fast) var(--ease-out);
}

.lf-btn--link:hover {
  color: var(--acc);
}

.lf-btn--link--accent {
  color: var(--acc);
}

.lf-btn--link--accent:hover {
  color: var(--color-foreground, var(--text-primary));
}

.lf-btn--link--bare {
  text-decoration: none;
}

/* 卡片基类：G§05/§07 配方（浅灰底（scheme card_background）+ 1px 边 + 18px 圆角 + L0 影）。
   hover 统一 -6px/300ms（G§07 促销卡规格：上浮 6px + L1 影）；--flat 用于轻量子块 */
.lf-card {
  background: var(--color-card-background, var(--soft));
  border: 1px solid var(--color-card-border, rgba(20, 30, 34, 0.08));
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-card);
}

.lf-card--hover {
  transition: box-shadow var(--duration-slow) var(--ease-out),
    transform var(--duration-slow) var(--ease-out),
    border-color var(--duration-base) var(--ease-out);
}

.lf-card--hover:hover {
  box-shadow: var(--shadow-lift);
  transform: translateY(-6px);
}

.lf-card--flat {
  box-shadow: none;
}

/* 图标座 chip：G§10 特性图标座（白底 + 24px 圆角 + L1 影，描边 --pri）；
   --accent 变体：朱砂描边 + 朱砂雾 16% 衬底（旁有标题文字双通道）；不支持 color-mix 时回退卡底 */
.lf-icon-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 3rem; /* 48px */
  height: 3rem;
  border-radius: var(--radius-icon);
  color: var(--pri);
  background: var(--bg-white);
  box-shadow: var(--shadow-card);
}

.lf-icon-chip--sm {
  width: 2.5rem; /* 40px */
  height: 2.5rem;
  border-radius: var(--radius-sm);
}

.lf-icon-chip--lg {
  width: 3.5rem; /* 56px */
  height: 3.5rem;
}

.lf-icon-chip--accent {
  color: var(--acc);
  background: var(--color-card-background, var(--bg-gray)); /* 不支持 color-mix 时的兜底 */
  background: color-mix(in srgb, var(--acc) 16%, var(--color-card-background, var(--bg-white)));
}

.lf-icon-chip--pill {
  border-radius: var(--radius-pill);
}

.lf-icon-chip--surface {
  background: var(--bg-white);
  border: 1px solid var(--color-card-border, rgba(20, 30, 34, 0.08));
  color: var(--pri);
}

/* 表单基础件（统一 contact-form / customers / partners 三套） */
.lf-label {
  display: block;
  margin-block-end: var(--space-2);
  font-size: var(--text-3);
  font-weight: 600;
  color: var(--color-foreground, var(--text-primary));
}

.lf-label__required {
  color: var(--acc);
  margin-inline-start: var(--space-1);
}

.lf-input,
.lf-textarea {
  width: 100%;
  min-height: 44px; /* 触摸目标 ≥44px */
  padding-block: var(--space-3);
  padding-inline: var(--space-4);
  border: 1px solid var(--color-card-border, rgba(20, 30, 34, 0.14));
  border-radius: var(--radius-base);
  background: var(--color-background, var(--bg-white));
  color: var(--color-foreground, var(--text-primary));
  font-family: inherit;
  font-size: var(--text-5); /* ≥16px 防 iOS 聚焦缩放 */
  line-height: var(--leading-snug);
  transition: border-color var(--duration-fast) var(--ease-out),
    box-shadow var(--duration-fast) var(--ease-out);
}

.lf-input::placeholder,
.lf-textarea::placeholder {
  color: var(--color-text-muted, var(--text-secondary));
}

/* 聚焦朱砂环：box-shadow 双声明 fallback（rgba → color-mix，组织方式参照 section-advantages.css）；
   不覆盖 outline，全局 :focus-visible 朱砂环保留 */
.lf-input:focus-visible,
.lf-textarea:focus-visible {
  border-color: var(--acc);
  box-shadow: 0 0 0 3px rgba(200, 67, 43, 0.22); /* 不支持 color-mix 时的兜底 */
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--acc) 22%, transparent);
}

.lf-input[aria-invalid="true"],
.lf-textarea[aria-invalid="true"] {
  border-color: var(--acc);
}

.lf-textarea {
  min-height: 132px;
  resize: vertical;
}

/* select 对齐：UA 下拉控件忽略 line-height、盒高由内部控件撑起（实测 45px），
   比同契约 input/textarea 的实际高（16px×1.5 + 12px×2 + 1px×2 = 50px）矮 5px，
   桌面双列同行时底缘参差（Stage A CM-02）。补足 min-height 使两控件等高。 */
select.lf-input {
  min-height: 50px;
}

.lf-field-error {
  margin-block-start: var(--space-2);
  font-size: var(--text-3);
  color: var(--acc); /* 警示沿用朱砂系（G§02 不另造红色） */
}

.lf-form-alert {
  padding: var(--space-4) var(--space-5);
  border-radius: var(--radius-base);
  border-inline-start: 4px solid;
  font-size: var(--text-4);
  line-height: var(--leading-snug);
}

.lf-form-alert--success {
  border-color: var(--up); /* 正向/成功 = 青碧（G§02 语义色） */
  background: rgba(29, 158, 111, 0.1); /* 不支持 color-mix 时的兜底 */
  background: color-mix(in srgb, var(--up) 10%, transparent);
  color: var(--color-foreground, var(--text-primary));
}

.lf-form-alert--error {
  border-color: var(--acc);
  background: rgba(200, 67, 43, 0.08); /* 不支持 color-mix 时的兜底 */
  background: color-mix(in srgb, var(--acc) 8%, transparent);
  color: var(--acc);
}

/* FAQ 手风琴（原生 details/summary，统一 funding/partners 双定义）。
   现有行为核对：两侧 [open] 图标均 rotate(180deg)（仅 transform，§7 transform-performance）；
   duration 取 partners 的 200ms（--duration-base），图标色取 funding 的砖红（装饰图标旁有标题双通道） */
.lf-faq__item {
  background: var(--color-card-background, var(--soft));
  border: 1px solid var(--color-card-border, rgba(20, 30, 34, 0.08));
  border-radius: var(--radius-base);
}

.lf-faq__item + .lf-faq__item {
  margin-block-start: var(--space-3);
}

.lf-faq__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-5);
  min-height: 44px; /* 触摸目标 ≥44px */
  font-weight: 600;
  cursor: pointer;
  list-style: none; /* 移除原生 marker，改用自定义图标 */
}

.lf-faq__summary::-webkit-details-marker {
  display: none;
}

.lf-faq__summary::marker {
  content: none;
}

.lf-faq__icon {
  flex-shrink: 0;
  color: var(--acc); /* 装饰图标旁有标题文字双通道（G§02） */
  transition: transform var(--duration-base) var(--ease-out);
}

.lf-faq__item[open] .lf-faq__icon {
  transform: rotate(180deg); /* 仅 transform（§7 transform-performance） */
}

.lf-faq__answer {
  padding: 0 var(--space-5) var(--space-5);
  font-size: var(--text-5);
  color: var(--color-foreground, var(--text-primary));
  line-height: var(--leading-relaxed); /* 长文答案 1.7（对齐 funding 现有值） */
}

[dir="rtl"] .lf-faq__answer {
  line-height: var(--leading-rtl); /* RTL 阿拉伯扩展字形更宽松 */
}

/* 分页（统一 news-list/customer 双定义；类契约 = snippets/pagination.liquid 现有 BEM，另加箭头包裹层） */
.lf-pagination {
  margin-block-start: var(--space-10);
}

.lf-pagination__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: var(--space-2);
  list-style: none;
  margin: 0;
  padding: 0;
}

.lf-pagination__item {
  margin: 0;
}

.lf-pagination__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px; /* 触摸目标 ≥44px */
  padding-inline: var(--space-3);
  border-radius: var(--radius-sm);
  font-weight: 600;
  color: var(--color-foreground, var(--text-primary));
  text-decoration: none;
  transition: background-color var(--duration-fast) var(--ease-out),
    color var(--duration-fast) var(--ease-out);
}

.lf-pagination__link:hover {
  background: var(--color-card-background, var(--soft));
}

/* 当前页：主色实底白字（G§07 页签选中态 --pri 底白字；选中态 ≠ CTA，不用朱砂） */
.lf-pagination__link--current,
.lf-pagination__link--current:hover {
  background: var(--pri);
  color: var(--text-inverse);
}

.lf-pagination__link--arrow {
  padding-inline: 0;
  background: var(--color-card-background, var(--soft));
}

.lf-pagination__arrow {
  display: inline-flex;
}

.lf-pagination__ellipsis {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding-inline: var(--space-2);
  color: var(--color-text-secondary, var(--text-secondary));
}

/* 徽章基类（最小契约：胶囊 + 加粗 + 紧凑行高，字号/配色留给上下文用令牌） */
.lf-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  border-radius: var(--radius-pill);
  font-weight: 600;
  line-height: var(--leading-snug);
}

/* ---------- 8. 水印纹样容器（ui-ux-pro-max：装饰 ≤10% 不抢内容） ---------- */
.lf-watermark {
  position: absolute; /* 父容器需 position: relative */
  inset: 0;
  z-index: 0; /* 压在内容之下——内容层需 position: relative; z-index: 1（仅 DOM 顺序不够：定位元素绘制在 static 之上） */
  opacity: 0.1; /* ≤10%，learnings 设计规则 */
  pointer-events: none; /* 不拦截点击 */
  overflow: hidden;
}

/* ---------- 9. 间距工具类（RTL 逻辑属性优先） ----------
   水平方向一律逻辑属性 margin-inline-* / padding-inline-*；
   垂直方向用逻辑 margin-block-*；对称场景（居中）才允许物理等价写法 */

/* 外边距（inline 水平） */
.lf-mx-auto { margin-inline: auto; }
.lf-mx-1 { margin-inline: var(--space-1); }
.lf-mx-2 { margin-inline: var(--space-2); }
.lf-mx-4 { margin-inline: var(--space-4); }
.lf-mx-6 { margin-inline: var(--space-6); }
.lf-mx-8 { margin-inline: var(--space-8); }
.lf-mx-12 { margin-inline: var(--space-12); }

/* 外边距（inline-start / inline-end 单侧） */
.lf-ms-1 { margin-inline-start: var(--space-1); }
.lf-ms-2 { margin-inline-start: var(--space-2); }
.lf-ms-3 { margin-inline-start: var(--space-3); }
.lf-ms-4 { margin-inline-start: var(--space-4); }
.lf-ms-6 { margin-inline-start: var(--space-6); }
.lf-me-1 { margin-inline-end: var(--space-1); }
.lf-me-2 { margin-inline-end: var(--space-2); }
.lf-me-3 { margin-inline-end: var(--space-3); }
.lf-me-4 { margin-inline-end: var(--space-4); }
.lf-me-6 { margin-inline-end: var(--space-6); }

/* 外边距（block 垂直） */
.lf-my-1 { margin-block: var(--space-1); }
.lf-my-2 { margin-block: var(--space-2); }
.lf-my-4 { margin-block: var(--space-4); }
.lf-my-6 { margin-block: var(--space-6); }
.lf-my-8 { margin-block: var(--space-8); }
.lf-my-12 { margin-block: var(--space-12); }
.lf-mt-1 { margin-block-start: var(--space-1); }
.lf-mt-2 { margin-block-start: var(--space-2); }
.lf-mt-4 { margin-block-start: var(--space-4); }
.lf-mt-6 { margin-block-start: var(--space-6); }
.lf-mt-8 { margin-block-start: var(--space-8); }
.lf-mt-12 { margin-block-start: var(--space-12); }
.lf-mb-1 { margin-block-end: var(--space-1); }
.lf-mb-2 { margin-block-end: var(--space-2); }
.lf-mb-4 { margin-block-end: var(--space-4); }
.lf-mb-6 { margin-block-end: var(--space-6); }
.lf-mb-8 { margin-block-end: var(--space-8); }
.lf-mb-12 { margin-block-end: var(--space-12); }

/* 内边距（inline 水平） */
.lf-px-1 { padding-inline: var(--space-1); }
.lf-px-2 { padding-inline: var(--space-2); }
.lf-px-3 { padding-inline: var(--space-3); }
.lf-px-4 { padding-inline: var(--space-4); }
.lf-px-5 { padding-inline: var(--space-5); }
.lf-px-6 { padding-inline: var(--space-6); }
.lf-px-8 { padding-inline: var(--space-8); }

/* 内边距（inline-start / inline-end 单侧） */
.lf-ps-1 { padding-inline-start: var(--space-1); }
.lf-ps-2 { padding-inline-start: var(--space-2); }
.lf-ps-4 { padding-inline-start: var(--space-4); }
.lf-ps-6 { padding-inline-start: var(--space-6); }
.lf-pe-1 { padding-inline-end: var(--space-1); }
.lf-pe-2 { padding-inline-end: var(--space-2); }
.lf-pe-4 { padding-inline-end: var(--space-4); }
.lf-pe-6 { padding-inline-end: var(--space-6); }

/* 内边距（block 垂直） */
.lf-py-1 { padding-block: var(--space-1); }
.lf-py-2 { padding-block: var(--space-2); }
.lf-py-3 { padding-block: var(--space-3); }
.lf-py-4 { padding-block: var(--space-4); }
.lf-py-6 { padding-block: var(--space-6); }
.lf-py-8 { padding-block: var(--space-8); }
.lf-py-12 { padding-block: var(--space-12); }
.lf-pt-1 { padding-block-start: var(--space-1); }
.lf-pt-2 { padding-block-start: var(--space-2); }
.lf-pt-4 { padding-block-start: var(--space-4); }
.lf-pt-6 { padding-block-start: var(--space-6); }
.lf-pt-8 { padding-block-start: var(--space-8); }
.lf-pb-1 { padding-block-end: var(--space-1); }
.lf-pb-2 { padding-block-end: var(--space-2); }
.lf-pb-4 { padding-block-end: var(--space-4); }
.lf-pb-6 { padding-block-end: var(--space-6); }
.lf-pb-8 { padding-block-end: var(--space-8); }
.lf-pb-12 { padding-block-end: var(--space-12); }

/* ---------- 10. 布局工具类（少量） ---------- */
.lf-flex { display: flex; }
.lf-inline-flex { display: inline-flex; }
.lf-grid { display: grid; }
.lf-flex-col { flex-direction: column; }
.lf-flex-wrap { flex-wrap: wrap; }
.lf-items-center { align-items: center; }
.lf-items-start { align-items: flex-start; }
.lf-justify-center { justify-content: center; }
.lf-justify-between { justify-content: space-between; }
.lf-gap-1 { gap: var(--space-1); }
.lf-gap-2 { gap: var(--space-2); }
.lf-gap-3 { gap: var(--space-3); }
.lf-gap-4 { gap: var(--space-4); }
.lf-gap-6 { gap: var(--space-6); }
.lf-gap-8 { gap: var(--space-8); }

.lf-relative { position: relative; }
.lf-absolute { position: absolute; }
.lf-hidden { display: none; }
.lf-w-full { width: 100%; }
.lf-h-full { height: 100%; }

/* 绝对定位锚点：逻辑起点（LTR=left / RTL=right，自动镜像） */
.lf-anchor-start {
  position: absolute;
  inset-inline-start: 0;
}

/* ---------- 11. RTL 覆盖组（ug 等从右向左语言，[dir="rtl"] 挂 html） ---------- */
/* 方向性图标/箭头镜像翻转 */
[dir="rtl"] .lf-rtl-flip {
  transform: scaleX(-1);
}

/* 阿拉伯扩展/维吾尔文字形高耸且 descender 多，行高需比拉丁文字更宽松 */
[dir="rtl"] .lf-rtl-text {
  line-height: var(--leading-rtl);
}

/* 阿拉伯字母字形高耸且 descender 多，标题行高需比拉丁 1.25 宽松 */
[dir="rtl"] :is(h1, h2, h3, h4, h5, h6) {
  line-height: 1.4;
}

/* 逻辑文本对齐兜底（老浏览器不支持 text-align: start 时） */
[dir="rtl"] .lf-text-start { text-align: right; }
[dir="rtl"] .lf-text-end { text-align: left; }

/* ---------- 11b. 滚动渐入契约（spec-g §08 .rev→in .8s；animations.js 挂 visible 类） ----------
   初始态缺失导致渐入无效 —— v2.2 补齐：观察目标初始 opacity 0 + 下移 26px，
   进入视口由 animations.js 加 .lf-fade-in--visible（0.8s var(--ease)，阈值 12%） */
.section-fade-in,
[data-lf-fade-in] {
  opacity: 0;
  transform: translateY(26px) scale(0.985); /* v2.3：入场微缩放，落定还原 */
  transition: opacity var(--duration-reveal) var(--ease),
    transform var(--duration-reveal) var(--ease);
}

.lf-fade-in--visible {
  opacity: 1;
  transform: none;
}

/* stagger 子项：同样初始隐藏，进入视口由 animations.js 按 80ms 阶梯加可见类
   （revealAll 降级路径覆盖 reduced-motion / 无 IO，保底可见） */
.stagger-item {
  opacity: 0;
  transform: translateY(26px) scale(0.985); /* v2.3：同入场微缩放 */
  transition: opacity var(--duration-reveal) var(--ease),
    transform var(--duration-reveal) var(--ease);
}

.stagger-item.lf-fade-in--visible {
  opacity: 1;
  transform: none;
}

/* ---------- 11c. 交互动效（v2.3） ---------- */

/* 按压反馈：点击瞬间轻微压缩（120ms，--duration-fast 档） */
.lf-btn:active {
  transform: scale(0.97);
}

/* 数字落定弹跳：count-up 完成后由 animations.js 加类（一次性 .45s） */
@keyframes lf-count-bounce {
  0% { transform: scale(1); }
  35% { transform: scale(1.05); }
  60% { transform: scale(0.995); }
  100% { transform: scale(1); }
}

.lf-countup--done {
  animation: lf-count-bounce 0.45s var(--ease);
}

.lf-countup--done:hover {
  animation: none;
}

/* 页面滚动进度线：顶部 2px 朱砂渐变，transform scaleX（GPU，滚动联动） */
.lf-scroll-progress {
  position: fixed;
  inset-block-start: 0;
  inset-inline-start: 0;
  inset-inline-end: 0;
  height: 2px;
  z-index: 95;
  background: linear-gradient(90deg, var(--acc), var(--acc-hi)); /* 朱砂渐变（装饰，注释来源） */
  transform: scaleX(0);
  transform-origin: left;
  pointer-events: none;
}

[dir="rtl"] .lf-scroll-progress {
  transform-origin: right;
}

/* ---------- 12. 动效降级（ui-ux-pro-max §1 reduced-motion） ---------- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ---------- 13. 锚点定位补偿：sticky header 不遮住跳转目标 ---------- */
:target {
  scroll-margin-block-start: 84px; /* header 高 68px + 呼吸间距 */
}

/* ---------- 13. 无障碍跳过链接（保留任务 1，改逻辑定位 + 达标对比度） ---------- */
.skip-to-content-link {
  position: absolute;
  inset-inline-start: -9999px; /* 视口外隐藏 */
}

.skip-to-content-link:focus {
  position: fixed;
  inset-inline-start: 0.5rem;
  inset-block-start: 0.5rem;
  z-index: 9999;
  padding: var(--space-2) var(--space-4);
  background: var(--bg-white);
  color: var(--text-primary); /* 白底深字 ≈21:1 ✓（原金字 2.3:1 不达标，已修正） */
  box-shadow: var(--shadow-lift);
}