/* ==========================================================================
   见一见 · 官方静态官网共享样式表
   --------------------------------------------------------------------------
   硬约束（改动前必读）：
   1. 零外部依赖 —— 本文件不得出现 @import、url() 外链、远程字体。
      全部图标为 HTML 内联 SVG，全部字体走系统栈。
   2. 阴影一律基于 rgba(214,148,130,α)，禁止纯黑 rgba(0,0,0,α) / #000 阴影。
   3. 正文与条款文字一律 #3E2C2A，--brown-3 仅供装饰（分隔线、占位框描边），
      禁止用于任何文字（对比度不足 4.5:1）。
   4. 圆角仅四档：--r1(14) / --r2(22) / --r3(28) / --r-pill(999)。
   5. 断点：移动优先，仅 @media (min-width: 768px) 与 (min-width: 1024px)。
   ========================================================================== */

:root {
  /* 色板 —— 与 web_privacy/ 及 lib/theme/app_theme.dart 保持一致 */
  --cream: #FFF8F4;/* 页面背景 · 奶油底 */
  --card: #FFFFFF;       /* 卡片 / 导航 / 页脚块背景 */
  --brown: #3E2C2A;      /* 主文本 · 深暖棕（12.6:1） */
  --brown-2: #8A6E68;    /* 次要文本（5.3:1，仅 ≥14px） */
  --brown-3: #B9A29C;    /* 仅装饰：分隔线、占位框描边。禁用于文字 */
  --orange: #FFA07E;     /* 渐变起 · 暖橙（不可作文字色） */
  --pink: #FF7E9D;       /* 渐变止 · 暖粉（不可作文字色） */
  --shadow: rgba(214, 148, 130, 0.35);       /* 柔和暖影 · 低层级 */
  --shadow-deep: rgba(214, 148, 130, 0.45);  /* 柔和暖影 · 深层级 */
  --line: #E8D8D0;       /* 描边 / 分隔线 */
  --safety-bg: #FFF1E6;  /* 提示块底（.verdict / th） */
  --accent-ink: #B35A3C; /* 警示 / 审核附录标题（4.6:1，仅 ≥15px） */

  /* 圆角四档 */
  --r1: 14px;
  --r2: 22px;
  --r3: 28px;
  --r-pill: 999px;

  /* 阴影三档 */
  --sh-low: 0 4px 18px var(--shadow);
  --sh-mid: 0 6px 24px var(--shadow);
  --sh-high: 0 8px 28px var(--shadow-deep);

  /* 字号阶梯 */
  --fs-h1: 24px;
  --fs-h2: 20px;
  --fs-h3: 17px;
  --fs-body: 16px;
  --fs-clause: 15.5px;
  --fs-badge: 13px;
  --fs-meta: 14px;
  --fs-foot: 13px;

  --grad: linear-gradient(90deg, var(--orange), var(--pink));
}

/* ==========================================================================
   兼容别名层 —— 首页专用
   --------------------------------------------------------------------------
   原有样式表用的是 --cream / --brown / --r2 这套命名，
   首页为了与同系列另外两个官网（见一见 / 附近寻聊）保持一致的写法，
   用了 --bg / --text / --brand-grad / --rXl 这套别名。
   这里做一次映射，两套命名都能用，避免改动原有的法务页样式。
   ========================================================================== */
:root {
  --bg: var(--cream);
  --bg-deep: #FBEEE7;
  --text: var(--brown);
  --text-2: var(--brown-2);
  --text-3: var(--brown-3);
  --coral: #FF8A76;
  --rose: var(--pink);
  --peach: #FFA98C;
  --brand-grad: linear-gradient(135deg, #FFA07E 0%, #FF7E9D 100%);
  --text-grad: linear-gradient(120deg, #F2705A 0%, #EE5F86 60%, #F58AA8 100%);
  --line: rgba(255, 220, 208, .75);
  --line-soft: rgba(255, 228, 218, .9);
  --radius: var(--r2);
  --rLg: var(--r2);
  --rXl: var(--r3);
  --sh-sm: var(--sh-low);
  --sh-md: var(--sh-mid);
  --sh-lg: var(--sh-high);
  --pageH: 24px;
  --gapMd: 12px;
  --gapLg: 20px;
  --gapXl: 34px;
}

/* 首页共用工具类（原样式表没有这些名字） */
.topbar { position: sticky; top: 0; z-index: 50; background: rgba(255, 248, 244, .92);
  backdrop-filter: saturate(180%) blur(14px); -webkit-backdrop-filter: saturate(180%) blur(14px);
  border-bottom: 1px solid var(--line-soft); }
.topbar-in { display: flex; align-items: center; gap: 28px; height: 62px; }
.brand { display: flex; align-items: center; gap: 10px; font-weight: 800; font-size: 19px;
  color: var(--text); text-decoration: none; flex: 0 0 auto; }
.brand:hover { text-decoration: none; }
.brand img { width: 30px; height: 30px; border-radius: 8px; display: block; }
.nav { display: flex; gap: 4px; margin-left: auto; flex-wrap: wrap; }
.nav a { padding: 7px 13px; border-radius: 9px; font-size: 14.5px; font-weight: 600;
  color: var(--text-2); text-decoration: none; transition: background .18s, color .18s; }
.nav a:hover { background: rgba(255,168,140,.12); color: var(--coral); text-decoration: none; }
.nav a.on { background: rgba(255,168,140,.16); color: var(--coral); }
@media (max-width: 860px) {
  .topbar-in { height: auto; padding: 10px 0; flex-wrap: wrap; gap: 10px; }
  .nav { margin-left: 0; width: 100%; gap: 2px; }
  .nav a { padding: 6px 10px; font-size: 13.5px; }
}

.wrap { max-width: 1080px; margin: 0 auto; padding: 0 24px; }
.sec { padding: 62px 0; }
.sec-alt { background: var(--card); border-block: 1px solid var(--line-soft); }
.sec-head { max-width: 720px; margin-bottom: 34px; }
.sec-head p { margin: 10px 0 0; color: var(--text-2); font-size: 15.5px; line-height: 1.85; }
.gt { margin: 0 0 12px; font-size: clamp(23px, 3.6vw, 30px); font-weight: 800; letter-spacing: -.3px; }
.eyebrow { display: inline-flex; align-items: center; gap: 6px; padding: 5px 13px;
  border-radius: 20px; background: rgba(255,255,255,.8); border: 1px solid var(--line-soft);
  font-size: 12.5px; font-weight: 700; color: var(--text-3); }
.eyebrow svg { color: var(--peach); }
.grad-text { background: var(--text-grad); -webkit-background-clip: text;
  background-clip: text; color: transparent; }

.foot { margin-top: 70px; padding: 40px 0 34px; background: var(--card);
  border-top: 1px solid var(--line-soft); }
/* 兼容别名层的页脚栅格。原样式表后面还有一条 .foot-grid { grid-template-columns: 1fr }
   （给法务页的 .foot-col 用），同名类会互相覆盖。
   所以这里改用「直接子元素」选择器提高优先级，只作用于首页那 4 列。 */
.wrap > .foot-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 30px; }
@media (max-width: 860px) { .wrap > .foot-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .wrap > .foot-grid { grid-template-columns: 1fr; } }
.foot-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 30px; }
.foot h4 { margin: 0 0 12px; font-size: 14px; font-weight: 800; color: var(--text); }
.foot ul { margin: 0; padding: 0; list-style: none; }
.foot li { margin-bottom: 8px; }
.foot li a { color: var(--text-2); font-size: 14px; }
.foot li a:hover { color: var(--coral); }
.foot-about { font-size: 13.5px; color: var(--text-3); line-height: 1.8; max-width: 320px; }
.foot-btm { margin-top: 30px; padding-top: 20px; border-top: 1px solid var(--line-soft);
  font-size: 12.5px; color: var(--text-3); display: flex;
  justify-content: space-between; gap: 14px; flex-wrap: wrap; }

.top { position: fixed; right: 22px; bottom: 22px; width: 44px; height: 44px;
  border-radius: 50%; background: #fff; border: 1px solid var(--line);
  box-shadow: var(--sh-md); display: grid; place-items: center; color: var(--coral);
  cursor: pointer; opacity: 0; pointer-events: none; transition: opacity .2s; z-index: 60; }
.top.show { opacity: 1; pointer-events: auto; }

* { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  /* 锚点跳转平滑；仅在用户未要求减少动效时启用（见文件末尾） */
}

body {
  margin: 0;
  background: var(--cream);
  color: var(--brown);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
    "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue",
    Arial, sans-serif;
  font-size: var(--fs-body);
  line-height: 1.85;
  -webkit-font-smoothing: antialiased;
}

/* 顶部暖橙→暖粉渐变装饰条，与 App 主色一致 */
.topbar {
  height: 8px;
  background: var(--grad);
}

/* ---------------------------------------------------------------- 布局容器 */
.wrap {
  max-width: 760px;          /* 法律页：窄栏，长文易读 */
  margin: 0 auto;
  padding: 20px 14px 48px;
}

.wrap-wide {
  max-width: 1080px;         /* 首页：宽栏，容纳 4 列卡片 */
}

/* ------------------------------------------------------------ 站点导航 */
/* 规格 2.1：吸顶白底 + 底部 1px 细线，5 页互相全链，纯静态链接、零 JS */
nav.site-nav {
  position: sticky;
  top: 0;
  z-index: 10;
  background: var(--card);
  border-bottom: 1px solid var(--line);
}

.site-nav .nav-inner {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 14px;
  height: 52px;               /* 移动端 52px */
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--brown);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.4px;
  text-decoration: none;
  white-space: nowrap;
  /* 最小点击区 44×44 */
  min-height: 44px;
}

.brand svg { display: block; flex: none; }

/* 桌面端链接行（移动端隐藏） */
.nav-links {
  display: none;
  align-items: center;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.nav-links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;          /* 最小点击区 */
  padding: 0 11px;
  color: var(--brown);
  font-size: var(--fs-meta);
  text-decoration: none;
  border-bottom: 2px solid transparent;
  border-radius: var(--r1);
  transition: color .2s, border-color .2s, background-color .2s;
}

.nav-links a:hover {
  color: var(--pink);
  border-bottom-color: var(--pink);
  background: var(--cream);
}

/* 当前页标识：下划线用暖橙（装饰色），文字用 --accent-ink。
   规格 2.1 要求「橙色 + 下划线」，但规格 5.6 硬规则禁止 --orange 承载文字
   （14px on 白仅 1.98:1）。因此保留橙色下划线作为非文字标识，
   文字改用 --accent-ink #B35A3C（4.72:1，通过），并加粗以加强辨识。 */
.nav-links a[aria-current="page"] {
  color: var(--accent-ink);
  border-bottom-color: var(--orange);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* 移动端抽屉：<details> 实现，零 JS（规格 2.1 / 5.8） */
.nav-drawer { position: relative; }

.nav-drawer > summary {
  list-style: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;                /* 最小点击区 */
  height: 44px;
  color: var(--brown);
  font-size: 17px;
  border: 1px solid var(--line);
  border-radius: var(--r1);
  background: var(--card);
  cursor: pointer;
  user-select: none;
}

.nav-drawer > summary::-webkit-details-marker { display: none; }

.nav-drawer[open] > summary {
  color: var(--pink);
  border-color: var(--pink);
}

.nav-drawer ul {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 20;
  min-width: 168px;
  margin: 0;
  padding: 6px;
  list-style: none;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r2);
  box-shadow: var(--sh-high);
}

.nav-drawer ul a {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 0 12px;
  color: var(--brown);
  font-size: var(--fs-meta);
  text-decoration: none;
  border-radius: var(--r1);
}

.nav-drawer ul a:hover { background: var(--cream); color: var(--pink); }

.nav-drawer ul a[aria-current="page"] {
  /* 底色用白card 而非 --safety-bg：--accent-ink 在 --safety-bg 上仅 4.27:1
     （低于 4.5），在白card 上为 4.72:1，通过。左侧橙色竖条保留暖橙标识。 */
  color: var(--accent-ink);
  font-weight: 700;
  background: var(--card);
  box-shadow: inset 3px 0 0 var(--orange);
}

/* -------------------------------------------------------------- 首屏 Hero */
header.hero {
  background: var(--card);
  border-radius: var(--r2);
  padding: 22px 18px;
  box-shadow: var(--sh-mid);
  margin-top: 18px;
}

.badge {
  display: inline-block;
  padding: 4px 12px;
  border-radius: var(--r-pill);
  font-size: var(--fs-badge);
  font-weight: 700;
  line-height: 1.6;
  color: var(--brown);        /* 渐变底上的文字用深棕，不用白字，保证对比度 */
  background: var(--grad);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .55);
}

h1 {
  margin: 14px 0 6px;
  font-size: var(--fs-h1);
  line-height: 1.4;
  letter-spacing: 0.5px;
}

.verdict {
  margin: 16px 0 0;
  padding: 14px 16px;
  background: var(--safety-bg);
  border-left: 4px solid var(--orange);
  border-radius: var(--r1);
  font-size: var(--fs-meta);
  line-height: 1.8;
}

.verdict strong { color: var(--brown); }

.meta {
  margin: 14px 0 0;
  font-size: var(--fs-meta);
  color: var(--brown-2);
}

.meta span + span::before {
  content: "·";
  margin: 0 8px;
  color: var(--brown-3);
}

/* -------------------------------------------------------------- 首页布局 */
/* 首页 Hero 两栏（规格 2.2）：桌面文字左 / 日历图标卡右，移动端上下堆叠 */
.hero-split {
  display: grid;
  gap: 20px;
  align-items: center;
}

.hero-copy p { margin: 14px 0 0; }

.hero-copy .lead {
  font-size: var(--fs-body);
  line-height: 1.9;
}

/* 日历图标卡：纯 CSS 圆角方块 + 内联 SVG，无任何图片外链 */
.icon-card {
  display: grid;
  place-items: center;
  min-height: 190px;
  padding: 22px;
  background: var(--grad);
  border-radius: var(--r3);
  box-shadow: var(--sh-mid);
}

.icon-card svg { display: block; }

/* CTA 按钮组 */
.cta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 18px;
  margin: 22px 0 0;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 22px;
  border-radius: var(--r-pill);
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  transition: color .2s, border-color .2s, background-color .2s;
}

.btn-primary {
  color: var(--brown);        /* 深棕字压渐变底，对比度达标 */
  background: var(--grad);
  border: 1px solid var(--orange);
  box-shadow: var(--sh-low);
}

.btn-primary:hover {
  color: var(--brown);
  border-color: var(--pink);
  box-shadow: var(--sh-mid);
}

.btn-ghost {
  color: var(--brown);
  background: var(--card);
  border: 1px solid var(--line);
}

.btn-ghost:hover { border-color: var(--pink); color: var(--pink); }

/* 区块通用 */
.block { margin-top: 26px; }

.block > h2 {
  margin: 0 0 6px;
  padding-left: 12px;
  font-size: var(--fs-h2);
  line-height: 1.5;
  border-left: 4px solid;
  border-image: var(--grad) 1;
}

.block > .sub {
  margin: 0 0 16px;
  padding-left: 16px;
  color: var(--brown-2);
  font-size: var(--fs-meta);
}

/* 功能特性卡（规格 2.3）：移动单列 → 768px 两列 → 1024px 四列 */
.grid-features {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.feature-card {
  padding: 20px 18px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r2);
  box-shadow: var(--sh-low);
}

.feature-card .ico {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  margin-bottom: 12px;
  background: var(--safety-bg);
  border-radius: var(--r1);
}

.feature-card .ico svg { display: block; }

.feature-card h3 {
  margin: 0 0 6px;
  font-size: var(--fs-h3);
  line-height: 1.6;
}

.feature-card > p {
  margin: 0 0 12px;
  font-size: var(--fs-meta);
  color: var(--brown);
}

.feature-card ul {
  margin: 0;
  padding-left: 20px;
  font-size: var(--fs-meta);
  color: var(--brown-2);
}

.feature-card li { margin: 0 0 6px; }

.feature-card li:last-child { margin-bottom: 0; }

/* 隐私与合规卖点：三问三答（规格 2.4） */
.grid-qa {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.qa {
  padding: 18px 16px;
  background: var(--card);
  border-radius: var(--r2);
  box-shadow: var(--sh-low);
}

.qa h3 {
  margin: 0 0 8px;
  font-size: var(--fs-h3);
  line-height: 1.6;
}

.qa p {
  margin: 0;
  font-size: var(--fs-meta);
  color: var(--brown);
}

/* 技术事实清单：前置加粗小标题 */
.facts {
  margin: 14px 0 0;
  padding: 20px 18px;
  background: var(--card);
  border-radius: var(--r2);
  box-shadow: var(--sh-low);
}

.facts > li {
  margin: 0 0 12px;
  font-size: var(--fs-meta);
  color: var(--brown);
}

.facts > li:last-child { margin-bottom: 0; }

.facts ol {
  margin: 0;
  padding-left: 22px;
}

.facts ol li { margin: 0 0 8px; }

.facts ol li:last-child { margin-bottom: 0; }

/* 高亮结论块 */
.verdict-block {
  margin: 16px 0 0;
  padding: 18px;
  background: var(--safety-bg);
  border-left: 4px solid var(--pink);
  border-radius: var(--r1);
  font-size: var(--fs-meta);
  line-height: 1.85;
}

/* 截图占位框（规格 1.4）：浅奶油底 + 虚线描边 + 居中说明文字 */
.grid-shots {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
}

.shot { margin: 0; }

.shot .frame {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 10px;
  width: 100%;
  max-width: 260px;
  aspect-ratio: 430 / 880;
  margin: 0 auto;
  padding: 18px 14px;
  text-align: center;
  background: var(--cream);
  border: 2px dashed var(--brown-3);   /* --brown-3 仅装饰 */
  border-radius: 18px;
}

.shot .frame .ph-title {
  font-size: var(--fs-meta);
  font-weight: 700;
  color: var(--brown);
}

.shot .frame .ph-note {
  font-size: 12.5px;
  line-height: 1.7;
  /* 占位框底色是奶油底 #FFF8F4，--brown-2 在此底上仅 4.43:1（低于 4.5），
     而本行只有 12.5px 属小文本，故改用 --brown（12.5:1）。 */
  color: var(--brown);
}

.shot figcaption {
  max-width: 260px;
  margin: 10px auto 0;
  text-align: center;
  font-size: var(--fs-meta);
  line-height: 1.7;
  color: var(--brown-2);
}

/* 平台徽标 + 下载按钮（规格 2.6） */
.platforms {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 14px 0 0;
}

.pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 14px;
  border: 1px solid var(--line);
  border-radius: var(--r-pill);
  background: var(--cream);
  font-size: var(--fs-badge);
  font-weight: 700;
  color: var(--brown);
}

.pill svg { display: block; flex: none; }

.version-line {
  margin: 0;
  font-size: var(--fs-meta);
  color: var(--brown);
}

.note-line {
  margin: 10px 0 0;
  font-size: var(--fs-meta);
  color: var(--brown-2);
}

/* ------------------------------------------------------------------ 目录 */
nav.toc {
  margin: 20px 0 0;
  padding: 16px 18px;
  background: var(--card);
  border-radius: var(--r2);
  box-shadow: var(--sh-low);
}

nav.toc p {
  margin: 0 0 10px;
  font-size: var(--fs-meta);
  font-weight: 700;
  color: var(--brown-2);
}

nav.toc ol {
  margin: 0;
  padding-left: 20px;
  columns: 1;
  column-gap: 24px;
  font-size: var(--fs-meta);
}

nav.toc li { margin: 2px 0; break-inside: avoid; }

nav.toc a {
  color: var(--brown);
  text-decoration: none;
  border-bottom: 1px solid var(--line);
  display: inline-block;
  padding: 2px 0;
}

nav.toc a:hover { border-bottom-color: var(--pink); }

/* -------------------------------------------------------------- 法律正文 */
section {
  margin-top: 18px;
  padding: 20px 16px;
  background: var(--card);
  border-radius: var(--r2);
  box-shadow: var(--sh-low);
}

section > h2 {
  margin: 0 0 14px;
  font-size: 19px;
  line-height: 1.5;
  padding-left: 12px;
  border-left: 4px solid;
  border-image: linear-gradient(180deg, var(--orange), var(--pink)) 1;
}

section > h2 + p { margin-top: 0; }

section p { margin: 0 0 12px; }

section p:last-child { margin-bottom: 0; }

.clauses {
  margin: 0;
  padding-left: 22px;
}

.clauses li {
  margin: 0 0 10px;
  font-size: var(--fs-clause);
  line-height: 1.9;
}

.clauses li:last-child { margin-bottom: 0; }

code {
  padding: 1px 6px;
  border-radius: var(--r1);
  background: var(--safety-bg);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.9em;
  color: var(--brown);
}

/* 审核附录：与政策正文视觉区分 */
section.appendix {
  border: 1px dashed var(--orange);
  background: #FFFCFA;
}

section.appendix > h2 {
  border-left: none;
  padding-left: 0;
  color: var(--accent-ink);
}

.appendix .tag {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 10px;
  border-radius: var(--r-pill);
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  background: var(--accent-ink);
  vertical-align: middle;
}

.divider {
  height: 1px;
  margin: 20px 0 0;
  background: linear-gradient(90deg, transparent, var(--line), transparent);
}

table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 14px;
  font-size: var(--fs-meta);
}

caption {
  text-align: left;
  font-weight: 700;
  color: var(--brown);
  padding: 14px 0 6px;
}

th, td {
  border: 1px solid var(--line);
  padding: 9px 10px;
  text-align: left;
  vertical-align: top;
}

th {
  background: var(--safety-bg);
  font-weight: 700;
}

.no {
  color: var(--accent-ink);
  font-weight: 700;
  white-space: nowrap;
}

/* ------------------------------------------------------------------ 页脚 */
/* 备案号必须在每一个页面的 footer 内展示（规格 2.7，工信部要求） */
footer.site-foot {
  margin-top: 26px;
  background: var(--card);
  border-top: 1px solid var(--line);
  border-radius: var(--r2);
  padding: 22px 18px;
  font-size: var(--fs-foot);
  line-height: 1.8;
  color: var(--brown-2);
}

.foot-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
}

.foot-col > h2 {
  margin: 0 0 8px;
  font-size: var(--fs-foot);
  font-weight: 700;
  color: var(--brown);
}

.foot-col p { margin: 0 0 6px; }

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

.foot-col li { margin: 0 0 4px; }

.foot-bottom {
  margin: 18px 0 0;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  font-size: var(--fs-foot);
  color: var(--brown-2);
}

.foot-bottom p { margin: 0 0 4px; }

/* ------------------------------------------------------------------ 链接 */
/* 正文内链接统一深棕 + 底线，不用浏览器默认纯蓝 */
a {
  color: var(--brown);
  text-decoration: none;
  border-bottom: 1px solid var(--line);
  transition: color .2s, border-color .2s;
}

a:hover { color: var(--pink); border-bottom-color: var(--pink); }

/* 焦点态：不得outline: none */
a:focus-visible,
summary:focus-visible {
  outline: 2px solid var(--pink);
  outline-offset: 2px;
}

.foot-col a,
.foot-bottom a { color: var(--brown-2); }

.foot-col a:hover,
.foot-bottom a:hover { color: var(--pink); }

.mail { color: var(--brown); font-weight: 700; }

/* 纯文字徽标（如"附加披露"外的行内标签） */
.soft-note { font-size: var(--fs-meta); color: var(--brown-2); }

/* ============================================================ 断点：≥768px */
@media (min-width: 768px) {
  .wrap { max-width: 760px; padding: 28px 20px 64px; }
  .wrap-wide { max-width: 1080px; }

  nav.site-nav .nav-inner { height: 56px; padding: 0 20px; }

  /* 桌面端显示链接行、隐藏抽屉按钮 */
  .nav-links { display: flex; }
  .nav-drawer { display: none; }

  h1 { font-size: 28px; }

  header.hero { padding: 28px 24px; }

  .verdict { font-size: 15px; }

  section { padding: 24px 22px; }
  section > h2 { font-size: 20px; }

  nav.toc ol { columns: 2; }

  .block { margin-top: 34px; }

  /* 功能卡两列 / 截图两列 / 三问两列 */
  .grid-features,
  .grid-shots,
  .grid-qa { grid-template-columns: repeat(2, 1fr); }

  .icon-card { min-height: 240px; }

  footer.site-foot { padding: 26px 24px; }

  .foot-grid { grid-template-columns: repeat(3, 1fr); gap: 26px; }
}

/* =========================================================== 断点：≥1024px */
@media (min-width: 1024px) {
  /* 首页 Hero 两栏：文字左 / 图标卡右 */
  .hero-split { grid-template-columns: 1fr 300px; gap: 40px; }

  /* 功能卡四列 / 截图四列 / 三问三列 */
  .grid-features { grid-template-columns: repeat(4, 1fr); }
  .grid-shots { grid-template-columns: repeat(4, 1fr); }
  .grid-qa { grid-template-columns: repeat(3, 1fr); }
}

/* ------------------------------------------------------------ 无障碍动效 */
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
    transition: none !important;
  }
  html { scroll-behavior: auto; }
}

/* -------------------------------------------------------------- 打印样式 */
/* 规格 5.7：去掉全部装饰（渐变条、阴影、目录胶囊、CTA 按钮、彩色底），
   保留纯黑字与白底，单条条款不跨页断开。
   实现要点：打印时必须**显式覆盖**每一个有色背景与彩色文字，
   因为 .badge/.verdict/th/code/.no/.mail 等都自带颜色，
   仅靠 body{color:#000;background:#fff} 不足以让整页变黑白。 */
@media print {
  /* 兜底：任何元素都不得有背景色与阴影 */
  body, body * {
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
    /* 打印统一黑白：所有描边转灰 */
    border-color: #ccc !important;
  }

  body {
    background: #fff !important;
    color: #000 !important;
    font-size: 12pt;
    line-height: 1.7;
  }

  /* 全部文字统一纯黑（含 .mail / code / .no / .meta / .pill / .badge 等） */
  body, body * {
    color: #000 !important;
  }

  /* 需要隐藏的装饰与交互件 */
  .topbar,
  nav.site-nav,
  nav.toc,
  .cta-row,
  .no-print,
  .nav-drawer,
  .icon-card,
  .badge {
    display: none !important;
  }

  /* 容器去掉圆角与内边距压缩，用 1px 描边替代阴影 */
  .wrap,
  .wrap-wide {
    max-width: none;
    padding: 0;
  }

  header.hero,
  section,
  .feature-card,
  .qa,
  .facts,
  .verdict,
  .verdict-block,
  footer.site-foot {
    box-shadow: none !important;
    border: 1px solid #ddd !important;
    border-radius: 0 !important;
    background: #fff !important;
    padding: 12pt;
    margin-top: 10pt;
  }

  /* 标题左侧渐变竖条改为中性灰（打印无渐变） */
  section > h2 {
    border-left: 2pt solid #999 !important;
    padding-left: 6pt;
    color: #000 !important;
  }

  .block > h2 {
    border-left: 2pt solid #999 !important;
    padding-left: 6pt;
  }

  /* 分隔线改灰；.meta 的间隔点与 .divider 的暖色渐变在打印时也转灰 */
  .divider,
  hr {
    background: #ddd !important;
  }

  .meta span + span::before {
    color: #666 !important;
  }

  /* 表格保留边框与浅灰表头以便阅读 */
  table,
  th,
  td {
    border-color: #bbb !important;
  }

  th {
    background: #f0f0f0 !important;
  }

  .tag {
    color: #fff !important;
    background: #666 !important;
  }

  /* 内联 SVG 的 fill / stroke 是**表现属性**，不受 body *{color} 影响，
     打印时必须单独转灰，否则功能图标会印成棕色。 */
  body svg,
  body svg * {
    fill: #666 !important;
    stroke: #666 !important;
  }

  /* 纯装饰性 SVG 打印时直接去掉 */
  .feature-card .ico {
    display: none !important;
  }

  th {
    background: #f0f0f0 !important;
  }

  a {
    color: #000 !important;
    border-bottom: 0 !important;
  }

  /* 打印时展开外链目标，仅 footer 可能含http 外链 */
  footer a[href^="http"]::after,
  .foot-bottom a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: 9pt;
    color: #555;
  }

  h1, h2, h3 { break-after: avoid; page-break-after: avoid; }
  section { break-inside: auto; }
  li { break-inside: avoid; }
  tr { break-inside: avoid; }

  .verdict { border-left-width: 3pt !important; }

  .foot-grid { grid-template-columns: repeat(3, 1fr); }

  @page { margin: 18mm 16mm; }
}

/* ==========================================================================
   见一见 · 官网首页专用样式（hp- 前缀）
   --------------------------------------------------------------------------
   追加于 2026 官网首页重写。仅供 index.html 使用。
   硬约束：
   1. 只追加，不修改上方任何既有规则 —— privacy / terms / offline /
      compliance 四个法律页仍在使用它们。
   2. 全部类名带 hp- 前缀，避免与既有类冲突。
   3. 只复用 :root 已有的变量与四档圆角，不引入新色值、不引入外链。
   4. 注意：上方 606 行有裸 `section {}` 规则会命中本页所有 <section>，
      本段用 .hp-sec 显式覆盖 padding / 背景 / 阴影 / 圆角以脱离该默认样式。
   5. 文字色只用 --brown / --brown-2 / --accent-ink，
      绝不把 --brown-3 / --orange / --pink 用作文字色（对比度不足）。
   ========================================================================== */

/* ------------------------------------------------------------- 首页 Hero */
.hp-hero {
  /* 覆盖裸 section{} 默认样式 */
  padding: 26px 18px 22px;
  margin: 18px 0 0;
  background: var(--card);
  border-radius: var(--r3);
  box-shadow: var(--sh-mid);

  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  align-items: center;
}

.hp-hero h1 {
  margin: 12px 0 0;
  font-size: 26px;
  line-height: 1.42;
  letter-spacing: 0.3px;
}

.hp-lead {
  margin: 14px 0 0;
  font-size: var(--fs-body);
  line-height: 1.9;
  color: var(--brown);
}

.hp-hero-cta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
  margin: 22px 0 0;
}

/* Hero 数字条：48 / 6 / 0 / 0 */
.hp-numbers {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin: 24px 0 0;
  padding: 16px 4px 0;
  list-style: none;
  border-top: 1px solid var(--line);
}

.hp-numbers li { margin: 0; }

.hp-numbers strong {
  display: block;
  font-size: 24px;
  line-height: 1.3;
  color: var(--accent-ink);
  letter-spacing: 0.5px;
}

.hp-numbers span {
  display: block;
  font-size: var(--fs-badge);
  line-height: 1.6;
  color: var(--brown-2);
}

/* ------------------------------------------------- Hero 右侧 App 示意屏 */
/* 纯 HTML + 内联 SVG 画的示意屏，非真实截图，正式版将替换为真机截图 */
.hp-mock {
  position: relative;
  width: 100%;
  max-width: 320px;
  margin: 0 auto;
  padding: 0 0 10px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r3);
  box-shadow: var(--sh-high);
  overflow: hidden;
}

.hp-mock-bar {
  height: 6px;
  background: var(--grad);
}

.hp-mock-pad { padding: 18px 16px 6px; }

.hp-mock-kicker {
  margin: 0;
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--brown-2);
}

.hp-mock-digits {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 7px;
  margin: 10px 0 16px;
}

.hp-mock-d {
  padding: 9px 2px 7px;
  text-align: center;
  background: var(--cream);
  border-radius: var(--r1);
}

.hp-mock-d-last {
  background: var(--grad);
}

.hp-mock-n {
  display: block;
  font-size: 21px;
  font-weight: 700;
  line-height: 1.25;
  color: var(--brown);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.3px;
}

/* 单位文字在奶油底小块上：--brown-2 仅 4.43:1，改用 --brown */
.hp-mock-u {
  display: block;
  font-size: 11px;
  line-height: 1.5;
  color: var(--brown);
}

/* 渐变块上的单位改用深棕：--brown-2 在橙粉渐变上对比度不足 */
.hp-mock-d-last .hp-mock-u { color: var(--brown); }

.hp-mock-row {
  padding: 12px 13px;
  margin-bottom: 10px;
  background: var(--cream);
  border-radius: var(--r1);
}

.hp-mock-row-top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.hp-mock-row-title {
  font-size: var(--fs-badge);
  font-weight: 700;
  color: var(--brown);
}

/* 进度数字在奶油底行块上：同样由 --brown-2 改为 --brown */
.hp-mock-row-num {
  font-size: 12px;
  color: var(--brown);
  white-space: nowrap;
}

/* 清单进度条：轨道用 --line，填充用暖橙渐变 */
.hp-mock-bar-track {
  height: 7px;
  margin: 9px 0 8px;
  background: var(--line);
  border-radius: var(--r-pill);
  overflow: hidden;
}

.hp-mock-bar-track i {
  display: block;
  height: 100%;
  background: var(--grad);
  border-radius: var(--r-pill);
}

.hp-mock-done {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  font-size: 12px;
  line-height: 1.6;
  color: var(--brown);
}

.hp-mock-done svg { flex: none; }

.hp-mock-topic {
  margin: 9px 0 0;
  padding: 9px 11px;
  font-size: 12.5px;
  line-height: 1.7;
  color: var(--brown);
  background: var(--card);
  border-left: 3px solid var(--orange);
  border-radius: var(--r1);
}

.hp-mock-note {
  margin: 0;
  padding-top: 4px;
  text-align: center;
  font-size: 11.5px;
  line-height: 1.6;
  color: var(--brown-2);
}

/* ------------------------------------------------------------ 首页区块通用 */
.hp-sec {
  /* 覆盖裸 section{} 的默认卡片样式：改为通栏、去掉内阴影 */
  padding: 0;
  margin: 44px 0 0;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
}

.hp-sec-head { margin: 0 0 18px; }

.hp-sec-head h2 {
  margin: 0 0 8px;
  padding-left: 13px;
  font-size: 21px;
  line-height: 1.5;
  border-left: 4px solid;
  border-image: var(--grad) 1;
}

/* 副标题在奶油底上：--brown-2 在此底仅 4.43:1（低于 4.5），故改用 --brown */
.hp-sec-head > p {
  margin: 0;
  padding-left: 17px;
  font-size: var(--fs-meta);
  line-height: 1.85;
  color: var(--brown);
}

.hp-sec-foot {
  margin: 16px 0 0;
  font-size: var(--fs-meta);
  line-height: 1.8;
  color: var(--brown);
}

/* ------------------------------------------------------------ 真实场景卡 */
.hp-scenes {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.hp-scene {
  padding: 20px 18px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r2);
  box-shadow: var(--sh-low);
}

.hp-scene-when {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}

.hp-scene-when svg { flex: none; }

.hp-scene-when span {
  font-size: var(--fs-badge);
  font-weight: 700;
  color: var(--accent-ink);
  letter-spacing: 0.2px;
}

.hp-scene h3 {
  margin: 0 0 10px;
  font-size: var(--fs-h3);
  line-height: 1.6;
}

.hp-scene-pain {
  margin: 0;
  padding-left: 13px;
  font-size: var(--fs-meta);
  line-height: 1.85;
  color: var(--brown);
  border-left: 3px solid var(--line);
}

/* 「见一见」化解句：暖粉左边条 + 浅橙底，写成好处而非免责
   注意：--accent-ink 在 --safety-bg 上仅 4.27:1（低于 4.5），
   因此强调词也用 --brown（11.87:1），靠字重而非颜色做强调。 */
.hp-scene-fix {
  margin: 12px 0 0;
  padding: 12px 13px;
  font-size: var(--fs-meta);
  line-height: 1.85;
  color: var(--brown);
  background: var(--safety-bg);
  border-left: 3px solid var(--pink);
  border-radius: 0 var(--r1) var(--r1) 0;
}

.hp-scene-fix span {
  font-weight: 700;
  color: var(--brown);
}

/* ---------------------------------------------------------- 怎么用：时间线 */
.hp-steps {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.hp-step {
  position: relative;
  margin: 0;
  padding: 20px 18px 18px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r2);
  box-shadow: var(--sh-low);
}

.hp-step-num {
  position: absolute;
  top: 16px;
  right: 18px;
  font-size: 34px;
  font-weight: 700;
  line-height: 1;
  color: var(--orange);
  opacity: .5;
  font-variant-numeric: tabular-nums;
}

.hp-step-ico {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  background: var(--safety-bg);
  border-radius: var(--r1);
}

.hp-step-ico svg { display: block; }

/* 阶段标签「见面前 / 出发前 …」 */
.hp-step-when {
  margin: 12px 0 0;
  font-size: var(--fs-badge);
  font-weight: 700;
  letter-spacing: 1px;
  color: var(--accent-ink);
}

.hp-step-txt h3 {
  margin: 4px 0 8px;
  padding-right: 44px;   /* 让开右上角序号，避免压字 */
  font-size: var(--fs-h3);
  line-height: 1.6;
}

.hp-step-txt > p:last-child {
  margin: 0;
  font-size: var(--fs-meta);
  line-height: 1.85;
  color: var(--brown);
}

/* 步骤内截图占位框：横版小图位 */
.hp-shot {
  display: grid;
  place-items: center;
  margin-top: 14px;
  padding: 20px 14px;
  text-align: center;
  background: var(--cream);
  border: 2px dashed var(--brown-3);
  border-radius: var(--r1);
}

.hp-shot-ph {
  font-size: 12.5px;
  line-height: 1.7;
  color: var(--brown);
}

/* -------------------------------------------------------- 为什么值得信任 */
.hp-trust {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.hp-trust-card {
  padding: 20px 18px;
  background: var(--card);
  border-radius: var(--r2);
  box-shadow: var(--sh-low);
  border-top: 3px solid var(--orange);
}

.hp-trust-card:nth-child(2) { border-top-color: var(--pink); }

.hp-trust-ico {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  background: var(--grad);
  border-radius: var(--r1);
}

.hp-trust-ico svg { display: block; }

.hp-trust-card h3 {
  margin: 12px 0 8px;
  font-size: var(--fs-h3);
  line-height: 1.6;
}

.hp-trust-card p {
  margin: 0;
  font-size: var(--fs-meta);
  line-height: 1.85;
  color: var(--brown);
}

/* -------------------------------------------------------------- 常见问题 */
.hp-faq {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.hp-faq-item {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r2);
  box-shadow: var(--sh-low);
  overflow: hidden;
}

.hp-faq-item > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 54px;
  padding: 14px 18px;
  font-size: var(--fs-body);
  font-weight: 700;
  line-height: 1.65;
  color: var(--brown);
  cursor: pointer;
  list-style: none;
  user-select: none;
}

.hp-faq-item > summary::-webkit-details-marker { display: none; }

/* 展开指示：纯 CSS 加号，展开后变减号（不含 JS） */
.hp-faq-item > summary::after {
  content: "";
  flex: none;
  width: 13px;
  height: 13px;
  background:
    linear-gradient(var(--accent-ink), var(--accent-ink)) center / 13px 2px no-repeat,
    linear-gradient(var(--accent-ink), var(--accent-ink)) center / 2px 13px no-repeat;
  border-radius: 2px;
}

.hp-faq-item[open] > summary::after {
  background:
    linear-gradient(var(--accent-ink), var(--accent-ink)) center / 13px 2px no-repeat;
}

.hp-faq-item[open] > summary { border-bottom: 1px solid var(--line); }

.hp-faq-body { padding: 14px 18px 16px; }

.hp-faq-body p {
  margin: 0;
  font-size: var(--fs-meta);
  line-height: 1.9;
  color: var(--brown);
}

/* ------------------------------------------------------------------ 下载 */
.hp-get {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.hp-get-card {
  padding: 22px 18px;
  text-align: center;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r2);
  box-shadow: var(--sh-low);
}

.hp-get-ico {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  margin: 0 auto 12px;
  background: var(--grad);
  border-radius: var(--r1);
}

.hp-get-ico svg { display: block; }

.hp-get-card h3 {
  margin: 0 0 4px;
  font-size: var(--fs-h3);
  line-height: 1.6;
}

.hp-get-card p {
  margin: 0 0 14px;
  font-size: var(--fs-meta);
  color: var(--brown-2);
}

/* 商店链接占位：虚线框 + 深棕字，明确标示待填而非可点死链 */
.hp-get-link {
  display: block;
  padding: 11px 12px;
  font-size: var(--fs-meta);
  font-weight: 700;
  line-height: 1.6;
  color: var(--brown);
  background: var(--cream);
  border: 1px dashed var(--brown-3);
  border-radius: var(--r-pill);
}

.hp-pill-soon { margin-right: 6px; }

/* ------------------------------------------------------ 首页页脚（复用页脚） */
/* 页面 footer 内再套一层 .wrap，需把内层 padding 归零，避免双重留白 */
.hp-foot > .wrap { padding: 0; max-width: 1080px; }

/* 首页页脚为四栏（产品/法律/关于/联系），而既有 .foot-grid 在 ≥768px 只给
   3 列（见上方 821 行），会导致「联系」折到第二行。此处仅首页覆盖为 4 列。 */
.hp-foot .foot-grid { grid-template-columns: repeat(2, 1fr); gap: 22px 26px; }

@media (min-width: 1024px) {
  .hp-foot .foot-grid { grid-template-columns: repeat(4, 1fr); }
}

/* ============================================================ 断点：≥768px */
@media (min-width: 768px) {
  .hp-hero { padding: 32px 26px 28px; }

  .hp-hero h1 { font-size: 32px; }

  /* 数字条四列 */
  .hp-numbers { grid-template-columns: repeat(4, 1fr); }

  .hp-numbers strong { font-size: 27px; }

  /* 场景卡两列 */
  .hp-scenes { grid-template-columns: repeat(2, 1fr); gap: 16px; }

  .hp-trust { grid-template-columns: repeat(2, 1fr); }

  .hp-get { grid-template-columns: repeat(2, 1fr); }

  .hp-sec-head h2 { font-size: 23px; }

  /* 步骤：左文右截图占位 */
  .hp-step {
    display: grid;
    grid-template-columns: 1fr 190px;
    grid-template-areas:
      "ico  shot"
      "txt  shot";
    align-content: start;
    column-gap: 20px;
  }

  .hp-step-ico { grid-area: ico; }
  .hp-step-txt { grid-area: txt; }
  .hp-shot  { grid-area: shot; margin-top: 0; align-self: center; }

  .hp-step-txt h3 { font-size: 18px; }

  .hp-foot > .wrap { padding: 0; }
}

/* =========================================================== 断点：≥1024px */
@media (min-width: 1024px) {
  /* Hero 两栏：文案左 / 示意屏右 */
  .hp-hero {
    grid-template-columns: 1fr 330px;
    gap: 44px;
    padding: 40px 34px 34px;
  }

  .hp-hero h1 { font-size: 36px; }

  .hp-mock { max-width: 330px; }

  /* 场景卡两列（保持 2 列，避免一行 4 张过窄） */
  .hp-scenes { grid-template-columns: repeat(2, 1fr); gap: 18px; }

  /* 信任卡四列 */
  .hp-trust { grid-template-columns: repeat(4, 1fr); gap: 14px; }

  .hp-trust-card { padding: 22px 18px; }

  /* 步骤：桌面端更宽的截图位 */
  .hp-step { grid-template-columns: 1fr 230px; }

  .hp-sec { margin-top: 56px; }

  .hp-sec-head { margin-bottom: 22px; }

  .hp-sec-head h2 { font-size: 25px; }
}

/* ------------------------------------------------------------ 首页专属动效 */
/* 全部包在 no-preference 内：用户要求减少动效时完全关闭 */
@media (prefers-reduced-motion: no-preference) {
  .hp-hero-copy > * { animation: hp-rise .5s ease-out both; }

  .hp-hero-copy > *:nth-child(1) { animation-delay: .02s; }
  .hp-hero-copy > *:nth-child(2) { animation-delay: .08s; }
  .hp-hero-copy > *:nth-child(3) { animation-delay: .14s; }
  .hp-hero-copy > *:nth-child(4) { animation-delay: .2s; }
  .hp-hero-copy > *:nth-child(5) { animation-delay: .26s; }

  .hp-mock { animation: hp-rise .55s ease-out .16s both; }

  .hp-faq-item > summary {
    transition: background-color .2s, border-color .2s, color .2s;
  }

  .hp-faq-item > summary:hover {
    background: var(--cream);
  }

  /* 悬停时序号加深 */
  .hp-step-num { transition: opacity .2s, color .2s; }
  .hp-step:hover .hp-step-num { opacity: .95; color: var(--pink); }
}

@keyframes hp-rise {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: none; }
}

/* ------------------------------------------------ 首页新增元素的打印样式 */
/* 追加在既有 @media print 之后：打印时收起交互件、去掉装饰 */
@media print {
  .hp-hero {
    padding: 0;
    box-shadow: none !important;
    border: 1px solid #ddd !important;
  }

  .hp-hero-copy > *,
  .hp-mock { animation: none !important; opacity: 1 !important; }

  .hp-sec { margin-top: 14pt; }

  .hp-mock,
  .hp-shot { display: none !important; }

  .hp-scenes,
  .hp-trust,
  .hp-get { grid-template-columns: 1fr 1fr; }

  .hp-step { display: block; }

  .hp-step-num { color: #999 !important; }

  .hp-faq-item { break-inside: avoid; }

  /* 折叠的 FAQ 在打印时展开正文 */
  .hp-faq-item > summary { font-weight: 700; }
}

/* ── 联系方式卡片 ── */
.contact-card{
  margin:18px 0 0;padding:18px 20px;border-radius:14px;
  background:linear-gradient(135deg,#FFF7F2,#FFF1F4);
  border:1px solid rgba(255,235,228,.9);
}
.contact-card h4{margin:0 0 12px;font-size:14.5px;font-weight:800;color:var(--text)}
.contact-list{list-style:none;margin:0;padding:0}
.contact-list li{
  display:flex;gap:12px;align-items:baseline;
  padding:6px 0;font-size:13.5px;line-height:1.7;
}
.contact-list li span{
  flex:0 0 68px;color:var(--text-3);font-size:12.5px;
}
.contact-list li b{font-weight:700;color:var(--text)}
.contact-list li a{color:var(--coral);text-decoration:none;word-break:break-all}
.contact-list li a:hover{text-decoration:underline}
@media(max-width:560px){
  .contact-list li{flex-direction:column;gap:1px}
  .contact-list li span{flex:none}
}