/* ==========================================================================
   昂听官网新版样式 —— 按 Figma「国内设计文件 / 首页」(1920 画板) 一比一实现

   比例单位 --at-u：
     画板宽 1920 时 --at-u = 1px，所有数值与 Figma 完全一致；
     视口变窄时整体等比缩小（1440 下为 0.75px），保持 Figma 的全部比例关系；
     窄于 1280 时锁定比例，由文末的窄屏兜底接管（本期只交付 PC 端）。
   所有尺寸写作 calc(<Figma 数值> * var(--at-u))，便于与设计稿逐项核对。

   字体：MiSans（Medium 500 / Regular 400 / Light 300 / Semibold 600），随主题下发（assets/fonts，见下方 @font-face），回退苹方 / 微软雅黑。
   作用域：body.at-site（只在新版模板加载，不影响 Astra / Elementor 页面）。
   ========================================================================== */

/* --------------------------------------------------------------------------
   字体：MiSans（小米官方 woff2，未做任何改动，取自 hyperos.mi.com/font 的 MiSans.zip）
   Light 300 / Regular 400 / Medium 500 / Semibold 600 —— 设计稿只用到这四个字重。
   font-display: swap：字体未到达前先用系统字体显示，到达后替换，不白屏。
   授权：MiSans 可免费商用，但协议要求「在软件中特别注明使用了 MiSans 字体」，见 README。
   -------------------------------------------------------------------------- */
@font-face { font-family: "MiSans"; font-weight: 300; font-style: normal; font-display: swap; src: url("../fonts/MiSans-Light.woff2") format("woff2"); }
@font-face { font-family: "MiSans"; font-weight: 400; font-style: normal; font-display: swap; src: url("../fonts/MiSans-Regular.woff2") format("woff2"); }
@font-face { font-family: "MiSans"; font-weight: 500; font-style: normal; font-display: swap; src: url("../fonts/MiSans-Medium.woff2") format("woff2"); }
@font-face { font-family: "MiSans"; font-weight: 600; font-style: normal; font-display: swap; src: url("../fonts/MiSans-Semibold.woff2") format("woff2"); }
/* 指标对齐的回退字体：MiSans 到达前先用系统字体（苹方 / 微软雅黑）显示，但把上行 / 下行 / 行距强制成 MiSans 的值
   （ascent 1044 / descent 282 / lineGap 0，每 1000 单位，line-height:normal ≈ 1.326），替换字体时行高、基线都不变，页面不再上下跳 */
@font-face {
  font-family: "MiSans Fallback"; font-weight: 300 600; font-style: normal;
  src: local("PingFang SC"), local("PingFang SC Regular"), local("PingFangSC-Regular"), local("Microsoft YaHei"), local("MicrosoftYaHei"), local("微软雅黑"), local("Helvetica Neue"), local("Arial");
  ascent-override: 104.4%; descent-override: 28.2%; line-gap-override: 0%;
}


:root {
  /* --at-vw 由 main.js 设为 documentElement.clientWidth（排除滚动条）；未执行时回退 100vw。 */
  /* 按反馈 2026-10-20（安卓平板 3840×2160 / DPI 240 = 网页宽 2560 截图：内容只占屏幕中间一截、钉住的区块下面空一大块）：
     超过 1920 不再封顶，整站一起按「屏宽 / 1920」等比放大（之前只有全幅图区块放大，见下方「全幅图区块宽屏自适应」，已并进来）；1280 以下仍按 1280 算。 */
  --at-u: calc(max(1280px, var(--at-vw, 100vw)) / 1920);

  --at-brand: #f05627;
  --at-brand-hover: #d94a1f;
  /* 按钮状态（Figma 570:1278「按钮」）：点击 #f05627，点击且悬浮 #c23f18，选中底色 #ffe7df */
  --at-brand-press: #c23f18;
  --at-brand-soft: #ffe7df;
  --at-black: #000000;
  --at-text: #191715;
  --at-white: #ffffff;
  --at-bg-warm: #f7f5f0;
  --at-bg-dark: #1d1d1d;
  --at-line-header: #d8d8d8;
  --at-line-card: #d2d2d7;
  /* 设计稿的分隔线是 0.5px 的 40% 黑（FAQ 485:535、规格表 482:144）；普通屏幕画不出半像素，1px 按 20% 黑等效。 */
  --at-faq-line: rgba(0, 0, 0, 0.2);
  --at-faq-plus-bg: #f2e2db;
  --at-footer-muted: #9f9f9f;

  --at-font: "MiSans", "MiSans VF", "MiSans Fallback", -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;

  --at-pad: calc(240 * var(--at-u));
  /* 内容区到屏幕边的距离：1920 以内就是 --at-pad；更宽的屏幕上 1920 宽的内容区居中，两侧多出的空白也算进来。
     横滑轨道用它做左右内边距：轨道铺满整屏，第一张卡仍和标题对齐（超宽屏不再在 1920 处一刀切）。 */
  --at-gutter: calc(max(0px, (var(--at-vw, 100vw) - 1920 * var(--at-u)) / 2) + var(--at-pad));
  --at-header-h: calc(62.189 * var(--at-u));
  --at-radius: 25px; /* 按反馈：图片 / 卡片圆角 PC 与手机统一 25（稿内 20 / 40 不再分档）；2026-10-19 起固定 25px、不随屏宽缩放；按钮、胶囊、弹层、进度条不走这两个变量 */
  --at-radius-lg: 25px;

  --at-dur: 200ms;
  --at-dur-enter: 450ms;
  --at-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  /* 导航扩展面板的滑出节奏：参照 Oura 官网，慢而柔（650ms，起步快、收尾长） */
  --at-mega-dur: 650ms;
  --at-mega-ease: cubic-bezier(0.32, 0, 0.16, 1);
  /* 面板内容在滑出过程中淡入，略短于滑出本身 */
  --at-mega-fade: 450ms;
}

/* --------------------------------------------------------------------------
   基础
   -------------------------------------------------------------------------- */
body.at-site {
  margin: 0;
  background: var(--at-white);
  color: var(--at-black);
  font-family: var(--at-font);
  font-size: calc(18 * var(--at-u));
  line-height: normal;
  letter-spacing: 0;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  scroll-padding-top: var(--at-header-h);
  overflow-x: hidden;
  /* 用 clip 不用 hidden：WP 里 Astra/插件给 html 也设了 overflow-x: hidden，body 的 hidden 就不再交给视口，
     body 变成不会滚的滚动容器，服务流程的 sticky 钉不住。clip 只裁切、不生成滚动容器（不支持的老浏览器退回上一行） */
  overflow-x: clip;
}
html { scroll-padding-top: var(--at-header-h); }
.at-site *, .at-site *::before, .at-site *::after { box-sizing: border-box; }
.at-site :where(img) { max-width: 100%; height: auto; display: block; }
.at-site :where(a) { color: inherit; text-decoration: none; }
.at-site :where(ul, ol) { margin: 0; padding: 0; list-style: none; }
.at-site :where(h1, h2, h3, h4, p) { margin: 0; }
.at-site :where(button) { font: inherit; color: inherit; cursor: pointer; }
.at-site :focus-visible { outline: none; } /* 全站不显示橙色焦点框 */
/* 手机上点按链接 / 按钮时浏览器默认会闪一个半透明方块（安卓 Chrome、iOS Safari 的点按高亮），按反馈 2026-10-20（手机导航栏点击有方块）全站关掉；该属性会继承，加在 body 上即可 */
body.at-site { -webkit-tap-highlight-color: transparent; }
.at-site [hidden] { display: none !important; }

.at-skip {
  position: absolute; left: 16px; top: -100px; z-index: 1000;
  background: var(--at-black); color: #fff; padding: 10px 16px; border-radius: 6px; font-size: 14px;
}
.at-skip:focus { top: 16px; }

/* 宽于 1920 的屏幕（2K / 4K）：内容区按 1920 画板封顶并居中，两侧留白增大，版式与 1920 完全一致；
   绝对定位的容器（首屏 / 家庭场景的 inner）靠 margin auto 同样居中。 */
.at-container { width: 100%; max-width: calc(1920 * var(--at-u)); margin: 0 auto; padding-inline: var(--at-pad); }

/* 模块标题：46px MiSans Medium，黑 */
.at-section__title { font-size: calc(46 * var(--at-u)); font-weight: 500; line-height: normal; color: var(--at-black); }

.at-actions { display: flex; flex-wrap: wrap; align-items: center; }

/* 占位块：素材未到时显示 */
.at-placeholder {
  width: 100%; height: 100%; min-height: 200px;
  display: flex; align-items: center; justify-content: center;
  background: repeating-linear-gradient(45deg, #eceef0 0 12px, #f3f4f5 12px 24px);
  color: #8a8d93; font-size: 14px; text-align: center; padding: 16px;
}
.at-placeholder--hero { position: absolute; inset: 0; }

.at-tag {
  display: inline-block; vertical-align: middle; line-height: 1; font-weight: 500;
  font-size: calc(14 * var(--at-u)); color: var(--at-brand);
  border: 1px solid currentColor; border-radius: 999px;
  padding: calc(5 * var(--at-u)) calc(10 * var(--at-u)); margin-left: calc(10 * var(--at-u));
}
.at-tag--inverse { color: #fff; }
.at-status { display: inline-flex; align-items: center; height: calc(35 * var(--at-u)); font-size: calc(14 * var(--at-u)); color: rgba(0, 0, 0, 0.6); }
.at-status--inverse { color: rgba(255, 255, 255, 0.85); }

/* --------------------------------------------------------------------------
   按钮（Figma btn-primary）
   lg：高 60 / 22px；sm：高 35 / 14px / 描边 0.6px；圆角胶囊
   -------------------------------------------------------------------------- */
.at-btn {
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 9999px; border: 1px solid transparent; background: none;
  font-weight: 400; line-height: normal; white-space: nowrap;
  transition: background-color var(--at-dur) var(--at-ease), border-color var(--at-dur) var(--at-ease), color var(--at-dur) var(--at-ease), padding var(--at-dur) var(--at-ease);
}
.at-btn--lg { height: calc(60 * var(--at-u)); padding-inline: calc(32 * var(--at-u)); font-size: calc(22 * var(--at-u)); gap: calc(14 * var(--at-u)); }
.at-btn--sm { height: calc(35 * var(--at-u)); padding-inline: calc(20 * var(--at-u)); font-size: calc(14 * var(--at-u)); gap: calc(8.4 * var(--at-u)); border-width: calc(0.6 * var(--at-u)); }

/* 箭头：按 Figma 的实际几何还原。设计稿里它是一条横贯的尾线 + 贴在右端的箭头，
   两者同厚、箭头压在尾线上（所以尾线要通到底，不能只画到箭头前面，否则中间会断）。
     lg（485:438）        26 × 10.017
     sm（485:389 产品卡）  15.586 × 8.829
     悬浮（570:1305 改）  尾线加长到 46，高度（即线厚与箭头大小）保持不变 —— 箭头不加粗
   头宽与线厚都是高度的定比（0.5278 / 0.1358），所以只要给宽高两个数就够。 */
.at-btn__arrow {
  --a-w: 26; --a-h: 10.017;
  flex: none; position: relative; display: inline-block;
  width: calc(var(--a-w) * var(--at-u)); height: calc(var(--a-h) * var(--at-u));
  transition: width var(--at-dur) var(--at-ease), height var(--at-dur) var(--at-ease);
}
.at-btn__arrow-line {
  position: absolute; left: 0; right: calc(var(--a-h) * 0.075 * var(--at-u)); top: 50%; transform: translateY(-50%);
  height: calc(var(--a-h) * 0.1358 * var(--at-u)); border-radius: 0 999px 999px 0; background: currentColor;
}
/* 按反馈「箭头不能突出」：尾线原来画到箭头盒子最右边（4.662），比箭头尖（圆角拐点圆心在 4.0、描边半宽 0.6）还靠外，方头两角从尖上露出来；
   改为只画到拐点圆心（右缩 0.662 / 4.662 × 头宽 = 0.075 × 高），右端圆头，正好藏进拐点的圆角里。 */
.at-btn__arrow-head {
  position: absolute; right: 0; top: 0; height: 100%;
  width: calc(var(--a-h) * 0.5278 * var(--at-u)); overflow: visible;
}
.at-btn--sm .at-btn__arrow { --a-w: 15.586; --a-h: 8.829; }
.at-btn:hover .at-btn__arrow { --a-w: 46; }
.at-btn--sm:hover .at-btn__arrow { --a-w: 27.6; }
/* 箭头悬浮时按钮宽度不变（570:1303 仍是 234×60）：箭头加长 20（sm 12），两侧内边距各收一半，文字随之左移 10（sm 6）。 */
.at-btn--arrow.at-btn--lg:hover { padding-inline: calc(22 * var(--at-u)); }
.at-btn--arrow.at-btn--sm:hover { padding-inline: calc(14 * var(--at-u)); }

.at-btn--primary { background: var(--at-brand); color: #fff; border-color: var(--at-brand); }
.at-btn--primary:hover { background: var(--at-brand-hover); border-color: var(--at-brand-hover); }
.at-btn--primary:active { background: var(--at-brand-press); border-color: var(--at-brand-press); }

/* 描边按钮（570:1285 / 1291 / 1297）：静态 1px；悬浮描边加粗到 2px（用内阴影叠，避免按钮跟着变宽）。
   稿里按下时填橙色 #f05627（指针停在上面按下是更深的 #c23f18），按反馈 2026-10-20 去掉：点了直接跳转，按钮保持描边样子（手机端同样，并关掉浏览器自带的点按高亮）。 */
.at-btn--outline-dark, .at-btn--outline-light { background: none; } /* 点按高亮已在 body.at-site 上全站关掉 */
.at-btn--outline-dark { color: var(--at-black); border-color: var(--at-black); }
/* sm 尺寸的黑描边在设计稿里只有 0.57–0.61px（527:540 / 797:200），Figma 渲出来是约 60% 的黑（#5c5b5a）；
   浏览器画不了亚像素线、会补成 1px 纯黑，比稿重一截，所以用 62% 透明度的黑来还原那种细线观感 */
.at-btn--sm.at-btn--outline-dark { border-color: rgba(0, 0, 0, 0.62); }
.at-btn--outline-light { color: #fff; border-color: #fff; }
.at-btn--outline-dark:hover, .at-btn--outline-light:hover { box-shadow: inset 0 0 0 calc(1 * var(--at-u)) currentColor; }
.at-btn--sm.at-btn--outline-dark:hover, .at-btn--sm.at-btn--outline-light:hover { box-shadow: inset 0 0 0 calc(0.6 * var(--at-u)) currentColor; }
/* 带右箭头的描边按钮（了解产品 → / 阅读指南 → 等）：悬浮只做箭头加长，描边不加粗 */
.at-btn--arrow.at-btn--outline-dark:hover, .at-btn--arrow.at-btn--outline-light:hover { box-shadow: none; }
.at-btn--solid-dark { background: var(--at-black); color: #fff; border-color: var(--at-black); }
.at-btn--solid-dark:hover { background: #222; }
.at-btn--ghost { color: var(--at-black); padding-inline: calc(8 * var(--at-u)); }
.at-btn--ghost:hover { color: var(--at-brand); }

/* --------------------------------------------------------------------------
   头部（530:980「导航栏白色」）：高 62.189，透明压在首屏 KV 上；
   Logo（左 240）/ 导航 / 客服图标（右 240）按 space-between 排布，即设计稿的 501 间距；
   导航 18px MiSans Medium 间距 80。首页吸顶白字：首屏上全透明、滚过后垫半透明毛玻璃底（展开扩展面板时临时转白底黑字）；产品页不吸顶随首屏滚走。
   -------------------------------------------------------------------------- */
.at-header {
  position: sticky; top: 0; z-index: 100;
  height: var(--at-header-h); background: #fff; border-bottom: 1px solid var(--at-line-header);
  transition: background var(--at-dur) var(--at-ease), border-color var(--at-dur) var(--at-ease);
}
.at-header__inner { position: relative; height: 100%; display: flex; align-items: center; justify-content: space-between; }
/* 标志内联 SVG：黑色笔画走 currentColor，「昂」中间的橙色一笔固定 #F05627，白底黑字、KV 上白字两种形态都保留橙色。 */
.at-logo { display: inline-flex; align-items: center; gap: calc(8.434 * var(--at-u)); height: calc(32.189 * var(--at-u)); color: var(--at-black); }
.at-logo__part, .at-logo__img { display: block; height: calc(32.189 * var(--at-u)); width: auto; }
.at-logo--inverse { color: #fff; }
.at-site .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* 压在 KV 上的形态：透明底、白字白 logo，滚动后也保持；只有展开扩展面板时（.is-mega）切回「导航栏填充」白底黑字，面板才可读。 */
.at-header--overlay { border-bottom-color: transparent; } /* 压在 KV 上或面板展开时都不画底线 */
.at-header--overlay:not(.is-mega) { background: transparent; border-bottom-color: transparent; }
.at-header--overlay:not(.is-mega) .at-nav__list > li > a,
.at-header--overlay:not(.is-mega) .at-headicon { color: #fff; }
.at-header--overlay:not(.is-mega) .at-logo { color: #fff; }
.at-header--overlay:not(.is-mega) .at-burger span { background: #fff; }
/* 滚过首屏后（.is-scrolled，main.js headerGlass）：Figma 622:1581「导航栏填充」画的是 黑 15% + 模糊 35、白字，那是压在深色 KV 上的效果；
   滚过首屏后导航下面是白色内容，黑 15% 垫在白底上只剩一条浅灰，白字白标志看不清，Chrome 的背景模糊还会把邻近图片的颜色晕进这条带里（反馈录屏 20261014-155018）。
   按反馈改成与比较页同一套浅色毛玻璃：白 60% + 模糊 35，标志、导航、图标转黑（标志里「昂」中间那一笔仍是橙色）；展开扩展面板时切回白底黑字。
   验配服务页整页黑底，滚动后仍用深色毛玻璃 + 白字。 */
.at-header--overlay { transition: background var(--at-dur) var(--at-ease), border-color var(--at-dur) var(--at-ease), backdrop-filter var(--at-dur) var(--at-ease), -webkit-backdrop-filter var(--at-dur) var(--at-ease); }
.at-header--overlay.is-scrolled:not(.is-mega) { background: rgba(255, 255, 255, 0.6); -webkit-backdrop-filter: blur(35px); backdrop-filter: blur(35px); }
.at-header--overlay.is-scrolled:not(.is-mega) .at-nav__list > li > a,
.at-header--overlay.is-scrolled:not(.is-mega) .at-headicon,
.at-header--overlay.is-scrolled:not(.is-mega) .at-logo { color: var(--at-black); }
.at-header--overlay.is-scrolled:not(.is-mega) .at-burger span { background: var(--at-black); }
.at-site.page-template-page-fitting .at-header--overlay.is-scrolled:not(.is-mega) { background: rgba(0, 0, 0, 0.2); }
.at-site.page-template-page-fitting .at-header--overlay.is-scrolled:not(.is-mega) .at-nav__list > li > a,
.at-site.page-template-page-fitting .at-header--overlay.is-scrolled:not(.is-mega) .at-headicon,
.at-site.page-template-page-fitting .at-header--overlay.is-scrolled:not(.is-mega) .at-logo { color: #fff; }
.at-site.page-template-page-fitting .at-header--overlay.is-scrolled:not(.is-mega) .at-burger span { background: #fff; }

.at-nav__list { display: flex; gap: calc(80 * var(--at-u)); }
.at-nav__list > li { position: relative; }
/* 感应区放大：上下撑满导航高度（62.189）、左右各扩到项间距的一半（40），用等量负外边距抵消，布局与视觉都不变；
   这样指针靠近文字（上下、左右一段范围内）就能触发悬浮和扩展面板，不必正好压在字上。 */
.at-nav__list > li > a {
  position: relative; isolation: isolate;
  display: block; white-space: nowrap; color: var(--at-black); font-weight: 500;
  font-size: calc(18 * var(--at-u)); line-height: calc(30.07 * var(--at-u));
  padding: calc(16.06 * var(--at-u)) calc(40 * var(--at-u)); margin: calc(-16.06 * var(--at-u)) calc(-40 * var(--at-u));
  transition: color var(--at-dur) var(--at-ease);
}
/* 悬浮 / 当前页 / 面板展开时的橙色胶囊：100×35（量自设计图，三项等宽），
   用伪元素绝对定位画在文字底下，不参与布局 —— 导航项之间仍是设计稿的 80 间距。
   宽度按文字宽算（100% 是含感应区内边距的盒宽，先减掉左右 80 再加 28）。 */
.at-nav__list > li > a::before {
  content: ""; position: absolute; z-index: -1;
  left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: calc(100% - 52 * var(--at-u)); min-width: calc(100 * var(--at-u)); height: calc(35 * var(--at-u));
  background: var(--at-brand); border-radius: 9999px;
  opacity: 0; transition: opacity var(--at-dur) var(--at-ease);
}
.at-nav__list > li > a:hover,
.at-nav__list > li > a[aria-expanded="true"],
.at-nav__list > li.current-menu-item > a,
.at-nav__list > li.current-menu-ancestor > a,
.at-nav__list > li.current_page_item > a { color: #fff; }
.at-nav__list > li > a:hover::before,
.at-nav__list > li > a[aria-expanded="true"]::before,
.at-nav__list > li.current-menu-item > a::before,
.at-nav__list > li.current-menu-ancestor > a::before,
.at-nav__list > li.current_page_item > a::before { opacity: 1; }
/* 滚过首屏后导航转黑字（上面 .is-scrolled 那条优先级更高），会把橙色胶囊上的字也压成黑色；悬浮 / 当前页仍要白字（反馈 2026-10-19） */
.at-header--overlay.is-scrolled:not(.is-mega) .at-nav__list > li > a:hover,
.at-header--overlay.is-scrolled:not(.is-mega) .at-nav__list > li.current-menu-item > a,
.at-header--overlay.is-scrolled:not(.is-mega) .at-nav__list > li.current-menu-ancestor > a,
.at-header--overlay.is-scrolled:not(.is-mega) .at-nav__list > li.current_page_item > a { color: #fff; }

/* 下拉（后台配置二级菜单时）：1px 灰线，无厚重阴影 */
.at-nav__list .sub-menu {
  position: absolute; top: calc(100% + 12px); left: 50%; transform: translate(-50%, -4px); min-width: calc(240 * var(--at-u));
  background: #fff; border: 1px solid var(--at-line-header); border-radius: 12px; padding: 8px;
  opacity: 0; visibility: hidden;
  transition: opacity var(--at-dur) var(--at-ease), transform var(--at-dur) var(--at-ease), visibility var(--at-dur);
}
.at-nav__list > li:hover > .sub-menu,
.at-nav__list > li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.at-nav__list .sub-menu a { display: block; padding: 10px 14px; border-radius: 8px; font-size: calc(16 * var(--at-u)); color: var(--at-black); }
.at-nav__list .sub-menu a:hover { background: #f5f5f5; }
.at-nav__list .sub-menu .description { display: block; font-size: 13px; color: #8a8d93; margin-top: 2px; }

.at-header__actions { display: flex; align-items: center; gap: calc(12 * var(--at-u)); }
.at-headicon {
  display: inline-flex; align-items: center; justify-content: center;
  width: calc(30 * var(--at-u)); height: calc(30 * var(--at-u));
  padding: 0; /* 清掉 button 默认内边距，图标才能撑满 30×30（530:995） */
  border: 0; background: none; color: var(--at-black);
  transition: color var(--at-dur) var(--at-ease);
}
.at-headicon__icon { width: 100%; height: 100%; }
.at-headicon:hover, .at-headicon[aria-expanded="true"] { color: var(--at-brand); }
.at-burger { display: none; }

/* 客服电话浮窗（需求表：点击客服图标浮窗显示 400 电话）：挂在图标右下，白底卡片 */
.at-contact { position: relative; display: inline-flex; }
.at-contact__pop {
  position: absolute; right: 0; top: calc(100% + 14 * var(--at-u)); z-index: 5; min-width: calc(260 * var(--at-u));
  padding: calc(18 * var(--at-u)) calc(24 * var(--at-u)); background: #fff; color: var(--at-black); text-align: left;
  border-radius: calc(16 * var(--at-u)); box-shadow: 0 calc(12 * var(--at-u)) calc(36 * var(--at-u)) rgba(0, 0, 0, 0.13), 0 calc(3 * var(--at-u)) calc(10 * var(--at-u)) rgba(0, 0, 0, 0.07);
  animation: at-modal-in var(--at-dur) var(--at-ease);
}
.at-contact__label, .at-contact__hint { font-size: calc(14 * var(--at-u)); line-height: normal; color: var(--at-footer-muted); white-space: nowrap; }
.at-contact__phone { display: block; margin-top: calc(6 * var(--at-u)); font-size: calc(26 * var(--at-u)); font-weight: 500; line-height: normal; color: var(--at-black); white-space: nowrap; }
.at-contact__phone:hover { color: var(--at-brand); }
.at-contact__hint { margin-top: calc(8 * var(--at-u)); }


/* --------------------------------------------------------------------------
   导航扩展面板：产品栏扩展（554:1212，高 340）/ 目录栏扩展（554:1249，高 240）
   hover 或键盘聚焦「产品」「关于昂听」时展开；展开期间导航为白底黑字。

   动效参照理想官网：面板 top 对齐导航顶边、顶部留出导航高度，收起时整体 translateY(-100%)
   藏到视口上方，展开时滑下来；两块面板共用一个容器，互相切换时高度平滑过渡。
   -------------------------------------------------------------------------- */
.at-mega {
  position: absolute; top: 0; left: 0; right: 0; z-index: 1;
  padding-top: var(--at-header-h);
  background: #fff; /* 底边不画线，同理想官网：面板与下方模糊页面之间没有分隔线 */
  transform: translateY(-100%); opacity: 0; pointer-events: none;
  transition: transform var(--at-mega-dur) var(--at-mega-ease), opacity var(--at-mega-dur) var(--at-mega-ease);
}
.at-mega.is-open { transform: none; opacity: 1; pointer-events: auto; }
/* 导航本身要压在面板之上，否则会被面板顶部那块白底盖住。 */
.at-header__inner { z-index: 2; }

.at-mega__body { position: relative; overflow: hidden; height: 0; transition: height var(--at-mega-dur) var(--at-mega-ease); }
.at-mega.is-products .at-mega__body { height: calc(340 * var(--at-u)); }
.at-mega.is-about .at-mega__body { height: calc(240 * var(--at-u)); }

.at-mega__panel {
  position: absolute; top: 0; left: 0; right: 0; max-width: calc(1920 * var(--at-u)); margin-inline: auto;
  opacity: 0; visibility: hidden;
  transition: opacity var(--at-mega-fade) var(--at-mega-ease), visibility var(--at-mega-fade);
}
.at-mega__panel.is-active { opacity: 1; visibility: visible; }
.at-mega__panel--products { height: calc(340 * var(--at-u)); display: flex; flex-direction: column; align-items: center; padding-top: calc(40 * var(--at-u)); }
.at-mega__panel--about { height: calc(240 * var(--at-u)); }

/* 页面遮罩（554:1113）：面板展开时其余内容模糊 35 + 50% 白洗；导航 z-index 100，遮罩压在它下面。
   纯装饰，pointer-events: none —— 收起靠导航区域的 mouseleave，不需要遮罩接点击。 */
.at-scrim {
  /* 四边各外扩 80：backdrop-filter 在自身边缘采样不足会留一圈没糊开的亮边，
     把边缘推到视口外就看不到了。设计稿那块矩形也是 1965×1121 / 位置 (-1,-14)，同一个道理。 */
  position: fixed; top: -80px; left: -80px; width: calc(100vw + 160px); height: calc(100vh + 160px);
  z-index: 99; pointer-events: none;
  background: rgba(255, 255, 255, 0.4);
  -webkit-backdrop-filter: blur(40px);
  backdrop-filter: blur(40px);
  opacity: 0; visibility: hidden;
  transition: opacity var(--at-dur) var(--at-ease), visibility var(--at-dur);
}
.at-scrim.is-open { opacity: 1; visibility: visible; }
/* 挂了扩展面板的导航项不再走简易下拉，避免两层菜单打架。 */
.at-nav__list > li > a[data-at-mega] + .sub-menu { display: none; }

/* 产品栏扩展（869:1750）：三块 459.67×203 圆角 20 底 #f7f5f0 横排，间距 30，整排宽 1440 从面板 top 40 起；
   块内左文右图：名称 24px Medium + 「产品详情 →」110×35（间距 5）靠左，图 157×145 位槽靠右，左右内边距 53；
   下方居中一枚「产品对比」132×38 描边按钮（top 263，与卡片间距 20）。 */
.at-mega__products { display: flex; gap: calc(30 * var(--at-u)); width: calc(1440 * var(--at-u)); }
.at-mega__product {
  flex: 1 1 0; min-width: 0; display: flex; align-items: center; justify-content: space-between;
  height: calc(203 * var(--at-u)); padding-inline: calc(53 * var(--at-u));
  background: var(--at-bg-warm); border-radius: var(--at-radius); /* 2026-10-19 卡片统一 25 */
}
.at-mega__info { display: flex; flex-direction: column; align-items: flex-start; gap: calc(5 * var(--at-u)); }
.at-mega__name { font-size: calc(24 * var(--at-u)); font-weight: 500; line-height: normal; color: var(--at-black); white-space: nowrap; }
/* 「产品详情 →」110×35 定宽、内容居中（869:1785）。悬浮时宽度不变，箭头加长 8.4（通用 sm 按钮是 12），
   文字左移 4.2 而不是 6 —— 卡内左侧空间窄，按反馈少移一点 */
.at-mega__btn { width: calc(110 * var(--at-u)); padding-inline: 0; gap: calc(7.933 * var(--at-u)); border-width: calc(0.5 * var(--at-u)); }
.at-mega__btn .at-btn__arrow { --a-w: 14.167; --a-h: 8.34; } /* 801:286：箭头 14.167 宽，文字 56 + 间距 7.93 + 箭头居中后文字正好距左 15.95 */
.at-mega__btn.at-btn--sm:hover .at-btn__arrow { --a-w: 22.5; }
.at-mega__btn.at-btn--arrow.at-btn--sm:hover { padding-inline: 0; } /* 定宽居中，不走通用的收内边距 */

/* 图：157×145 位槽，导航小图已按设计稿的裁切框裁好（机身靠右、垂直居中），hover 轻微放大不撑动版面。
   --at-nav-scale（产品字段「导航小图显示比例」）叠在两个状态上，用来把三张图的可见机身对齐。 */
.at-mega__thumb { position: relative; flex: none; display: block; width: calc(157 * var(--at-u)); height: calc(145 * var(--at-u)); }
.at-mega__img, .at-mega__thumb .at-placeholder {
  display: block; width: 100%; height: 100%; object-fit: contain;
  transform-origin: center;
  transition: transform var(--at-dur-enter) var(--at-ease);
}
.at-mega__product:hover .at-mega__img,
.at-mega__product:focus-within .at-mega__img { transform: scale(calc(1.06 * var(--at-nav-scale, 1))); }
/* 产品还没传导航小图时的占位块，缩到位槽尺寸。 */
.at-mega__thumb .at-placeholder { min-height: 0; font-size: 11px; padding: 8px; }

/* 「产品对比」（869:1874）：132×38，16px Medium，1px 黑描边 */
.at-mega__panel--products .at-mega__compare { margin-top: calc(20 * var(--at-u)); height: calc(38 * var(--at-u)); padding-inline: calc(34 * var(--at-u)); font-size: calc(16 * var(--at-u)); font-weight: 500; border: 1px solid var(--at-black); }

/* 列左边对齐设计稿：首列 left 808，次列 left 1076 —— 即列间距 196（268 - 首列 72）。 */
.at-mega__cols {
  position: absolute; left: calc(808 * var(--at-u)); top: calc(40 * var(--at-u));
  display: flex; align-items: flex-start; gap: calc(196 * var(--at-u));
}
.at-mega__col { display: flex; flex-direction: column; gap: calc(10 * var(--at-u)); }
.at-mega__coltitle { font-size: calc(18 * var(--at-u)); font-weight: 400; line-height: normal; color: var(--at-footer-muted); white-space: nowrap; }
.at-mega__col a { font-size: calc(18 * var(--at-u)); line-height: normal; color: var(--at-black); white-space: nowrap; }
/* 悬浮加到 Semibold（600），与 FAQ 问题悬浮一致 */
.at-mega__col a:hover { font-weight: 600; }

/* --------------------------------------------------------------------------
   首屏（485:357）：1920×900；文字 left 240 / top 323 / 宽 684；
   标题 66 Medium，间距 5，副标 46 Light；按钮 top 517（相对文字块 +194）
   -------------------------------------------------------------------------- */
.at-hero { position: relative; height: calc(900 * var(--at-u)); overflow: hidden; background: #fff; color: #fff; }
/* 设计稿里导航（y=0，h=62.189）压在首屏（y=0，h=900）之上，首屏总高即 900；此处上移首屏保持同样的叠压关系。 */
.at-site.home .at-hero { margin-top: calc(-62.189 * var(--at-u)); }
.at-hero__media, .at-hero__media picture { position: absolute; inset: 0; }
.at-hero__img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
/* 首屏视频（首页设置 → 首屏视频 / 首屏视频 · 手机）：叠在 KV 图上铺满，静音自动循环；KV 图留作封面与兜底。手机端（≤767）同样播，用竖版视频，没填时 PC 视频居中裁切（源由 main.js 按断点选） */
.at-hero__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
/* 没在播（被拦 / 失效 / 3 秒没播起来，main.js 加 .is-video-failed）时视频本身也透明，免得停住的视频在 iPhone 上画成黑块盖住 KV；
   用透明度而不是 visibility:hidden——iOS 不会自动播放不可见的视频，之后真正播起来（playing）摘掉类名就接回视频 */
.at-hero.is-video-failed .at-hero__video { opacity: 0; }
/* 播视频的那一端不显示 KV（主推产品图），底色黑，视频出第一帧即接上；视频加载失败（main.js 加 .is-video-failed）退回 KV。按反馈 2026-10-18：刷新时视频后面先露出昂听 Pro3.0 */
@media (min-width: 768px) {
  .at-hero--video-pc { background: #000; }
  .at-hero--video-pc:not(.is-video-failed) .at-hero__media picture, .at-hero--video-pc:not(.is-video-failed) .at-hero__media > .at-hero__img { visibility: hidden; }
}
@media (max-width: 767px) {
  .at-hero--video-m { background: #000; }
  .at-hero--video-m:not(.is-video-failed) .at-hero__media picture, .at-hero--video-m:not(.is-video-failed) .at-hero__media > .at-hero__img { visibility: hidden; }
}
.at-hero__inner { position: absolute; inset: 0; }
.at-hero__copy { position: absolute; top: calc(323 * var(--at-u)); left: var(--at-pad); width: calc(684 * var(--at-u)); }
.at-hero__title { font-size: calc(66 * var(--at-u)); font-weight: 500; line-height: normal; color: #fff; white-space: nowrap; }
.at-hero__sub { margin-top: calc(5 * var(--at-u)); font-size: calc(46 * var(--at-u)); font-weight: 300; line-height: normal; color: #fff; white-space: nowrap; }
.at-hero__actions { position: absolute; top: calc(194 * var(--at-u)); left: 0; gap: calc(15 * var(--at-u)); }
.at-hero .at-tag--inverse { position: absolute; top: calc(-46 * var(--at-u)); left: 0; margin: 0; }

/* --------------------------------------------------------------------------
   荣誉奖项带（485:365 区块，标识排布按 802:445，高 300）：白底；标题「品牌实力」32 Medium 居中 top 70；
   通栏轮播 top 128：九枚标识按原始宽高横排、间距 138（整条 2015 宽），向左匀速无限滚动。
   实现：同一组标识连排两遍，动画把整条向左移动一遍的宽度（-50%）再从头来，视觉无缝；
   指针停上去暂停；系统「减少动态效果」时不动，静止居中。
   -------------------------------------------------------------------------- */
/* 802:443：区块高 300；标题 32px Semibold 居中 top 47（自然行高 42），标识行 top 134 高 101，底留 65；标识间距 138 */
.at-awards { padding-top: calc(102 * var(--at-u)); padding-bottom: calc(65 * var(--at-u)); background: #fff; overflow: hidden; } /* 上 47 → 102（反馈 2026-10-20：「品牌实力」标题去掉后，轮播上下留白调成一样——下方是本块 65 + 产品区上内边距 37 = 102） */
.at-awards__title { margin-bottom: calc(40 * var(--at-u)); text-align: left; font-size: calc(46 * var(--at-u)); font-weight: 500; line-height: normal; color: var(--at-black); } /* 字号粗细同区块标题 .at-section__title（46 / Medium，如「选择你的昂听」），与手机端一致（反馈 2026-10-20）；原稿 32 / Semibold。标题到标识 45 → 40，同区块标题到内容；居中改左对齐，外层包 .at-container，与「选择你的昂听」同一左边线（反馈 2026-10-20） */
/* 滚动窗口：任何屏宽都通栏铺满、两端不渐隐（按反馈：超宽屏上也一直延伸到屏幕边，main.js 按窗口宽补足份数） */
.at-awards__window { overflow: hidden; }
.at-awards__marquee { display: flex; width: max-content; height: calc(100.776 * var(--at-u)); animation: at-marquee 60s linear infinite; }
.at-awards__marquee:hover { animation-play-state: paused; }
.at-awards__track { flex: none; display: flex; align-items: center; gap: calc(138 * var(--at-u)); padding-right: calc(138 * var(--at-u)); height: 100%; }
.at-awards__item { flex: 0 0 auto; width: calc(var(--at-aw) * var(--at-u)); height: calc(var(--at-ah) * var(--at-u)); }
.at-awards__item img { display: block; width: 100%; height: 100%; object-fit: contain; }
/* 一遍标识比屏幕窄时（1920 下一遍约 1690 宽，超宽屏差得更多，滚到后半圈右侧会露白），main.js 按屏宽补足份数，并把每圈位移设成一遍的宽度 */
@keyframes at-marquee { from { transform: translateX(0); } to { transform: translateX(var(--at-marquee-shift, -50%)); } }
@media (prefers-reduced-motion: reduce) {
  .at-awards__marquee { animation: none; width: auto; justify-content: center; }
  .at-awards__track[aria-hidden="true"] { display: none; }
  .at-awards__track { padding-right: 0; }
}

/* --------------------------------------------------------------------------
   产品区（485:377，高 750）：标题 top 37；卡片 699.5×474 r20 间距 40，可横向滚动
   -------------------------------------------------------------------------- */
.at-products { padding-top: calc(37 * var(--at-u)); padding-bottom: calc(38 * var(--at-u)); background: #fff; }
.at-products .at-section__title { margin-bottom: calc(40 * var(--at-u)); }
.at-products__track {
  display: flex; gap: calc(40 * var(--at-u)); overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scroll-behavior: auto; /* 保持 auto：前后按钮的滑动由 main.js 自己补间（600ms 先快后慢），手势由原生横滑 + 吸附负责 */
  padding-inline: var(--at-gutter); scroll-padding-inline: var(--at-gutter); scrollbar-width: none;
}
.at-products__track::-webkit-scrollbar { display: none; }
.at-pcard {
  position: relative; flex: 0 0 calc(699.5 * var(--at-u)); height: calc(474 * var(--at-u));
  border-radius: var(--at-radius); overflow: hidden; background: #ddd; scroll-snap-align: start; scroll-snap-stop: always; color: #fff;
}
.at-pcard__media { position: absolute; inset: 0; display: block; }
.at-pcard__img {
  width: 100%; height: 100%; object-fit: cover;
  /* 放大锚点与倍数每张卡不同（802:411「扩展」静态 / 悬浮两排裁切框解出：Pro3.0 1.163 @ 59% 61%、听力豆 1.397 @ 47% 66%、Pro1.0 1.291 @ 71% 72%），
     由产品字段「产品卡悬浮放大倍数 / 放大锚点」写进 --at-zoom / --at-zoom-origin；按反馈统一只放大一点，没填时 1.1（2026-10-19 由 1.06 调大）。 */
  transform-origin: var(--at-zoom-origin, center);
  transform: scale(var(--at-base, 1));
  transition: transform var(--at-dur-enter) var(--at-ease);
}
/* 悬浮状态：同一张底图按各自倍数放大，卡片尺寸、渐变、文案和按钮都不动。静态先乘 --at-base（见下）。 */
.at-pcard:hover .at-pcard__img,
.at-pcard:focus-within .at-pcard__img { transform: scale(calc(var(--at-base, 1) * var(--at-zoom, 1.1))); }
/* 静态尺寸对齐（反馈 2026-10-19）：Pro1.0 卡图里的产品比 Pro3.0 小约 15%（充电盒宽 280 : 328，按 700 宽量）、也更靠下，
   静态先放大 1.18（锚点沿用它的 71% 72%，放大后产品中心约在 50% / 39%，与 Pro3.0 的 52% / 40% 对齐）；只管 PC，手机卡图单独构图。 */
@media (min-width: 767.02px) {
  .at-pcard[data-at-product="pro1"] { --at-base: 1.18; }
}
/* 测试站装了 Smush 懒加载：它往页面里写 .lazyloaded { transition: opacity 400ms }，排在主题样式后面，会把产品卡和导航小图的放大过渡盖掉，
   悬停时图片一下子跳大、没有动画（反馈 2026-10-19）。这里抬高优先级，放大过渡和懒加载的淡入一起保留。 */
.at-pcard .at-pcard__img, .at-mega__thumb .at-mega__img { transition: transform var(--at-dur-enter) var(--at-ease), opacity 400ms; }
.at-pcard__media::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(102, 102, 102, 0) 40%);
}
.at-pcard__body { position: absolute; left: calc(50 * var(--at-u)); right: calc(30 * var(--at-u)); top: calc(310 * var(--at-u)); }
/* 点卡片任意处都进产品页（反馈 2026-10-19）：文字层盖在图片链接上（手机端铺满整张卡），本身不接点击、让给下面的 .at-pcard__media 链接；
   名称链接和两枚按钮照常可点。 */
.at-pcard__body { pointer-events: none; }
.at-pcard__body a, .at-pcard__body button, .at-pcard__body .at-status { pointer-events: auto; }
.at-pcard__media { cursor: pointer; }
.at-pcard__name { font-size: calc(32 * var(--at-u)); font-weight: 500; line-height: normal; white-space: nowrap; }
.at-pcard__tagline { margin-top: calc(9 * var(--at-u)); font-size: calc(18 * var(--at-u)); line-height: normal; }
.at-pcard__actions { margin-top: calc(22 * var(--at-u)); gap: calc(15 * var(--at-u)); }

.at-carousel__nav { display: flex; justify-content: flex-end; gap: calc(36 * var(--at-u)); margin-top: calc(40 * var(--at-u)); }
.at-carousel__btn { width: calc(60 * var(--at-u)); height: calc(60 * var(--at-u)); padding: 0; border: 0; background: none; color: #000; display: inline-flex; }
.at-carousel__btn svg { width: 100%; height: 100%; }
/* 「按钮滑动」稿：可点时圆底 black/40%（#999），到头不可点的那一侧圆底 black/10%（#e6e6e6），白色箭头不变；悬浮 / 按下再加深一档 */
.at-carousel__btn circle { fill-opacity: 0.4; transition: fill-opacity var(--at-dur) var(--at-ease); }
.at-carousel__btn:hover circle { fill-opacity: 0.5; }
.at-carousel__btn:active circle { fill-opacity: 0.6; }
.at-carousel__btn[disabled] { pointer-events: none; }
.at-carousel__btn[disabled] circle { fill-opacity: 0.1; }

/* --------------------------------------------------------------------------
   产品与操作展示（485:421，高 840）：三卡 459×600 r20 间距 31；文字 left 43 宽 374 gap 20
   -------------------------------------------------------------------------- */
.at-features { padding-top: calc(19 * var(--at-u)); padding-bottom: calc(56 * var(--at-u)); background: #fff; } /* 下留白 20 → 56（反馈 2026-10-20）：下面的「选购指引」删掉后按钮几乎贴到家庭场景大图，改成与上方（产品区左右箭头到本区标题，56）一样 */
.at-features .at-section__title { margin-bottom: calc(40 * var(--at-u)); }
.at-fcards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(31 * var(--at-u)); }
.at-fcard { position: relative; height: calc(600 * var(--at-u)); border-radius: var(--at-radius); overflow: hidden; background: #000; color: #fff; }
.at-fcard__media, .at-fcard__img { position: absolute; inset: 0; width: 100%; height: 100%; }
.at-fcard__img { object-fit: cover; }
.at-fcard__media::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.9) 0%, rgba(102, 102, 102, 0) 45%);
}
/* 第一、三张卡稿内没有渐变遮罩（PC 1178:386 的渐变压在照片下面、1178:394 只有照片；手机 1178:685 / 695 同样），只有第二张有 */
.at-fcard:nth-child(1) .at-fcard__media::after, .at-fcard:nth-child(3) .at-fcard__media::after { content: none; }
.at-fcard__body {
  position: absolute; left: calc(43 * var(--at-u)); bottom: calc(60 * var(--at-u));
  width: calc(374 * var(--at-u)); display: flex; flex-direction: column; gap: calc(20 * var(--at-u));
}
.at-fcard__title { font-size: calc(32 * var(--at-u)); font-weight: 500; line-height: normal; }
.at-fcard__desc { font-size: calc(18 * var(--at-u)); line-height: normal; }
.at-features__foot { margin-top: calc(40 * var(--at-u)); }
.at-features__foot .at-btn--lg { min-width: calc(247 * var(--at-u)); }

/* 深色页签形态（需求表 H06 可选形态） */
.at-features--dark { background: #17191c; color: #f5f6f7; }
.at-features--dark .at-section__title { color: #f5f6f7; }
.at-tabs__list { display: flex; flex-wrap: wrap; gap: calc(10 * var(--at-u)); margin-bottom: calc(24 * var(--at-u)); }
.at-tabs__tab {
  height: calc(48 * var(--at-u)); padding-inline: calc(24 * var(--at-u)); border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.2); background: transparent; color: rgba(245, 246, 247, 0.72);
  font-size: calc(18 * var(--at-u)); transition: background-color var(--at-dur), color var(--at-dur), border-color var(--at-dur);
}
.at-tabs__tab:hover { color: #fff; border-color: rgba(255, 255, 255, 0.4); }
.at-tabs__tab[aria-selected="true"] { background: #fff; color: #000; border-color: #fff; }
.at-tabs__media { height: calc(600 * var(--at-u)); border-radius: var(--at-radius); overflow: hidden; background: #23262b; }
.at-tabs__img { width: 100%; height: 100%; object-fit: cover; }
.at-tabs__desc { margin-top: calc(20 * var(--at-u)); max-width: calc(700 * var(--at-u)); font-size: calc(18 * var(--at-u)); color: rgba(245, 246, 247, 0.72); }

/* --------------------------------------------------------------------------
   选购指引（485:439，高 820）：左图 930×531 r20；右列 465（间距 45）
   引导 24px top 203；三卡 465×93 r20 间距 20，内容宽 389
   -------------------------------------------------------------------------- */
.at-guide { padding-top: calc(54 * var(--at-u)); padding-bottom: calc(134 * var(--at-u)); background: #fff; }
.at-guide .at-section__title { margin-bottom: calc(40 * var(--at-u)); }
.at-guide__grid { display: grid; grid-template-columns: calc(930 * var(--at-u)) calc(465 * var(--at-u)); gap: calc(45 * var(--at-u)); align-items: start; }
.at-guide__media { position: relative; height: calc(531 * var(--at-u)); border-radius: var(--at-radius); overflow: hidden; background: #b76262; }
/* 每张卡一张图，叠在同一位置，点击卡片淡入淡出切换（450ms）。 */
.at-guide__slide { position: absolute; inset: 0; opacity: 0; transition: opacity var(--at-dur-enter) var(--at-ease); }
.at-guide__slide.is-active { opacity: 1; }
.at-guide__img { width: 100%; height: 100%; object-fit: cover; }
.at-guide__side { padding-top: calc(48 * var(--at-u)); }
.at-guide__intro { font-size: calc(24 * var(--at-u)); line-height: normal; color: var(--at-black); }
.at-guide__list { display: flex; flex-direction: column; gap: calc(20 * var(--at-u)); margin-top: calc(20 * var(--at-u)); }
.at-gcard {
  display: flex; align-items: center; justify-content: center; width: 100%; height: calc(93 * var(--at-u)); padding: 0;
  border: 1px solid var(--at-line-card); border-radius: var(--at-radius); /* 页签卡按 2026-10-19 反馈也统一 25 */ background: none; color: var(--at-black); font: inherit; text-align: left;
  transition: border-color var(--at-dur), background-color var(--at-dur), box-shadow var(--at-dur);
}
/* Frame 2085663319 三态：静态描边 1px #d2d2d7；悬浮加粗到 1.5px（颜色不变）；
   选中不填色，只有橙描边 + 橙字 —— 当前选中的页签（默认第一张）。 */
.at-gcard:hover { box-shadow: inset 0 0 0 calc(0.5 * var(--at-u)) var(--at-line-card); }
.at-gcard:active,
.at-gcard[aria-selected="true"],
.at-gcard.is-selected { background: none; border-color: var(--at-brand); color: var(--at-brand); }
.at-gcard[aria-selected="true"]:hover,
.at-gcard.is-selected:hover { box-shadow: inset 0 0 0 calc(0.5 * var(--at-u)) var(--at-brand); }
.at-gcard__inner { width: calc(389 * var(--at-u)); display: block; }
.at-gcard__title { display: block; font-size: calc(18 * var(--at-u)); font-weight: 600; line-height: normal; }
.at-gcard__desc { display: block; font-size: calc(18 * var(--at-u)); line-height: normal; }

/* --------------------------------------------------------------------------
   家庭使用场景（485:452，1920×800）：左侧渐变 rgba(0,0,0,.93)→透明(55%)
   标题 46 top 239；正文 24 宽 562 top 381；按钮 168×35 top 525
   -------------------------------------------------------------------------- */
.at-lifestyle { position: relative; height: calc(800 * var(--at-u)); overflow: hidden; background: #fff; color: #fff; }
.at-lifestyle__media, .at-lifestyle__img { position: absolute; inset: 0; width: 100%; height: 100%; }
.at-lifestyle__img { object-fit: cover; }
.at-lifestyle__media::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(to right, rgba(0, 0, 0, 0.93) 0%, rgba(102, 102, 102, 0) 54.891%);
  mix-blend-mode: multiply; /* Figma 1178:414：遮罩为正片叠底 */
}
.at-lifestyle__inner { position: absolute; inset: 0; }
/* 文案块 top 227（Figma 485:452：标题 227、正文 369、按钮 513，按钮为 lg 尺寸 60 高） */
.at-lifestyle__copy { position: absolute; top: calc(227 * var(--at-u)); left: var(--at-pad); width: calc(562 * var(--at-u)); }
.at-lifestyle__title { margin-left: calc(3 * var(--at-u)); font-size: calc(46 * var(--at-u)); font-weight: 500; line-height: normal; }
.at-lifestyle__body { position: absolute; top: calc(142 * var(--at-u)); left: 0; width: 100%; font-size: calc(24 * var(--at-u)); line-height: normal; }
.at-lifestyle__actions { position: absolute; top: calc(286 * var(--at-u)); left: 0; }
/* 「关于昂听 →」按钮严格按 Figma 485:456：190×60 定宽居中、描边 0.68、文字与箭头间距 9.522；悬浮箭头加长时宽度不变 */
.at-lifestyle__actions .at-btn { width: calc(190 * var(--at-u)); padding-inline: 0; gap: calc(9.522 * var(--at-u)); border-width: calc(0.68 * var(--at-u)); }
.at-lifestyle__actions .at-btn--arrow.at-btn--lg:hover { padding-inline: 0; }

/* --------------------------------------------------------------------------
   服务流程（485:459，高 950，底 #f7f5f0）：内容 top 82，块间距 40
   标题行 + 黑按钮 240×60；图 1440×500 r40；四步 300 宽间距 61，12px 圆点 + 连线
   -------------------------------------------------------------------------- */
.at-service { padding-top: calc(82 * var(--at-u)); padding-bottom: calc(82 * var(--at-u)); background: var(--at-bg-warm); }
/* 滚动驱动读条（main.js serviceSteps）：脚本在区块外套一层占位容器撑出滚动距离，区块 sticky 钉在里面；top 由脚本按区块高 / 视口高计算 */
.at-service-pin { background: var(--at-bg-warm); }
.at-service-pin > .at-service { position: sticky; top: 0; }
.at-service__head { display: flex; align-items: flex-start; justify-content: space-between; gap: calc(24 * var(--at-u)); min-height: calc(61 * var(--at-u)); }
/* 每一步一张图叠在同一位置，切换时淡入淡出（450ms） */
.at-service__media { position: relative; height: calc(500 * var(--at-u)); margin-top: calc(40 * var(--at-u)); border-radius: var(--at-radius-lg); overflow: hidden; background: #b76262; }
.at-service__slide { position: absolute; inset: 0; opacity: 0; transition: opacity var(--at-dur-enter) var(--at-ease); }
.at-service__slide.is-active { opacity: 1; }
.at-service__img { width: 100%; height: 100%; object-fit: cover; }
.at-steps {
  position: relative; display: grid; grid-template-columns: repeat(var(--at-steps, 4), calc(300 * var(--at-u)));
  gap: calc(61 * var(--at-u)); margin-top: calc(40 * var(--at-u)); padding-top: calc(27 * var(--at-u));
}
/* 灰色连线从首个圆点到轨道右端（与上方图片右边缘对齐），不超出容器 */
.at-steps::before { content: ""; position: absolute; left: calc(4 * var(--at-u)); right: 0; top: calc(6 * var(--at-u)); height: 1px; background: rgba(0, 0, 0, 0.18); }
/* 读条：橙色进度线压在灰线上，从首个圆点起，宽度由 main.js serviceSteps 按当前步设置并做线性过渡 */
.at-steps__fill { position: absolute; left: calc(4 * var(--at-u)); top: calc(6 * var(--at-u)); height: 1px; width: 0; background: var(--at-brand); pointer-events: none; transition: width 0.4s var(--at-ease); } /* 整段跳到当前圆点，0.4s 过渡与 App 页进度条一致 */
.at-step { position: relative; }
.at-step__btn {
  display: flex; flex-direction: column; gap: calc(15 * var(--at-u)); align-items: flex-start; width: 100%;
  padding: 0; border: 0; background: none; text-align: left; color: var(--at-black); cursor: pointer;
}
.at-step__dot { position: absolute; left: 0; top: calc(-27 * var(--at-u)); width: calc(12 * var(--at-u)); height: calc(12 * var(--at-u)); border-radius: 50%; background: #cfcac2; transition: background-color var(--at-dur) var(--at-ease); }
/* 当前步与走过的步圆点为橙色 */
.at-step.is-active .at-step__dot, .at-step.is-done .at-step__dot { background: var(--at-brand); }
.at-step__num { font-size: calc(24 * var(--at-u)); line-height: normal; color: var(--at-brand); }
.at-step__title { font-size: calc(24 * var(--at-u)); font-weight: 500; line-height: normal; color: var(--at-black); }
.at-step__desc { font-size: calc(18 * var(--at-u)); line-height: normal; color: var(--at-black); white-space: nowrap; }

/* --------------------------------------------------------------------------
   品牌信息（485:497，高 900，底 #f7f5f0）：左文右图 794×552 r40
   标题 top 343、正文 top 424、按钮 top 496（158×60 + 240×60）
   -------------------------------------------------------------------------- */
.at-about { padding-top: calc(174 * var(--at-u)); padding-bottom: calc(174 * var(--at-u)); background: var(--at-bg-warm); }
.at-about__grid { display: grid; grid-template-columns: 1fr calc(794 * var(--at-u)); align-items: center; }
.at-about__copy { padding-right: calc(60 * var(--at-u)); }
.at-about__title { margin-bottom: calc(25 * var(--at-u)); }
.at-about__body { font-size: calc(24 * var(--at-u)); line-height: normal; color: var(--at-black); }
.at-about__evidence { margin-top: calc(20 * var(--at-u)); display: grid; gap: calc(8 * var(--at-u)); font-size: calc(18 * var(--at-u)); }
.at-about__evidence li { position: relative; padding-left: calc(16 * var(--at-u)); }
.at-about__evidence li::before { content: ""; position: absolute; left: 0; top: 0.6em; width: calc(6 * var(--at-u)); height: calc(6 * var(--at-u)); border-radius: 50%; background: var(--at-brand); }
.at-about__actions { margin-top: calc(40 * var(--at-u)); gap: calc(15 * var(--at-u)); }
.at-about__media { height: calc(552 * var(--at-u)); border-radius: var(--at-radius-lg); overflow: hidden; background: #d9d9d9; }
.at-about__img { width: 100%; height: 100%; object-fit: cover; }

/* --------------------------------------------------------------------------
   选购与使用指南（485:507，高 900）：三卡 460×600 r20 间距 30
   卡内 left 35：分类 18、标题 24 Medium（宽 386）、按钮 130×35，按钮距底 54
   -------------------------------------------------------------------------- */
.at-articles { padding-top: calc(99 * var(--at-u)); padding-bottom: calc(100 * var(--at-u)); background: #fff; }
.at-articles .at-section__title { margin-bottom: calc(40 * var(--at-u)); }
.at-acards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(30 * var(--at-u)); }
.at-acard { position: relative; height: calc(600 * var(--at-u)); border-radius: var(--at-radius); overflow: hidden; background: #dcdcdc; color: #fff; }
.at-acard__link { position: absolute; inset: 0; display: block; }
.at-acard__media, .at-acard__img { position: absolute; inset: 0; width: 100%; height: 100%; }
.at-acard__img { object-fit: cover; }
.at-acard__media::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(102, 102, 102, 0) 50%);
}
/* 三张卡遮罩各不相同（Figma 1178:471 / 479 / 487）；手机端另按 490:752 */
@media (min-width: 767.02px) {
  .at-acard:nth-child(1) .at-acard__media::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(102, 102, 102, 0) 55%); }
  .at-acard:nth-child(2) .at-acard__media::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.42) 0%, rgba(102, 102, 102, 0) 50%); }
  .at-acard:nth-child(3) .at-acard__media::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.64) 0%, rgba(102, 102, 102, 0) 42.917%); }
}
.at-acard__body {
  position: absolute; left: calc(35 * var(--at-u)); right: calc(35 * var(--at-u)); bottom: calc(54 * var(--at-u));
  display: flex; flex-direction: column; align-items: flex-start;
}
.at-acard__cat { font-size: calc(18 * var(--at-u)); line-height: normal; }
.at-acard__title { margin-top: calc(5 * var(--at-u)); width: calc(386 * var(--at-u)); max-width: 100%; font-size: calc(24 * var(--at-u)); font-weight: 500; line-height: normal; }
.at-acard__body .at-btn { margin-top: calc(28 * var(--at-u)); min-width: calc(130 * var(--at-u)); }

/* --------------------------------------------------------------------------
   常见问题（485:535，高 773）：标题 top 91 行高 88；条目高 115.2，底边 0.5px
   问题 24px #191715；加号 53.6 圆形 #f2e2db；分隔线设计稿 0.5px 40% 黑，按 1px 20% 黑等效
   -------------------------------------------------------------------------- */
.at-faq { padding-top: calc(91 * var(--at-u)); padding-bottom: calc(219 * var(--at-u)); background: #fff; }
.at-faq .at-section__title { line-height: calc(74 * var(--at-u)); margin-bottom: calc(40 * var(--at-u)); }
.at-accordion__item { border-bottom: 1px solid var(--at-faq-line); }
.at-accordion__heading { font-size: inherit; font-weight: inherit; }
.at-accordion__trigger {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: calc(24 * var(--at-u));
  height: calc(115.2 * var(--at-u)); padding: 0; background: none; border: 0; text-align: left;
  font-size: calc(24 * var(--at-u)); font-weight: 400; line-height: calc(27.8 * var(--at-u)); color: var(--at-text);
}
/* PC 端悬浮：文字在原来颜色的基础上变浅（透明度 60%），不换色、不加粗、不变字号 */
.at-accordion__q { transition: opacity var(--at-dur) var(--at-ease); }
@media (min-width: 1280px) and (hover: hover) {
  .at-accordion__trigger:hover .at-accordion__q { opacity: 0.6; }
}
.at-accordion__icon {
  position: relative; flex: none; width: calc(53.63 * var(--at-u)); height: calc(53.63 * var(--at-u));
  border-radius: 50%; background: var(--at-faq-plus-bg); transition: background-color var(--at-dur);
}
.at-accordion__icon::before, .at-accordion__icon::after {
  content: ""; position: absolute; left: 50%; top: 50%; background: var(--at-brand); border-radius: 1px; transform: translate(-50%, -50%);
}
.at-accordion__icon::before { width: calc(18 * var(--at-u)); height: calc(2.6 * var(--at-u)); }
/* 展开 / 收起按反馈录屏 20261018-223914（ELEHEAR 海外站逐帧）：约 0.3s、先快后慢，加号变减号同步 */
.at-accordion__icon::after { width: calc(2.6 * var(--at-u)); height: calc(18 * var(--at-u)); transition: transform 0.3s var(--at-ease); }
.at-accordion__trigger[aria-expanded="true"] .at-accordion__icon::after { transform: translate(-50%, -50%) scaleY(0); }
/* 状态由 main.js 加在条目上的 .is-open 决定（不用 hidden 切换，见 main.js accordion）；收起后答案 visibility:hidden，读屏与 Tab 不会进去，展开时立即可见 */
.at-accordion__panel { display: grid; grid-template-rows: 0fr; visibility: hidden; transition: grid-template-rows 0.3s var(--at-ease), visibility 0s linear 0.3s; }
.at-accordion__item.is-open > .at-accordion__panel { grid-template-rows: 1fr; visibility: visible; transition: grid-template-rows 0.3s var(--at-ease), visibility 0s; }
.at-accordion__content { overflow: hidden; }
.at-accordion__content > * { max-width: calc(1000 * var(--at-u)); padding-bottom: calc(30 * var(--at-u)); font-size: calc(18 * var(--at-u)); line-height: 1.6; color: #000; } /* 展开的答案按反馈用纯黑 */
.at-accordion__content a { color: var(--at-brand); text-decoration: underline; text-underline-offset: 3px; }

/* --------------------------------------------------------------------------
   页尾（485:552）：主区 500 + 底栏 72，底 #1d1d1d
   左列 460 从 top 152；右侧三列各 190 间距 70，从 x 970 起
   -------------------------------------------------------------------------- */
.at-footer { background: var(--at-bg-dark); color: #fff; }
.at-footer__main {
  display: grid; grid-template-columns: calc(730 * var(--at-u)) 1fr; min-height: calc(500 * var(--at-u));
  padding-top: calc(152 * var(--at-u)); padding-bottom: calc(120 * var(--at-u));
}
.at-footer__brand { width: calc(460 * var(--at-u)); display: flex; flex-direction: column; align-items: flex-start; gap: calc(20 * var(--at-u)); }
.at-footer__slogan { font-size: calc(46 * var(--at-u)); font-weight: 500; line-height: normal; color: #fff; white-space: nowrap; }
.at-footer__sub { font-size: calc(24 * var(--at-u)); font-weight: 500; line-height: normal; color: var(--at-footer-muted); }
.at-footer__cols { display: flex; gap: calc(70 * var(--at-u)); align-items: flex-start; }
.at-footer__col { width: calc(190 * var(--at-u)); flex: none; }
.at-footer__col h3 { font-size: calc(24 * var(--at-u)); font-weight: 500; line-height: normal; letter-spacing: calc(1.2 * var(--at-u)); color: #fff; margin-bottom: calc(20 * var(--at-u)); }
.at-footer__col ul { display: flex; flex-direction: column; gap: calc(12 * var(--at-u)); }
.at-footer__col a { font-size: calc(18 * var(--at-u)); line-height: 1.55; color: #fff; transition: color var(--at-dur); }
.at-footer__col a:hover { color: var(--at-brand); }
/* 485:592：分隔线是 0.5px 的 #d8d8d8 40%；普通屏幕画不出半像素，1px 按 20% 等效，不然看起来比稿里粗一倍 */
.at-footer__legal { border-top: 1px solid rgba(216, 216, 216, 0.2); }
.at-footer__legal-inner { height: calc(72 * var(--at-u)); display: flex; align-items: center; justify-content: space-between; gap: calc(32 * var(--at-u)); }
.at-footer__disclaimer, .at-footer__copy { font-size: calc(12 * var(--at-u)); line-height: normal; color: rgba(255, 255, 255, 0.5); white-space: nowrap; }
.at-footer__disclaimer a, .at-footer__policies a { margin-left: calc(12 * var(--at-u)); }
.at-footer__disclaimer a:hover, .at-footer__copy a:hover { color: #fff; }

/* --------------------------------------------------------------------------
   购买平台选择层（P11 / D06）：宽 480 模态框
   -------------------------------------------------------------------------- */
.at-modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 24px; }
.at-modal__backdrop { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.55); }
.at-modal__dialog {
  position: relative; width: 480px; max-width: 100%; max-height: calc(100vh - 48px); overflow-y: auto;
  background: #fff; color: var(--at-black); border-radius: 20px; padding: 32px;
  animation: at-modal-in var(--at-dur) var(--at-ease);
}
@keyframes at-modal-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.at-modal__close { position: absolute; right: 16px; top: 16px; width: 44px; height: 44px; border: 0; background: none; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.at-modal__close:hover { background: #f3f4f5; }
.at-modal__title { font-size: 22px; font-weight: 500; margin-bottom: 20px; padding-right: 44px; }
.at-modal__hint { font-size: 14px; color: #8a8d93; margin-bottom: 12px; }
.at-modal__products { display: grid; gap: 12px; }
.at-modal__products button, .at-modal__platforms a {
  width: 100%; min-height: 56px; display: flex; align-items: center; gap: 14px; padding: 12px 16px;
  border: 1px solid var(--at-line-card); border-radius: 12px; background: #fff; font-size: 16px; font-weight: 500; text-align: left;
  transition: border-color var(--at-dur), background-color var(--at-dur), box-shadow var(--at-dur);
}
.at-modal__products button:hover, .at-modal__platforms a:hover { border-color: var(--at-black); background: #f7f7f7; }
.at-modal__products img, .at-modal__thumb img { width: 48px; height: 48px; object-fit: cover; border-radius: 6px; background: #f3f4f5; }
.at-modal__product { display: flex; align-items: center; gap: 14px; padding-bottom: 20px; border-bottom: 1px solid var(--at-line-card); margin-bottom: 20px; }
.at-modal__thumb:empty { display: none; }
.at-modal__label { font-size: 14px; color: #8a8d93; }
.at-modal__name { font-size: 16px; font-weight: 600; }
.at-modal__switch { margin-left: auto; background: none; border: 0; font-size: 14px; color: var(--at-brand); text-decoration: underline; text-underline-offset: 3px; }
.at-modal__platforms { display: grid; gap: 12px; }
.at-modal__platforms .at-platform__badge {
  flex: none; width: 40px; height: 40px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 700; color: #fff;
}
.at-platform__badge--jd { background: #e1251b; }
.at-platform__badge--tmall { background: #ff0036; }
.at-platform__badge--taobao { background: #ff5000; }
.at-modal__note { margin-top: 16px; font-size: 14px; color: #8a8d93; }
/* 锁滚动加在 html 上，不加在 body：WP 里 Astra 给 html 设了 overflow-x，body 的 overflow:hidden 就不再交给视口，body 自己变成滚动容器，
   吸顶导航条改按 body 定位、跳回页面最顶（滚过一段再开菜单 / 弹窗，标志和叉被甩出屏幕）。html 的 overflow 总是交给视口，没有这个问题。 */
html.at-modal-open, html.at-nav-open { overflow: hidden; }

/* --------------------------------------------------------------------------
   产品详情首屏骨架（P02 / P03）与通用页面
   -------------------------------------------------------------------------- */
.at-section { padding-block: calc(88 * var(--at-u)); }
.at-section--tight { padding-block: calc(44 * var(--at-u)); }
.at-product__hero { background: var(--at-bg-warm); }
.at-product__hero-inner { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: calc(64 * var(--at-u)); align-items: center; }
.at-product__media { aspect-ratio: 4 / 3; border-radius: var(--at-radius); overflow: hidden; background: #fff; }
.at-product__img { width: 100%; height: 100%; object-fit: cover; }
.at-product__name { font-size: calc(46 * var(--at-u)); font-weight: 500; line-height: 1.2; }
.at-product__subtitle { margin-top: calc(8 * var(--at-u)); font-size: calc(24 * var(--at-u)); color: rgba(0, 0, 0, 0.65); }
.at-product__lead { margin-top: calc(16 * var(--at-u)); font-size: calc(18 * var(--at-u)); }
.at-product .at-actions { margin-top: calc(32 * var(--at-u)); gap: calc(15 * var(--at-u)); }
.at-page__title { font-size: calc(46 * var(--at-u)); font-weight: 500; }
.at-prose { max-width: calc(800 * var(--at-u)); line-height: 1.7; }
.at-prose p { margin-bottom: 1em; }

/* ==========================================================================
   产品详情页 —— 按 Figma「国内设计文件 / 昂听Pro3.0」(482:42，1920 画板，总高 11325) 一比一实现
   按钮与悬浮态沿用上面的 .at-btn 体系（570:1278）。
   ========================================================================== */

/* xs 按钮（482:56 / 482:58）：高 30 / 12px / 描边 0.539 / 箭头 13.473 宽（等比 sm 箭头）；悬浮同样放大 1.77 倍、内边距收 5 */
.at-btn--xs { height: calc(30 * var(--at-u)); padding-inline: calc(21 * var(--at-u)); font-size: calc(12 * var(--at-u)); gap: calc(7.545 * var(--at-u)); border-width: calc(0.539 * var(--at-u)); }
.at-btn--xs .at-btn__arrow { --a-w: 13.473; --a-h: 7.632; }
.at-btn--xs:hover .at-btn__arrow { --a-w: 23.85; }
.at-btn--arrow.at-btn--xs:hover { padding-inline: calc(15.8 * var(--at-u)); }
.at-btn--xs.at-btn--outline-dark:hover, .at-btn--xs.at-btn--outline-light:hover { box-shadow: inset 0 0 0 calc(0.539 * var(--at-u)) currentColor; }

/* 产品详情页的导航同样压在首屏 KV 上（482:61），但不吸顶：随页面滚走，之后由悬浮条接管。 */
.at-site.single-at_product .at-header { position: absolute; top: 0; left: 0; right: 0; }

/* --------------------------------------------------------------------------
   悬浮条（482:52）：1494×50 圆角 20 底 rgba(255,255,255,.8)，居中，距视口顶 10；
   内边距 27：左产品名 18px Medium，右两枚 xs 按钮间距 9。
   首屏 KV 上不显示；滚过首屏后加 .is-visible 从顶部滑入并固定（main.js productBar）。
   -------------------------------------------------------------------------- */
.at-subnav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 90; height: calc(50 * var(--at-u) + 0.62rem);
  pointer-events: none; opacity: 0; transform: translateY(-100%);
  transition: transform var(--at-mega-dur) var(--at-mega-ease), opacity var(--at-mega-dur) var(--at-mega-ease);
}
.at-subnav.is-visible { pointer-events: auto; opacity: 1; transform: none; }
/* 797:200「新产品页导航栏」：条 1494×50 圆角 20，距视口顶 0.62rem（按反馈定，约 10px）；底 80% 白 + 毛玻璃 blur 30，投影 0 0 13 黑 10%；
   左产品名 23px Medium（内边距 32），右两枚按钮 34.07 高 / 14px（比较产品 102.2 宽描边 0.612，天猫购买 113.6 宽橙），间距 10.2，右内边距 27 */
.at-subnav__bar {
  position: absolute; top: 0.62rem; left: 50%; transform: translateX(-50%);
  width: calc(1494 * var(--at-u)); height: calc(50 * var(--at-u));
  display: flex; align-items: center; justify-content: space-between; padding-inline: calc(32 * var(--at-u)) calc(27 * var(--at-u));
  background: rgba(255, 255, 255, 0.8); border-radius: calc(20 * var(--at-u));
  -webkit-backdrop-filter: blur(30px); backdrop-filter: blur(30px);
  box-shadow: 0 0 calc(13 * var(--at-u)) rgba(0, 0, 0, 0.1);
}
/* 产品名是回首页的链接：外观保持纯文字 */
.at-subnav__name { font-size: calc(23 * var(--at-u)); font-weight: 500; line-height: calc(38.5 * var(--at-u)); color: var(--at-black); white-space: nowrap; text-decoration: none; }
.at-subnav__name:hover { color: var(--at-black); }
.at-subnav__actions { gap: calc(10.221 * var(--at-u)); }
.at-subnav .at-btn--sm { height: calc(34.07 * var(--at-u)); padding-inline: 0; }
.at-subnav .at-btn--outline-dark { width: calc(102.211 * var(--at-u)); border-width: calc(0.612 * var(--at-u)); }
.at-subnav .at-btn--outline-dark:hover { box-shadow: inset 0 0 0 calc(0.612 * var(--at-u)) currentColor; }
/* 「天猫购买 →」113.568 宽：文字 56 + 箭头 15.3 + 间距 8.6；悬浮时箭头加长、宽度不变 */
.at-subnav .at-btn--primary { width: calc(113.568 * var(--at-u)); gap: calc(8.569 * var(--at-u)); }
.at-subnav .at-btn--primary .at-btn__arrow { --a-w: 15.301; --a-h: 8.668; }
.at-subnav .at-btn--primary:hover .at-btn__arrow { --a-w: 27.1; }
.at-subnav .at-status { height: calc(34.07 * var(--at-u)); font-size: calc(14 * var(--at-u)); }

/* --------------------------------------------------------------------------
   首屏（482:61）：文字 top 334，标题 66 Medium / 副标 46 Light 间距 10；按钮 top 507（相对文字块 +173），间距 15
   -------------------------------------------------------------------------- */
.at-hero--product .at-hero__copy { top: calc(334 * var(--at-u)); }
.at-hero--product .at-hero__sub { margin-top: calc(10 * var(--at-u)); }
.at-hero--product .at-hero__actions { top: calc(173 * var(--at-u)); }
.at-hero--product .at-hero__compare { min-width: calc(172 * var(--at-u)); }
/* 全幅图区块宽屏自适应（2026-10-18 起超过 1920 时首屏等全幅图区块按屏宽放大、文字容器封顶 1920）：2026-10-20 起整站超过 1920 一起等比放大（见 :root 的 --at-u），这段单独规则已删 */
/* Pro3.0 首屏（1178:287）：标题框按稿高 67（MiSans 行高 normal 实际约 87，副标会比稿低 20、离按钮只剩 15，稿里是 40） */
.at-pro--pro3 .at-hero__title { height: calc(67 * var(--at-u)); }

/* --------------------------------------------------------------------------
   核心优势（482:95，高 840）：标题 top 69；三卡 459×600 r20 间距 31 top 170；
   卡内渐变 rgba(0,0,0,.6)→透明(51.375%) 正片叠底；圆环 70 橙 + 白线条图标；标题 32 Medium / 说明 24；整组居中 top 482
   -------------------------------------------------------------------------- */
.at-adv { padding-top: calc(69 * var(--at-u)); padding-bottom: calc(70 * var(--at-u)); background: #fff; }
.at-adv .at-section__title { margin-bottom: calc(44.32 * var(--at-u)); }
.at-adv__cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(31 * var(--at-u)); }
.at-adv__card { position: relative; height: calc(600 * var(--at-u)); border-radius: var(--at-radius); overflow: hidden; background: #000; color: #fff; }
.at-adv__media, .at-adv__img { position: absolute; inset: 0; width: 100%; height: 100%; }
.at-adv__img { object-fit: cover; }
.at-adv__media::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(102, 102, 102, 0) 51.375%);
}
.at-adv__body { position: absolute; left: 0; right: 0; top: calc(482 * var(--at-u)); display: flex; justify-content: center; align-items: flex-start; gap: calc(29 * var(--at-u)); }
.at-adv__ring { flex: none; display: inline-flex; align-items: center; justify-content: center; width: calc(70 * var(--at-u)); height: calc(70 * var(--at-u)); border-radius: 50%; background: var(--at-brand); }
.at-adv__icon { display: block; width: calc(var(--i-w, 48) * var(--at-u)); height: calc(var(--i-h, 48) * var(--at-u)); object-fit: contain; }
.at-adv__text { display: flex; flex-direction: column; }
.at-adv__title { margin-top: calc(2 * var(--at-u)); font-size: calc(32 * var(--at-u)); font-weight: 500; line-height: normal; white-space: nowrap; }
.at-adv__desc { font-size: calc(24 * var(--at-u)); line-height: normal; white-space: nowrap; }

/* --------------------------------------------------------------------------
   全幅图文带 1920×900：
   dark（623:1608）标题 66 白 top 67、副标 32 #b8b8b8 top 165；
   bottom（623:1603）自上而下渐变 40%→rgba(0,0,0,.4) 正片叠底，标题 46 白 top 667、副标 32/50 top 743.68；
   light（482:175）底 #868686，标题 66 黑 top 88、副标 32 黑 top 196
   -------------------------------------------------------------------------- */
.at-banner { position: relative; height: calc(900 * var(--at-u)); overflow: hidden; background: #000; color: #fff; text-align: center; }
.at-banner--light { background: #868686; color: var(--at-black); }
.at-banner__media, .at-banner__img { position: absolute; inset: 0; width: 100%; height: 100%; }
.at-banner__img { object-fit: cover; }
.at-banner--bottom .at-banner__media::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply;
  background: linear-gradient(to bottom, rgba(102, 102, 102, 0) 40%, rgba(0, 0, 0, 0.4) 100%);
}
.at-banner__copy { position: absolute; inset: 0; max-width: calc(1920 * var(--at-u)); margin-inline: auto; padding-inline: var(--at-pad); } /* 文字层与 .at-container 一样封顶 1920 居中：宽屏上左对齐的标题 / 要点与下面区块的标题对齐（按反馈），居中的标题不受影响 */
.at-banner__title, .at-banner__sub { position: absolute; left: 0; right: 0; }
.at-banner__title { font-size: calc(66 * var(--at-u)); font-weight: 500; line-height: normal; }
.at-banner__sub { font-size: calc(32 * var(--at-u)); font-weight: 400; line-height: normal; }
/* Pro3.0 更大功率 / 高增益 / 快速补能三块按新稿 1299:42（65dB高增益）统一：标题 46 Medium 居中 top 67、副标 24 Regular top 138；
   原稿是功率 / 补能标题 66 + 副标 32（top 67/165、88/196），高增益文字压在底部 top 667 */
@media (min-width: 768px) { /* 只管 PC：手机端（≤767）这三块另有一套字号与排版，两类选择器的特异性会压过它 */
  .at-banner--dark .at-banner__title, .at-banner--light .at-banner__title, .at-banner--bottom .at-banner__title { top: calc(67 * var(--at-u)); font-size: calc(46 * var(--at-u)); }
  .at-banner--dark .at-banner__sub, .at-banner--light .at-banner__sub, .at-banner--bottom .at-banner__sub { top: calc(138 * var(--at-u)); font-size: calc(32 * var(--at-u)); } /* 副标 24 → 32（反馈 2026-10-20「统一 2rem」；按 --at-u 随屏宽缩放，1920 宽时正好 2rem，写死 2rem 在 4K 等宽屏上会比周围文字小；手机端 1.125rem 见 ≤767 的 .at-banner 规则） */
}
/* 更大功率的副标：旧稿 #b8b8b8，新稿 1299:47 改成白色（banner 本身就是白字，不再单独设色） */
/* 居中的三块副标末尾「。」不参与居中、挂在右边（字形只占左半格，算进宽度会显得整行偏左；反馈 2026-10-21「感觉没居中」，同首屏副标） */
.at-banner--dark .at-banner__punc, .at-banner--light .at-banner__punc, .at-banner--bottom .at-banner__punc { margin-right: -1em; }

/* --------------------------------------------------------------------------
   标题 + 宽图 1440×500 r40：
   algo（623:1597，高 840）内容 top 120，标题 → 副标 32/50 → 图，间距 20；
   connect（482:264，高 900）内容 top 60，标题 → 三组参数（数值 32 Medium、说明 24、组距 80）→ 图，间距 40
   -------------------------------------------------------------------------- */
.at-showcase { background: #fff; }
.at-showcase--algo { padding-top: calc(120 * var(--at-u)); padding-bottom: calc(73.32 * var(--at-u)); }
.at-showcase--connect { padding-top: calc(60 * var(--at-u)); padding-bottom: calc(119.32 * var(--at-u)); }
.at-showcase__sub { margin-top: calc(20 * var(--at-u)); font-size: calc(32 * var(--at-u)); line-height: calc(50 * var(--at-u)); color: var(--at-black); }
.at-showcase__stats { display: flex; align-items: flex-start; gap: calc(80 * var(--at-u)); margin: calc(40 * var(--at-u)) 0 0; }
.at-showcase__stat dt { font-size: calc(32 * var(--at-u)); font-weight: 500; line-height: normal; color: var(--at-black); white-space: nowrap; }
.at-showcase__stat dd { margin: calc(7 * var(--at-u)) 0 0; font-size: calc(24 * var(--at-u)); line-height: normal; color: var(--at-black); white-space: nowrap; }
.at-showcase__media { height: calc(500 * var(--at-u)); margin-top: calc(20 * var(--at-u)); border-radius: var(--at-radius-lg); overflow: hidden; background: #d9d9d9; }
.at-showcase__stats + .at-showcase__media { margin-top: calc(40 * var(--at-u)); }
.at-showcase__img { width: 100%; height: 100%; object-fit: cover; }

/* --------------------------------------------------------------------------
   精准聚音（482:43，高 840）：标题 top 104；两卡 701×530 r20 间距 40 top 205；
   渐变 rgba(0,0,0,.2)→透明(60%)；说明 32 Medium 白居中 top 430
   -------------------------------------------------------------------------- */
.at-focus { padding-top: calc(104 * var(--at-u)); padding-bottom: calc(105 * var(--at-u)); background: #fff; }
.at-focus .at-section__title { margin-bottom: calc(44.32 * var(--at-u)); }
.at-focus__cards { display: flex; gap: calc(40 * var(--at-u)); }
.at-focus__card { position: relative; flex: 1 1 0; height: calc(530 * var(--at-u)); border-radius: var(--at-radius); overflow: hidden; background: #ddd; color: #fff; }
.at-focus__media, .at-focus__img { position: absolute; inset: 0; width: 100%; height: 100%; }
.at-focus__img { object-fit: cover; }
.at-focus__media::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.2) 0%, rgba(102, 102, 102, 0) 60%);
}
.at-focus__caption { position: absolute; left: 0; right: 0; top: calc(430 * var(--at-u)); text-align: center; font-size: calc(32 * var(--at-u)); font-weight: 500; line-height: normal; }

/* --------------------------------------------------------------------------
   续航（482:280，高 900）：标题 top 99（高 62）；两卡 700×600 r20 黑底 间距 40 top 201；
   两组数字居中 top 430，组距 100：数值 46 Medium、说明 24（间距 5）
   -------------------------------------------------------------------------- */
.at-battery { padding-top: calc(99 * var(--at-u)); padding-bottom: calc(99 * var(--at-u)); background: #fff; }
.at-battery .at-section__title { line-height: calc(62 * var(--at-u)); margin-bottom: calc(40 * var(--at-u)); }
.at-battery__cards { display: flex; gap: calc(40 * var(--at-u)); }
.at-battery__card { position: relative; flex: 1 1 0; height: calc(600 * var(--at-u)); border-radius: var(--at-radius); overflow: hidden; background: #000; color: #fff; }
.at-battery__media, .at-battery__img { position: absolute; inset: 0; width: 100%; height: 100%; }
.at-battery__img { object-fit: cover; }
.at-battery__stats { position: absolute; left: 0; right: 0; top: calc(430 * var(--at-u)); margin: 0; display: flex; justify-content: center; align-items: flex-start; gap: calc(100 * var(--at-u)); }
.at-battery__stat dt { font-size: calc(46 * var(--at-u)); font-weight: 500; line-height: normal; white-space: nowrap; }
.at-battery__stat dd { margin: calc(5 * var(--at-u)) 0 0; font-size: calc(24 * var(--at-u)); line-height: normal; white-space: nowrap; }

/* --------------------------------------------------------------------------
   产品规格（482:144，高 1133，底 #f7f5f0）：标题 56 Medium top 94；表 top 208：
   行内边距 30、行高 27.807、线 rgba(0,0,0,.4)；参数 30 Medium #9f9f9f 宽 180，数值从 540 起（间距 360）；注释 18 #9f9f9f top 1020
   -------------------------------------------------------------------------- */
.at-specs { padding-top: calc(94 * var(--at-u)); padding-bottom: calc(89 * var(--at-u)); background: var(--at-bg-warm); }
.at-specs__title { font-size: calc(56 * var(--at-u)); font-weight: 500; line-height: normal; color: var(--at-black); }
.at-specs__table { margin: calc(40 * var(--at-u)) 0 0; border-top: 1px solid var(--at-faq-line); }
.at-specs__row { display: flex; align-items: center; gap: calc(360 * var(--at-u)); padding-block: calc(30 * var(--at-u)); border-bottom: 1px solid var(--at-faq-line); font-size: calc(30 * var(--at-u)); line-height: calc(27.807 * var(--at-u)); }
.at-specs__row dt { flex: none; width: calc(180 * var(--at-u)); font-weight: 500; color: var(--at-footer-muted); }
.at-specs__row dd { margin: 0; color: var(--at-black); white-space: nowrap; }
.at-specs__note { margin-top: calc(20 * var(--at-u)); max-width: calc(952 * var(--at-u)); font-size: calc(18 * var(--at-u)); line-height: normal; color: var(--at-footer-muted); }

/* --------------------------------------------------------------------------
   使用与服务（482:181，高 800，底 #f7f5f0）：右图 500×500 r40 白底 top 150；
   左文 top 198 宽 981：眉题 24 #9f9f9f → 标题 46（间距 32）→ 正文 32 宽 748（间距 40）→ 按钮（间距 40 / 15）
   -------------------------------------------------------------------------- */
.at-cta { padding-top: calc(150 * var(--at-u)); padding-bottom: calc(150 * var(--at-u)); background: var(--at-bg-warm); }
.at-cta__grid { display: flex; align-items: flex-start; justify-content: space-between; gap: calc(40 * var(--at-u)); }
.at-cta__copy { width: calc(981 * var(--at-u)); padding-top: calc(48 * var(--at-u)); }
.at-cta__eyebrow { font-size: calc(24 * var(--at-u)); font-weight: 500; line-height: normal; color: var(--at-footer-muted); }
.at-cta__title { font-size: calc(46 * var(--at-u)); font-weight: 500; line-height: normal; color: var(--at-black); }
.at-cta__eyebrow + .at-cta__title { margin-top: calc(32 * var(--at-u)); }
.at-cta__body { margin-top: calc(40 * var(--at-u)); width: calc(748 * var(--at-u)); max-width: 100%; font-size: calc(32 * var(--at-u)); line-height: normal; color: var(--at-black); }
.at-cta__actions { margin-top: calc(40 * var(--at-u)); gap: calc(15 * var(--at-u)); }
.at-cta__media { flex: none; width: calc(500 * var(--at-u)); height: calc(500 * var(--at-u)); border-radius: var(--at-radius-lg); overflow: hidden; background: #fff; }
.at-cta__img { width: 100%; height: 100%; object-fit: cover; }
/* App 下载码 + iOS / Android 切换（Frame 2085663576）：白框 500×500 不变；下方 20 处一排两个 240×78 按钮、间距 20，
   与昂听App 页首屏下载按钮同一套（248.5×81 一排 517）等比缩到 500 宽：圆角 19.3、图标 33.8×41.5 / 41.5×41.5、文字 31、图标与文字间距 30；
   选中：橙描边 + 橙色图标文字；未选中：浅灰描边 + 黑色图标文字（按反馈）。Android 文字框定宽、左对齐，同 App 页 */
.at-cta__side { flex: none; width: calc(500 * var(--at-u)); margin-top: calc(-50 * var(--at-u)); margin-bottom: calc(-48.2 * var(--at-u)); } /* 稿内区块仍高 800：白框顶边从 150 上移到 100，按钮底边 698.2，左文不动 */
.at-cta__qr { width: 100%; height: 100%; }
.at-cta__stores { display: flex; gap: calc(20 * var(--at-u)); margin-top: calc(20 * var(--at-u)); }
.at-cta__store { flex: 1 0 0; min-width: 0; display: flex; align-items: center; justify-content: center; gap: calc(30 * var(--at-u)); height: calc(78.2 * var(--at-u)); padding: 0; border: 1px solid var(--at-line-card); border-radius: calc(19.3 * var(--at-u)); background: none; color: var(--at-black); font: inherit; font-size: calc(31 * var(--at-u)); font-weight: 400; line-height: normal; white-space: nowrap; cursor: pointer; transition: border-color var(--at-dur) var(--at-ease), color var(--at-dur) var(--at-ease); }
.at-cta__store:hover { border-color: var(--at-black); }
.at-cta__store[aria-selected="true"] { border-color: var(--at-brand); color: var(--at-brand); }
.at-cta__store-icon { flex: none; display: block; }
.at-cta__store-icon svg { display: block; width: 100%; height: 100%; }
.at-cta__store-icon--ios { width: calc(33.8 * var(--at-u)); height: calc(41.5 * var(--at-u)); }
.at-cta__store-icon--android { width: calc(41.5 * var(--at-u)); height: calc(41.5 * var(--at-u)); }
.at-cta__store-icon--android + .at-cta__store-label { width: calc(123.6 * var(--at-u)); }

/* 常见问题（482:195，高 900）：标题 top 102；条目 top 216 起，问题 18px（首页是 24px）；5 条后留 108 */
.at-pro .at-faq { padding-top: calc(102 * var(--at-u)); padding-bottom: calc(108 * var(--at-u)); }
/* 产品页问题字号按反馈与首页统一（24），不再单独缩小 */
.at-pro .at-accordion__trigger { font-size: calc(24 * var(--at-u)); }

/* 窄屏兜底（仅保证不破版） */
@media (max-width: 1279px) {
  .at-subnav { display: none; }
  .at-site.single-at_product .at-header { position: sticky; }
  .at-adv__cards { grid-template-columns: 1fr; }
  .at-adv__card { height: auto; aspect-ratio: 459 / 600; }
  .at-adv__body { top: auto; bottom: 8%; }
  .at-banner { height: auto; aspect-ratio: 16 / 9; }
  .at-showcase__media { height: auto; aspect-ratio: 1440 / 500; }
  .at-showcase__stats { flex-wrap: wrap; gap: 24px; }
  .at-focus__cards, .at-battery__cards { flex-direction: column; }
  /* 竖排时必须去掉 flex: 1 1 0，否则高度被算成 0、整组卡不显示（浏览器缩放后屏宽可能是 767.5 这类小数，会落进这里） */
  .at-focus__card, .at-battery__card { flex: none; }
  .at-focus__card { height: auto; aspect-ratio: 701 / 530; }
  .at-focus__caption { top: auto; bottom: 12%; }
  .at-battery__card { height: auto; aspect-ratio: 700 / 600; }
  .at-battery__stats { top: auto; bottom: 10%; }
  .at-specs__row { gap: 24px; flex-wrap: wrap; }
  .at-specs__row dd { white-space: normal; }
  .at-cta__grid { flex-direction: column; }
  .at-cta__copy { width: auto; padding-top: 0; }
  .at-cta__media { width: min(500px, 100%); height: auto; aspect-ratio: 1; }
  .at-cta__side { width: min(500px, 100%); margin: 0; }
  .at-cta__side .at-cta__media { width: 100%; }
}

/* ==========================================================================
   产品详情页 · 听力豆版式 —— 按 Figma「国内设计文件 / 昂听听力豆」(507:999，1920 画板，总高 10831) 一比一实现
   悬浮条、首屏、产品规格、使用与服务、常见问题、页尾与 Pro3.0 版式共用上面的样式，这里只写差异；
   按钮全部沿用 .at-btn 体系（570:1278），不另起样式。
   ========================================================================== */

/* 首屏（507:1052）：与 Pro3.0 相同的文字与按钮位置，另叠一层自右向左的渐变（40% 处透明 → 左边缘 rgba(0,0,0,.6)），压暗左侧文字区 */
.at-pro--bean .at-hero__media::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(to left, rgba(102, 102, 102, 0) 40%, rgba(0, 0, 0, 0.6) 100%);
}

/* --------------------------------------------------------------------------
   小巧耳内（507:1063，高 900）：标题 top 135；两卡 700×530 r40 间距 40 top 236；说明 32 Medium 白居中 top 438；
   第一张渐变 rgba(0,0,0,.7)→透明(60%) 正片叠底，第二张 .2→透明(60%)
   -------------------------------------------------------------------------- */
.at-focus--fit { padding-top: calc(135 * var(--at-u)); padding-bottom: calc(134 * var(--at-u)); }
.at-focus--fit .at-section__title { margin-bottom: calc(40 * var(--at-u)); }
.at-focus--fit .at-focus__card { border-radius: var(--at-radius-lg); background: #e8e8e8; }
.at-focus--fit .at-focus__media::after { mix-blend-mode: multiply; background: linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, rgba(102, 102, 102, 0) 60%); }
.at-focus--fit .at-focus__card:nth-child(2) .at-focus__media::after { mix-blend-mode: normal; background: linear-gradient(to top, rgba(0, 0, 0, 0.2) 0%, rgba(102, 102, 102, 0) 60%); }
.at-focus--fit .at-focus__caption { top: calc(438 * var(--at-u)); }

/* --------------------------------------------------------------------------
   全幅图文带 · 左文形态：
   left（降噪 507:1137）渐变 rgba(0,0,0,.74)→透明(62.722%) 正片叠底；标题 46 白 left 240 top 348 宽 666；
     卖点两行 32 白（top 449 / 511）：图标槽 38 宽居中放图标，图标与文字间距 30（设计稿两行分别是 245+23.76+43 / 240+38+30，文字都从 ≈310 起）；
   stat（续航 507:1198）渐变 rgba(0,0,0,.7)→透明(56.43%) 正片叠底；标题 46 白 top 345 宽 648；
     闪电圆环 98.984 left 239 top 452.5；文字 left 377.98 top 446：说明 32 Light、数值 46 Semibold
   -------------------------------------------------------------------------- */
.at-banner--left, .at-banner--stat { text-align: left; }
.at-banner--left .at-banner__media::after, .at-banner--stat .at-banner__media::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply;
}
.at-banner--left .at-banner__media::after { background: linear-gradient(to right, rgba(0, 0, 0, 0.74) 0%, rgba(102, 102, 102, 0) 62.722%); }
.at-banner--stat .at-banner__media::after { background: linear-gradient(to right, rgba(0, 0, 0, 0.7) 0%, rgba(102, 102, 102, 0) 56.43%); }
.at-banner--left .at-banner__title, .at-banner--stat .at-banner__title { left: var(--at-pad); right: auto; font-size: calc(46 * var(--at-u)); }
.at-banner--left .at-banner__title { top: calc(348 * var(--at-u)); width: calc(666 * var(--at-u)); }
.at-banner--stat .at-banner__title { top: calc(345 * var(--at-u)); width: calc(648 * var(--at-u)); }
/* 要点两行（579:1387）：首行「柔和语音增强」麦克风图标 23.758×35.699 在 left 245、top 449，图标与文字间距 43；
   次行「AI智能降噪」图标 38×32.882 在 left 240、top 511，间距 30。两行各高 42（32px 文字的自然行高），行距 20。 */
.at-banner__points { position: absolute; left: var(--at-pad); top: calc(449 * var(--at-u)); display: flex; flex-direction: column; gap: calc(20 * var(--at-u)); }
.at-banner__point { display: flex; align-items: center; gap: calc(30 * var(--at-u)); }
.at-banner__point:first-child { gap: calc(43 * var(--at-u)); padding-left: calc(5 * var(--at-u)); }
.at-banner__point-icon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: calc(38 * var(--at-u)); height: calc(42 * var(--at-u)); }
.at-banner__point:first-child .at-banner__point-icon { width: auto; }
.at-banner__point-icon .at-adv__icon { width: calc(var(--i-w, 38) * var(--at-u)); height: calc(var(--i-h, 38) * var(--at-u)); }
.at-banner__point-text { font-size: calc(32 * var(--at-u)); line-height: normal; color: #fff; white-space: nowrap; }
.at-banner__stat { position: absolute; left: var(--at-pad); top: calc(418 * var(--at-u)); display: flex; align-items: center; gap: calc(40 * var(--at-u)); } /* 稿内 top 446；按反馈把标题到「助听模式长达」看得见的字距减半（约 56 → 28，盒子间距 40 → 12） */
.at-banner__stat-icon { flex: none; width: calc(98.984 * var(--at-u)); height: calc(98.984 * var(--at-u)); margin-top: calc(4 * var(--at-u)); }
.at-banner__stat-text { display: flex; flex-direction: column; color: #fff; white-space: nowrap; }
.at-banner__stat-label { font-size: calc(32 * var(--at-u)); font-weight: 300; line-height: normal; }
.at-banner__stat-value { font-size: calc(46 * var(--at-u)); font-weight: 600; line-height: normal; }

/* --------------------------------------------------------------------------
   串联横滑（507:1154 / 507:1171，高 950）：标题 top 74；卡 1439×600 r20 间距 40 top 175，横向滚动（同首页产品区）；
   渐变 rgba(0,0,0,.9)→透明(41.917%)；说明两行 32 Medium 白 left 70 top 460；前后按钮 top 815（卡下 40），底留 75
   -------------------------------------------------------------------------- */
.at-link { padding-top: calc(74 * var(--at-u)); padding-bottom: calc(75 * var(--at-u)); background: #fff; }
.at-link .at-section__title { margin-bottom: calc(40 * var(--at-u)); }
.at-link__track {
  display: flex; gap: calc(40 * var(--at-u)); overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scroll-behavior: smooth;
  padding-inline: var(--at-gutter); scroll-padding-inline: var(--at-gutter); scrollbar-width: none;
}
.at-link__track::-webkit-scrollbar { display: none; }
.at-link__card {
  position: relative; flex: 0 0 calc(1439 * var(--at-u)); height: calc(600 * var(--at-u));
  border-radius: var(--at-radius); overflow: hidden; background: #222; scroll-snap-align: start; color: #fff;
}
.at-link__media, .at-link__img { position: absolute; inset: 0; width: 100%; height: 100%; }
.at-link__img { object-fit: cover; }
.at-link__media::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.9) 0%, rgba(102, 102, 102, 0) 41.917%);
}
/* 按反馈：右侧露出一截的下一张卡先不显示文字，滑到当前位置（main.js carousel 加 .is-current）后再出现，节奏与页面入场动效一致（下方 32px 淡入上滑、600ms 慢出） */
.at-link__card .at-link__caption { opacity: 0; transform: translateY(32px); transition: opacity 0.6s cubic-bezier(0, 0, 0.3, 1), transform 0.6s cubic-bezier(0, 0, 0.3, 1); }
.at-link__card.is-current .at-link__caption { opacity: 1; transform: none; }
.at-link__track.is-jumping .at-link__caption { transition: none; } /* 首尾相接：停在副本上瞬间换回真卡时，文字不重新淡入 */
.at-link__caption { position: absolute; left: calc(70 * var(--at-u)); top: calc(460 * var(--at-u)); width: calc(494 * var(--at-u)); font-size: calc(32 * var(--at-u)); font-weight: 500; line-height: normal; }

/* --------------------------------------------------------------------------
   科技三卡（507:1155，高 900）：标题居中 top 99；卡 top 200（同核心优势的 459×600 r20 间距 31）；
   文字 left 43 / top 460 宽 374：标题 32 Medium、说明 18，间距 20；渐变 rgba(0,0,0,.6)→透明(45%) 正片叠底；没有图标
   -------------------------------------------------------------------------- */
.at-adv--tech { padding-top: calc(99 * var(--at-u)); padding-bottom: calc(100 * var(--at-u)); }
.at-adv--tech .at-section__title { text-align: center; margin-bottom: calc(40 * var(--at-u)); }
.at-adv--tech .at-adv__media::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(102, 102, 102, 0) 45%); }
.at-adv--tech .at-adv__body { left: calc(43 * var(--at-u)); right: auto; top: calc(460 * var(--at-u)); width: calc(374 * var(--at-u)); justify-content: flex-start; }
.at-adv--tech .at-adv__text { gap: calc(20 * var(--at-u)); }
.at-adv--tech .at-adv__title { margin-top: 0; white-space: normal; }
.at-adv--tech .at-adv__desc { font-size: calc(18 * var(--at-u)); white-space: normal; }

/* --------------------------------------------------------------------------
   耳帽与耳翼（507:1025，高 900）：标题 top 116；左图 835×466 r40 top 217，按钮 310×60 压在图右下（距右 48 / 距底 32）；
   右列 left 1179（间距 104）宽 501：正文 24 top 326（宽 491）→ 步骤 top 462 间距 20，18px，序号橙色，文字从 51 起
   -------------------------------------------------------------------------- */
.at-tips { padding-top: calc(116 * var(--at-u)); padding-bottom: calc(217 * var(--at-u)); background: #fff; }
.at-tips .at-section__title { margin-bottom: calc(40 * var(--at-u)); }
/* 按新稿 1490:42：图 644×466；右列 left 1023 宽 657，与图垂直居中（稿内 top 302 / 高 296，中线同为 450）：三步在上（32px，间距 20，序号橙、文字从 69 起），间距 40，再是说明 18px（宽 647） */
.at-tips__grid { display: flex; align-items: center; gap: calc(139 * var(--at-u)); }
.at-tips__media { position: relative; flex: none; width: calc(644 * var(--at-u)); height: calc(466 * var(--at-u)); border-radius: var(--at-radius-lg); overflow: hidden; background: #cfcfcf; }
.at-tips__img { width: 100%; height: 100%; object-fit: cover; }
.at-tips__btn { position: absolute; right: calc(47 * var(--at-u)); bottom: calc(32 * var(--at-u)); min-width: calc(310 * var(--at-u)); }
.at-tips__side { display: flex; flex-direction: column; width: calc(657 * var(--at-u)); }
.at-tips__body { order: 2; width: calc(647 * var(--at-u)); max-width: 100%; margin-top: calc(40 * var(--at-u)); font-size: calc(18 * var(--at-u)); line-height: normal; color: var(--at-black); }
.at-tips__steps { order: 1; display: flex; flex-direction: column; gap: calc(20 * var(--at-u)); }
.at-tips__step { position: relative; padding-left: calc(69 * var(--at-u)); font-size: calc(32 * var(--at-u)); line-height: normal; color: var(--at-black); }
.at-tips__num { position: absolute; left: 0; top: 0; color: var(--at-brand); }

/* --------------------------------------------------------------------------
   场景页签（507:1188，高 800）：标题居中 top 0；图 1440×600 r40 top 100，渐变 rgba(0,0,0,.5)→透明 正片叠底；
   页签一排居中 top 480 间距 22，按钮 179×60：选中橙色实心，其余白描边（.at-btn 三态照旧）
   -------------------------------------------------------------------------- */
.at-scene { padding-top: 0; padding-bottom: calc(100 * var(--at-u)); background: #fff; }
.at-scene__title { text-align: center; margin-bottom: calc(39 * var(--at-u)); }
.at-scene__stage { position: relative; height: calc(600 * var(--at-u)); border-radius: var(--at-radius-lg); overflow: hidden; background: #d2d2d2; }
.at-scene__panel { position: absolute; inset: 0; }
.at-scene__panel::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(102, 102, 102, 0) 100%);
}
.at-scene__img { width: 100%; height: 100%; object-fit: cover; }
/* 页签在模板里放在图片容器后面（手机端要竖排到图下方），PC 端靠绝对定位压回图上：
   卡片形态相对容器定位，距容器底 60（= 图高 600 - top 480 - 按钮 60），与原先 top 480 同一位置。 */
.at-scene .at-container { position: relative; }
.at-scene__tabs { position: absolute; left: 0; right: 0; bottom: calc(60 * var(--at-u)); display: flex; justify-content: center; gap: calc(22 * var(--at-u)); }
/* 图内指示圆点只在手机端显示 */
.at-scene__dots { display: none; }
.at-scene__tab { width: calc(179 * var(--at-u)); padding-inline: 0; }
.at-scene__tab[aria-selected="true"] { background: var(--at-brand); border-color: var(--at-brand); color: #fff; box-shadow: none; }
.at-scene__tab[aria-selected="true"]:hover { background: var(--at-brand-hover); border-color: var(--at-brand-hover); }
.at-scene__tab[aria-selected="true"]:active { background: var(--at-brand-press); border-color: var(--at-brand-press); }

/* 产品规格（507:1208，高 1309）：标题 46（Pro3.0 是 56）top 94，表 top 208；注释 14px；底留 94 */
.at-pro--bean .at-specs { padding-bottom: calc(94 * var(--at-u)); }
.at-pro--bean .at-specs__title { font-size: calc(46 * var(--at-u)); }
.at-pro--bean .at-specs__table { margin-top: calc(53 * var(--at-u)); }
.at-pro--bean .at-specs__note { font-size: calc(14 * var(--at-u)); }

/* 使用与服务（507:1245，高 900）：右图 500×500 top 200；左文 top 251 宽 981，眉题 → 标题 → 正文（宽 769）→ 按钮 间距都是 40；
   按钮「查看使用支持」210×60 橙 + 「查看佩戴与维护 →」280×60 黑描边 */
.at-pro--bean .at-cta { padding-top: calc(200 * var(--at-u)); padding-bottom: calc(200 * var(--at-u)); }
.at-pro--bean .at-cta__copy { padding-top: calc(51 * var(--at-u)); }
.at-pro--bean .at-cta__eyebrow + .at-cta__title { margin-top: calc(40 * var(--at-u)); }
.at-pro--bean .at-cta__body { width: calc(769 * var(--at-u)); }
.at-pro--bean .at-cta__actions .at-btn--primary { min-width: calc(210 * var(--at-u)); }
.at-pro--bean .at-cta__actions .at-btn--outline-dark { min-width: calc(280 * var(--at-u)); }

/* ==========================================================================
   产品详情页 · Pro1.0 版式 —— 按 Figma「国内设计文件 / 昂听Pro1.0」(526:297，1920 画板，总高 11985) 一比一实现
   悬浮条、首屏、产品规格、使用与服务、常见问题、页尾与 Pro3.0 相同；按钮沿用 .at-btn 体系。
   ========================================================================== */

/* 首屏（526:347）：同听力豆的左侧渐变，但设计稿用的是「明度」混合（图片左侧压暗并去色） */
.at-pro--pro1 .at-hero__media::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: luminosity;
  background: linear-gradient(to left, rgba(102, 102, 102, 0) 40%, rgba(0, 0, 0, 0.6) 100%);
}

/* --------------------------------------------------------------------------
   图 + 文两栏：图与文字块按设计稿在 1920 容器内绝对定位（left 直接取 Figma 的 x），每个 key 一组数值
   -------------------------------------------------------------------------- */
.at-split { background: #fff; }
.at-split__inner { position: relative; }
.at-split__media { position: absolute; border-radius: var(--at-radius-lg); overflow: hidden; background: #e8e8e8; }
.at-split__img { width: 100%; height: 100%; object-fit: cover; }
.at-split__copy { position: absolute; display: flex; flex-direction: column; align-items: flex-start; color: var(--at-black); }
.at-split__title { font-size: calc(46 * var(--at-u)); font-weight: 500; line-height: normal; }
.at-split__sub, .at-split__body { font-size: calc(32 * var(--at-u)); line-height: normal; }
.at-split__steps { display: flex; flex-direction: column; gap: calc(20 * var(--at-u)); }
.at-split__step { position: relative; padding-left: calc(51 * var(--at-u)); font-size: calc(24 * var(--at-u)); line-height: normal; white-space: nowrap; }
.at-split__num { position: absolute; left: 0; top: 0; color: var(--at-brand); }

/* mic 双麦定向拾音（526:427，高 840）：图 920×700 在 x 758 / top 70；左文 top 328：标题两行 + 说明 32 top 470 */
.at-split--mic .at-split__inner { height: calc(840 * var(--at-u)); }
.at-split--mic .at-split__media { left: calc(758 * var(--at-u)); top: calc(70 * var(--at-u)); width: calc(920 * var(--at-u)); height: calc(700 * var(--at-u)); }
.at-split--mic .at-split__copy { left: var(--at-pad); top: calc(328 * var(--at-u)); width: calc(500 * var(--at-u)); }
.at-split--mic .at-split__sub { margin-top: calc(20 * var(--at-u)); white-space: nowrap; }

/* wear 日常佩戴更自然（526:432，高 820）：图 675×700 在左 top 60；右文 x 1065 / top 208 宽 614，标题 → 正文 32 → 三步 24，间距 40 */
.at-split--wear .at-split__inner { height: calc(770 * var(--at-u)); } /* 按反馈整块上移 50（稿内 820，图顶 60 / 文字顶 208），与上面「双麦定向拾音」的图距 130 → 80，下方间距不变 */
.at-split--wear .at-split__media { left: var(--at-pad); top: calc(10 * var(--at-u)); width: calc(675 * var(--at-u)); height: calc(700 * var(--at-u)); background: #cfcfcf; }
.at-split--wear .at-split__copy { left: calc(1065 * var(--at-u)); top: calc(158 * var(--at-u)); width: calc(614 * var(--at-u)); gap: calc(40 * var(--at-u)); }

/* phone 连上手机（526:323，高 760）：图 706×600 在左 top 80，图上渐变 60%→透明(60%) 正片叠底，参数 left 130 / top 453（数值 46 Medium，说明 18，第一组宽 159）；
   右文 x 1096 / top 252 宽 584：标题 → 正文 24（宽 533）→ 「查看连接步骤 →」230×60，间距 20 */
.at-split--phone .at-split__inner { height: calc(760 * var(--at-u)); }
.at-split--phone .at-split__media { left: var(--at-pad); top: calc(80 * var(--at-u)); width: calc(706 * var(--at-u)); height: calc(600 * var(--at-u)); }
.at-split--phone .at-split__media::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(102, 102, 102, 0) 60%);
}
.at-split__stats { position: absolute; z-index: 1; left: calc(130 * var(--at-u)); top: calc(453 * var(--at-u)); margin: 0; display: flex; align-items: flex-start; color: #fff; }
.at-split__stat:first-child { width: calc(159 * var(--at-u)); }
.at-split__stat dt { font-size: calc(46 * var(--at-u)); font-weight: 500; line-height: calc(52 * var(--at-u)); white-space: nowrap; }
.at-split__stat dd { margin: calc(15 * var(--at-u)) 0 0; font-size: calc(18 * var(--at-u)); line-height: normal; white-space: nowrap; }
.at-split--phone .at-split__copy { left: calc(1096 * var(--at-u)); top: calc(252 * var(--at-u)); width: calc(584 * var(--at-u)); gap: calc(20 * var(--at-u)); }
.at-split--phone .at-split__title { width: calc(645 * var(--at-u)); white-space: nowrap; }
.at-split--phone .at-split__body { width: calc(533 * var(--at-u)); font-size: calc(32 * var(--at-u)); } /* 正文 24 → 32（反馈 2026-10-20「统一 2rem」，同 Pro3.0 三块 banner 副标、同下面验配师正文；按 --at-u 缩放，1920 宽时即 2rem；手机端 1.125rem） */
.at-split--phone .at-split__actions .at-btn { min-width: calc(230 * var(--at-u)); }

/* fitting 验配师保驾护航（526:422，高 760）：左文 top 297（标题 → 正文 32 宽 533，间距 20）；图 783×600 在 x 897 / top 83 */
.at-split--fitting .at-split__inner { height: calc(760 * var(--at-u)); }
.at-split--fitting .at-split__copy { left: var(--at-pad); top: calc(297 * var(--at-u)); width: calc(648 * var(--at-u)); gap: calc(20 * var(--at-u)); }
.at-split--fitting .at-split__body { width: calc(533 * var(--at-u)); }
.at-split--fitting .at-split__media { left: calc(897 * var(--at-u)); top: calc(83 * var(--at-u)); width: calc(783 * var(--at-u)); height: calc(600 * var(--at-u)); background: #d9d9d9; }

/* ip IP66 防尘防水（526:476，高 900）：图 1002×700 在左 top 100；右文 x 1392 / top 389：标题 + 说明 32（top 470） */
.at-split--ip .at-split__inner { height: calc(900 * var(--at-u)); }
.at-split--ip .at-split__media { left: var(--at-pad); top: calc(100 * var(--at-u)); width: calc(1002 * var(--at-u)); height: calc(700 * var(--at-u)); background: #cfcfcf; }
.at-split--ip .at-split__copy { left: calc(1392 * var(--at-u)); top: calc(389 * var(--at-u)); }
.at-split--ip .at-split__title, .at-split--ip .at-split__sub { white-space: nowrap; }
.at-split--ip .at-split__sub { margin-top: calc(20 * var(--at-u)); }

/* --------------------------------------------------------------------------
   全幅图文带 · Pro1.0 的两种左文形态
   stats（频响 526:447）：渐变 黑→透明(57.694%) 正片叠底，底 #858585；标题 top 349；参数行 top 430：数值 46 Semibold + 说明 32 Light
   left · k-bands（64 频段 526:472）：渐变 60%→透明(48.846%)；标题 top 388、副标 32 top 469
   -------------------------------------------------------------------------- */
.at-banner--stats { text-align: left; background: #858585; }
.at-banner--stats .at-banner__media::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply;
  background: linear-gradient(to right, #000 0%, rgba(102, 102, 102, 0) 57.694%);
}
.at-banner--stats .at-banner__title { left: var(--at-pad); right: auto; top: calc(349 * var(--at-u)); font-size: calc(46 * var(--at-u)); white-space: nowrap; }
.at-banner__figures { position: absolute; left: var(--at-pad); top: calc(430 * var(--at-u)); margin: 0; display: flex; flex-direction: column; color: #fff; }
.at-banner__figure { display: flex; align-items: baseline; gap: calc(12 * var(--at-u)); white-space: nowrap; }
.at-banner__figure dt { font-size: calc(46 * var(--at-u)); font-weight: 600; line-height: normal; }
.at-banner__figure dd { margin: 0; font-size: calc(32 * var(--at-u)); font-weight: 300; line-height: normal; }
.at-banner--left .at-banner__sub { left: var(--at-pad); right: auto; text-align: left; white-space: nowrap; }
.at-banner--k-bands .at-banner__media::after { background: linear-gradient(to right, rgba(0, 0, 0, 0.6) 0%, rgba(102, 102, 102, 0) 48.846%); }
.at-banner--k-bands .at-banner__title { top: calc(388 * var(--at-u)); width: calc(593 * var(--at-u)); }
.at-banner--k-bands .at-banner__sub { top: calc(469 * var(--at-u)); }

/* 降噪两卡（526:452，高 900）：标题 top 134；两卡 700×530 r40 间距 40 top 235；说明 top 430（同 Pro3.0 聚音）；渐变 20%→透明(60%) */
.at-focus--denoise { padding-top: calc(134 * var(--at-u)); padding-bottom: calc(135 * var(--at-u)); }
.at-focus--denoise .at-section__title { margin-bottom: calc(40 * var(--at-u)); }
.at-focus--denoise .at-focus__card { border-radius: var(--at-radius-lg); background: #000; }

/* 多场景页签 · 铺满形态（526:461，高 900）：图铺满，顶部渐变 40%→透明(44%) 正片叠底；标题 46 白居中 top 51、副标 24 top 122；页签 top 789 */
.at-scene--full { position: relative; height: calc(900 * var(--at-u)); padding: 0; overflow: hidden; background: #000; }
.at-scene--full .at-container { position: static; }
.at-scene--full .at-scene__stage { position: absolute; inset: 0; height: auto; border-radius: 0; }
.at-scene--full .at-scene__panel::after { background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0%, rgba(102, 102, 102, 0) 44.029%); }
/* 标题块在模板里位于图片容器之前，z-index 保证它压在铺满的图上 */
.at-scene__copy { position: absolute; z-index: 1; left: 0; right: 0; top: calc(51 * var(--at-u)); text-align: center; color: #fff; }
.at-scene--full .at-scene__title { margin: 0; color: #fff; }
.at-scene__sub { margin-top: calc(10 * var(--at-u)); font-size: calc(24 * var(--at-u)); line-height: normal; }
.at-scene--full .at-scene__tabs { top: calc(789 * var(--at-u)); bottom: auto; }

/* 窄屏兜底（仅保证不破版） */
@media (max-width: 1279px) {
  .at-split__inner { height: auto !important; display: flex; flex-direction: column; gap: 24px; padding-block: 40px; }
  .at-split__media, .at-split__copy { position: static !important; width: 100% !important; }
  .at-split__media { height: auto !important; aspect-ratio: 4 / 3; }
  .at-split--wear .at-split__media, .at-split--ip .at-split__media { order: -1; }
  .at-split__step { white-space: normal; }
  .at-split__stats { left: 24px; top: auto; bottom: 24px; }
  .at-banner__figures { top: auto; bottom: 10%; }
  .at-scene--full { height: auto; aspect-ratio: 16 / 9; }
  /* 1280 以下横幅按 16:9 缩放，标题与要点改按设计稿在 900 高里的比例定位（348/900、449/900），保持和标题的间距 */
  .at-banner--left .at-banner__title { top: 38.67%; }
  .at-banner__points { top: 49.9%; bottom: auto; }
  .at-banner__stat { top: auto; bottom: 10%; }
  .at-link__card { flex-basis: min(1000px, 85vw); height: auto; aspect-ratio: 1439 / 600; }
  .at-link__caption { top: auto; bottom: 8%; }
  .at-adv--tech .at-adv__body { top: auto; bottom: 8%; }
  .at-tips__grid { flex-direction: column; align-items: stretch; gap: 32px; }
  .at-tips__media { width: 100%; height: auto; aspect-ratio: 644 / 466; }
  .at-tips__side { width: auto; padding-top: 0; }
  .at-scene__stage { height: auto; aspect-ratio: 1440 / 600; }
  .at-scene__tabs { top: auto; bottom: 6%; flex-wrap: wrap; gap: 12px; padding-inline: 16px; }
}

/* ==========================================================================
   产品比较页 —— 按 Figma「国内设计文件 / 比较页」(527:527，1920 画板，总高 2808) 一比一实现
   导航白底黑字（530:912）；首屏 900 白底；对比表 1336 底 #f7f5f0；页尾与首页共用。按钮沿用 .at-btn 体系。
   ========================================================================== */

/* 导航（530:912）：吸顶但底色透明、黑字、没有底线 —— 滚到哪里就透出哪里的底色（白色首屏 / 米色对比表）；展开扩展面板时临时白底，面板才可读 */
.at-site.page-template-page-compare .at-header { background: transparent; border-bottom-color: transparent; transition: background var(--at-dur) var(--at-ease), backdrop-filter var(--at-dur) var(--at-ease), -webkit-backdrop-filter var(--at-dur) var(--at-ease); }
/* 滚动后（.is-scrolled，main.js headerGlass）：黑字导航垫 60% 白 + 35px 毛玻璃底，与首页滚动态同一做法（首页是白字所以垫 20% 黑） */
.at-site.page-template-page-compare .at-header.is-scrolled:not(.is-mega) { background: rgba(255, 255, 255, 0.6); -webkit-backdrop-filter: blur(35px); backdrop-filter: blur(35px); }
.at-site.page-template-page-compare .at-header.is-mega { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; }
/* 使用指南页导航（反馈 2026-10-20 截图「该模糊并且去掉这条线」）：一直是毛玻璃（白 60% + 模糊 35，同比较页滚动后），不画底线。
   毛玻璃画在 ::before 上：手机端导航条本身加 backdrop-filter 会把 fixed 的客服按钮收进导航（同首页 / 比较页手机端的做法）；展开扩展面板时临时白底。 */
.at-site.page-template-page-manual .at-header { background: transparent; border-bottom-color: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; }
.at-site.page-template-page-manual .at-header::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: rgba(255, 255, 255, 0.6); -webkit-backdrop-filter: blur(35px); backdrop-filter: blur(35px); }
.at-site.page-template-page-manual .at-header.is-mega { background: #fff; }
/* 首屏（527:528）：设计稿的 y 从导航顶边起算，区块上移一个导航高度（导航透明，压在首屏顶部的空白上），top 149 / 386 与设计稿一致 */
.at-compare__hero { position: relative; height: calc(900 * var(--at-u)); margin-top: calc(-62.189 * var(--at-u)); background: #fff; }
.at-compare__hero .at-container { position: relative; height: 100%; }
.at-compare__title { position: absolute; left: 0; right: 0; top: calc(149 * var(--at-u)); text-align: center; font-size: calc(66 * var(--at-u)); font-weight: 500; line-height: normal; color: var(--at-black); }
.at-compare__sub { position: absolute; left: 0; right: 0; top: calc(249 * var(--at-u)); text-align: center; font-size: calc(32 * var(--at-u)); line-height: normal; color: var(--at-black); }
/* 产品卡（1497:81，2026-10-19 新稿）：460×422 底 #f7f5f0，间距 30，整排居中 top 386（三张共 1440 宽）；卡内内容宽 222，顶部留 23，图框 222×231、图与文字、文字与按钮间距各 15 */
.at-compare__cards { position: absolute; left: 0; right: 0; top: calc(386 * var(--at-u)); display: flex; justify-content: center; gap: calc(30 * var(--at-u)); }
.at-ccard {
  flex: none; width: calc(460 * var(--at-u)); height: calc(422 * var(--at-u)); padding-top: calc(23 * var(--at-u));
  display: flex; flex-direction: column; align-items: center; gap: calc(15 * var(--at-u));
  background: var(--at-bg-warm); border-radius: var(--at-radius); /* 稿内 35（旧稿 15.865），按反馈全站卡片统一 25 */
}
.at-ccard__media { display: block; width: calc(222 * var(--at-u)); height: calc(231 * var(--at-u)); }
.at-ccard__img, .at-ccard__media .at-placeholder { width: 100%; height: 100%; object-fit: contain; min-height: 0; }
.at-ccard__text { text-align: center; }
.at-ccard__name { font-size: calc(32 * var(--at-u)); font-weight: 500; line-height: normal; color: var(--at-black); white-space: nowrap; }
.at-ccard__sub { font-size: calc(18 * var(--at-u)); line-height: normal; color: var(--at-footer-muted); white-space: nowrap; }
.at-ccard__actions { width: calc(222 * var(--at-u)); gap: calc(15 * var(--at-u)); flex-wrap: nowrap; }
/* 「产品详情」97×35 描边 + 「天猫购买 →」110×35 橙：文字 56 + 箭头 14.17 + 间距 7.9，内边距 16 */
.at-ccard__detail { width: calc(97 * var(--at-u)); padding-inline: 0; }
.at-ccard__actions .at-btn--primary { width: calc(110 * var(--at-u)); padding-inline: 0; }
.at-ccard__actions .at-btn--primary .at-btn__arrow { --a-w: 14.167; --a-h: 8.34; }
.at-ccard__actions .at-btn--primary:hover .at-btn__arrow { --a-w: 25.07; }
.at-ccard__actions .at-status { height: calc(35 * var(--at-u)); font-size: calc(14 * var(--at-u)); }

/* 对比表（527:567，高 1336）：表头 top 125（「对比项目」24 Medium；产品名 28 Medium 居中于各列）；
   表 top 202：行高 88、线 rgba(0,0,0,.4)，参数 18 Medium #9f9f9f 左对齐，数值 18 居中、行高 27.807；注释 16 #9f9f9f top 1190
   列宽：三款产品时按设计稿各列中心（454.5 / 888.5 / 1312）解出 316 / 277 / 591 / 256；其他数量时首列 316、其余等分 */
.at-compare__table-wrap { padding-top: calc(125 * var(--at-u)); padding-bottom: calc(125 * var(--at-u)); background: var(--at-bg-warm); }
.at-ctable { width: 100%; border-collapse: collapse; table-layout: fixed; color: var(--at-black); }
.at-ctable col, .at-ctable th, .at-ctable td { padding: 0; }
.at-ctable thead th { padding-bottom: calc(40 * var(--at-u)); text-align: center; font-size: calc(28 * var(--at-u)); font-weight: 500; line-height: normal; vertical-align: top; white-space: nowrap; }
.at-ctable thead .at-ctable__label-head { text-align: left; font-size: calc(24 * var(--at-u)); padding-top: calc(5 * var(--at-u)); }
.at-ctable tbody tr { border-top: 1px solid var(--at-faq-line); }
.at-ctable tbody tr:last-child { border-bottom: 1px solid var(--at-faq-line); }
.at-ctable tbody th, .at-ctable tbody td { height: calc(88 * var(--at-u)); font-size: calc(18 * var(--at-u)); line-height: calc(27.807 * var(--at-u)); vertical-align: middle; }
.at-ctable tbody th { text-align: left; font-weight: 500; color: var(--at-footer-muted); white-space: nowrap; }
.at-ctable tbody td { text-align: center; }
.at-ctable th:first-child, .at-ctable td:first-child { width: calc(316 * var(--at-u)); }
.at-ctable[style*="--at-cols: 3"] th:nth-child(2), .at-ctable[style*="--at-cols: 3"] td:nth-child(2) { width: calc(277 * var(--at-u)); }
.at-ctable[style*="--at-cols: 3"] th:nth-child(3), .at-ctable[style*="--at-cols: 3"] td:nth-child(3) { width: calc(591 * var(--at-u)); }
.at-ctable[style*="--at-cols: 3"] th:nth-child(4), .at-ctable[style*="--at-cols: 3"] td:nth-child(4) { width: calc(256 * var(--at-u)); }
.at-ctable__note { margin-top: calc(20 * var(--at-u)); max-width: calc(952 * var(--at-u)); font-size: calc(16 * var(--at-u)); line-height: normal; color: var(--at-footer-muted); }

/* ==========================================================================
   关于VOCCLEAR 页 —— 按 Figma「国内设计文件 / 关于VOCCLEAR」(1071:81，1920 画板，总高 6279) 一比一实现
   导航透明白字压在首屏上（1071:168，同首页 / 产品页）；页尾与首页共用。文案与图片在「首页设置 → 关于VOCCLEAR 页」里改。
   ========================================================================== */
.at-vc__title { font-size: calc(46 * var(--at-u)); font-weight: 500; line-height: normal; color: var(--at-black); }
.at-vc__body { font-size: calc(32 * var(--at-u)); line-height: normal; color: var(--at-black); }
.at-vc__title--light, .at-vc__body--light { color: #fff; }
/* 首屏（1178:2468，原 1071:82）：全幅 1920×900，上移一个导航高度让透明导航压在图上；标题 66 Medium 白居中 top 153。
   新稿的底部压暗渐变（透明 @37% → 黑 68% @88.2%）是画板底色，被上面不透明的芯片图（1178:2470）整个盖住，导出图底部没有压暗，所以 PC 不叠渐变；手机端的顶部压暗在下面手机一节里另给 */
.at-vc__hero { position: relative; height: calc(900 * var(--at-u)); margin-top: calc(-62.189 * var(--at-u)); overflow: hidden; background: #000; color: #fff; }
.at-vc__hero-media, .at-vc__hero-media picture { position: absolute; inset: 0; }
.at-vc__hero-img, .at-vc__hero-media .at-placeholder { width: 100%; height: 100%; object-fit: cover; object-position: center; min-height: 0; }
/* 超过 1920 宽时整块首屏按屏宽等比放大，见产品页首屏一节的「全幅图区块宽屏自适应」 */
.at-vc__hero-media::after { content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply; }
.at-vc__hero-title { position: absolute; left: 0; right: 0; top: calc(153 * var(--at-u)); z-index: 1; text-align: center; font-size: calc(66 * var(--at-u)); font-weight: 500; line-height: normal; white-space: nowrap; }
/* AI 智能语音优化（1071:91）：底 #1d1d1d，内边距 120/240，底线白 15%；左 535 宽：标题 46 白 + 正文 18 #b8b8b8（间距 24）；右三组参数间距 64：数值 46 Semibold 橙、说明 16 白、间距 8 */
.at-vc__opt { background: var(--at-bg-dark); border-bottom: 1px solid rgba(255, 255, 255, 0.15); }
.at-vc__opt-inner { display: flex; align-items: center; justify-content: space-between; gap: calc(60 * var(--at-u)); padding-top: calc(120 * var(--at-u)); padding-bottom: calc(120 * var(--at-u)); }
.at-vc__opt-copy { flex: none; display: flex; flex-direction: column; gap: calc(24 * var(--at-u)); width: calc(535 * var(--at-u)); }
.at-vc__opt-body { font-size: calc(18 * var(--at-u)); line-height: normal; color: #b8b8b8; }
.at-vc__stats { display: flex; gap: calc(64 * var(--at-u)); margin: 0; white-space: nowrap; }
.at-vc__stat { display: flex; flex-direction: column; gap: calc(8 * var(--at-u)); }
.at-vc__stat dt { font-size: calc(46 * var(--at-u)); font-weight: 600; line-height: normal; color: var(--at-brand); }
.at-vc__stat dd { margin: 0; font-size: calc(16 * var(--at-u)); line-height: normal; color: #fff; }
.at-count { display: inline-block; text-align: left; font-variant-numeric: tabular-nums; } /* 数字读数（main.js countUp）：等宽数字 + 起跑前按终值占宽，单位不跟着跳 */
/* 图文两栏（1071:86 反馈抑制：图左 680×520，区块高 790、上 2 下 120；1071:119 定向聚焦：图右 680×460，区块高 800、上下 120）：图圆角 20，图文间距 120，标题与正文间距 20 */
.at-vc__feature { background: #fff; }
.at-vc__feature-inner { box-sizing: border-box; display: flex; align-items: center; gap: calc(120 * var(--at-u)); }
.at-vc__feature--feedback .at-vc__feature-inner { height: calc(790 * var(--at-u)); padding-top: calc(2 * var(--at-u)); padding-bottom: calc(120 * var(--at-u)); }
.at-vc__feature--focus .at-vc__feature-inner { height: calc(800 * var(--at-u)); padding-top: calc(120 * var(--at-u)); padding-bottom: calc(120 * var(--at-u)); }
.at-vc__feature-media { flex: none; width: calc(680 * var(--at-u)); height: calc(520 * var(--at-u)); border-radius: var(--at-radius); overflow: hidden; background: #d9d9d9; }
.at-vc__feature--focus .at-vc__feature-media { height: calc(460 * var(--at-u)); }
.at-vc__feature-img, .at-vc__feature-media .at-placeholder { width: 100%; height: 100%; object-fit: cover; min-height: 0; }
.at-vc__feature-copy { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: calc(20 * var(--at-u)); }
.at-vc__feature--focus .at-vc__title { white-space: nowrap; }
/* AI 智能降噪（1071:113）：高 900 白底，标题 46 → 正文 32/50 宽 1180 → 图 1440×600 圆角 20，间距 20 */
.at-vc__denoise { height: calc(900 * var(--at-u)); overflow: hidden; background: #fff; }
.at-vc__denoise-inner { display: flex; flex-direction: column; gap: calc(20 * var(--at-u)); }
.at-vc__denoise-body { width: calc(1180 * var(--at-u)); max-width: 100%; line-height: calc(50 * var(--at-u)); }
.at-vc__denoise-media { width: 100%; height: calc(600 * var(--at-u)); border-radius: var(--at-radius); overflow: hidden; background: #d9d9d9; }
.at-vc__denoise-img, .at-vc__denoise-media .at-placeholder { width: 100%; height: 100%; object-fit: cover; min-height: 0; }
/* 全幅图文带 1920×900 正片叠底（1071:105 风噪：底部压暗 45% → 透明 @63.5%，标题 top 617 宽 657、正文 top 698 宽 1195，x 240；1071:109 突发噪声：上下压暗 45%，标题居中 top 67、正文居中 top 718 宽 909） */
.at-vc__banner { position: relative; height: calc(900 * var(--at-u)); overflow: hidden; background: #000; color: #fff; }
.at-vc__banner-media, .at-vc__banner-img, .at-vc__banner-media .at-placeholder { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; }
.at-vc__banner-img { object-fit: cover; }
.at-vc__banner-media::after { content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply; }
.at-vc__banner--wind .at-vc__banner-media::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(102, 102, 102, 0) 63.462%); } /* 1178:2491：新稿底部黑 60%（原稿 45%） */
.at-vc__banner--sudden .at-vc__banner-media::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.45) 0%, rgba(255, 255, 255, 0) 60.199%, rgba(0, 0, 0, 0.45) 100%); }
.at-vc__banner-copy { position: absolute; inset: 0; }
.at-vc__banner-copy .at-vc__title, .at-vc__banner-copy .at-vc__body { position: absolute; left: var(--at-pad); right: var(--at-pad); }
.at-vc__banner--wind .at-vc__title { top: calc(617 * var(--at-u)); width: calc(657 * var(--at-u)); }
.at-vc__banner--wind .at-vc__body { top: calc(698 * var(--at-u)); width: calc(1195 * var(--at-u)); }
.at-vc__banner--sudden .at-vc__title { top: calc(67 * var(--at-u)); text-align: center; }
.at-vc__banner--sudden .at-vc__body { top: calc(718 * var(--at-u)); width: calc(909 * var(--at-u)); margin: 0 auto; text-align: center; }

/* ==========================================================================
   昂听App 页 —— 按 Figma「国内设计文件 / 昂听App」(1074:1094，1920 画板，总高 4692) 一比一实现
   导航透明白字压在首屏上（1074:1109，同首页 / 产品页）；页尾与首页共用。文案与图片在「首页设置 → 昂听App 页」里改。
   ========================================================================== */
.at-app__title { font-size: calc(46 * var(--at-u)); font-weight: 500; line-height: normal; color: var(--at-black); }
.at-app__title--light { color: #fff; }
/* 首屏（1074:1097）：全幅 1920×900，上移一个导航高度让透明导航压在图上。
   图上两层渐变：顶部 黑 32% → 透明 @27.2%「明度」混合（画板填充里的渐变层）；左侧 Rectangle 8 黑 60% → 透明 @51.9% 正片叠底。
   文字块 left 240、垂直居中（中心上移 0.5）、宽 684、间距 20：标题 66 Medium 白；下载按钮一排宽 517、间距 20，每枚 248.5×81 白描边 1 圆角 20，图标与文字 32 间距 30 */
.at-app__hero { position: relative; height: calc(900 * var(--at-u)); margin-top: calc(-62.189 * var(--at-u)); overflow: hidden; background: #000; color: #fff; }
.at-app__hero-media, .at-app__hero-media picture { position: absolute; inset: 0; }
.at-app__hero-img, .at-app__hero-media .at-placeholder { width: 100%; height: 100%; object-fit: cover; object-position: center; min-height: 0; }
.at-app__hero-media::before, .at-app__hero-media::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; } /* z-index：::before 排在 <picture>（也是 absolute）前面，不抬高会被图片盖住，顶部压暗渐变不显示、导航白字看不清（反馈 2026-10-20） */
.at-app__hero-media::before { mix-blend-mode: luminosity; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.32) 0%, rgba(102, 102, 102, 0) 27.173%); }
.at-app__hero-media::after { mix-blend-mode: multiply; background: linear-gradient(to right, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 51.9%); }
.at-app__hero-inner { position: absolute; inset: 0; }
.at-app__hero-copy { position: absolute; left: var(--at-pad); top: calc(50% - 0.5 * var(--at-u)); transform: translateY(-50%); z-index: 1; display: flex; flex-direction: column; gap: calc(20 * var(--at-u)); width: calc(684 * var(--at-u)); }
.at-app__hero-title { font-size: calc(66 * var(--at-u)); font-weight: 500; line-height: normal; color: #fff; }
.at-app__hero-sp { display: none; } /* 手机端才显示的中英间空格（page-app.php） */
.at-app__stores { display: flex; gap: calc(20 * var(--at-u)); width: calc(517 * var(--at-u)); max-width: 100%; }
.at-app__store { flex: 1 0 0; min-width: 0; display: flex; align-items: center; justify-content: center; gap: calc(30 * var(--at-u)); height: calc(81 * var(--at-u)); border: 1px solid #fff; border-radius: calc(20 * var(--at-u)); color: #fff; font-size: calc(32 * var(--at-u)); font-weight: 400; line-height: normal; white-space: nowrap; transition: background var(--at-dur) var(--at-ease); }
a.at-app__store:hover { background: rgba(255, 255, 255, 0.12); }
a.at-app__store:active { background: rgba(255, 255, 255, 0.2); }
.at-app__store-icon { flex: none; display: block; }
.at-app__store-icon svg { display: block; width: 100%; height: 100%; }
.at-app__store-icon--ios { width: calc(35 * var(--at-u)); height: calc(43 * var(--at-u)); }
.at-app__store-icon--android { width: calc(43 * var(--at-u)); height: calc(43 * var(--at-u)); }
.at-app__store:nth-child(2) .at-app__store-label { width: calc(128 * var(--at-u)); } /* 1074:1108：Android 文字框宽 128，左对齐 */
/* 功能强大的蓝牙直连App（1074:1125，高 800 白底）：标题 46 left 240 top 117；图 835×466 圆角 20 left 240 top 218；右列 left 1178 宽 501，垂直居中、中心下移 25：副标 32 Medium + 正文 24，间距 20，段落间空一行 */
.at-app__intro { background: #fff; }
.at-app__intro-inner { position: relative; height: calc(800 * var(--at-u)); }
.at-app__intro-title { position: absolute; left: var(--at-pad); top: calc(117 * var(--at-u)); white-space: nowrap; }
.at-app__intro-media { position: absolute; left: var(--at-pad); top: calc(218 * var(--at-u)); width: calc(835 * var(--at-u)); height: calc(466 * var(--at-u)); border-radius: var(--at-radius); overflow: hidden; background: #cfcfcf; }
.at-app__intro-img, .at-app__intro-media .at-placeholder { width: 100%; height: 100%; object-fit: cover; min-height: 0; }
.at-app__intro-copy { position: absolute; left: calc(1178 * var(--at-u)); top: calc(50% + 25 * var(--at-u)); transform: translateY(-50%); display: flex; flex-direction: column; gap: calc(20 * var(--at-u)); width: calc(501 * var(--at-u)); }
.at-app__intro-sub { font-size: calc(32 * var(--at-u)); font-weight: 500; line-height: normal; white-space: nowrap; }
.at-app__intro-body { font-size: calc(24 * var(--at-u)); line-height: normal; }
.at-app__intro-body p + p { margin-top: 1.35em; } /* 稿内两段之间空一行（24px 常规行高） */
/* 耳鸣掩蔽功能（1074:1132，高 800）：全幅图横滑轮播（与首页产品区同一套 data-at-carousel，整张一页、吸附）。
   每张文字块 left 240 宽 562、垂直居中且中心下移 127.5、间距 10：标题 46 Medium / 副标 32（框高 71）/ 正文 18（框高 147）白。
   进度条 194×8 圆角 20 白 30% left 240 top 713，橙色滑块长度 = 可视 / 总宽（main.js data-at-carousel-thumb）；前后 60 圆按钮 left 646 / 742 top 687，圆底黑 30%（1074:1142），滚到头那侧 10%（1074:1139） */
.at-app__tinnitus { position: relative; height: calc(800 * var(--at-u)); overflow: hidden; background: #000; color: #fff; }
.at-app__slides { display: flex; height: 100%; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: none; }
.at-app__slides::-webkit-scrollbar { display: none; }
.at-app__slide { position: relative; flex: 0 0 100%; height: 100%; scroll-snap-align: start; overflow: hidden; }
.at-app__slide-media, .at-app__slide-media picture { position: absolute; inset: 0; }
.at-app__slide-img, .at-app__slide-media .at-placeholder { width: 100%; height: 100%; object-fit: cover; min-height: 0; }
/* 第二张稿（1074:1208）左侧压暗 黑 82% @21.8% → 透明 @59.5% 正片叠底；第一张（新稿 1178:2608）这层压在图上面：黑 60% → 透明 @54.9% */
.at-app__slide-media::after { content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply; background: linear-gradient(to right, rgba(0, 0, 0, 0.82) 21.766%, rgba(102, 102, 102, 0) 59.453%); }
.at-app__slide:first-child .at-app__slide-media::after { background: linear-gradient(to right, rgba(0, 0, 0, 0.6) 0%, rgba(102, 102, 102, 0) 54.891%); }
/* 文字不随图滑动：各张文字块叠在同一位置，当前张淡入、其余淡出（main.js 按 scrollLeft 切 .is-active） */
.at-app__slide-copies { position: absolute; inset: 0; pointer-events: none; }
.at-app__slide-copy { position: absolute; left: var(--at-pad); top: calc(50% + 127.5 * var(--at-u)); transform: translateY(-50%); display: flex; flex-direction: column; gap: calc(10 * var(--at-u)); width: calc(562 * var(--at-u)); opacity: 0; visibility: hidden; transition: opacity 0.6s var(--at-ease), visibility 0s linear 0.6s; }
.at-app__slide-copy.is-active { opacity: 1; visibility: visible; transition-delay: 0s, 0s; pointer-events: auto; }
.at-app__slide-sub { min-height: calc(71 * var(--at-u)); font-size: calc(32 * var(--at-u)); line-height: normal; }
.at-app__slide-body { min-height: calc(147 * var(--at-u)); font-size: calc(18 * var(--at-u)); line-height: normal; }
.at-app__slide-ctrl { position: absolute; inset: 0; pointer-events: none; }
.at-app__bar { position: absolute; left: var(--at-pad); top: calc(713 * var(--at-u)); width: calc(194 * var(--at-u)); height: calc(8 * var(--at-u)); border-radius: calc(20 * var(--at-u)); background: rgba(255, 255, 255, 0.3); overflow: hidden; }
.at-app__bar-thumb { position: absolute; left: 0; top: 0; height: 100%; width: 33.333%; border-radius: calc(20 * var(--at-u)); background: var(--at-brand); transition: width 0.4s var(--at-ease), transform 0.3s var(--at-ease); } /* 读条式：长度 = (当前张 + 1) / 张数（三张稿 64.667 → 194），最后一张再点下一张回第一张、读条重置 */
.at-app__slide-ctrl .at-carousel__nav { display: flex; position: absolute; left: calc(646 * var(--at-u)); top: calc(687 * var(--at-u)); gap: calc(36 * var(--at-u)); margin: 0; pointer-events: auto; }
.at-app__nav .at-carousel__btn circle { fill-opacity: 0.3; }
.at-app__nav .at-carousel__btn:hover circle { fill-opacity: 0.4; }
.at-app__nav .at-carousel__btn:active circle { fill-opacity: 0.5; }
.at-app__nav .at-carousel__btn[disabled] circle { fill-opacity: 0.1; }
/* 远程拾音（1074:1159，高 850 白底）：图 1002×528 圆角 20 left 240 top 161；标题 46 left 1360 top 364、副标 32 top 445 */
.at-app__remote { background: #fff; }
.at-app__remote-inner { position: relative; height: calc(850 * var(--at-u)); }
.at-app__remote-media { position: absolute; left: var(--at-pad); top: calc(161 * var(--at-u)); width: calc(1002 * var(--at-u)); height: calc(528 * var(--at-u)); border-radius: var(--at-radius); overflow: hidden; background: #cfcfcf; }
.at-app__remote-img, .at-app__remote-media .at-placeholder { width: 100%; height: 100%; object-fit: cover; min-height: 0; }
.at-app__remote-copy { position: absolute; left: calc(1360 * var(--at-u)); top: 0; bottom: 0; right: var(--at-pad); }
.at-app__remote-copy .at-app__title { position: absolute; left: 0; top: calc(364 * var(--at-u)); white-space: nowrap; }
.at-app__remote-sub { position: absolute; left: 0; top: calc(445 * var(--at-u)); font-size: calc(32 * var(--at-u)); line-height: normal; white-space: nowrap; }
/* 远程验配 / OTA 两卡（1074:1148，上 50 下 120）：两卡等宽 704×600 圆角 20 间距 32 内边距 40，上下压暗（验配 50% / OTA 38%）→ 透明 @54% 正片叠底；
   左上标题 46 Medium + 副标 24（间距 12），左下正文 18 宽 562，全白 */
.at-app__cards { background: #fff; }
.at-app__cards-inner { display: flex; gap: calc(32 * var(--at-u)); padding-top: calc(50 * var(--at-u)); padding-bottom: calc(120 * var(--at-u)); }
.at-app__card { position: relative; flex: 1 0 0; min-width: 0; display: flex; flex-direction: column; justify-content: space-between; height: calc(600 * var(--at-u)); padding: calc(40 * var(--at-u)); border-radius: var(--at-radius); overflow: hidden; background: #333; color: #fff; }
.at-app__card-media, .at-app__card-media picture { position: absolute; inset: 0; }
.at-app__card-img, .at-app__card-media .at-placeholder { width: 100%; height: 100%; object-fit: cover; min-height: 0; }
.at-app__card-media::after { content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply; background: linear-gradient(to top, rgba(0, 0, 0, var(--at-app-shade, 0.5)) 0%, rgba(102, 102, 102, 0) 54.046%, rgba(0, 0, 0, var(--at-app-shade-top, var(--at-app-shade, 0.5))) 100%); }
.at-app__card--ota { --at-app-shade: 0.38; --at-app-shade-top: 0.18; } /* 新稿 1178:2630：底 38% / 顶 18% */
.at-app__card-head { position: relative; z-index: 1; display: flex; flex-direction: column; gap: calc(12 * var(--at-u)); white-space: nowrap; }
.at-app__card-sub { font-size: calc(24 * var(--at-u)); line-height: normal; }
.at-app__card-body { position: relative; z-index: 1; width: calc(562 * var(--at-u)); max-width: 100%; font-size: calc(18 * var(--at-u)); line-height: normal; }

/* ==========================================================================
   蓝牙直连 页 —— 按 Figma「国内设计文件 / 蓝牙直连」(1074:1240，1920 画板，总高 4052) 一比一实现
   导航透明白字压在首屏上（1074:1246）；页尾与首页共用。文案与图片在「首页设置 → 蓝牙直连 页」里改。
   ========================================================================== */
.at-bt__title { font-size: calc(46 * var(--at-u)); font-weight: 500; line-height: normal; color: var(--at-black); }
.at-bt__title--light { color: #fff; }
/* 首屏（1074:1243）：全幅 1920×900，上移一个导航高度；左侧 Rectangle 8 黑 60% → 透明 @51.9% 正片叠底；标题 66 Medium 白两行 left 240 top 362 宽 533 */
.at-bt__hero { position: relative; height: calc(900 * var(--at-u)); margin-top: calc(-62.189 * var(--at-u)); overflow: hidden; background: #000; color: #fff; }
.at-bt__hero-media, .at-bt__hero-media picture, .at-bt__online-media, .at-bt__online-media picture { position: absolute; inset: 0; }
.at-bt__hero-img, .at-bt__hero-media .at-placeholder, .at-bt__online-img, .at-bt__online-media .at-placeholder { width: 100%; height: 100%; object-fit: cover; object-position: center; min-height: 0; }
.at-bt__hero-media::after { content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply; background: linear-gradient(to right, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 51.9%); }
.at-bt__hero-inner { position: absolute; inset: 0; }
.at-bt__hero-title { position: absolute; left: var(--at-pad); top: calc(362 * var(--at-u)); width: calc(533 * var(--at-u)); font-size: calc(66 * var(--at-u)); font-weight: 500; line-height: normal; color: #fff; }
/* 始终在线（1074:1262）：全幅深色图（稿内渐变层压在图下面看不见，不叠）；标题 46 白 left 240 top 346 宽 593、正文 32 top 427 宽 593 */
.at-bt__online { position: relative; height: calc(900 * var(--at-u)); overflow: hidden; background: #000; color: #fff; }
.at-bt__online-inner { position: absolute; inset: 0; }
.at-bt__online-copy { position: absolute; inset: 0; }
.at-bt__online-copy .at-bt__title { position: absolute; left: var(--at-pad); top: calc(346 * var(--at-u)); width: calc(593 * var(--at-u)); }
.at-bt__online-body { position: absolute; left: var(--at-pad); top: calc(427 * var(--at-u)); width: calc(593 * var(--at-u)); font-size: calc(32 * var(--at-u)); line-height: normal; }
/* 与生活同步（1074:1266，高 900 白底）：内容 top 57 居中、间距 20：标题 46 → 正文 24 宽 704（框高 84）→ 图 1440×600 圆角 20；
   页签一排居中 top 480：179×60、间距 22、22px，选中橙色实心（同产品页场景页签，复用 .at-btn 与 data-at-tabs） */
.at-bt__scene { height: calc(900 * var(--at-u)); overflow: hidden; background: #fff; }
.at-bt__scene-inner { position: relative; display: flex; flex-direction: column; align-items: center; gap: calc(20 * var(--at-u)); padding-top: calc(57 * var(--at-u)); }
.at-bt__scene-title { text-align: center; white-space: nowrap; }
.at-bt__scene-body { width: calc(704 * var(--at-u)); max-width: 100%; min-height: calc(84 * var(--at-u)); text-align: center; font-size: calc(24 * var(--at-u)); line-height: normal; color: var(--at-black); }
.at-bt__stage { position: relative; width: 100%; height: calc(600 * var(--at-u)); border-radius: var(--at-radius); overflow: hidden; background: #d2d2d2; }
.at-bt__frame { position: absolute; inset: 0; } /* 图 + 圆点的容器：PC 铺满舞台；手机端变成 335×300 的圆角图，页签排在它下方 */
/* 图上底部压暗（正片叠底），四张页签图各自一套，随页签切换（面板是舞台里前四个子元素，按设计稿页签顺序）：
   接听电话 1178:2747 黑 40% → 透明 @52.061%；播放音乐 1178:2829 40% @64.522%；观看视频 1178:2843 50% @42.89%；线上会议 1178:2857 50% @33.985%。后台多于四个页签时沿用第一套 */
.at-bt__panel::after { content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply; background: linear-gradient(to top, rgba(0, 0, 0, var(--bt-shade, 0.4)) 0%, rgba(102, 102, 102, 0) var(--bt-shade-stop, 52.061%)); }
.at-bt__panel:nth-child(2) { --bt-shade: 0.4; --bt-shade-stop: 64.522%; }
.at-bt__panel:nth-child(3) { --bt-shade: 0.5; --bt-shade-stop: 42.89%; }
.at-bt__panel:nth-child(4) { --bt-shade: 0.5; --bt-shade-stop: 33.985%; }
.at-bt__panel, .at-bt__panel picture { position: absolute; inset: 0; }
.at-bt__img, .at-bt__panel .at-placeholder { width: 100%; height: 100%; object-fit: cover; min-height: 0; }
.at-bt__dots { display: none; }
.at-bt__tabs { position: absolute; left: 0; right: 0; top: calc(480 * var(--at-u)); z-index: 1; display: flex; justify-content: center; gap: calc(22 * var(--at-u)); }
.at-bt__tab { width: calc(179 * var(--at-u)); padding-inline: 0; }
.at-bt__tab[aria-selected="true"] { background: var(--at-brand); border-color: var(--at-brand); color: #fff; box-shadow: none; }
.at-bt__tab[aria-selected="true"]:hover { background: var(--at-brand-hover); border-color: var(--at-brand-hover); }
.at-bt__tab[aria-selected="true"]:active { background: var(--at-brand-press); border-color: var(--at-brand-press); }
/* 常见问题（1074:1280，高 780）：内容 top 77：标题 46 Medium 行高 88、框高 74（稿内被裁）→ 副标 32 Medium 行高 88 → FAQ 行 115.2（复用首页 .at-accordion），底留 75 */
.at-bt__faq { padding-top: calc(77 * var(--at-u)); padding-bottom: calc(75 * var(--at-u)); background: #fff; }
.at-bt__faq-title { height: calc(74 * var(--at-u)); overflow: hidden; font-size: calc(46 * var(--at-u)); font-weight: 500; line-height: calc(88 * var(--at-u)); color: var(--at-black); white-space: nowrap; }
.at-bt__faq-more { display: block; width: fit-content; height: calc(88 * var(--at-u)); margin: 0; font-size: calc(32 * var(--at-u)); font-weight: 500; line-height: calc(88 * var(--at-u)); color: var(--at-black); transition: color var(--at-dur) var(--at-ease); }
a.at-bt__faq-more:hover { color: var(--at-brand); }

/* ==========================================================================
   验配服务 页 —— 按 Figma「国内设计文件 / 验配服务」(1074:1393，1920 画板，高 962，黑底) 一比一实现
   导航透明白字压在黑底上（1074:1401）；标题 46 Medium 白居中 top 161；视频框 1440×550 圆角 20 left 240、垂直居中且中心下移 56，
   稿内是 #181818 占位 + 居中 81.9 播放图标（#555）；后台填了视频地址后框里放 <video>，图标转白可点（main.js data-at-video）。页尾与首页共用。
   ========================================================================== */
.at-fit { background: #000; }
.at-fit__stage { position: relative; height: calc(962 * var(--at-u)); margin-top: calc(-62.189 * var(--at-u)); overflow: hidden; background: #000; color: #fff; }
.at-fit__inner { position: relative; height: 100%; }
/* 新稿 1575:3452 / 1582:3627（2026-10-19）：左上标题 46 Medium（top 130）+ 当前视频名 32 Regular（下距 20）；右上编号按钮；视频框 top 281 */
.at-fit__head { position: absolute; left: var(--at-pad); top: calc(130 * var(--at-u)); right: calc(var(--at-pad) + 460 * var(--at-u)); }
.at-fit__title { font-size: calc(46 * var(--at-u)); font-weight: 500; line-height: normal; white-space: nowrap; color: #fff; }
.at-fit__name { margin-top: calc(20 * var(--at-u)); font-size: calc(32 * var(--at-u)); font-weight: 400; line-height: calc(50 * var(--at-u)); min-height: calc(50 * var(--at-u)); color: #fff; }
/* 编号按钮（1582:3575）：73.8×65、圆角 20、间距 14，数字 24 Medium 白；选中 1px 白描边，其余白 20%（悬停 60%） */
.at-fit__tabs { position: absolute; right: var(--at-pad); top: calc(130 * var(--at-u)); display: flex; gap: calc(14 * var(--at-u)); }
.at-fit__tab { display: flex; align-items: center; justify-content: center; width: calc(73.8 * var(--at-u)); height: calc(65 * var(--at-u)); padding: 0; border: 1px solid rgba(255, 255, 255, 0.2); border-radius: calc(20 * var(--at-u)); background: none; color: #fff; font-size: calc(24 * var(--at-u)); font-weight: 500; line-height: 1; cursor: pointer; transition: border-color var(--at-dur) var(--at-ease); }
.at-fit__tab:hover { border-color: rgba(255, 255, 255, 0.6); }
.at-fit__tab[aria-selected="true"] { border-color: #fff; }
.at-fit__video { position: absolute; left: var(--at-pad); right: var(--at-pad); top: calc(281 * var(--at-u)); height: calc(550 * var(--at-u)); border-radius: var(--at-radius); overflow: hidden; background: #181818; }
/* 封面铺满框；视频完整显示（底部压着字幕，铺满会被裁掉），两侧黑边 */
.at-fit__poster, .at-fit__player { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; background: #181818; }
.at-fit__player { object-fit: contain; background: #000; }
.at-fit__video:not(.has-video) .at-fit__player, .at-fit__poster[hidden] { display: none; }
.at-fit__poster { z-index: 1; transition: opacity 0.3s var(--at-ease); }
/* 用 inset:0 + margin:auto 居中而不用 transform 平移：平移会落在半像素上，图标边缘发虚（按反馈「像素不够」改） */
.at-fit__play { position: absolute; inset: 0; z-index: 2; width: calc(81.907 * var(--at-u)); height: calc(81.907 * var(--at-u)); margin: auto; padding: 0; border: 0; background: none; color: #555; }
.at-fit__play svg { display: block; width: 100%; height: 100%; shape-rendering: geometricPrecision; }
.at-fit__video.has-video .at-fit__play { color: #fff; cursor: pointer; transition: color var(--at-dur) var(--at-ease), transform var(--at-dur) var(--at-ease); }
.at-fit__video.has-video .at-fit__play:hover { transform: scale(1.06); }
.at-fit__video.is-playing .at-fit__play, .at-fit__video.is-playing .at-fit__poster { opacity: 0; pointer-events: none; }
/* 封面可点：整块手形；压一层很淡的黑（12%），播放图标加阴影，亮色封面上也看得出是视频（反馈 2026-10-19） */
.at-fit__video.has-video .at-fit__poster { cursor: pointer; }
.at-fit__video.has-video::after { content: ""; position: absolute; inset: 0; z-index: 1; background: rgba(0, 0, 0, 0.12); pointer-events: none; transition: opacity 0.3s var(--at-ease); }
.at-fit__video.is-playing::after, .at-fit__video.has-played::after { opacity: 0; }
/* 播放过一次后，暂停时不再盖回封面（不挡暂停画面和进度条）；换到别的按钮时 main.js 去掉 has-played，封面回来 */
.at-fit__video.has-played .at-fit__poster { opacity: 0; pointer-events: none; }
.at-fit__video.has-video .at-fit__play { filter: drop-shadow(0 calc(4 * var(--at-u)) calc(16 * var(--at-u)) rgba(0, 0, 0, 0.35)); }

/* ==========================================================================
   联系我们 页 —— 按 Figma「国内设计文件 / 联系我们」(1074:1461，1920 画板，总高 2212) 一比一实现
   导航透明白字压在首屏上（1074:1468）；页尾与首页共用。文案与图片在「首页设置 → 联系我们 页」里改。
   ========================================================================== */
/* 首屏（1074:1464）：全幅 1920×900，上下各压暗 黑 30% → 透明 @69% 明度混合；居中文字块 top 689：标题 66 Medium（框高 73）+ 公司名 24（框高 56），间距 20 */
.at-ct__hero { position: relative; height: calc(900 * var(--at-u)); margin-top: calc(-62.189 * var(--at-u)); overflow: hidden; background: #000; color: #fff; }
.at-ct__hero-media, .at-ct__hero-media picture { position: absolute; inset: 0; }
.at-ct__hero-img, .at-ct__hero-media .at-placeholder { width: 100%; height: 100%; object-fit: cover; object-position: center; min-height: 0; }
.at-ct__hero-media::after { content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: luminosity; background: linear-gradient(to top, rgba(0, 0, 0, 0.3) 0%, rgba(102, 102, 102, 0) 69.032%, rgba(0, 0, 0, 0.3) 100%); }
.at-ct__hero-copy { position: absolute; left: 0; right: 0; top: calc(689 * var(--at-u)); display: flex; flex-direction: column; align-items: center; gap: calc(20 * var(--at-u)); text-align: center; }
.at-ct__hero-title { font-size: calc(66 * var(--at-u)); font-weight: 500; line-height: calc(73 * var(--at-u)); color: #fff; } /* 稿内标题框高 73（行高按 73 定，公司名才落在 782） */
.at-ct__hero-sub { min-height: calc(56 * var(--at-u)); font-size: calc(24 * var(--at-u)); line-height: normal; color: #fff; }
/* 联系方式（1074:1484，高 740，底 #f7f5f0）：三张联系卡 305.674×94.43 圆角 20 白底、间距 13.99，整排 945 宽从 left 488 起、top 121；
   二维码 364×364 圆角 20 白底 left 488 / top 255.43；右侧页签卡 left 893、540×172 圆角 20、间距 20（选中橙描边橙字，其余描边 #d2d2d7）。
   按反馈只留「服务号」一张卡：二维码框是正方形，边长跟右侧卡片总高一致（--at-ct-n 张卡：H = n×172 + (n−1)×20，一张 172、两张 364 即稿内原值）；
   右侧卡片紧跟二维码（间距 41），右边缘仍对齐上面三张联系卡那一排（488 + 945），区块高度按 H 收缩（稿内 740 − 364 + H） */
.at-ct__info { --at-ct-h: calc(172 * var(--at-ct-n, 2) + 20 * (var(--at-ct-n, 2) - 1)); height: calc((376 + var(--at-ct-h)) * var(--at-u)); overflow: hidden; background: var(--at-bg-warm); }
.at-ct__info-inner { position: relative; height: 100%; }
.at-ct__cards { position: absolute; left: calc(488 * var(--at-u)); top: calc(121 * var(--at-u)); display: flex; gap: calc(13.99 * var(--at-u)); }
.at-ct__card { position: relative; display: block; width: calc(305.674 * var(--at-u)); height: calc(94.43 * var(--at-u)); border-radius: var(--at-radius); background: #fff; color: var(--at-black); }
.at-ct__card-ring { position: absolute; left: calc(21.68 * var(--at-u)); top: calc(23.08 * var(--at-u)); display: flex; align-items: center; justify-content: center; width: calc(48.964 * var(--at-u)); height: calc(48.964 * var(--at-u)); border-radius: 50%; background: var(--at-brand); color: #fff; }
.at-ct__icon { display: block; }
.at-ct__icon--wrench { width: calc(23.78 * var(--at-u)); height: calc(22.6 * var(--at-u)); }
.at-ct__icon--ring { width: 100%; height: 100%; }
.at-ct__card-main { position: absolute; left: calc(90.93 * var(--at-u)); top: calc(24.48 * var(--at-u)); font-size: calc(16 * var(--at-u)); font-weight: 500; line-height: normal; white-space: nowrap; }
/* 稿内评论「悬浮下横贯」：指针停在联系卡上时，主文字下方直接出现一条细横线（不做从左到右的划出动画）。高清屏（2x 及以上）用半像素细线；普通屏一个物理像素画不出半像素、只会变成半透明显得发浅，所以保持 1px 实色 */
.at-ct__card-main::after { content: ""; position: absolute; left: 0; right: 0; bottom: calc(-2 * var(--at-u)); height: 1px; background: currentColor; opacity: 0; }
@media (min-resolution: 2dppx) { .at-ct__card-main::after { height: 0.5px; } }
a.at-ct__card:hover .at-ct__card-main::after, a.at-ct__card:focus-visible .at-ct__card-main::after { opacity: 1; }
.at-ct__card-sub { position: absolute; left: calc(90.93 * var(--at-u)); top: calc(53.86 * var(--at-u)); font-size: calc(14 * var(--at-u)); line-height: normal; white-space: nowrap; }
.at-ct__qr { position: absolute; left: calc(488 * var(--at-u)); top: calc(255.43 * var(--at-u)); width: calc(var(--at-ct-h) * var(--at-u)); height: calc(var(--at-ct-h) * var(--at-u)); border-radius: var(--at-radius); overflow: hidden; background: #fff; }
.at-ct__qr-panel { position: absolute; inset: 0; }
.at-ct__qr-img, .at-ct__qr-panel .at-placeholder { width: 100%; height: 100%; object-fit: contain; min-height: 0; }
.at-ct__tabs { position: absolute; left: calc((488 + var(--at-ct-h) + 41) * var(--at-u)); top: calc(255.43 * var(--at-u)); display: flex; flex-direction: column; gap: calc(20 * var(--at-u)); width: calc((945 - var(--at-ct-h) - 41) * var(--at-u)); }
.at-ct__tab { display: flex; align-items: center; justify-content: center; width: 100%; height: calc(172 * var(--at-u)); padding: 0 calc(25 * var(--at-u)); border: 1px solid var(--at-line-card); border-radius: var(--at-radius); background: none; color: var(--at-black); text-align: left; cursor: pointer; transition: border-color var(--at-dur) var(--at-ease), color var(--at-dur) var(--at-ease); }
.at-ct__tab-inner { display: block; width: 100%; } /* 卡宽 − 左右各 25：两张卡时即稿内 490，一张卡时卡片加宽、文字仍从左 25 起 */
.at-ct__tab-title { display: block; font-size: calc(24 * var(--at-u)); font-weight: 600; line-height: 1.7; }
.at-ct__tab-desc { display: block; font-size: calc(18 * var(--at-u)); line-height: 1.7; }
.at-ct__tab:hover { border-color: var(--at-brand); }
.at-ct__tab[aria-selected="true"] { border-color: #d2d2d7; color: var(--at-black); } /* 按反馈：选中卡（只有一张时就是它）文字黑色、不用橙色；描边按 2026-10-19 反馈改灰 #D2D2D7 */

/* ==========================================================================
   常见问题 页 —— 按 Figma「国内设计文件 / 常见问题」(1074:1586，1920 画板，区块高 1000，白底) 一比一实现
   导航白底黑字不压图（同比较页）；页尾与首页共用。页签在「首页设置 → 常见问题 页」里配，条目在「常见问题」里按显示位置归类。
   分类页签一排居中 top 67：179×60 胶囊、间距 20、22px，选中橙色实心白字、其余黑描边（.at-btn--outline-dark）；
   标题 46 Medium（行高 88、框高 74）left 240 top 234；FAQ 行从 top 348 起，每行 115.2、行距 2（复用 .at-accordion）
   ========================================================================== */
/* 首屏（1074:1563）：全幅 1920×900，上移一个导航高度；左侧 黑 48% → 透明 @53% 明度混合；
   左文 left 240 垂直居中（中心上移 0.5）宽 598、无间距：标题 66 Medium → 副标 46 Light（框高 91）→ 搜索框 194×60 白胶囊（放大镜 27×28 + 22px #9f9f9f 提示，间距 14），悬浮 / 聚焦时展宽到 360（稿内评论「悬浮展开问题栏」） */
.at-faqp__hero { position: relative; height: calc(900 * var(--at-u)); margin-top: calc(-62.189 * var(--at-u)); overflow: hidden; background: #000; color: #fff; }
.at-faqp__hero-media, .at-faqp__hero-media picture { position: absolute; inset: 0; }
.at-faqp__hero-img, .at-faqp__hero-media .at-placeholder { width: 100%; height: 100%; object-fit: cover; object-position: center; min-height: 0; }
.at-faqp__hero-media::after { content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: luminosity; background: linear-gradient(to left, rgba(102, 102, 102, 0) 53.07%, rgba(0, 0, 0, 0.48) 100%); }
.at-faqp__hero-inner { position: absolute; inset: 0; }
.at-faqp__hero-copy { position: absolute; left: var(--at-pad); top: calc(50% - 0.5 * var(--at-u)); transform: translateY(-50%); display: flex; flex-direction: column; align-items: flex-start; width: calc(598 * var(--at-u)); }
.at-faqp__hero-title { font-size: calc(66 * var(--at-u)); font-weight: 500; line-height: normal; color: #fff; }
.at-faqp__hero-sub { min-height: calc(91 * var(--at-u)); font-size: calc(46 * var(--at-u)); font-weight: 300; line-height: normal; color: #fff; white-space: nowrap; } /* 稿内框宽 598 正好 13 个字；at_sentence() 补的「。」会把「切。」挤到第二行（反馈 2026-10-26），PC 不折行 */
.at-faqp__search { position: relative; display: flex; align-items: center; gap: calc(14 * var(--at-u)); width: calc(194 * var(--at-u)); height: calc(60 * var(--at-u)); padding: 0 calc(24 * var(--at-u)) 0 calc(32.5 * var(--at-u)); border-radius: 9999px; background: #fff; color: #9f9f9f; transition: width 0.3s var(--at-ease); }
/* 稿内评论「悬浮展开问题栏」：指针悬浮到胶囊上即展开到与副标题同宽（598，右边与「切」字对齐），聚焦或已有输入时保持展开 */
.at-faqp__search:hover, .at-faqp__search:focus-within, .at-faqp__search.has-value { width: 100%; }
.at-faqp__search-label { flex: none; display: block; width: calc(27 * var(--at-u)); height: calc(28 * var(--at-u)); color: #9f9f9f; cursor: text; } /* 稿内放大镜 #9f9f9f（1074:1568） */
.at-faqp__search-icon { display: block; width: 100%; height: 100%; }
.at-faqp__search-input { flex: 1 1 0; min-width: 0; height: 100%; padding: 0; border: 0; background: none; font: inherit; font-size: calc(22 * var(--at-u)); line-height: normal; color: var(--at-black); outline: none; -webkit-appearance: none; appearance: none; }
.at-site .at-faqp__search-input:focus, .at-site .at-faqp__search-input:focus-visible { outline: none; box-shadow: none; } /* 聚焦不画任何框 */
.at-faqp__search-input::placeholder { color: #9f9f9f; opacity: 1; }
/* 稿内评论：悬浮展开或点进去输入时不显示「搜索问题」，只在收起态显示 */
.at-faqp__search:hover .at-faqp__search-input::placeholder, .at-faqp__search:focus-within .at-faqp__search-input::placeholder { color: transparent; }
.at-faqp__search-input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
/* 分类区（1074:1586，top 900）：稿内白区一直画到页尾 2524（1624 高），按反馈不再留这个最小高度——问题少的分类下面会空一大块，高度随内容走，底部留 120 */
.at-faqp__section { padding-bottom: calc(120 * var(--at-u)); background: #fff; }
/* 搜索态：输入关键词后所有分类一起显示、只留匹配的问题，页签变灰不可点；清空即恢复 */
.at-faqp__section.is-searching .at-faqp__tabs { opacity: 0.35; pointer-events: none; }
.at-faqp__section.is-searching .at-faqp__panel { display: block !important; }
.at-faqp__section.is-searching .at-faqp__panel.is-empty, .at-faqp__section.is-searching .at-accordion__item.is-hidden { display: none !important; }
.at-faqp__section.is-searching .at-faqp__panel + .at-faqp__panel { padding-top: calc(60 * var(--at-u)); }
.at-faqp__nomatch { padding-top: calc(107 * var(--at-u)); font-size: calc(24 * var(--at-u)); line-height: 1.6; color: var(--at-footer-muted); }
.at-faqp__inner { position: relative; padding-top: calc(67 * var(--at-u)); }
.at-faqp__tabs { display: flex; justify-content: center; gap: calc(20 * var(--at-u)); }
.at-faqp__tab { width: calc(179 * var(--at-u)); padding-inline: 0; }
.at-faqp__tab[aria-selected="true"] { background: var(--at-brand); border-color: var(--at-brand); color: #fff; box-shadow: none; }
.at-faqp__tab[aria-selected="true"]:hover { background: var(--at-brand-hover); border-color: var(--at-brand-hover); }
.at-faqp__tab[aria-selected="true"]:active { background: var(--at-brand-press); border-color: var(--at-brand-press); }
.at-faqp__panel { padding-top: calc(107 * var(--at-u)); } /* 234 - 67 - 60 */
.at-faqp__title { height: calc(74 * var(--at-u)); overflow: hidden; font-size: calc(46 * var(--at-u)); font-weight: 500; line-height: calc(88 * var(--at-u)); color: var(--at-black); white-space: nowrap; }
.at-faqp__list { margin-top: calc(40 * var(--at-u)); } /* 348 - 234 - 74 */
.at-faqp__list .at-accordion__item { margin-bottom: calc(2 * var(--at-u)); } /* 稿内行距 2 */
.at-faqp__empty { margin-top: calc(40 * var(--at-u)); font-size: calc(18 * var(--at-u)); line-height: 1.6; color: var(--at-footer-muted); }

@media (max-width: 1279px) {
  .at-site.page-template-page-compare .at-header { background: #fff; }
  .at-compare__hero { height: auto; margin-top: 0; padding: 40px 0; }
  .at-compare__hero .at-container { height: auto; }
  .at-compare__title, .at-compare__sub, .at-compare__cards { position: static; }
  .at-compare__sub { margin-top: 12px; }
  .at-compare__cards { margin-top: 32px; flex-wrap: wrap; }
  .at-ctable { display: block; overflow-x: auto; }
  .at-ctable th, .at-ctable td { min-width: 160px; }
}

/* --------------------------------------------------------------------------
   入场动效（参考 elehear.com）：滚动进入视口的内容块从下方 32px 处淡入上滑，600ms 慢出曲线，同一区块内的块按顺序错开 75ms；页面打开时已在屏幕内的首屏内容不播；
   仅首次进入视口时播放（main.js reveal 加 .at-reveal / .is-in，播完后摘掉类名恢复各自原有过渡）；减少动态效果偏好下禁用
   -------------------------------------------------------------------------- */
/* 位移用独立的 translate 属性，不用 transform：不少块自己靠 transform: translateY(-50%) 垂直居中（App 页介绍文字、首屏文案等），
   用 transform 会把居中覆盖掉，入场时错位半个自身高度，播完摘类名又跳回去，看着像卡顿（反馈 2026-10-20）。translate 与 transform 叠加，互不影响。 */
.at-site .at-reveal { opacity: 0.01; translate: 0 32px; transition: opacity 0.6s cubic-bezier(0, 0, 0.3, 1), translate 0.6s cubic-bezier(0, 0, 0.3, 1); }
.at-site .at-reveal.is-in { opacity: 1; translate: none; }
@media (prefers-reduced-motion: reduce) {
  .at-site *, .at-site *::before, .at-site *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; scroll-behavior: auto !important; }
  .at-site .at-reveal { opacity: 1; translate: none; }
}

/* --------------------------------------------------------------------------
   窄屏兜底（本期只交付 PC 端；以下仅保证 1280 以下不破版，未按手机稿细调）
   -------------------------------------------------------------------------- */
@media (max-width: 1279px) {
  :root { --at-pad: 40px; }
  .at-hero, .at-lifestyle { height: auto; min-height: 0; }
  .at-hero__media, .at-lifestyle__media { position: relative; aspect-ratio: 16 / 9; }
  .at-hero__copy, .at-lifestyle__copy { position: absolute; top: 22%; left: var(--at-pad); width: auto; max-width: min(560px, calc(100% - 2 * var(--at-pad))); }
  .at-hero__actions, .at-lifestyle__actions, .at-lifestyle__body, .at-hero .at-tag--inverse { position: static; margin-top: 20px; }
  .at-awards { padding-block: 40px; }
  .at-awards__marquee { height: 64px; animation-duration: 40s; }
  .at-awards__track { gap: 56px; padding-right: 56px; }
  .at-awards__item { width: calc(56px * var(--at-aw) / var(--at-ah)); height: 56px; } /* 宽度直接算出来，不靠 aspect-ratio：iOS WebKit 在横排 flex 里按 aspect-ratio 推宽度不稳，可能把宽度算成 0、标识整条不显示（反馈 2026-10-20） */
  .at-guide__grid { grid-template-columns: 1fr; }
  .at-guide__media { height: auto; aspect-ratio: 930 / 531; }
  .at-guide__side { padding-top: 0; }
  .at-guide__list, .at-gcard__inner { width: auto; }
  .at-gcard__inner { padding-inline: 24px; width: 100%; }
  .at-about__grid { grid-template-columns: 1fr; gap: 32px; }
  .at-about__copy { padding-right: 0; }
  .at-about__media { height: auto; aspect-ratio: 794 / 552; }
  .at-service__media { height: auto; aspect-ratio: 1440 / 500; }
  .at-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
  .at-steps::before { display: none; }
  .at-step__dot { display: none; }
  .at-step__desc { white-space: normal; }
  .at-footer__main { grid-template-columns: 1fr; gap: 40px; }
  .at-footer__brand { width: auto; }
  .at-footer__slogan { white-space: normal; }
  .at-footer__cols { flex-wrap: wrap; }
  .at-footer__col { width: auto; min-width: 150px; }
  .at-footer__legal-inner { height: auto; flex-direction: column; align-items: flex-start; padding-block: 20px; gap: 8px; }
  .at-footer__disclaimer, .at-footer__copy { white-space: normal; }
}
@media (max-width: 1023px) {
  /* ---- 窄屏菜单（Figma 1539:3046「导航栏移动端扩展」，展开态 1539:2669 / 2865 / 2957）：整屏蒙层 黑 80% + 背景模糊 70，压在页面上、导航条下面（导航条留在最上层，标志与叉是白色）。
     内容是一列行（.at-mnav）：left 20 / top 80，每行 60 高、20px Regular 白、底边 0.5px 白 20%，行间 12；带「+」的行点开就地展开、「+」转成「−」。
     动效用回之前那套（按反馈 2026-10-19，此前试过阿维塔式左滑、id.iit.edu 录屏 0.44s 擦开，都改回）：面板从顶部向下「擦」开（clip-path）0.2s、从慢到快（ease-in 三次方），收起向上擦回 0.2s、先快后慢；
     菜单行从下方 10px 处依次浮上来淡入（0.32s cubic-bezier(.4,0,.6,1)，面板擦开后 0.2s 起步、每行错开 40ms），收起时 0.16s 一起淡出。分组同 FAQ：同时只开一组，高度过渡 0.3s、「+」的竖线收没成「−」。汉堡变叉与面板同步（0.2s）。 ---- */
  .at-nav, .at-burger { --at-nav-dur: 0.2s; --at-nav-in: cubic-bezier(0.32, 0, 0.67, 0); --at-nav-out: cubic-bezier(0, 0.55, 0.45, 1); }
  .at-nav { position: fixed; inset: 0; z-index: 99; display: block; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding: 80px 20px 40px; background: rgba(0, 0, 0, 0.8); -webkit-backdrop-filter: blur(70px); backdrop-filter: blur(70px); clip-path: inset(0 0 100% 0); visibility: hidden; transition: clip-path 1s cubic-bezier(0.85, 0, 0.15, 1), visibility 0s linear 1s; } /* 收起同打开：1s circ.inOut 向上擦回（反馈 2026-10-19） */
  /* 打开：按反馈 2026-10-19「再面一点」用回最早那版的 1s circ.inOut（cubic-bezier(.85,0,.15,1)：起步很慢、中段一下展开、结尾慢慢收住）。
     之前试过 0.2s ease-in（看着像匀速）、0.7s cubic-bezier(.65,0,.3,1)（录屏 飞书20261019-182809 拟合）。收起也用同一条曲线（见上面 .at-nav）。 */
  .at-nav.is-open { clip-path: inset(0 0 0 0); visibility: visible; transition: clip-path 1s cubic-bezier(0.85, 0, 0.15, 1), visibility 0s; }
  /* PC 的一级导航（产品 / 验配服务 / 关于昂听）在手机菜单里换成 .at-mnav。 */
  .at-nav__list { display: none; }
  .at-mnav { display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; list-style: none; }
  /* 收起时文字不先淡出（按反馈 2026-10-19）：留在原处随面板一起被向上擦掉，等面板收完（1s）再瞬间复位，下次打开照旧依次浮现 */
  .at-mnav__item { opacity: 0; transform: translateY(10px); transition: opacity 0s linear 1s, transform 0s linear 1s; }
  .at-nav.is-open .at-mnav__item { opacity: 1; transform: none; transition-duration: 0.32s, 0.32s; transition-delay: calc(0.2s + var(--at-nav-i, 0) * 40ms); }
  .at-mnav__item:nth-child(2) { --at-nav-i: 1; } .at-mnav__item:nth-child(3) { --at-nav-i: 2; } .at-mnav__item:nth-child(4) { --at-nav-i: 3; } .at-mnav__item:nth-child(5) { --at-nav-i: 4; } .at-mnav__item:nth-child(n+6) { --at-nav-i: 5; }
  .at-mnav__head { display: flex; align-items: center; justify-content: space-between; width: 100%; height: 60px; margin: 0; padding: 0; border: 0; border-bottom: 0.5px solid rgba(255, 255, 255, 0.2); background: none; font: inherit; font-size: 20px; font-weight: 400; line-height: 27px; color: #fff; text-align: left; cursor: pointer; }
  /* 「+」：稿内是 40px MiSans Thin 的加号放在 28×28 的框里，这里用两条 1px 线画（18 长）；展开时竖线纵向收没成「−」，动法同 FAQ（.at-accordion__icon，0.3s）。 */
  .at-mnav__icon { position: relative; flex: none; width: 28px; height: 28px; }
  .at-mnav__icon::before, .at-mnav__icon::after { content: ""; position: absolute; left: 50%; top: 50%; background: #fff; transform: translate(-50%, -50%); }
  .at-mnav__icon::before { width: 18px; height: 1px; }
  .at-mnav__icon::after { width: 1px; height: 18px; transition: transform 0.3s var(--at-ease); }
  .at-mnav__head[aria-expanded="true"] .at-mnav__icon::after { transform: translate(-50%, -50%) scaleY(0); }
  .at-mnav__panel { display: grid; grid-template-rows: 0fr; visibility: hidden; transition: grid-template-rows 0.3s var(--at-ease), visibility 0s linear 0.3s; } /* 同 FAQ .at-accordion__panel */
  .at-mnav__head[aria-expanded="true"] + .at-mnav__panel { grid-template-rows: 1fr; visibility: visible; transition: grid-template-rows 0.3s var(--at-ease), visibility 0s; }
  .at-mnav__inner { min-height: 0; overflow: hidden; }
  /* 产品行（1539:2669 / 2865）：图框 107×107 靠右，名称 20px Regular + 「产品详情 →」111×35 白描边 30%（间距 5）在左、对图框垂直居中。按反馈 2026-10-19 对照稿：产品之间不画分隔线，标题行下留 19、行间 18（用内边距，不靠外边距），整组结束的那条线画在组下方 12 的间隔里（同「关于昂听」）。 */
  .at-mnav__prod { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 18px; }
  .at-mnav__prod:first-child { padding-top: 19px; }
  .at-mnav__info { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; }
  .at-mnav__name { font-size: 20px; font-weight: 400; line-height: 27px; color: #fff; white-space: nowrap; }
  .at-mnav .at-btn { min-width: 0; padding-inline: 16.5px; border-color: rgba(255, 255, 255, 0.3); color: #fff; font-weight: 400; } /* 稿 111 宽：16.5 + 文字 56 + 箭头 */
  .at-mnav__thumb { flex: none; width: 107px; height: 107px; display: flex; align-items: center; justify-content: center; }
  .at-mnav__thumb img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
  /* 图框高按稿逐款：Pro3.0 106（1539:2833）、Pro1.0 117（1539:2862，图上方多了耳机）、听力豆 107（1539:2955）；名称和按钮对图框垂直居中，行高跟着变，下面各行位置与稿一致 */
  .at-mnav__prod[data-at-product="pro3"] .at-mnav__thumb { height: 106px; }
  .at-mnav__prod[data-at-product="pro3"] .at-mnav__info { margin-bottom: 1px; } /* 文字列 67 高对 106 高的图框居中会落在半像素（19.5），「产品详情」按钮 30% 白的 1px 上边框被摊到两行像素、手机上几乎看不见（反馈 2026-10-20 微信截图）；底下垫 1px 让它落在整像素上（视觉上只上移 0.5） */
  .at-mnav__prod[data-at-product="pro1"] .at-mnav__thumb { height: 117px; }
  /* 「关于昂听」展开（1539:3039）：链接一列 20px Regular 白，间距 24；上距标题行 22、下距 20，底边 0.5px 白 20% 隔开下一行。 */
  /* 内边距和底边不能直接加在 .at-mnav__inner 上：收起时 0fr 压不掉 padding / border，会留一截空白。上距用首项外边距（在 overflow:hidden 里，收起时一起被裁掉）。
     稿内末项下 20 处那条线是下一行（验配服务）的上沿：面板只留 8，加上行间 12 正好 20；线画在面板底下 12 处（行间里），随面板展开淡入、收起淡出。 */
  .at-mnav__inner--links { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
  .at-mnav__inner--links > :first-child { margin-top: 22px; }
  .at-mnav__inner--links > :last-child { margin-bottom: 8px; }
  .at-mnav__panel--links, .at-mnav__panel--products { position: relative; }
  .at-mnav__panel--links::after, .at-mnav__panel--products::after { content: ""; position: absolute; left: 0; right: 0; bottom: -12px; border-bottom: 0.5px solid rgba(255, 255, 255, 0.2); opacity: 0; transition: opacity 0.3s var(--at-ease); }
  .at-mnav__head[aria-expanded="true"] + :is(.at-mnav__panel--links, .at-mnav__panel--products)::after { opacity: 1; }
  .at-nav__link { display: block; font-size: 20px; font-weight: 400; line-height: 27px; color: #fff; }
  /* 窄屏走抽屉菜单，不展开扩展面板，也就没有遮罩。 */
  .at-mega, .at-scrim { display: none; }
  /* .at-nav 是导航条的子元素，整屏蒙层会盖住同级的标志和汉堡：把这两个抬到蒙层（z 99）之上。 */
  .at-header .at-logo, .at-header__actions { position: relative; z-index: 100; } /* 只抬导航条里的标志；不加 .at-header 的话页尾标志也会压到展开的菜单上面 */
  /* 菜单打开时导航条变透明压在蒙层上，标志与汉堡（已变叉）都是白色，不管底下是哪种页面。
     变色跟着面板擦过导航条的时刻走（反馈录屏 飞书20261020-103334「有点僵硬」：原先一点开就瞬间变透明、变白，面板 1s circ.inOut 起步慢，
     约 0.27s 才擦过导航条，中间白字压在白底上、标志消失；收起反过来，面板 0.73s 就退出导航条，白字要到 1s 才变回）。
     按曲线 cubic-bezier(.85,0,.15,1) 算：打开时面板下沿 0.17–0.24s 扫过标志（y 11–30）、0.27s 盖住导航条底边（41）；收起时 0.73s 露出导航条底边、0.77–0.85s 扫过标志。
     html.at-nav-open 随点击即时增删（= 打开态，管打开的时机）；body.at-nav-open 收起后还留 1s（= 收起过程，管收起的时机）。 */
  html.at-nav-open body.at-site .at-header, html.at-nav-open body .at-header--overlay.is-scrolled:not(.is-mega) { background: transparent; border-bottom-color: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; transition: background-color 0s linear 0.27s, border-color 0s linear 0.27s; }
  body.at-nav-open.at-site .at-header { transition: background-color 0s linear 0.73s, border-color 0s linear 0.73s; }
  html.at-nav-open body .at-header .at-logo, html.at-nav-open body .at-header.is-scrolled:not(.is-mega) .at-logo { color: #fff; transition: color 0.07s linear 0.17s; }
  body.at-nav-open .at-header .at-logo { transition: color 0.08s linear 0.77s; }
  /* 毛玻璃底（::before，首页 / 产品页 / 比较页的滚动态）同导航条底色一起按时机隐去、复原 */
  html.at-nav-open body .at-header.is-scrolled:not(.is-mega)::before { opacity: 0; transition: opacity 0s linear 0.27s; }
  body.at-nav-open .at-header.is-scrolled:not(.is-mega)::before { transition: opacity 0s linear 0.73s; }
  html.at-nav-open body.page-template-page-manual .at-header::before { opacity: 0; transition: opacity 0s linear 0.27s; } /* 使用指南页导航一直是毛玻璃，同上 */
  body.at-nav-open.page-template-page-manual .at-header::before { transition: opacity 0s linear 0.73s; }
  /* 汉堡 ↔ 叉：尺寸按 Figma（汉堡 842:321 / 842:55：15.87×13.6、三条 1.5 线；叉 1539:3123：15×15、45°），动法照 id.iit.edu 实测：
     三条线都以右端为轴，中线 scaleX 1→0 向右端缩没，上下线绕右端各转 45° 并拉长，交出端正的 15×15 的叉；时长曲线 0.2s（--at-nav-dur），展开先慢后快、收起先快后慢。 */
  .at-burger { display: flex; width: 44px; height: 44px; margin-right: -14.75px; padding: 0; border: 0; background: none; flex-direction: column; align-items: center; justify-content: flex-start; padding-top: 14px; gap: 5.5px; } /* 842:51：三条线 1.5 粗圆头，中心距 6.8 → 间距 5.3 */ /* 图标居中在 44 的点击区里，右移 14 后图标右边正好贴容器右侧 20 */ /* 三条线的顶边要落在整像素上（反馈 2026-10-20 iPhone 截图：中间那条比上下细）：原来 44 高居中排、间距 5.3，三条线顶边在 12.45 / 19.25 / 26.05，3 倍屏上各落在不同的小数位，抗锯齿后粗细深浅不一；改成从顶上 14 排起、间距 5.5（中心距 6.8 → 7），按钮顶在导航条 -2 处，三条线顶边正好是 12 / 19 / 26 */
  .at-burger span { display: block; width: 17.37px; height: 1.5px; background: var(--at-black); border-radius: 1px; transform-origin: right center; transition: transform var(--at-nav-dur) var(--at-nav-out); }
  .at-burger[aria-expanded="true"] span { transition-timing-function: var(--at-nav-in); } /* 展开时同面板先慢后快，收起时先快后慢 */
  /* 汉堡 / 叉变白同标志的时机（见上方「变色跟着面板擦过导航条」） */
  html.at-nav-open body .at-burger span, html.at-nav-open body .at-header.is-scrolled:not(.is-mega) .at-burger span { background: #fff; transition: transform var(--at-nav-dur) var(--at-nav-in), background-color 0.07s linear 0.17s; }
  body.at-nav-open .at-burger span { transition: transform var(--at-nav-dur) var(--at-nav-out), background-color 0.08s linear 0.77s; }
  .at-burger[aria-expanded="true"] span:nth-child(1) { transform: translate(-1.3px, 0.75px) rotate(-45deg) scaleX(1.091); }
  .at-burger[aria-expanded="true"] span:nth-child(2) { transform: scaleX(0); }
  .at-burger[aria-expanded="true"] span:nth-child(3) { transform: translate(-1.3px, 0.15px) rotate(45deg) scaleX(1.091); }
  /* 菜单打开时锁滚动见上方「html.at-nav-open」（不能加在 body 上） */
  @media (prefers-reduced-motion: reduce) {
    .at-nav, .at-nav.is-open, .at-burger span, .at-mnav__item, .at-nav.is-open .at-mnav__item, .at-mnav__panel, .at-mnav__icon, .at-mnav__icon::before, .at-mnav__icon::after { transition: none; }
    /* 面板瞬间开合，导航条变色也不再等擦过的时机 */
    html body.at-nav-open.at-site .at-header, html body.at-nav-open .at-header .at-logo, html body.at-nav-open .at-burger span, html body.at-nav-open .at-header.is-scrolled:not(.is-mega)::before,
    html.at-nav-open body.at-site .at-header, html.at-nav-open body .at-header.is-scrolled:not(.is-mega) .at-logo, html.at-nav-open body .at-header.is-scrolled:not(.is-mega) .at-burger span, html.at-nav-open body .at-header.is-scrolled:not(.is-mega)::before { transition: none; }
  }
  .at-fcards, .at-acards { grid-template-columns: 1fr; }
  .at-fcard, .at-acard { height: auto; aspect-ratio: 460 / 600; }
  .at-pcard { flex-basis: min(700px, 85vw); height: auto; aspect-ratio: 699.5 / 474; }
  .at-steps { grid-template-columns: 1fr; }
  .at-carousel__nav { display: none; }
}

/* ==========================================================================
   手机端专用元素在 PC 端一律不显示（下面的 ≤767 手机端样式再把它们打开）
   ========================================================================== */
.at-carousel__nav--mobile, .at-ctable__title, .at-ctable__label-m, .at-ctable__foot, .at-br-m { display: none; }
/* 手机菜单（.at-mnav）只在抽屉菜单（≤1023）里用；写成 min-width 是因为这段在 ≤1023 块之后，普通规则会盖掉那边的 display。 */
@media (min-width: 1024px) { .at-mnav { display: none; } }
/* 两端文案 / 按钮不同时各出一份：.at-only-pc 只在 ≥768 显示，.at-only-m 只在 ≤767 显示（如首屏按钮 PC / 手机文字不同时） */
@media (min-width: 767.02px) { .at-only-m { display: none !important; } }
@media (max-width: 767px) { .at-only-pc { display: none !important; } }

/* 768–1023（手机横屏、平板竖屏）没有单独的稿：首页两组卡片按手机稿的尺寸排（1178:682 横卡 335:260、1178:752 指南卡 280×400 横滑），
   不再把 PC 的 460:600 竖卡拉成一列（一张近 1000px 高）。功能卡的手机构图图片在这个宽度也生效（features.php 传 max-width:1023px）。 */
@media (min-width: 767.02px) and (max-width: 1023px) {
  .at-fcards { grid-template-columns: 1fr; gap: 24px; }
  .at-fcard { height: auto; aspect-ratio: 335 / 260; }
  .at-fcard__body { left: 20px; right: 20px; bottom: 20px; width: auto; gap: 10px; }
  .at-fcard__title { font-size: 20px; }
  .at-fcard__desc { font-size: 14px; line-height: 1.5; }
  .at-acards { display: flex; gap: 14px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scroll-behavior: smooth; margin-inline: calc(-1 * var(--at-pad)); padding-inline: var(--at-pad); scroll-padding-inline: var(--at-pad); scrollbar-width: none; }
  .at-acards::-webkit-scrollbar { display: none; }
  .at-acard { flex: 0 0 280px; height: auto; aspect-ratio: 280 / 400; scroll-snap-align: start; scroll-snap-stop: always; }
  .at-acard__body { left: 14px; right: 14px; bottom: 26px; }
  .at-acard__cat { font-size: 14px; }
  .at-acard__title { margin-top: 5px; width: auto; font-size: 18px; }
  .at-acard__body .at-btn { margin-top: 20px; min-width: 136.7px; }
  .at-articles .at-carousel__nav { display: flex; justify-content: flex-end; gap: 20px; margin-top: 24px; }
  .at-articles .at-carousel__btn { width: 42px; height: 42px; }
}

/* 产品页 768–1279（没有单独的稿）：按 PC 稿的并排关系等比缩小，不再拉成一列。
   上面「窄屏兜底」把聚音 / 续航改成竖排时 flex: 1 1 0 还在，竖排下高度被算成 0、两组卡整块不显示，这里改回并排；
   核心优势三卡也保持三列（单列时一张近 1000px 高）。 */
@media (min-width: 767.02px) and (max-width: 1279px) {
  .at-adv__cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  .at-adv__card { aspect-ratio: 459 / 600; }
  .at-adv--tech .at-adv__body { width: auto; right: calc(43 * var(--at-u)); }
  .at-focus__cards, .at-battery__cards { flex-direction: row; gap: 16px; }
  .at-focus__card, .at-battery__card { flex: 1 1 0; }
  /* 「窄屏兜底」把产品页导航改成 sticky 后会占一行高度：透明导航的白色 logo / 图标落在白底上看不见，首屏也被推到导航下面。
     同首页：首屏上提一个导航高度，让导航压在首屏图上（稿 1178:287）；滚动后导航照常变成半透明白底黑字。 */
  .at-site.single-at_product .at-hero { margin-top: calc(-1 * var(--at-header-h)); }
}
/* Pro3.0 首屏 768–1279（1178:287 等比缩放）：上面「窄屏兜底」把首屏改成 16:9、文字贴左 40px、按钮跟在后面，和稿差得多。
   这里按视口宽度等比还原 1920×900 的版式（--hu = 视口宽 / 1920）：文字左 240、顶 334，标题 66 / 副标 46 间距 10，按钮距副标 40、60 高、间距 15；
   字号和按钮高度设下限，768 宽时不至于小到看不清、点不到。 */
@media (min-width: 767.02px) and (max-width: 1279px) {
  .at-pro--pro3 .at-hero { --hu: calc(var(--at-vw, 100vw) / 1920); height: calc(900 * var(--hu)); }
  .at-pro--pro3 .at-hero__media { position: absolute; inset: 0; aspect-ratio: auto; }
  .at-pro--pro3 .at-hero__copy { top: calc(334 * var(--hu)); left: calc(240 * var(--hu)); max-width: none; }
  .at-pro--pro3 .at-hero__title { height: auto; font-size: max(30px, calc(66 * var(--hu))); line-height: 1.02; }
  .at-pro--pro3 .at-hero__sub { margin-top: calc(10 * var(--hu)); font-size: max(20px, calc(46 * var(--hu))); line-height: 1.22; }
  .at-pro--pro3 .at-hero__actions { margin-top: calc(40 * var(--hu)); gap: calc(15 * var(--hu)); }
  .at-pro--pro3 .at-hero__actions .at-btn--lg { height: max(38px, calc(60 * var(--hu))); padding-inline: max(18px, calc(32 * var(--hu))); font-size: max(14px, calc(22 * var(--hu))); gap: max(8px, calc(14 * var(--hu))); }
  .at-pro--pro3 .at-hero__compare { min-width: max(110px, calc(172 * var(--hu))); }
}

/* 768–1023 三列卡只有 220–300 宽，核心优势的「图标 + 文字」横排放不下：图标放到文字上方，整组居中 */
@media (min-width: 767.02px) and (max-width: 1023px) {
  .at-adv--adv .at-adv__body { flex-direction: column; align-items: center; gap: 10px; text-align: center; }
  .at-adv--adv .at-adv__text { align-items: center; }
}

/* ==========================================================================
   手机端 —— 按 Figma「国内设计文件 / 首页移动端」(490:627) 及各产品页 / 比较页移动端画板（375 画板）实现
   与 PC 端共用同一套模板与类名，只在 ≤767 下改布局：
     · 画板宽 375，左右留 20，内容宽 335；区块之间统一留 60，尺寸按稿直接写 px（卡片宽度随屏幕撑满，高度按稿的宽高比）
     · 导航改成白底黑字 41 高（不再压在 KV 上），右侧「选购」图标 + 汉堡；客服耳麦变成右下角悬浮按钮（812:475）
     · 所有按钮统一 35 高 / 14px（即 PC 的 sm 尺寸），通栏按钮 44 高
     · 多列卡片改单列竖排；指南卡与听力豆串联改横滑 + 42 圆形前后按钮；比较表横向滑动 + 进度条
   PC 端（≥768）不受影响。
   ========================================================================== */
@media (max-width: 767px) {
  :root {
    --at-pad: 20px;
    --at-header-h: 41px;
    --at-radius: 25px;
    --at-radius-lg: 25px;
  }
  body.at-site { font-size: 14px; }
  html, body.at-site { scroll-padding-top: 41px; }
  .at-container { max-width: none; padding-inline: 20px; }
  .at-section__title { font-size: 30px; line-height: 1.2; }
  /* 中文标题只在标点后换行（设计稿：「从声音处理，/到佩戴与调节。」）：at_seg() 把标题按标点切成若干段，
     每段在手机端是 inline-block，放得下就同一行，放不下整段换行，不会在词中间断开；PC 端这些 span 是普通行内元素，没有影响。 */
  .at-seg { display: inline-block; max-width: 100%; }
  /* 居中标题里以标点结尾的段：把标点宽度（1em）从盒子里扣掉再居中，字面上的四个字就正好居中、标点挂在右边（490:636 这一行右移 18.5 ≈ 半个标点）。只对居中的标题生效，左对齐标题不需要。 */
  .at-hero__title .at-seg--punc, .at-compare__title .at-seg--punc { margin-right: -1em; }
  .at-hero__sub .at-seg--punc:last-child { margin-right: -1em; } /* 首屏副标末尾的句号同样不参与居中：字面居中、句号挂右 */
  /* 标题里的「/」是手机端专用换行（设计稿「听力豆串联 / 助听、音乐、通话」），PC 端不换行 */
  .at-br-m { display: inline; }

  /* ---- 按钮：lg / sm 都是 35 高 14px；箭头 15.586×8.829（同 PC 的 sm）---- */
  .at-btn--lg, .at-btn--sm { height: 35px; padding-inline: 20px; font-size: 14px; gap: 8.4px; border-width: 0.6px; }
  .at-btn--arrow.at-btn--lg:hover, .at-btn--arrow.at-btn--sm:hover { padding-inline: 20px; }
  .at-btn--outline-dark:hover, .at-btn--outline-light:hover, .at-btn--sm.at-btn--outline-dark:hover, .at-btn--sm.at-btn--outline-light:hover { box-shadow: none; }
  .at-btn__arrow, .at-btn--sm .at-btn__arrow, .at-btn:hover .at-btn__arrow, .at-btn--sm:hover .at-btn__arrow { --a-w: 15.586; --a-h: 8.829; width: 15.586px; height: 8.829px; }
  .at-btn__arrow-line { height: 1.2px; right: 0.66px; } /* 头宽 4.66 × 0.142：尾线止于箭头尖，见上方 PC 说明 */
  .at-btn__arrow-head { width: 4.66px; }
  .at-tag { font-size: 12px; padding: 4px 8px; margin-left: 8px; }
  .at-status { height: 35px; font-size: 14px; }
  .at-carousel__nav { display: none; gap: 20px; margin-top: 24px; }
  .at-carousel__btn { width: 42px; height: 42px; }

  /* ---- 导航（842:320 / 产品页 842:337）：高 41，只有标志 40×19（左 20）+ 汉堡 15.9×13.6（右 20），没有「选购」图标；
     首页与产品页压在首屏 KV 上：透明底、白标志白汉堡；滚过首屏后（.is-scrolled，Figma 842:151「导航栏移动端滑动」画的是 20% 黑 + 模糊 35、白标志）按反馈同 PC 改成浅色毛玻璃：白 60% + 模糊 35，标志和汉堡转黑（验配服务页黑底仍用深色 + 白）；其余页面白底黑字。
     毛玻璃画在 ::before 上而不是导航条本身：导航条一旦有 backdrop-filter，里面 fixed 定位的客服悬浮按钮就会被它当成定位基准、跑到导航里去。 ---- */
  .at-header, .at-site.page-template-page-compare .at-header { position: sticky; top: 0; height: 41px; background: #fff; border-bottom: 0.5px solid var(--at-line-header); -webkit-backdrop-filter: none; backdrop-filter: none; }
  /* 比较页（反馈录屏 飞书20261020-103334：手机端导航不是毛玻璃）：同 PC，一滚动就垫白 60% + 模糊 35。
     导航条本身不能加 backdrop-filter（PC 规则特异性更高，这里要显式压掉），否则客服按钮被导航条收走；毛玻璃同首页画在 ::before 上。 */
  .at-site.page-template-page-compare .at-header.is-scrolled:not(.is-mega) { background: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .at-site.page-template-page-compare .at-header.is-scrolled:not(.is-mega)::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: rgba(255, 255, 255, 0.6); -webkit-backdrop-filter: blur(35px); backdrop-filter: blur(35px); }
  /* 比较页导航不画底线（反馈 2026-10-20 截图「不要这根线」，同 PC 稿 530:912）：顶部和滚动后都不画 */
  .at-site.page-template-page-compare .at-header, .at-site.page-template-page-compare .at-header.is-scrolled:not(.is-mega) { border-bottom-color: transparent; }
  /* 产品页主导航不吸顶、随首屏滚走（同 PC）：滚过首屏后由下面的悬浮条（842:69）接替 */
  .at-site.single-at_product .at-header { position: absolute; top: 0; left: 0; right: 0; }
  .at-header--overlay:not(.is-mega) { background: transparent; border-bottom-color: transparent; }
  .at-header--overlay.is-scrolled:not(.is-mega) { background: transparent; border-bottom-color: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .at-header--overlay.is-scrolled:not(.is-mega)::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: rgba(255, 255, 255, 0.6); -webkit-backdrop-filter: blur(35px); backdrop-filter: blur(35px); }
  .at-site.page-template-page-fitting .at-header--overlay.is-scrolled:not(.is-mega)::before { background: rgba(0, 0, 0, 0.2); }
  .at-site.page-template-page-fitting .at-header--overlay.is-scrolled:not(.is-mega) { background: transparent; }
  .at-logo { height: 19px; gap: 5px; }
  .at-logo__part, .at-logo__img { height: 19px; }
  .at-header__actions { gap: 17px; }
  .at-headicon { width: 30px; height: 30px; padding: 0; }
  /* 客服（812:475）：右下角悬浮 40 圆，白 60% + 毛玻璃，投影 0 0 13.3 黑 10%，图标 21.3；浮窗改成向上弹出 */
  .at-contact { position: fixed; right: 25px; bottom: 27px; z-index: 95; } /* 812:491：x 310 / y 625 于 375×692 画板 */
  .at-contact .at-headicon, .at-header--overlay:not(.is-mega) .at-contact .at-headicon { width: 40px; height: 40px; border-radius: 50%; background: rgba(255, 255, 255, 0.6); color: var(--at-black); box-shadow: 0 0 13.3px rgba(0, 0, 0, 0.1); -webkit-backdrop-filter: blur(9px); backdrop-filter: blur(9px); }
  .at-contact .at-headicon__icon { width: 21.3px; height: 21.3px; }
  .at-contact__pop { top: auto; bottom: calc(100% + 12px); right: 0; min-width: 220px; padding: 14px 18px; border-radius: 16px; box-shadow: 0 8px 28px rgba(0, 0, 0, 0.13), 0 2px 8px rgba(0, 0, 0, 0.07); }
  .at-contact__label, .at-contact__hint { font-size: 12px; }
  .at-contact__phone { margin-top: 4px; font-size: 22px; }
  body.at-nav-open .at-contact, body.at-modal-open .at-contact { display: none; }
  /* ---- 产品页悬浮条（842:69「产品导航栏移动端」）：条 335×40 圆角 20，left 20 / top 10，底白 80% + 毛玻璃 10，投影 0 0 13 黑 10%，内边距 14；
     左产品名 14px Medium，右「比较产品」62×20.65 描边 0.5 + 「天猫购买 →」68.8×20.65 橙，10px，间距 6.2，箭头 9.3；滚过首屏后滑入（main.js productBar），此时主导航已随页面滚走 ---- */
  .at-subnav { display: block; height: 50px; }
  .at-subnav__bar { top: 10px; left: 20px; right: 20px; width: auto; height: 40px; transform: none; padding-inline: 14px; border-radius: 20px; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 0 13px rgba(0, 0, 0, 0.1); }
  .at-subnav__name { font-size: 14px; line-height: 20px; }
  .at-subnav__actions { gap: 6.2px; }
  .at-subnav .at-btn--sm, .at-subnav .at-status { height: 20.65px; padding-inline: 0; font-size: 10px; gap: 5.2px; }
  .at-subnav .at-btn--outline-dark { width: 62px; border-width: 0.5px; }
  .at-subnav .at-btn--primary { width: 68.84px; }
  .at-subnav .at-btn--primary .at-btn__arrow, .at-subnav .at-btn--primary:hover .at-btn__arrow { --a-w: 9.275; --a-h: 5.254; width: 9.275px; height: 5.254px; }
  .at-subnav .at-btn__arrow-line { height: 0.72px; right: 0.39px; }
  .at-subnav .at-btn__arrow-head { width: 2.77px; }

  /* ---- 首屏（首页 490:630 / 产品页 657:68）：375×692 从页面顶部起，导航透明压在上面（往上收 41）；手机 KV 独立构图（750×1384，2 倍）；
     顶部压暗渐变 黑 30%@1.2% → 透明@64.6%（产品页 黑 60%@4% → 透明@63.6%），正片叠底；文字居中 top 80：标题 40 Medium、副标 16（产品页 26）间距 5；按钮居中 top 570（距底 87） ---- */
  .at-hero, .at-hero--product { position: relative; height: 692px; min-height: 0; overflow: hidden; }
  .at-site.home .at-hero { margin-top: -41px; }
  .at-site.single-at_product .at-hero { margin-top: 0; } /* 产品页导航是 absolute，不占高度 */
  .at-hero__media { position: absolute; inset: 0; aspect-ratio: auto; }
  .at-hero__media::after { content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 1.156%, rgba(102, 102, 102, 0) 64.595%); }
  .at-hero--product .at-hero__media::after, .at-pro--pro1 .at-hero__media::after { mix-blend-mode: multiply; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.6) 4.046%, rgba(102, 102, 102, 0) 63.584%); }
  .at-pro--bean .at-hero__media::after { content: none; } /* 听力豆手机 KV（671:369）里压暗渐变压在产品图下面、耳机不被压暗，所以渐变已合进「首屏 KV · 手机」图里，这里不再叠 */
  .at-pro--pro1 .at-hero__media::after { background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, rgba(102, 102, 102, 0) 36.298%); } /* 692:728：Pro1.0 手机首屏压暗 黑 30% → 透明 @36.3%，正片叠底 */
  .at-hero__copy, .at-hero--product .at-hero__copy { position: absolute; inset: 80px 20px 0; width: auto; max-width: none; text-align: center; }
  .at-hero__title { font-size: 40px; line-height: normal; white-space: normal; text-wrap: balance; max-width: 300px; margin-inline: auto; }
  .at-hero__sub, .at-hero--product .at-hero__sub { margin-top: 5px; font-size: 16px; line-height: normal; white-space: normal; }
  .at-hero--product .at-hero__sub { font-size: 26px; }
  /* 首页手机首屏按新稿 1504:153（反馈 2026-10-19）：副标 20（原 16）；标题「专业助听 / 就选昂听」两行不带逗号——逗号本来就挂在行外（margin-right -1em）不参与居中，这里再把它裁掉 */
  .at-hero:not(.at-hero--product) .at-hero__sub { font-size: 20px; }
  .at-hero:not(.at-hero--product) .at-hero__title .at-seg--punc { clip-path: inset(0 1em 0 0); }
  .at-hero:not(.at-hero--product) .at-hero__actions .at-btn--primary { min-width: 140px; } /* 1504:157：「昂听产品对比」140×35 */
  .at-hero__actions, .at-hero--product .at-hero__actions { position: absolute; top: auto; bottom: 87px; left: 0; right: 0; margin: 0; justify-content: center; gap: 15px; }
  .at-hero .at-tag--inverse { position: static; display: inline-block; margin: 0 0 8px; }
  .at-hero__actions .at-btn--primary { min-width: 116px; }
  .at-hero--product .at-hero__compare { min-width: 103px; }

  /* ---- 荣誉奖项带（812:495，高 200）：标题 20 Medium top 18；标识按 0.897 缩放（最高 90.4）横排间距 40，top 76 ---- */
  .at-awards { padding: 56px 0; } /* 整块加高（反馈 2026-10-20：「可以再宽点，400–500」，选了「标识放大 + 留白加大」）：上下留白 100；之后反馈「稍微窄点」（标题上方、标识到「选择你的昂听」两段留白）→ 70；标题去掉后又反馈「可以再窄点」→ 40；又反馈「再宽点就好了」→ 56，整块约 182 */
  .at-awards__title { margin-bottom: 40px; font-size: 30px; font-weight: 500; line-height: 36px; } /* 字号同下面的区块标题「选择你的昂听」（30 / Medium / 行高 36，反馈 2026-10-20）；与标识间距同下方标题到内容的 24 */
  .at-awards__marquee { height: 70px; animation-duration: 70s; } /* 标识最高 90.4（手机稿 812:495 原值，按 0.897 缩放）：反馈 2026-10-20 先放大到 160、又嫌大缩到 120，仍嫌大，回到稿内尺寸；之后反馈「可以再小点」→ 最高 70（按 0.7 缩放） */
  .at-awards__track { gap: 32px; padding-right: 32px; } /* 稿内间距 40，标识缩到 70 后随之收到 32 */
  .at-awards__item { width: calc(var(--at-aw) * 0.7px); height: calc(var(--at-ah) * 0.7px); } /* 宽度直接按 --at-aw 算（与高度同一比例），不靠 aspect-ratio：iOS WebKit 在横排 flex 里按 aspect-ratio 推宽度不稳 */

  /* ---- 产品区（490:637）：紧接奖项带；卡 335×410 r20 竖排间距 24；名称 28 Medium 居中 top 32，说明 16 居中；按钮居中距底 21 ---- */
  .at-products { padding: 0; }
  .at-products .at-section__title { margin-bottom: 24px; }
  .at-products__track { flex-direction: column; gap: 24px; overflow: visible; scroll-snap-type: none; padding-inline: 20px; }
  .at-pcard { flex: none; width: 100%; height: auto; aspect-ratio: 335 / 410; }
  /* 手机稿 1178:642 / 656 / 670：顶部压暗（下半透明 → 顶边黑 50%，正片叠底），Pro1.0 只压 20%；稿里那层 0.7 的下压渐变垫在产品图下面，看不到 */
  .at-pcard__media::after { mix-blend-mode: multiply; background: linear-gradient(to top, rgba(102, 102, 102, 0) 50%, rgba(0, 0, 0, 0.5) 100%); }
  .at-pcard[data-at-product="pro1"] .at-pcard__media::after { background: linear-gradient(to top, rgba(102, 102, 102, 0) 50%, rgba(0, 0, 0, 0.2) 100%); }
  .at-pcard:hover .at-pcard__img, .at-pcard:focus-within .at-pcard__img { transform: none; }
  .at-pcard__body { inset: 32px 20px 21px; top: 32px; text-align: center; }
  .at-pcard__name { font-size: 28px; line-height: 1.04; letter-spacing: -0.616px; white-space: normal; } /* 490:646：名称行 29（top 32），稿内名称框高 35，下面留 6 再接说明（top 67） */
  .at-pcard__tagline { margin: 6px auto 0; max-width: 230px; font-size: 16px; line-height: normal; word-break: keep-all; } /* 490:647：说明框宽 241 折成两行、只在「·」处换行；浏览器字宽比 Figma 略窄，241 时「小巧便携 · 入耳式 · App自主调节」刚好塞进一行，收到 230 让它同样折行 */
  .at-pcard__actions { position: absolute; left: 0; right: 0; bottom: 0; margin: 0; justify-content: center; gap: 15px; }
  .at-pcard__actions .at-btn--outline-light { min-width: 116px; }
  .at-pcard__actions .at-btn--primary { min-width: 103px; }

  /* ---- 产品与操作展示（490:682）：三卡 335×260 r16 竖排间距 24，文字 left/right 20 距底 20：标题 20 Medium、说明 14/1.5；底部通栏橙色按钮 ---- */
  .at-features { padding: 60px 0 0; }
  .at-features .at-section__title { margin-bottom: 24px; line-height: 1.08; letter-spacing: -0.66px; }
  .at-fcards { grid-template-columns: 1fr; gap: 24px; }
  .at-fcard { height: auto; aspect-ratio: 335 / 260; border-radius: var(--at-radius); }
  .at-fcard__media::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(102, 102, 102, 0) 51.442%); }
  .at-fcard__body { left: 20px; right: 20px; bottom: 20px; width: auto; gap: 10px; }
  .at-fcard__title { font-size: 20px; }
  .at-fcard__desc { font-size: 14px; line-height: 1.5; }
  .at-fcard:nth-child(3) .at-fcard__desc { color: rgba(255, 255, 255, 0.8); } /* 1178:699 */
  .at-features__foot { margin-top: 24px; }
  .at-features__foot .at-btn { width: 100%; min-width: 0; font-weight: 500; background: var(--at-brand); border-color: var(--at-brand); color: #fff; }
  .at-tabs__media { height: auto; aspect-ratio: 335 / 260; }

  /* ---- 选购指引（490:703）：标题 30/1.2 → 引导 18/1.6（间距 12）→ 图 335×297 r20 → 三张页签卡 335×65 r20 间距 12（间距 24）---- */
  .at-guide { padding: 60px 0 0; }
  .at-guide .at-section__title { margin-bottom: 12px; color: #111; }
  .at-guide__grid { display: flex; flex-direction: column; align-items: stretch; gap: 24px; }
  .at-guide__side { display: contents; }
  .at-guide__intro { order: 1; font-size: 18px; line-height: 1.6; max-width: 317px; }
  .at-guide__media { order: 2; height: auto; aspect-ratio: 335 / 297; border-radius: var(--at-radius); }
  .at-guide__list { order: 3; margin-top: 0; gap: 12px; width: auto; }
  .at-gcard { height: 65px; padding: 11px 29px 11px 25px; border-radius: var(--at-radius); justify-content: flex-start; }
  .at-gcard:hover { box-shadow: none; }
  .at-gcard[aria-selected="true"], .at-gcard.is-selected, .at-gcard:active { background: #fff9f7; box-shadow: inset 0 0 0 1px var(--at-brand); }
  .at-gcard__inner { width: 100%; padding: 0; }
  .at-gcard__title { font-size: 18px; line-height: 1.5; }
  .at-gcard__desc { font-size: 14px; line-height: 1.5; }

  /* ---- 家庭场景（490:846，375×650）：顶部渐变 rgba(0,0,0,.5)@23.8%→透明@50%；标题 30/1.1 top 50、正文 16/1.35（间距 12，宽 320）；按钮居中距底 85 ---- */
  .at-lifestyle { height: 650px; min-height: 0; aspect-ratio: auto; margin-top: 60px; } /* 固定 650 高（同首屏固定 692），屏更宽时不再按比例拉高 */
  .at-lifestyle__media { position: absolute; aspect-ratio: auto; }
  .at-lifestyle__media::after { background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 23.813%, rgba(102, 102, 102, 0) 49.999%); mix-blend-mode: normal; }
  .at-lifestyle__copy { position: absolute; inset: 50px 20px 0; width: auto; max-width: none; }
  .at-lifestyle__title { margin-left: 0; font-size: 30px; line-height: 1.1; letter-spacing: 0.3px; }
  .at-lifestyle__body { position: static; margin-top: 12px; width: 320px; max-width: 100%; font-size: 16px; line-height: 1.35; letter-spacing: 0.32px; }
  .at-lifestyle__actions { position: absolute; top: auto; bottom: 85px; left: 0; right: 0; margin: 0; display: flex; justify-content: center; }
  .at-lifestyle__actions .at-btn { min-width: 125px; }

  /* ---- 服务流程（490:717，底 #fcfaf6）：上留 60；标题 30/1.2 → 图 335×400 r20 → 四步 2×2（162.5×65 r20，圆标 32 + 标题 16 Semibold / 说明 12）→ 通栏橙色按钮，间距 24 ---- */
  .at-service, .at-service-pin { background: #fcfaf6; }
  .at-service { padding: 60px 0 0; }
  .at-service .at-container { display: flex; flex-direction: column; }
  .at-service__head { display: contents; }
  .at-service__title { order: 1; }
  .at-service__media { order: 2; height: auto; aspect-ratio: 335 / 400; margin-top: 24px; border-radius: var(--at-radius); }
  .at-steps { order: 3; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 9.5px; margin-top: 24px; padding-top: 0; }
  .at-steps::before, .at-steps__fill, .at-step__dot { display: none; }
  .at-step__btn { display: grid; grid-template-columns: 32px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 10px; row-gap: 0; align-items: center; height: 65px; padding: 11px 10px; border: 1px solid var(--at-line-card); border-radius: var(--at-radius); background: transparent; transition: border-color var(--at-dur), background-color var(--at-dur), color var(--at-dur); }
  .at-step.is-active .at-step__btn { background: #fff9f7; border-color: var(--at-brand); color: var(--at-brand); }
  .at-step__num { grid-row: 1 / 3; width: 32px; height: 32px; border-radius: 50%; background: var(--at-line-card); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 0; line-height: 1; }
  .at-step__num::before { content: attr(data-n); font-size: 16px; font-weight: 700; }
  .at-step.is-active .at-step__num { background: var(--at-brand); }
  .at-step__title { grid-column: 2; font-size: 16px; font-weight: 600; line-height: 1.5; color: inherit; white-space: nowrap; }
  .at-step__desc { grid-column: 2; font-size: 12px; line-height: 1.5; color: inherit; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  /* 手机端新版式（手机稿 1512:602，反馈 2026-10-19）：当前步骤的标题 20 Medium + 说明 14（行高都是 1.5）压在图左下角 left 20、距图底 29，白字；
     图底压暗 正片叠底 透明@50.473% → 黑 40%；随图淡入淡出。下面四个格子一排 73.75×65 间距 14，只留 32 序号圆（选中 #fff9f7 底 + 橙描边 + 橙圆，其余 #d2d2d7），步骤文字只对读屏保留。 */
  .at-service__slide::after { content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply; background: linear-gradient(to bottom, rgba(102, 102, 102, 0) 50.473%, rgba(0, 0, 0, 0.4) 100%); }
  .at-service__cap { position: absolute; left: 20px; right: 20px; bottom: 29px; z-index: 1; display: flex; flex-direction: column; gap: 0; color: #fff; }
  .at-service__cap-title { font-size: 20px; font-weight: 500; line-height: 1.5; }
  .at-service__cap-desc { font-size: 14px; line-height: 1.5; }
  /* 两张图交叉淡入淡出时文字不叠：旧图的文字立刻收起，新图的文字稍晚淡入 */
  .at-service__cap { opacity: 1; transition: opacity 0.3s var(--at-ease) 0.15s; }
  .at-service__slide:not(.is-active) .at-service__cap { opacity: 0; transition: none; }
  .at-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
  .at-step__btn { position: relative; display: flex; align-items: center; justify-content: center; height: 65px; padding: 0; }
  .at-step__title, .at-step__desc { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

  /* ---- 关于昂听（490:741，底 #fcfaf6）：上下各 60；标题 30/1.08 → 正文 18/1.6 → 图 335×400 r20 → 两枚 162×35 按钮（间距 11），块间距 24 ---- */
  .at-about { padding: 60px 0; background: #fcfaf6; }
  .at-about__grid { display: flex; flex-direction: column; align-items: stretch; gap: 24px; }
  .at-about__copy { display: contents; }
  .at-about__title { order: 1; margin-bottom: 0; line-height: 1.08; letter-spacing: -0.66px; }
  .at-about__body { order: 2; font-size: 18px; line-height: 1.6; }
  .at-about__evidence { order: 3; margin-top: 0; font-size: 14px; }
  .at-about__media { order: 4; height: auto; aspect-ratio: 335 / 400; border-radius: var(--at-radius); }
  .at-about__actions { order: 5; margin-top: 0; gap: 11px; flex-wrap: nowrap; }
  .at-about__actions .at-btn { flex: 1 1 0; min-width: 0; padding-inline: 12px; font-weight: 500; }
  .at-about + .at-articles { padding-top: 0; }

  /* ---- 选购与使用指南（490:752）：卡 280×400 r20 横滑间距 14（右侧露出）；卡内 left 14 距底 26：分类 14、标题 18 Medium、按钮 136.7×35；右下 42 圆形前后按钮 ---- */
  .at-articles { padding: 60px 0 0; }
  .at-articles .at-section__title { margin-bottom: 24px; }
  .at-acards { display: flex; gap: 14px; overflow-x: auto; overflow-y: hidden; /* 只设 overflow-x 时 overflow-y 会被算成 auto，入场动画的 translateY(32px) 会让容器能上下滚 */ scroll-snap-type: x mandatory; scroll-behavior: smooth; margin-inline: -20px; padding-inline: 20px; scroll-padding-inline: 20px; scrollbar-width: none; }
  .at-acards::-webkit-scrollbar { display: none; }
  .at-acard { flex: 0 0 min(280px, 74.7vw); height: auto; aspect-ratio: 280 / 400; scroll-snap-align: start; scroll-snap-stop: always; border-radius: var(--at-radius); } /* snap-stop：一次手势只过一张，不会停在两张之间 */
  .at-acard__media::after { background: linear-gradient(to bottom, rgba(102, 102, 102, 0) 40%, rgba(0, 0, 0, 0.6) 100%); }
  .at-acard__body { left: 14px; right: 14px; bottom: 26px; }
  .at-acard__cat { font-size: 14px; }
  .at-acard__title { margin-top: 5px; width: auto; font-size: 18px; }
  .at-acard__body .at-btn { margin-top: 20px; min-width: 136.7px; }
  .at-articles .at-carousel__nav, .at-link .at-carousel__nav { display: flex; }

  /* ---- 常见问题（首页 490:788 / 产品页 657:225）：标题 24（产品页 26）Medium #191715；条目上下 16、行间 12、底线 1px #eaeaea；问题 14；加号 28 圆 ---- */
  .at-faq, .at-pro .at-faq { padding: 60px 0; }
  .at-faq .at-section__title { font-size: 24px; line-height: normal; color: var(--at-text); margin-bottom: 21px; }
  .at-pro .at-faq .at-section__title { font-size: 26px; margin-bottom: 12px; }
  .at-accordion { display: flex; flex-direction: column; gap: 12px; }
  .at-accordion__item { border-bottom-color: #eaeaea; }
  .at-accordion__trigger, .at-pro .at-accordion__trigger { height: auto; padding: 16px 0; gap: 12px; font-size: 14px; line-height: normal; color: var(--at-black); }
  .at-accordion__icon { width: 28px; height: 28px; }
  .at-accordion__icon::before { width: 10px; height: 1.6px; }
  .at-accordion__icon::after { width: 1.6px; height: 10px; }
  .at-accordion__content > * { max-width: none; padding-bottom: 16px; font-size: 14px; }

  /* ---- 页尾（490:804）：上 29；标志 47×22 → 口号 24 Medium → 副标 14/1.5（间距 12）；三列竖排间距 24：栏目 18 Medium、链接 14/1.5 白 80%；分隔线上下各 24；说明 11/1.5，下 29 ---- */
  .at-footer__main { display: flex; flex-direction: column; gap: 24px; min-height: 0; padding: 29px 20px 0; }
  .at-footer__brand { width: auto; gap: 12px; }
  .at-footer__brand .at-logo { height: 22px; gap: 5px; }
  .at-footer__brand .at-logo__part, .at-footer__brand .at-logo__img { height: 22px; }
  .at-footer__slogan { font-size: 24px; }
  .at-footer__sub { font-size: 14px; font-weight: 400; line-height: 1.5; color: #fff; }
  .at-footer__cols { flex-direction: column; gap: 24px; }
  .at-footer__col { width: auto; min-width: 0; }
  .at-footer__col h3 { font-size: 18px; letter-spacing: 0; margin-bottom: 12px; }
  .at-footer__col ul { gap: 8px; }
  .at-footer__col a { font-size: 14px; line-height: 1.5; color: rgba(255, 255, 255, 0.8); }
  .at-footer__legal { margin: 24px 20px 0; border-top-color: rgba(216, 216, 216, 0.4); }
  .at-footer__legal-inner { height: auto; flex-direction: column; align-items: flex-start; gap: 12px; padding: 24px 0 29px; }
  .at-footer__disclaimer, .at-footer__copy { font-size: 11px; line-height: 1.5; color: rgba(255, 255, 255, 0.8); white-space: normal; }
  .at-footer__disclaimer a, .at-footer__policies a { margin-left: 8px; }

  /* ---- 购买平台选择层：手机改底部抽屉 ---- */
  .at-modal { align-items: flex-end; padding: 0; }
  .at-modal__dialog { width: 100%; max-height: 85vh; border-radius: 20px 20px 0 0; padding: 24px 20px calc(24px + env(safe-area-inset-bottom)); }

  /* ---- 通用页面 ---- */
  .at-section { padding-block: 40px; }
  .at-section--tight { padding-block: 24px; }
  .at-page__title, .at-product__name { font-size: 30px; }
  .at-prose { max-width: none; font-size: 15px; }
  .at-product__hero-inner { grid-template-columns: 1fr; gap: 24px; }
  .at-product__subtitle { font-size: 16px; }

  /* ==========================================================================
     产品详情页
     ========================================================================== */
  .at-btn--xs { height: 30px; padding-inline: 16px; font-size: 12px; }

  /* 核心优势（657:78）：卡 335×410 r20 竖排间距 24；圆环 48 + 图标 33，标题 26 Medium / 说明 14，整组居中距底 35 */
  .at-adv, .at-adv--tech { padding: 60px 0 0; }
  .at-adv .at-section__title, .at-adv--tech .at-section__title { margin-bottom: 24px; text-align: left; }
  .at-adv__cards { grid-template-columns: 1fr; gap: 24px; }
  .at-adv__card { height: auto; aspect-ratio: 335 / 410; }
  .at-adv__media::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(102, 102, 102, 0) 50%); }
  /* Pro3.0 手机稿：第 2 张（1178:1583）黑底产品图上没有压暗，第 3 张（1178:1598）压到 75% */
  .at-adv--adv .at-adv__card:nth-child(2) .at-adv__media::after { content: none; }
  .at-adv--adv .at-adv__card:nth-child(3) .at-adv__media::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.75) 0%, rgba(102, 102, 102, 0) 50%); }
  .at-adv__body { top: auto; bottom: 35px; left: 20px; right: 20px; gap: 21px; justify-content: center; align-items: center; }
  .at-adv__ring { width: 48px; height: 48px; }
  .at-adv__icon { width: calc(var(--i-w, 48) * 0.686px); height: calc(var(--i-h, 48) * 0.686px); }
  .at-adv__title { margin-top: 0; font-size: 26px; line-height: 1.04; letter-spacing: -0.572px; }
  .at-adv__desc { margin-top: 8px; font-size: 14px; }
  /* 科技三卡（671:420）：同首页展示卡，335×260 r10，文字 left/right 20 距底 21 */
  .at-adv--tech .at-adv__card { aspect-ratio: 335 / 260; border-radius: var(--at-radius); }
  .at-adv--tech .at-adv__media::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(102, 102, 102, 0) 51.442%); }
  .at-adv--tech .at-adv__body { left: 20px; right: 20px; top: auto; bottom: 21px; width: auto; justify-content: flex-start; }
  .at-adv--tech .at-adv__text { gap: 10px; }
  .at-adv--tech .at-adv__title { font-size: 20px; line-height: normal; letter-spacing: 0; }
  .at-adv--tech .at-adv__desc { margin-top: 0; font-size: 14px; line-height: 1.5; }

  /* 全幅图文带（Elepro 375×650）：文字 left 20 宽 335，标题 30/1.1（字距 .3），副标 20（上留 52）；bottom 形态文字在下（距底 77，副标 18）；相邻两条图文带之间不留空 */
  .at-banner { height: 650px; aspect-ratio: auto; margin-top: 60px; text-align: left; } /* 固定 650 高（同首屏固定 692），屏更宽时不再按比例拉高 */
  .at-banner + .at-banner { margin-top: 0; }
  .at-banner__copy { display: flex; flex-direction: column; gap: 5px; padding: 52px 20px 0; }
  .at-banner__title, .at-banner__sub, .at-banner--left .at-banner__title, .at-banner--stat .at-banner__title, .at-banner--stats .at-banner__title, .at-banner--k-bands .at-banner__title, .at-banner--left .at-banner__sub, .at-banner--k-bands .at-banner__sub { position: static; width: auto; font-size: 30px; line-height: 1.1; letter-spacing: 0.3px; white-space: normal; }
  .at-banner__sub, .at-banner--left .at-banner__sub, .at-banner--k-bands .at-banner__sub { font-size: 20px; line-height: 1.35; letter-spacing: 0.4px; color: #fff; }
  /* 快速补能（973:150）：手机端是深色照片 + 白字（PC 是浅色底黑字），顶部压暗渐变 黑 40%@1.8% → 透明@31.6% 正片叠底；标题 30 / 副标 20 与「更大功率」同一套 */
  .at-banner--light { background: #000; color: #fff; }
  .at-banner--light .at-banner__sub { color: #fff; }
  .at-banner--light .at-banner__media::after { content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 1.846%, rgba(102, 102, 102, 0) 31.601%); }
  .at-banner--dark .at-banner__media::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 23.813%, rgba(102, 102, 102, 0) 49.999%); }
  /* 高增益按新手机稿 1504:145：标题 30/1.1 + 副标 18/1.35（间距 5）居中压在顶部 top 53；稿内压暗渐变被上层图盖住、实际不可见，手机端不叠 */
  .at-banner--bottom .at-banner__copy { align-items: center; padding: 53px 20px 0; text-align: center; }
  /* 反馈 2026-10-19：更大功率 / 快速补能的标题与副标也跟 PC 一样在顶部居中（三块统一） */
  .at-banner--dark .at-banner__copy, .at-banner--light .at-banner__copy { align-items: center; text-align: center; }
  .at-banner--bottom .at-banner__media::after { content: none; }
  .at-banner--bottom .at-banner__title { font-size: 30px; }
  .at-banner--dark .at-banner__sub, .at-banner--light .at-banner__sub, .at-banner--bottom .at-banner__sub { font-size: 1.125rem; letter-spacing: 0; } /* Pro3.0 更大功率 / 高增益 / 快速补能的副标：原 20 / 18 / 20 → 1.125rem（反馈 2026-10-20：PC 统一 2rem，手机端统一 1.125rem，同 Pro1.0 验配师正文） */
  .at-banner--k-bands .at-banner__copy { padding-top: 60px; }
  .at-banner--k-bands .at-banner__sub { font-size: 18px; letter-spacing: 0.36px; }
  .at-banner--k-bands { height: 600px; } /* 692:808：64 频段手机端高 600，不是 650 */
  .at-banner--k-bands .at-banner__media::after { content: none; } /* 692:808 稿内没有压暗渐变，手机图自带暗色天空 */
  /* left（降噪 671:386）：顶部压暗 + 底部压暗；卖点行在底部（距底 75，行距 15），图标槽 24，文字 20 */
  .at-banner--left .at-banner__media::after { background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 23.813%, rgba(102, 102, 102, 0) 49.999%), linear-gradient(to bottom, rgba(102, 102, 102, 0) 55%, rgba(0, 0, 0, 0.5) 100%); }
  .at-banner__points { top: auto; bottom: 75px; left: 20px; gap: 15px; }
  .at-banner__point { gap: 20px; }
  .at-banner__point-icon { width: 24px; height: 24px; }
  .at-banner__point-icon .at-adv__icon { width: calc(var(--i-w, 38) * 0.55px); height: calc(var(--i-h, 38) * 0.55px); }
  .at-banner__point-text { font-size: 20px; white-space: normal; }
  /* stat（续航 671:471）：闪电圆环 69 + 说明 20 / 数值 26 Semibold，距底 58 */
  .at-banner--stat .at-banner__media::after { background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 23.813%, rgba(102, 102, 102, 0) 49.999%), linear-gradient(to bottom, rgba(102, 102, 102, 0) 55%, rgba(0, 0, 0, 0.5) 100%); }
  .at-banner__stat { top: auto; bottom: 58px; left: 20px; gap: 24px; }
  .at-banner__stat-icon { width: 69px; height: 69px; margin-top: 0; }
  .at-banner__stat-label { font-size: 20px; font-weight: 400; }
  .at-banner__stat-value { font-size: 26px; }
  /* stats（频响 692:759）：上下压暗；数值 26 Semibold + 说明 20，逐行，距底 59 */
  .at-banner--stats .at-banner__media::after { background: linear-gradient(to bottom, rgba(0, 0, 0, 0.6) 0%, rgba(102, 102, 102, 0) 41.18%, rgba(0, 0, 0, 0.6) 100%); }
  .at-banner__figures { top: auto; bottom: 59px; left: 26px; }
  .at-banner__figure { gap: 8px; }
  .at-banner__figure dt { font-size: 26px; }
  .at-banner__figure dd { font-size: 20px; font-weight: 400; }

  /* 标题 + 宽图（657:131 / 657:146）：标题 30/1.2 #111、副标 18/1.6（间距 12）、图 335×478 r20（间距 24）；智能连接的参数改到图下方的 #fcfaf6 面板里（图上圆角、面板下圆角） */
  .at-showcase, .at-showcase--algo, .at-showcase--connect { padding: 60px 0 0; }
  .at-showcase .at-container { display: flex; flex-direction: column; }
  .at-showcase .at-section__title { order: 1; color: #111; }
  .at-showcase__sub { order: 2; margin-top: 12px; font-size: 18px; line-height: 1.6; }
  .at-showcase__media, .at-showcase__stats + .at-showcase__media { order: 3; margin-top: 24px; height: auto; aspect-ratio: 335 / 478; border-radius: var(--at-radius); }
  /* 按反馈 Pro3.0 的四块（更大功率 / 高增益 / 快速补能 / 自研算法）缩到 600 高：三条全幅图带固定 600（手机图 750×1300 上下各裁 25），自研算法的图收到 335×410 让整块约 600 */
  .at-banner--dark, .at-banner--light { height: 600px; }
  .at-banner--bottom { height: 650px; } /* 高增益按新手机稿 1504:145（反馈 2026-10-19）恢复 650，不再跟另外两条缩到 600 */
  .at-banner--bottom .at-banner__img { object-position: center top; }
  .at-showcase--algo .at-showcase__media { aspect-ratio: 335 / 410; }
  .at-showcase--connect .at-showcase__media { margin-top: 22px; aspect-ratio: 335 / 307; }
  /* 「连接更智能，聆听更自由。」按稿（657:148）一行显示：12 个字在 30px 下有 352 宽、放不进 335，字号按可用宽度微缩（375 宽时 27.5px、360 宽时 26.2px），窄机也不换行、不溢出 */
  .at-showcase--connect .at-section__title { white-space: nowrap; font-size: min(30px, calc((100vw - 40px) / 12.2)); }
  .at-showcase__stats + .at-showcase__media { border-radius: var(--at-radius) var(--at-radius) 0 0; }
  .at-showcase__stats { order: 4; flex-direction: column; gap: 12px; margin: 0; padding: 15px 22px; background: #fcfaf6; border-radius: 0 0 var(--at-radius) var(--at-radius); }
  .at-showcase__stat dt { font-size: 20px; white-space: normal; }
  .at-showcase__stat dd { margin-top: 4px; font-size: 14px; color: var(--at-text); white-space: normal; }

  /* 两卡图（精准聚音 657:138：335×240 r20，说明 20 Medium left 32 距底 21；小巧耳内 671:379 / 降噪 692:762：335×280 r16，说明 18 left 24 距底 23） */
  .at-focus, .at-focus--fit, .at-focus--denoise { padding: 60px 0 0; }
  .at-focus .at-section__title, .at-focus--fit .at-section__title, .at-focus--denoise .at-section__title { margin-bottom: 24px; color: #111; }
  .at-focus__cards { flex-direction: column; gap: 24px; }
  .at-focus__card, .at-focus--fit .at-focus__card, .at-focus--denoise .at-focus__card { flex: none; height: auto; aspect-ratio: 335 / 240; border-radius: var(--at-radius); background: #cecece; }
  .at-focus__media::after, .at-focus--fit .at-focus__media::after, .at-focus--fit .at-focus__card:nth-child(2) .at-focus__media::after { mix-blend-mode: multiply; background: linear-gradient(to bottom, rgba(102, 102, 102, 0) 20%, rgba(0, 0, 0, 0.4) 100%); }
  .at-focus__caption, .at-focus--fit .at-focus__caption { top: auto; bottom: 21px; left: 32px; right: 20px; text-align: left; font-size: 20px; }
  .at-focus--fit .at-focus__card, .at-focus--denoise .at-focus__card { aspect-ratio: 335 / 280; border-radius: var(--at-radius); background: #000; }
  .at-focus--fit .at-focus__caption, .at-focus--denoise .at-focus__caption { bottom: 23px; left: 24px; font-size: 18px; }

  /* 续航（657:162）：卡 335×280 r16 竖排间距 24；数字组 left 20 距底 25，数值 20 Medium / 说明 14，组距 34 */
  .at-battery { padding: 60px 0 0; }
  .at-battery .at-section__title { line-height: normal; margin-bottom: 24px; }
  .at-battery__cards { flex-direction: column; gap: 24px; }
  .at-battery__card { flex: none; height: auto; aspect-ratio: 335 / 280; border-radius: var(--at-radius); }
  .at-battery__stats { top: auto; bottom: 25px; left: 20px; right: 20px; justify-content: flex-start; gap: 34px; }
  .at-battery__stat dt { font-size: 20px; }
  .at-battery__stat dd { margin-top: 4px; font-size: 14px; }

  /* 产品规格（657:181，底 #f7f5f0）：上 40 下 24；标题 30 Medium；行上下 16，参数 14 Medium #9f9f9f 宽 100，数值 14；注释 12/1.5 */
  .at-specs, .at-pro--bean .at-specs { padding: 40px 0 24px; }
  .at-specs__title, .at-pro--bean .at-specs__title { font-size: 30px; color: var(--at-text); }
  .at-specs__table, .at-pro--bean .at-specs__table { margin-top: 12px; border-top: 0; }
  .at-specs__row { flex-wrap: nowrap; align-items: flex-start; gap: 0; padding-block: 16px; font-size: 14px; line-height: normal; }
  .at-specs__row dt { width: 100px; }
  .at-specs__row dd { color: var(--at-text); }
  .at-specs__note, .at-pro--bean .at-specs__note { margin-top: 12px; max-width: none; font-size: 12px; line-height: 1.5; }

  /* 使用与服务（657:213，底 #f7f5f0）：上 40 下 21；眉题 14 Medium #9f9f9f → 标题 26（间距 4）→ 正文 14/1.5 → 图 335×295 r16 → 两枚通栏 44 高按钮（间距 12），块间距 24 */
  .at-cta, .at-pro--bean .at-cta { padding: 40px 0 21px; }
  .at-cta__grid { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
  .at-cta__copy, .at-pro--bean .at-cta__copy { display: contents; }
  .at-cta__eyebrow { order: 1; font-size: 14px; }
  .at-cta__title, .at-cta__eyebrow + .at-cta__title, .at-pro--bean .at-cta__eyebrow + .at-cta__title { order: 2; margin-top: 4px; font-size: 26px; color: var(--at-text); }
  .at-cta__body, .at-pro--bean .at-cta__body { order: 3; margin-top: 24px; width: auto; font-size: 14px; line-height: 1.5; color: var(--at-text); }
  .at-cta__media { order: 4; width: 100%; height: auto; aspect-ratio: 335 / 295; margin-top: 24px; border-radius: var(--at-radius); }
  .at-cta__img { object-fit: contain; }
  .at-cta__side { display: contents; } /* 二维码框与 iOS / Android 按钮直接参与上面的 order 排序：图 → 两个按钮 → 两枚通栏按钮 */
  .at-cta__side .at-cta__media { width: 100%; }
  .at-cta__stores { order: 4; gap: 12px; margin-top: 12px; }
  .at-cta__store { height: 44px; gap: 10px; border-radius: 10px; font-size: 14px; }
  .at-cta__store-icon--ios { width: 15px; height: 19px; }
  .at-cta__store-icon--android { width: 19px; height: 19px; }
  .at-cta__store-icon--android + .at-cta__store-label { width: auto; }
  .at-cta__actions { order: 5; margin-top: 24px; flex-direction: column; gap: 12px; }
  .at-cta__actions .at-btn, .at-pro--bean .at-cta__actions .at-btn--primary, .at-pro--bean .at-cta__actions .at-btn--outline-dark { width: 100%; min-width: 0; height: 44px; font-weight: 500; }
  .at-cta__actions .at-btn--outline-dark { color: var(--at-text); border-color: var(--at-text); }
  .at-pro--bean .at-cta__actions .at-btn__arrow { display: none; } /* 671:530：听力豆手机端描边按钮不带箭头 */

  /* 听力豆串联（671:402）：紧接图文带，上留 48；卡 279.5×431.5 r20 横滑间距 24；说明 18 Medium left 23 距底 24；前后按钮右下 */
  .at-link { padding: 48px 0 0; }
  .at-link .at-section__title { margin-bottom: 24px; }
  .at-link__track { gap: 24px; padding-inline: 20px; scroll-padding-inline: 20px; }
  .at-link__card { flex: 0 0 min(279.5px, 74.5vw); height: auto; aspect-ratio: 279.5 / 431.56; }
  .at-link__media::after { background: linear-gradient(to bottom, rgba(102, 102, 102, 0) 81.773%, rgba(0, 0, 0, 0.4) 90.536%); }
  .at-link__caption { top: auto; bottom: 24px; left: 23px; right: 16px; width: auto; font-size: 18px; }

  /* 耳帽与耳翼（新稿 1490:62，原 671:438）：标题 30 → 图 335×280 r10（通栏橙色按钮压在图内，四边留 16）→ 三步 18/1.4（序号 Medium 橙色、与文字间距 12，行距 12）→ 正文 14/1.5，块间距 24 */
  .at-tips { padding: 60px 0 0; }
  .at-tips .at-section__title { margin-bottom: 24px; color: var(--at-bg-dark); }
  .at-tips__grid { flex-direction: column; gap: 24px; }
  .at-tips__media { width: 100%; height: auto; aspect-ratio: 335 / 280; border-radius: var(--at-radius); }
  .at-tips__btn { left: 16px; right: 16px; bottom: 16px; min-width: 0; font-weight: 500; }
  .at-tips__btn .at-btn__arrow { display: none; } /* 671:441：手机端按钮不带箭头，PC 稿（507:999）保留 */
  .at-tips__side { width: auto; padding-top: 0; display: flex; flex-direction: column; }
  .at-tips__body { order: 2; width: auto; margin-top: 24px; font-size: 14px; line-height: 1.5; color: var(--at-bg-dark); } /* 671:438：稿内正文在三步下面，与 PC 相反 */
  /* 步骤文字按 at_seg() 分段、只在标点后换行（稿内第 3 步在「先取下，」后折行）；第 2 步一行 306 宽，比 335 − 序号 − 12 多出几像素，稿内伸进右边距，这里给列表让出 10px */
  .at-tips__steps { order: 1; margin-top: 0; margin-right: -10px; gap: 12px; }
  .at-tips__step { display: flex; align-items: flex-start; gap: 12px; padding-left: 0; font-size: 18px; line-height: 1.4; color: var(--at-bg-dark); }
  .at-tips__num { position: static; flex: none; font-weight: 500; line-height: normal; }
  .at-tips__text { flex: 1 1 auto; min-width: 0; }

  /* 场景页签（671:455 / 692:790）：两种形态在手机上一样——标题 30（副标 18/1.6）在图上方，图 335×360 r20 带指示圆点，页签竖排成通栏 35 高胶囊（选中：#fff9f7 底 + 橙描边橙字） */
  .at-scene, .at-scene--full { position: static; height: auto; aspect-ratio: auto; padding: 60px 0 0; overflow: visible; background: #fff; }
  .at-scene .at-container, .at-scene--full .at-container { position: static; display: flex; flex-direction: column; }
  .at-scene__title, .at-scene--full .at-scene__title { order: 1; margin: 0; text-align: left; color: var(--at-black); }
  .at-scene__copy { position: static; order: 1; text-align: left; color: var(--at-black); }
  .at-scene__sub { margin-top: 12px; font-size: 18px; line-height: 1.6; }
  .at-scene__stage, .at-scene--full .at-scene__stage { position: relative; inset: auto; order: 2; height: auto; aspect-ratio: 335 / 360; margin-top: 24px; border-radius: var(--at-radius); }
  .at-scene--full .at-scene__panel::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(102, 102, 102, 0) 100%); }
  .at-scene__dots { position: absolute; left: 0; right: 0; bottom: 18px; display: flex; justify-content: center; gap: 12px; }
  .at-scene__dot { width: 8px; height: 8px; border-radius: 50%; background: rgba(255, 255, 255, 0.5); transition: background-color var(--at-dur); }
  .at-scene__dot.is-active { background: var(--at-brand); } /* 按反馈：当前这张的圆点显示橙色（同蓝牙直连「与生活同步」图内圆点），其余仍是白 50% */
  .at-scene__tabs, .at-scene--full .at-scene__tabs { position: static; order: 3; flex-direction: column; flex-wrap: nowrap; gap: 12px; margin-top: 24px; padding: 0; }
  .at-scene__tab { width: 100%; height: 45px; font-size: 18px; font-weight: 500; color: var(--at-black); border: 1px solid var(--at-line-card); } /* 1508:294：高 45、18 Medium（反馈 2026-10-19，原 35 / 14） */
  .at-scene__tab[aria-selected="true"] { background: #fff9f7; border-color: var(--at-brand); color: var(--at-brand); }
  .at-scene__tab[aria-selected="true"]:hover, .at-scene__tab[aria-selected="true"]:active { background: #fff9f7; border-color: var(--at-brand); }

  /* 图 + 文两栏（Pro1.0 692:738 等）：竖排——标题 30/1.08、副标 18/1.6、图（335×400 r20；佩戴 335×280；连上手机 335×340 r16）、三步 14、正文 18/1.5、按钮通栏，块间距 24；
     验配师与 IP66 的正文在图上方（692:784 / 692:812），其余在图下方 */
  .at-split { padding: 60px 0 0; }
  .at-split__inner { display: flex; flex-direction: column; gap: 24px; padding: 0 20px; height: auto !important; }
  .at-split__copy { display: contents; }
  .at-split__title { order: 1; font-size: 30px; line-height: 1.08; }
  .at-split__sub { order: 2; margin-top: -18px; font-size: 18px; line-height: 1.6; white-space: normal; } /* 标题到副标：稿内 12（692:738 / 692:812），按反馈再收到 6（块间距 24 减 18） */
  .at-split--fitting .at-split__body { margin-top: -18px; } /* 692:784：标题到正文同样收到 6 */
  .at-split__media { order: 3; position: relative !important; inset: auto !important; width: 100% !important; height: auto !important; aspect-ratio: 335 / 400; border-radius: var(--at-radius); }
  .at-split--wear .at-split__media { aspect-ratio: 335 / 280; }
  .at-split--wear .at-split__media, .at-split--ip .at-split__media { order: 3; }
  .at-split--phone .at-split__media { aspect-ratio: 335 / 340; border-radius: var(--at-radius); }
  .at-split__steps { order: 4; gap: 12px; }
  .at-split__step { padding-left: 28px; font-size: 14px; line-height: 1.4; white-space: normal; }
  .at-split__num { font-weight: 500; }
  .at-split__body, .at-split--phone .at-split__body, .at-split--fitting .at-split__body { order: 5; width: auto; font-size: 18px; line-height: 1.5; }
  .at-split--phone .at-split__body { font-size: 1.125rem; } /* 原 14 → 1.125rem（反馈 2026-10-20：PC 统一 2rem，手机端统一 1.125rem，同验配师正文） */
  .at-split--fitting .at-split__body, .at-split--ip .at-split__sub { order: 2; }
  .at-split--mic .at-split__sub, .at-split--ip .at-split__sub { margin-top: -18px; white-space: normal; }
  .at-split--phone .at-split__title { width: auto; white-space: normal; }
  .at-split__actions { order: 6; }
  .at-split__actions .at-btn, .at-split--phone .at-split__actions .at-btn { width: 100%; min-width: 0; font-weight: 500; color: var(--at-text); border-color: var(--at-text); }
  .at-split__actions .at-btn__arrow { display: none; } /* 692:782：连上手机的「查看连接步骤」手机端不带箭头 */
  .at-split__stats { left: 20px; right: 20px; top: auto; bottom: 24px; gap: 34px; }
  .at-split__stat:first-child { width: auto; }
  .at-split__stat dt { font-size: 20px; line-height: normal; }
  .at-split__stat dd { margin-top: 4px; font-size: 14px; }

  /* ==========================================================================
     产品比较页（726:1083）
     ========================================================================== */
  /* 首屏：上下各 60；标题 40 Medium 居中（字距 -.88）、副标 20/1.6（间距 12）；卡 335×410 r20 底 #f7f5f0 竖排间距 24：图 227×233 顶留 21、名称 28、副标 18、按钮 103 / 116 × 35 */
  .at-compare__hero { height: auto; margin-top: 0; padding: 60px 0; }
  .at-compare__title { font-size: 40px; line-height: 1.08; letter-spacing: -0.88px; }
  .at-compare__title { display: flex; flex-direction: column; align-items: center; } /* 726:1087：「哪款昂听，」「更适合你？」各占一行、四个字居中、标点挂右 */
  .at-compare__sub { margin-top: 12px; font-size: 20px; line-height: 1.6; }
  .at-compare__cards { margin-top: 24px; flex-direction: column; flex-wrap: nowrap; gap: 24px; }
  .at-ccard { width: 100%; height: auto; aspect-ratio: auto; padding: 21px 0 20px; gap: 20px; border-radius: var(--at-radius); } /* 726:1091：335×410 = 上 21 + 图 233 + 文字/按钮 + 下 20，高度随内容，不再按比例拉高 */
  .at-ccard__media { width: 227px; height: 233px; }
  .at-ccard__name { font-size: 28px; line-height: 35px; letter-spacing: -0.616px; } /* 726:1097：名称行高 35，卡片正好 410 */
  .at-ccard__sub { font-size: 18px; }
  .at-ccard__actions { width: auto; gap: 15px; }
  .at-ccard__detail { width: 103px; }
  .at-ccard__actions .at-btn--primary { width: 116px; gap: 8.4px; }
  .at-ccard__actions .at-btn--primary .at-btn__arrow, .at-ccard__actions .at-btn--primary:hover .at-btn__arrow { --a-w: 15.586; --a-h: 8.829; width: 15.586px; height: 8.829px; }
  /* 对比表：上下各 40；标题「对比项目」30 Medium；表宽 = 110 + 150×产品数 + 左右 20，在容器里横向滑动：表头行上下 12，行上下 14，14px，参数列 #9f9f9f Medium，数值左对齐 #1d1d1d 行高 1.4；注释 12/1.5；进度条 8 高 + 42 圆形前后按钮 */
  .at-compare__table-wrap { padding: 40px 0; }
  .at-ctable__title { display: block; font-size: 30px; font-weight: 500; line-height: normal; color: var(--at-text); }
  .at-ctable__scroll { overflow-x: auto; margin-top: 12px; column-gap: 0; scroll-behavior: smooth; scrollbar-width: none; }
  .at-ctable__scroll::-webkit-scrollbar { display: none; }
  /* 线照产品规格表（.at-specs__row，反馈 2026-10-20 第三次「这个就挺好的，一样粗细」）：表格拆成块级行，每行一个 flex，横线画在整行上、一条到底；
     列宽用整数（130 / 170 …）。原先表格自动分列，列宽是 134.19 / 175.47 / 154.88 这类小数，线按格一段一段画，段的起止落在小数位上，
     iOS 上「产品」下面那段和别的段粗细深浅不一样。表格语义由模板里的 role 保留。 */
  .at-ctable, .at-ctable thead, .at-ctable tbody { display: block; }
  .at-ctable { width: max-content; min-width: 0; }
  .at-ctable thead tr, .at-ctable tbody tr, .at-ctable tbody tr:last-child { display: flex; align-items: center; border: 0; border-bottom: 1px solid var(--at-faq-line); }
  .at-ctable th, .at-ctable td { display: block; flex: none; }
  .at-ctable__label-pc { display: none; }
  .at-ctable__label-m { display: inline; }
  .at-ctable thead th, .at-ctable thead .at-ctable__label-head { padding: 12px 0; font-size: 14px; font-weight: 500; line-height: 20px; text-align: left; color: var(--at-bg-dark); }
  .at-ctable thead .at-ctable__label-head { color: var(--at-footer-muted); }
  /* 行高一律整数像素（原 1.4 = 19.6px，行高 48.6 → 每条线落在不同的小数位，2x/3x 屏取整后有的细有的粗发灰，反馈 2026-10-20 第二次） */
  .at-ctable tbody th, .at-ctable tbody td { height: auto; min-width: 0; padding: 14px 0; font-size: 14px; line-height: 20px; text-align: left; vertical-align: middle; color: var(--at-bg-dark); }
  .at-ctable tbody th { white-space: normal; color: var(--at-footer-muted); }
  .at-ctable th, .at-ctable td, .at-ctable th:first-child, .at-ctable td:first-child, .at-ctable[style*="--at-cols: 3"] th:nth-child(2), .at-ctable[style*="--at-cols: 3"] td:nth-child(2), .at-ctable[style*="--at-cols: 3"] th:nth-child(3), .at-ctable[style*="--at-cols: 3"] td:nth-child(3), .at-ctable[style*="--at-cols: 3"] th:nth-child(4), .at-ctable[style*="--at-cols: 3"] td:nth-child(4) { width: 150px; min-width: 0; }
  .at-ctable th:first-child, .at-ctable td:first-child { width: 130px; padding-left: 20px; }
  .at-ctable th:last-child, .at-ctable td:last-child { width: 170px; padding-right: 20px; }
  /* 产品列之间留 20 间隔（反馈 2026-10-20：列挨着太挤）：列宽 150 → 170，文字区仍 150，右边 20 空出来 */
  .at-ctable th:not(:first-child):not(:last-child), .at-ctable td:not(:first-child):not(:last-child) { width: 170px; padding-right: 20px; }
  /* 改块级行后列宽不再由表格自动分（原先 640 最小宽度按比例摊成 134.19 / 175.47 / 175.47 / 154.88），按原来的实际宽度取整写死，
     文字折行与改之前一致（如「配合AI降噪与语音增强。」不折到第三行）。选择器带 [style] 才压得过上面 nth-child 的 150。 */
  .at-ctable[style] tr > :first-child { width: 134px; }
  .at-ctable[style] tr > :not(:first-child):not(:last-child) { width: 176px; }
  .at-ctable[style] tr > :last-child { width: 154px; }
  .at-ctable__note { margin-top: 12px; max-width: none; font-size: 12px; line-height: 1.5; }
  .at-ctable__foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 12px; }
  .at-ctable__bar { position: relative; flex: 0 1 222px; height: 8px; border-radius: 20px; background: #e5e5e5; overflow: hidden; }
  .at-ctable__thumb { position: absolute; left: 0; top: 0; height: 100%; width: 33%; border-radius: 20px; background: #f15526; }
  .at-ctable__foot .at-carousel__nav { display: flex; margin: 0; gap: 16px; }

  /* ---- 关于VOCCLEAR 页（Figma 1114:1791「关于VOCCLEAR移动端」，375 画板，总高 5154）：
     首屏 375×692（1114:1792）透明导航压图，标题 40 Medium 白居中 top 80、分两行「昂听 / VOCCLEAR®」（.at-vc__hero-line 在手机端各占一行），顶部压暗 黑 30% → 透明 @65% 正片叠底，手机图 750×1384；
     语音优化（1114:1816）：底 #1d1d1d，内边距 60/20，标题 30 白 + 正文 14 #b8b8b8（间距 12）→ 三组参数竖排（组距 24；数值 30 Semibold 橙 + 说明 18 白，间距 4），没有 PC 的底线；
     反馈抑制（1114:1830）/ 定向聚焦（1114:1836）：内边距 60/20，标题 30 → 图 335×300 圆角 20 → 正文 18/1.6，间距 24；智能降噪（1114:1852）同样顺序，上边不留（上一块已留 60）、下留 60；
     风噪 600 高（1114:1842）/ 突发噪声 629 高（1114:1847）：全幅手机图（750×1200 / 750×1258），内边距 60/20，标题在顶、正文贴底、都左对齐；压暗 上下各 黑 60%（突发噪声 20%）→ @41.2% 透明，正片叠底；
     单行标题字段（降噪 / 风噪 / 突发噪声 / 定向聚焦）经 at_seg() 只在标点后换行 ---- */
  .at-vc .at-br-pc { display: none; } /* 正文里后台手动断的行只在 PC 生效，手机端按 335 宽自然折行（稿内正文没有手动换行） */
  .at-vc__hero { height: 692px; margin-top: -41px; }
  .at-vc__hero-media::after { background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, rgba(102, 102, 102, 0) 64.994%); }
  .at-vc__hero-title { top: 80px; padding: 0 20px; font-size: 40px; white-space: normal; }
  .at-vc__hero-line { display: block; }
  .at-vc__title { font-size: 30px; line-height: 1.08; }
  .at-vc__body { font-size: 18px; line-height: 1.6; }
  .at-vc__opt { border-bottom: 0; }
  .at-vc__opt-inner { flex-direction: column; align-items: stretch; gap: 24px; padding-top: 60px; padding-bottom: 60px; }
  .at-vc__opt-copy { width: auto; gap: 12px; }
  .at-vc__opt-body { font-size: 14px; line-height: normal; }
  .at-vc__stats { flex-direction: column; gap: 24px; white-space: normal; }
  .at-vc__stat { gap: 4px; }
  .at-vc__stat dt { font-size: 30px; }
  .at-vc__stat dd { font-size: 18px; }
  .at-vc__feature-inner, .at-vc__feature--feedback .at-vc__feature-inner, .at-vc__feature--focus .at-vc__feature-inner { flex-direction: column; align-items: stretch; gap: 24px; height: auto; padding: 60px 20px; }
  .at-vc__feature-copy { display: contents; } /* 标题与正文拆开，图插在中间：标题 → 图 → 正文 */
  .at-vc__feature-copy .at-vc__title { order: 1; }
  .at-vc__feature-media, .at-vc__feature--focus .at-vc__feature-media { order: 2; width: 100%; height: auto; aspect-ratio: 335 / 300; border-radius: var(--at-radius); }
  .at-vc__feature-copy .at-vc__body { order: 3; }
  .at-vc__feature--focus .at-vc__title { white-space: normal; }
  .at-vc__denoise { height: auto; padding-bottom: 60px; }
  .at-vc__denoise-inner { gap: 24px; }
  .at-vc__denoise-media { order: 2; height: auto; aspect-ratio: 335 / 300; border-radius: var(--at-radius); }
  .at-vc__denoise-body { order: 3; width: auto; line-height: 1.6; }
  /* 按稿 375 宽的比例缩放（风噪 1178:3359 为 375×600、突发噪声 1178:3364 为 375×629）：写死高度时，比 375 宽的手机上图会被放大、上下裁掉，人显得很大（反馈 2026-10-19） */
  .at-vc__banner { height: auto; aspect-ratio: 375 / 600; }
  .at-vc__banner--sudden { aspect-ratio: 375 / 629; }
  .at-vc__banner--wind .at-vc__banner-media::after { background: linear-gradient(to bottom, rgba(0, 0, 0, 0.24) 0%, rgba(102, 102, 102, 0) 41.18%, rgba(0, 0, 0, 0.71) 100%); } /* 新手机稿 1178:3359 */
  .at-vc__banner--sudden .at-vc__banner-media::after { background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(102, 102, 102, 0) 41.18%, rgba(0, 0, 0, 0.2) 100%); }
  .at-vc__banner-copy { display: flex; flex-direction: column; justify-content: space-between; gap: 24px; padding: 60px 20px; }
  .at-vc__banner-copy .at-vc__title, .at-vc__banner-copy .at-vc__body, .at-vc__banner--wind .at-vc__title, .at-vc__banner--wind .at-vc__body, .at-vc__banner--sudden .at-vc__title, .at-vc__banner--sudden .at-vc__body { position: static; width: auto; margin: 0; text-align: left; }
  /* 反馈 2026-10-19：按稿 1178:3359 / 3364 排——突发噪声标题不在「，」后提前换行，两块正文都距标题 300（稿内 gap 300）而不是贴底；
     比稿宽的手机上区块按比例变高，正文不再跟着往下沉。中间用一个可收缩的占位（::after，order 1）撑出 300，空间不够时自动缩小、正文不出框 */
  .at-vc__banner--sudden .at-vc__title .at-seg { display: inline; } /* 只管突发噪声：按字折行 + 「守护」后的手机端换行（page-vocclear.php），风噪仍在「，」后换行 */
  .at-vc__banner-copy { justify-content: flex-start; gap: 0; }
  .at-vc__banner-copy .at-vc__body { order: 2; }
  .at-vc__banner-copy::after { content: ""; order: 1; flex: 0 1 300px; min-height: 24px; }
  /* 风噪：正文按稿 1178:3363 定位在区块 424 / 600 = 70.667% 处（两人挽着的胳膊下方），按区块高度比例算，宽一点的手机上也不会上移压到胳膊；
     稿内「抑制风噪。」后换行，这一块手机端也显示后台填的换行（其余正文手机端仍按宽度自然折行）。 */
  .at-vc__banner--wind .at-vc__banner-copy .at-vc__body { position: absolute; left: 20px; right: 20px; top: 70.667%; }
  .at-vc .at-vc__banner--wind .at-br-pc { display: inline; }
  /* 突发噪声：正文按稿 1178:3368 贴区块底（离底 60，375 宽时 424–569 与稿一致），宽一点的手机也跟着贴底往下走（反馈 2026-10-19 两次「再往下」）；标题不动 */
  .at-vc__banner--sudden .at-vc__banner-copy .at-vc__body { position: absolute; left: 20px; right: 20px; top: auto; bottom: 60px; }

  /* ---- 昂听App 页（Figma 1114:1906「昂听App移动端」，375 画板，总高 4460）：
     首屏 375×692（1114:1907）：标题 40 Medium 白居中 top 80；两枚下载按钮居中 top 570（距底 87）：一排宽 237 间距 15，各 35 高白描边 0.5 圆角 10，图标 15×19 / 19×19 + 14px 文字间距 10；
       上下压暗 黑 39% → @45.2% 透明 → 黑 39% 正片叠底（PC 的左侧 / 顶部渐变不用）；手机图 750×1384；
     蓝牙直连（1114:1938）：内边距 60/20 间距 24，标题 30 → 副标 20 Medium/1.65 → 图 335×300 圆角 20 → 正文 18/1.6（段落间空一行）；
     耳鸣掩蔽（1114:1945）：底 #1d1d1d 内边距 60/20 间距 24；轨道变成 335×240 圆角 20 的卡（图不叠渐变），各张文字块在卡下方同一位置淡入淡出（叠成一格的 grid，高度取最长的一张）：
       标题 26 Medium / 副标 20 / 正文 14，行高 1.65 间距 12；最下一行读条 222×8 在左、两枚 42 圆按钮在右（间距 16）；
     远程拾音（1114:1961）：内边距 60/20 间距 24，标题 30 → 副标 18/1.6 → 图 335×350；
     两卡（1114:1968 / 1114:1973）：335×495 圆角 20 内边距 40/25 间距 24，上不留（上一块已留 60）下留 60；标题 30（「·」处换行、PC 不换）+ 副标 18 在顶，正文 14 在底；压暗 验配 50% / OTA 34% ---- */
  .at-app__hero { height: 692px; margin-top: -41px; } /* 同其他手机首屏固定 692（= 43.25rem，按反馈 2026-10-19 对照稿 1539:3310）；之前按 375/692 等比，宽一点的手机上会长到 760、按钮下沉 */
  /* 手机竖图（750×1384）按宽铺满、不横向裁切，这条不起作用；后台没传手机图时退回 PC 横图，图里的手机在 x≈60%，裁切对准它让手机居中。 */
  .at-app__hero-img { object-position: 64% center; }
  .at-app__hero-media::before { content: none; }
  .at-app__hero-media::after { mix-blend-mode: multiply; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.39) 0%, rgba(102, 102, 102, 0) 45.174%, rgba(0, 0, 0, 0.39) 99.98%); }
  /* 手机首屏按稿 1539:3310（2026-10-19）：标题「昂听 App」40px 居中、上距 80；两枚按钮 140×50、圆角 10、1px 白描边、18px，间距 12，底边距屏底 95（95 / 692 = 13.728%）。 */
  .at-app__hero-copy { left: 20px; right: 20px; top: 11.561%; bottom: 13.728%; transform: none; width: auto; gap: 0; justify-content: space-between; align-items: center; }
  .at-app__hero-title { font-size: 40px; text-align: center; }
  .at-app__hero-sp { display: inline; }
  .at-app__stores { width: auto; gap: 12px; }
  .at-app__store { flex: none; width: 140px; height: 50px; gap: 10px; border-width: 1px; border-radius: 10px; font-size: 18px; }
  .at-app__store-icon--ios { width: 15px; height: 19px; }
  .at-app__store-icon--android { width: 19px; height: 19px; }
  .at-app__store:nth-child(2) .at-app__store-label { width: auto; }
  .at-app__title { font-size: 30px; line-height: 1.08; white-space: normal; }
  .at-app__intro-inner { display: flex; flex-direction: column; gap: 24px; height: auto; padding: 60px 20px; }
  .at-app__intro-title, .at-app__intro-media { position: static; transform: none; width: auto; }
  .at-app__intro-copy { display: contents; } /* 副标与正文拆开：标题 → 副标 → 图 → 正文 */
  .at-app__intro-title { order: 1; }
  .at-app__intro-sub { order: 2; font-size: 20px; line-height: 1.65; white-space: normal; }
  .at-app__intro-media { order: 3; height: auto; aspect-ratio: 335 / 300; border-radius: var(--at-radius); }
  .at-app__intro-body { order: 4; font-size: 18px; line-height: 1.6; }
  .at-app__intro-body p + p { margin-top: 1em; }
  .at-app__tinnitus { display: flex; flex-direction: column; gap: 24px; height: auto; padding: 60px 20px; background: var(--at-bg-dark); }
  .at-app__slides { flex: none; height: auto; aspect-ratio: 335 / 240; border-radius: var(--at-radius); }
  .at-app__slide-media::after { content: none; }
  /* 三段文案叠在同一格里，区块按最长那段定高：切换时高度不变、读条和箭头不动，只换文字（按反馈同 PC） */
  .at-app__slide-copies { position: relative; inset: auto; display: grid; padding: 0; pointer-events: auto; }
  .at-app__slide-copy { grid-area: 1 / 1; position: static; transform: none; width: auto; gap: 12px; }
  .at-app__slide-copy .at-app__title { font-size: 26px; line-height: 1.65; }
  .at-app__slide-sub { min-height: 0; font-size: 20px; line-height: 1.65; }
  .at-app__slide-body { min-height: 0; font-size: 14px; line-height: 1.65; }
  .at-app__slide-ctrl { position: static; display: flex; align-items: center; justify-content: space-between; padding: 0; pointer-events: auto; }
  .at-app__bar { position: relative; inset: auto; width: 222px; height: 8px; border-radius: 20px; } /* 保持定位基准，否则绝对定位的橙色滑块会以整个区块为准铺开 */
  .at-app__bar-thumb { border-radius: 20px; }
  .at-app__slide-ctrl .at-carousel__nav { position: static; gap: 16px; }
  .at-app__nav .at-carousel__btn { width: 42px; height: 42px; }
  .at-app__remote-inner { display: flex; flex-direction: column; gap: 24px; height: auto; padding: 60px 20px; }
  .at-app__remote-media { order: 2; position: static; width: auto; height: auto; aspect-ratio: 335 / 350; border-radius: var(--at-radius); }
  .at-app__remote-copy { order: 1; position: static; display: flex; flex-direction: column; gap: 24px; }
  .at-app__remote-copy .at-app__title, .at-app__remote-sub { position: static; white-space: normal; }
  .at-app__remote-sub { font-size: 18px; line-height: 1.6; }
  .at-app__cards-inner { flex-direction: column; gap: 24px; padding: 0 20px 60px; }
  .at-app__card { flex: none; height: auto; aspect-ratio: 335 / 495; padding: 40px 25px; border-radius: var(--at-radius); }
  .at-app__card--ota { --at-app-shade: 0.34; --at-app-shade-top: 0.34; }
  .at-app__card-head { gap: 0; white-space: normal; }
  .at-app__card-head .at-app__title { line-height: normal; }
  .at-app__card-dot { display: none; } /* 标题里的「·」手机端换行（1114:1970：0操作 / 远程实时专家验配），PC 照常显示 */
  .at-app__card-sub { font-size: 18px; }
  .at-app__card-body { width: auto; font-size: 14px; line-height: normal; }

  /* ---- 蓝牙直连 页（Figma 1114:2026「蓝牙直连移动端」，375 画板，总高 3255）：
     首屏 375×692（1114:2027）：透明导航压图；标题 40 Medium 白居中 top 80 两行（行尾标点挂右、字面居中，同首页首屏）；顶部压暗 黑 30% → 透明 @65% 正片叠底（PC 的左侧渐变不用）；手机图 750×1384；
     始终在线（1114:2051）375×600：文字在顶，内边距 60/20：标题 30 Medium/1.08 → 正文 18/1.6 间距 12；上下压暗 黑 60% → @41.18% 透明 → 黑 60% 正片叠底；手机图 750×1200；
     生活场景（1114:2056）高 755：白底 内边距 30/20：标题 30/1.2（标点后换行）→ 12 → 正文 18/1.6 → 24 → 图 335×300 圆角 20（图内底部指示圆点 8、间距 12、距底 16：当前橙、其余白）→ 24 → 页签竖排通栏胶囊 35 高间距 12
       （14 Medium；选中浅橙底 #fff9f7 + 橙描边 + 橙字，其余 #d2d2d7 描边黑字）；
     常见问题（1114:2076）：上留 30：标题 26 Medium #191715 → 6 → 「需要更多信息？点击此处」18/1.6 → 23 → FAQ 行（同首页手机规则：14px、28 圆加号、行距 12）；下留 40 ---- */
  .at-bt .at-br-pc { display: none; } /* 正文里后台手动断的行只在 PC 生效，手机端按 335 宽自然折行 */
  .at-bt__hero { height: 692px; margin-top: -41px; }
  .at-bt__hero-media::after { background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, rgba(102, 102, 102, 0) 64.994%); }
  .at-bt__hero-title { left: 20px; right: 20px; top: 80px; width: auto; text-align: center; font-size: 40px; }
  .at-bt__hero-title .at-seg--punc { margin-right: -1em; } /* 「蓝牙直连，」的逗号不参与居中：四个字正好居中、逗号挂右（稿内 1114:2030 给这行补了前导空格） */
  .at-bt__title { font-size: 30px; line-height: 1.08; white-space: normal; }
  .at-bt__online { height: 600px; }
  .at-bt__online-media::after { content: ""; position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.6) 0%, rgba(102, 102, 102, 0) 41.18%, rgba(0, 0, 0, 0.6) 100%); }
  .at-bt__online-copy { display: flex; flex-direction: column; gap: 12px; padding: 60px 20px 0; }
  .at-bt__online-copy .at-bt__title, .at-bt__online-body { position: static; width: auto; }
  .at-bt__online-body { font-size: 18px; line-height: 1.6; }
  .at-bt__scene { height: auto; padding: 30px 0; }
  .at-bt__scene-inner { align-items: stretch; gap: 24px; padding: 0 20px; }
  .at-bt__scene-title { text-align: left; line-height: 1.2; }
  .at-bt__scene-body { width: auto; min-height: 0; margin-top: -12px; text-align: left; font-size: 18px; line-height: 1.6; } /* 标题 → 正文 12，其余 24 */
  .at-bt__stage { height: auto; border-radius: 0; overflow: visible; background: none; }
  .at-bt__frame { position: relative; inset: auto; aspect-ratio: 335 / 300; border-radius: var(--at-radius); overflow: hidden; background: #d2d2d2; }
  .at-bt__panel::after { content: none; } /* 手机稿 1114:2056 的图不压暗 */
  .at-bt__dots { position: absolute; left: 0; right: 0; bottom: 16px; z-index: 1; display: flex; justify-content: center; gap: 12px; }
  .at-bt__dot { width: 8px; height: 8px; border-radius: 50%; background: #fff; transition: background-color var(--at-dur); }
  .at-bt__dot.is-active { background: var(--at-brand); }
  .at-bt__tabs { position: static; flex-direction: column; gap: 12px; margin-top: 24px; }
  .at-bt__tab { width: 100%; height: 45px; font-size: 18px; font-weight: 500; color: var(--at-black); border: 1px solid #d2d2d7; } /* 同听力豆 / Pro1.0 场景页签（1508:294）：高 45、18 Medium */
  .at-bt__tab[aria-selected="true"] { background: #fff9f7; border-color: var(--at-brand); color: var(--at-brand); }
  .at-bt__tab[aria-selected="true"]:hover, .at-bt__tab[aria-selected="true"]:active { background: #fff9f7; border-color: var(--at-brand); }
  .at-bt__faq { padding: 30px 0 40px; }
  .at-bt__faq-title { height: auto; font-size: 26px; line-height: normal; color: #191715; white-space: normal; }
  .at-bt__faq-more { height: auto; margin: 6px 0 23px; font-size: 18px; font-weight: 400; line-height: 1.6; }

  /* 新稿只有 PC（1575:3452），手机端按 PC 排法顺排：上距 80，标题 30 Medium + 视频名 20（间距 8），编号按钮一排（52×46、圆角 14、间距 10、18 Medium，下距 20），视频框通栏 16:9，下留 60 */
  .at-fit__stage { height: auto; margin-top: -41px; padding: 80px 0 60px; }
  .at-fit__inner { height: auto; }
  .at-fit__head, .at-fit__tabs { position: static; transform: none; }
  .at-fit__video { position: relative; inset: auto; transform: none; } /* 封面、视频、播放图标都按它定位 */
  .at-fit__head { margin: 0; }
  .at-fit__title { font-size: 30px; line-height: 40px; white-space: normal; }
  .at-fit__name { margin-top: 8px; font-size: 20px; line-height: 28px; min-height: 28px; }
  .at-fit__tabs { margin-top: 20px; gap: 10px; }
  .at-fit__tab { width: 52px; height: 46px; border-radius: 14px; font-size: 18px; }
  .at-fit__video { margin-top: 20px; height: auto; aspect-ratio: 16 / 9; border-radius: var(--at-radius); }
  .at-fit__play { width: 58px; height: 58px; }

  /* ---- 联系我们 页 ---- */
  /* 联系我们手机稿（首屏 1607:74 新稿，375×692；原 1114:2147）：首屏图 hero-mobile.jpg（按稿内裁切框从原图裁，750×1384）；顶部压暗 黑 20% → 透明 @61.9% 正片叠底；
     文字块 top 80、左右各 38 居中：标题 40 Medium 行高 52，公司名 20 Regular 紧随其下 */
  .at-ct__hero { height: 692px; margin-top: -41px; }
  .at-ct__hero-media::after { mix-blend-mode: multiply; background: linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(102, 102, 102, 0) 61.917%); } /* 手机稿 1607:74（2026-10-20 新稿）：顶部黑 20%（原 1114:2147 是 30%） */
  .at-ct__hero-copy { top: 80px; bottom: auto; left: 38px; right: 38px; width: auto; gap: 0; padding: 0; } /* .at-container 自带 width:100%，不清掉的话 left/right 只认 left，整块右移 38 */
  .at-ct__hero-title { min-height: 0; font-size: 40px; line-height: 52px; }
  .at-ct__hero-sub { min-height: 0; font-size: 20px; line-height: normal; }
  /* 联系方式与二维码手机稿（1114:2172，375 宽，底 #f7f5f0）：上下 40、左右 20；联系列表与二维码组间距 24。
     联系卡竖排间距 12：白底圆角 20、内边距 20，橙色圆 49（扳手 24）| 文字列间距 20，主文字 18 Medium、说明 14，上下间距 8；
     二维码通栏正方形（335）圆角 20 白底；下方页签卡间距 12：描边 1、圆角 20、内边距 10/25，标题 18 Semibold、说明 14 行高 1.7 */
  .at-ct__info { height: auto; padding: 40px 0; }
  .at-ct__info-inner { display: flex; flex-direction: column; gap: 12px; height: auto; }
  .at-ct__cards { position: static; flex-direction: column; gap: 12px; margin-bottom: 12px; }
  .at-ct__card { display: grid; grid-template-columns: 49px minmax(0, 1fr); column-gap: 20px; align-content: center; width: 100%; height: auto; padding: 20px; border-radius: var(--at-radius); }
  .at-ct__card-ring { position: static; grid-row: 1 / span 2; align-self: center; width: 49px; height: 49px; }
  .at-ct__icon--wrench { width: 24px; height: 22.8px; }
  .at-ct__card-main { position: relative; left: auto; top: auto; justify-self: start; max-width: 100%; font-size: 18px; white-space: normal; overflow-wrap: anywhere; }
  .at-ct__card-sub { position: static; grid-column: 2; margin-top: 8px; font-size: 14px; white-space: normal; }
  .at-ct__qr { position: relative; left: auto; top: auto; width: 100%; height: auto; aspect-ratio: 1; margin: 0; border-radius: var(--at-radius); }
  .at-ct__tabs { position: static; width: auto; gap: 12px; }
  .at-ct__tab { height: auto; padding: 10px 25px; border-radius: var(--at-radius); }
  .at-ct__tab-inner { width: auto; }
  .at-ct__tab-title { font-size: 18px; font-weight: 600; line-height: normal; }
  .at-ct__tab-desc { margin-top: 0; font-size: 14px; line-height: 1.7; }

  /* ---- 常见问题 页（没有手机稿）：首屏 375×520 文字贴底（标题 36 / 副标 20 / 搜索框通栏 44）；页签 2×2 通栏胶囊 35 高（选中浅橙底 + 橙描边，同产品页场景页签手机规则）；标题 30；FAQ 行同首页手机规则 ---- */
  /* 常见问题手机首屏（1114:2254，375×692）：首屏图 hero-mobile.jpg（稿内最上层图 750×1384 裁切，下面三层图与压暗渐变都被它盖住，所以不叠压暗）；
     文字块 top 80 居中宽 270：标题 40 Medium 框高 52，副标 20 Regular；搜索框 top 171、左右各 20、高 35 白胶囊，左右内边距 20，放大镜 18 + 「搜索问题」14 #9f9f9f 间距 8.39 */
  .at-faqp__hero { height: 692px; margin-top: -41px; }
  .at-faqp__hero-media::after { display: none; }
  .at-faqp__hero-copy { left: 20px; right: 20px; top: 80px; bottom: auto; transform: none; width: auto; align-items: center; gap: 0; text-align: center; }
  .at-faqp__hero-title { max-width: 270px; font-size: 40px; line-height: 52px; }
  .at-faqp__hero-sub { max-width: 270px; min-height: 0; font-size: 20px; line-height: normal; white-space: normal; }
  .at-faqp__search, .at-faqp__search:hover, .at-faqp__search:focus-within, .at-faqp__search.has-value { width: 100%; height: 35px; margin-top: 12.5px; padding: 0 20px; gap: 8.39px; }
  .at-faqp__search-label { width: 18px; height: 18.67px; }
  /* 输入字号保持 16：iOS 输入框小于 16 聚焦时会整页放大；提示文字按稿 14 */
  .at-faqp__search-input { font-size: 16px; }
  .at-faqp__search-input::placeholder { font-size: 14px; }
  .at-faqp__section { min-height: 0; padding: 0 0 60px; }
  .at-faqp__nomatch { padding-top: 24px; font-size: 16px; }
  .at-faqp__inner { padding-top: 32px; }
  .at-faqp__tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  .at-faqp__tab { width: 100%; height: 35px; font-size: 14px; font-weight: 500; color: var(--at-black); border: 1px solid var(--at-line-card); }
  .at-faqp__tab[aria-selected="true"] { background: #fff9f7; border-color: var(--at-brand); color: var(--at-brand); }
  .at-faqp__tab[aria-selected="true"]:hover, .at-faqp__tab[aria-selected="true"]:active { background: #fff9f7; border-color: var(--at-brand); }
  .at-faqp__panel { padding-top: 40px; }
  .at-faqp__title { height: auto; font-size: 30px; line-height: 1.2; white-space: normal; }
  .at-faqp__list { margin-top: 16px; }
  .at-faqp__empty { margin-top: 16px; font-size: 14px; }
}

/* ==========================================================================
   听力豆图片遮罩按 Figma 逐张还原（PC 1178:882 / 手机 1178:1798；场景 2、3 页签 1400:299 / 309 / 337 / 353）
   稿里每张卡的压暗都不一样，有的渐变垫在照片下面、实际看不到，这里按看得到的效果写。
   ========================================================================== */
@media (min-width: 767.02px) {
  .at-pro--bean .at-banner--left .at-banner__media::after { background: linear-gradient(to right, rgba(0, 0, 0, 0.74) 0%, rgba(102, 102, 102, 0) 52.52%); }
  .at-pro--bean .at-link__media::after { mix-blend-mode: multiply; background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(102, 102, 102, 0) 45.083%); } /* 替换稿 1178:1141 */
  .at-pro--bean .at-adv--tech .at-adv__card:nth-child(1) .at-adv__media::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(102, 102, 102, 0) 41.917%); }
  .at-pro--bean .at-adv--tech .at-adv__card:nth-child(2) .at-adv__media::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(102, 102, 102, 0) 45%); }
  .at-pro--bean .at-adv--tech .at-adv__card:nth-child(3) .at-adv__media::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(102, 102, 102, 0) 51.375%); }
  .at-pro--bean .at-scene__panel:nth-child(1)::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(102, 102, 102, 0) 48.883%); }
  .at-pro--bean .at-scene__panel:nth-child(2)::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(102, 102, 102, 0) 39.761%); }
  .at-pro--bean .at-scene__panel:nth-child(3)::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(102, 102, 102, 0) 53.917%); }
}
@media (max-width: 767px) {
  .at-pro--bean .at-focus--fit .at-focus__card:nth-child(1) .at-focus__media::after { mix-blend-mode: normal; background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(102, 102, 102, 0) 51.262%); }
  .at-pro--bean .at-focus--fit .at-focus__card:nth-child(2) .at-focus__media::after { mix-blend-mode: normal; background: linear-gradient(to top, rgba(0, 0, 0, 0.22) 0%, rgba(102, 102, 102, 0) 51.262%); }
  .at-pro--bean .at-banner--left .at-banner__media::after { background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0%, rgba(102, 102, 102, 0) 48.407%, rgba(0, 0, 0, 0.4) 100%); }
  .at-pro--bean .at-link__media::after { mix-blend-mode: multiply; background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(102, 102, 102, 0) 51.375%); } /* 替换稿 1400:326 */
  .at-pro--bean .at-adv--tech .at-adv__card:nth-child(1) .at-adv__media::after { mix-blend-mode: normal; background: linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, rgba(102, 102, 102, 0) 51.442%); }
  .at-pro--bean .at-adv--tech .at-adv__card:nth-child(2) .at-adv__media::after { mix-blend-mode: normal; background: linear-gradient(to top, rgba(0, 0, 0, 0.48) 0%, rgba(102, 102, 102, 0) 51.442%); }
  .at-pro--bean .at-adv--tech .at-adv__card:nth-child(3) .at-adv__media::after { mix-blend-mode: normal; background: linear-gradient(to top, rgba(0, 0, 0, 0.65) 0%, rgba(102, 102, 102, 0) 51.442%); }
  .at-pro--bean .at-scene--card .at-scene__panel::after { content: none; } /* 1178:1891 / 1400:337 / 353 只有照片 */
}
@media (max-width: 767px) {
  .at-pro--bean .at-adv--tech .at-adv__card:nth-child(3) .at-adv__desc { color: rgba(255, 255, 255, 0.8); } /* 1178:1869 */
}

/* 听力豆手机稿 1178:1798 逐块量出的尺寸（只作用于听力豆 ≤767，Pro3.0 / Pro1.0 不受影响） */
@media (max-width: 767px) {
  /* 首屏 1178:1801：副标 26 Regular；「天猫购买」按钮宽 116（文字 + 间距 8.4 + 箭头 15 居中） */
  .at-pro--bean .at-hero--product .at-hero__sub { font-weight: 400; }
  .at-pro--bean .at-hero__actions .at-btn--primary { width: 116px; min-width: 0; padding-inline: 0; }
  .at-pro--bean .at-hero__sub .at-seg--punc:last-child { clip-path: inset(0 1em 0 0); } /* 手机稿 1504:191「小巧入耳，日常助听」句末不带句号：句号本来就挂在行外，这里裁掉 */
  /* Pro3.0 手机首屏 1504:168：标题 40 行高 normal（PC 给标题定的 67 高在手机上被算成 45，副标被挤上去 8px）、副标 26 Regular，标题 top 80 / 副标 top 138；「天猫购买 →」116 宽（文字 + 间距 8.4 + 箭头 15 居中） */
  .at-pro--pro3 .at-hero__title { height: auto; }
  .at-pro--pro3 .at-hero--product .at-hero__sub { font-weight: 400; }
  .at-pro--pro3 .at-hero__actions .at-btn--primary { width: 116px; min-width: 0; padding-inline: 0; }
  /* Pro1.0 手机首屏 1504:131：副标 26 Regular、「天猫购买 →」116 宽（与 Pro3.0 / 听力豆统一） */
  .at-pro--pro1 .at-hero--product .at-hero__sub { font-weight: 400; }
  .at-pro--pro1 .at-hero__actions .at-btn--primary { width: 116px; min-width: 0; padding-inline: 0; }
  /* 区块标题框高：1178:1813 / 1836 / 1872 MiSans 30 行高 normal = 每行 40（浏览器按 39 算）；1178:1854 行高 1.08、字距 -0.66 */
  .at-pro--bean .at-focus--fit .at-section__title,
  .at-pro--bean .at-link .at-section__title,
  .at-pro--bean .at-tips .at-section__title,
  .at-pro--bean .at-specs__title { line-height: 40px; }
  .at-pro--bean .at-adv--tech .at-section__title { line-height: 1.08; letter-spacing: -0.66px; }
  /* 佩戴两卡 1178:1814 / 1816：说明 top 230（距底 26） */
  .at-pro--bean .at-focus--fit .at-focus__caption { bottom: 26px; }
  /* 降噪卖点 1178:1821 / 1827：两行 top 512 / 551（距底 72.5，行距 12.5）；话筒图标 12.64×19 left 26 + 间距 24，降噪图标 19×16.44 left 20 + 间距 20 */
  .at-pro--bean .at-banner--left .at-banner__points { bottom: 72.5px; gap: 12.5px; }
  .at-pro--bean .at-banner--left .at-banner__point { gap: 20px; padding-left: 0; }
  .at-pro--bean .at-banner--left .at-banner__point:first-child { gap: 24px; padding-left: 6px; }
  .at-pro--bean .at-banner--left .at-banner__point-icon { width: auto; height: auto; }
  .at-pro--bean .at-banner--left .at-banner__point:first-child .at-adv__icon { width: 12.64px; height: 19px; }
  .at-pro--bean .at-banner--left .at-banner__point:nth-child(2) .at-adv__icon { width: 19px; height: 16.44px; }
  /* 串联三卡 1178:1838–1842：说明 top 350 / 卡高 431.56、两行 48 → 距底 33.56（按底边定位，窄屏卡变矮时文字不出框） */
  .at-pro--bean .at-link__caption { bottom: 33.56px; }
  /* 技术三卡 1178:1855 / 1860 / 1865：标题都在 top 160（描述一行的卡也不往下沉）、描述 top 197：
     仍按底边 21 定位，描述至少占两行 42，375 宽时三张卡标题都落在 160；更窄屏描述折成三行时往上长，不出框 */
  .at-pro--bean .at-adv--tech .at-adv__desc { min-height: 42px; }
  /* 佩戴三步 1490:69–77：行框 25 / 25 / 50（18 × 1.4 稿内取整到 25） */
  .at-pro--bean .at-tips__step { line-height: 25px; }
  /* 规格 1178:1914：每行 51（底线算在行内），区块下留 40；常见问题 1178:1964：每条 60（含底线），列表下留 46 */
  .at-pro--bean .at-specs { padding-bottom: 40px; }
  .at-pro--bean .at-specs__row { padding-bottom: 15px; }
  .at-pro--bean .at-faq { padding-bottom: 46px; }
  .at-pro--bean .at-accordion__trigger { padding-bottom: 15px; }
}

/* ==========================================================================
   Pro1.0 图片遮罩按 Figma 逐张还原（PC 1178:1148 / 手机 1178:2049；多场景 2、3 页签 1414:445 / 456）
   ========================================================================== */
@media (min-width: 767.02px) {
  .at-pro--pro1 .at-split--phone .at-split__media::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.3) 0%, rgba(102, 102, 102, 0) 60%); }
  .at-pro--pro1 .at-scene--full .at-scene__panel::after { mix-blend-mode: multiply; background: linear-gradient(to bottom, rgba(102, 102, 102, 0) 55.971%, rgba(0, 0, 0, 0.4) 100%); }
  .at-pro--pro1 .at-scene--full .at-scene__panel:nth-child(2)::after { background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(102, 102, 102, 0) 55.971%, rgba(0, 0, 0, 0.4) 100%); }
}
@media (max-width: 767px) {
  .at-pro--pro1 .at-banner--k-range .at-banner__media::after { mix-blend-mode: multiply; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, rgba(102, 102, 102, 0) 41.18%, rgba(0, 0, 0, 0.3) 100%); }
  .at-pro--pro1 .at-split--phone .at-split__media::after { content: none; } /* 1178:2096：渐变垫在照片下面 */
  .at-pro--pro1 .at-focus--denoise .at-focus__media::after { content: none; } /* 1178:2089 / 2091 只有照片 */
  .at-pro--pro1 .at-scene--full .at-scene__panel::after { content: none; } /* 1178:2120 / 1414:487 / 505 只有照片 */
}

/* --------------------------------------------------------------------------
   图片加载时不露灰底（按反馈 2026-10-18 录屏 20261018-213948：刷新后图片框先是一块灰、照片再淡入）。
   这些容器原来垫了占位灰（#ddd / #d9d9d9 / #d2d2d2 / #cfcfcf / #e8e8e8 / #222 等）；改成透明，加载期间直接是所在区块的底色（白 / 暖白），
   照片到了再出现。只改底色（background-color），不碰背景图；放在文件最后并带上原来的组合选择器，压过前面 PC / 手机各处的设置。
   保留：按钮悬停色、比较页进度条；后台没配图时的 .at-placeholder 占位提示不受影响。
   -------------------------------------------------------------------------- */
.at-pcard, .at-tabs__media, .at-about__media, .at-acard, .at-showcase__media,
.at-focus__card, .at-focus--fit .at-focus__card, .at-focus--denoise .at-focus__card,
.at-link__card, .at-tips__media, .at-scene__stage,
.at-split__media, .at-split--wear .at-split__media, .at-split--fitting .at-split__media, .at-split--ip .at-split__media,
.at-banner--light, .at-banner--stats,
.at-vc__feature-media, .at-vc__denoise-media,
.at-app__intro-media, .at-app__remote-media, .at-app__card,
.at-bt__stage, .at-bt__frame { background-color: transparent; }

/* WordPress 后台工具条（登录后 body 带 .admin-bar，工具条固定在最顶上，PC 32px / ≤782 为 46px，写在 --wp-admin--admin-bar--height）：
   导航、产品页悬浮条、首页服务流程钉住时都贴着视口顶端 top: 0，滚动后会被工具条盖住一截，看起来整条导航（及展开的面板）往上挪了（反馈 2026-10-19）。
   有工具条时把这几处的吸顶位置让出工具条高度；≤600 时工具条不再固定、随页面滚走，恢复 top: 0。普通访客没有工具条，不受影响。 */
.at-site.admin-bar .at-header,
.at-site.admin-bar .at-subnav,
.at-site.admin-bar .at-service-pin > .at-service { top: var(--wp-admin--admin-bar--height, 32px); }
@media (max-width: 600px) {
  .at-site.admin-bar .at-header,
  .at-site.admin-bar .at-subnav,
  .at-site.admin-bar .at-service-pin > .at-service { top: 0; }
}

/* 四个手机首屏的按钮按 Figma 1539:1906（首页）/ 1539:1822（Pro3.0）/ 1539:1878（听力豆）/ 1539:1850（Pro1.0）放大（反馈 2026-10-19）：
   高 50、字号 18，按钮组上沿 547（底距 95）；首页「昂听产品对比」160 宽、无箭头；产品页「天猫购买 →」「比较产品」各 140 宽、间距 12。
   写在文件末尾，盖过前面各页 116 / 103 宽、35 高的旧规则。 */
@media (max-width: 767px) {
  .at-hero__actions, .at-hero--product .at-hero__actions { bottom: 95px; gap: 12px; }
  .at-hero__actions .at-btn--lg { height: 50px; font-size: 18px; }
  .at-hero:not(.at-hero--product) .at-hero__actions .at-btn--primary { width: 160px; min-width: 0; padding-inline: 0; }
  .at-hero--product .at-hero__actions .at-btn--primary, .at-hero--product .at-hero__compare { width: 140px; min-width: 0; padding-inline: 0; }
}

/* ==========================================================================
   使用指南页（page-manual.php，按反馈 2026-10-20 从 H5 说明书 api-test.elehear.cn/h5/pages/manual.html 迁进来）。
   版式、字号、间距照 H5 的 manual.css 搬，类名套在 .at-man 下（正文片段沿用 H5 的类名 doc / section / block / illo / tip…）；rem 换成 px（H5 根字号 16）。
   PC：左侧 256 宽目录栏吸顶（导航条下方），右侧正文 #f4f4f4 底；
   ≤1023（手机稿 67:29084「电子说明书网页端 iOS」，2026-10-21）：不要目录栏，导航条下一条吸顶的章节页签（67:29088），插图换手机取景（*-m.jpg）。
   ========================================================================== */
.at-man { background: #f4f4f4; color: #131313; font-size: 18px; line-height: 26px; }
.at-man__layout { display: grid; grid-template-columns: 256px minmax(0, 1fr); max-width: 1440px; margin: 0 auto; background: #fff; }
.at-man__main { max-width: 1184px; padding: 24px 40px 64px; background: #f4f4f4; }
.at-man__crumb { display: flex; gap: 8px; align-items: center; margin: 0 0 24px; font-size: 12px; line-height: 20px; white-space: nowrap; }
.at-man__crumb a, .at-man__crumb span { color: rgba(0, 0, 0, 0.45); }
.at-man__crumb a:hover { color: #131313; }
.at-man__crumb [aria-current] { color: #131313; }
/* 目录栏 */
.at-man__toc { position: sticky; top: var(--at-header-h); align-self: start; max-height: calc(100vh - var(--at-header-h)); padding: 30px 0 60px 40px; overflow-y: auto; overscroll-behavior: contain; background: #fff; }
.at-man__picker { position: relative; z-index: 2; width: 200px; margin: 0 auto 24px; }
.at-man__device { display: flex; gap: 8px; align-items: center; justify-content: space-between; width: 100%; height: 49px; padding: 4px 16px; border: 1px solid #dedede; border-radius: 24px; background: transparent; color: #191919; font: inherit; font-size: 18px; line-height: 1.6; letter-spacing: 0.18px; cursor: pointer; }
.at-man__caret { flex: none; width: 12px; height: 7px; transition: transform var(--at-dur) var(--at-ease); }
.at-man__device[aria-expanded="true"] .at-man__caret { transform: scaleY(-1); }
.at-man__picker-menu { position: absolute; top: calc(100% + 6px); left: 0; width: 100%; margin: 0; padding: 8px; border: 1px solid #dedede; border-radius: 16px; background: #fff; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1); list-style: none; }
.at-man__picker-menu[hidden] { display: none; }
.at-man__picker-menu a { display: block; padding: 6px 10px; border-radius: 4px; color: #131313; font-size: 18px; line-height: 1.6; letter-spacing: 0.18px; white-space: nowrap; }
.at-man__picker-menu a:hover { background: #f8f9fa; }
.at-man__picker-menu a.is-active { color: var(--at-brand); }
.at-man__list { margin: 0; padding: 0 8px; list-style: none; }
.at-man__list a { display: block; padding: 6px; border-radius: 4px; color: #131313; font-size: 18px; line-height: 1.6; letter-spacing: 0.18px; white-space: nowrap; }
.at-man__list a:hover { background: #f8f9fa; }
.at-man__list .is-sub a { padding-left: 25px; }
.at-man__list a.is-active { background: #f8f9fa; color: var(--at-brand); }
.at-man__tabs { display: none; }
/* App 内嵌版（page-manual.php ?view=app）：页面不输出官网导航，导航高度归零，页签贴顶、锚点不再让导航 */
html.at-man-app { --at-header-h: 0px; }
/* 分平台内容：.at-man[data-os] 由 page-manual.php 里的小脚本按 UA 写入；电脑 / 其它系统不写，两套都显示 */
.at-man[data-os="ios"] [data-os-only="android"], .at-man[data-os="android"] [data-os-only="ios"] { display: none; }
/* 正文（H5 片段的类名） */
.at-man .doc + .doc { margin-top: 72px; }
.at-man .doc, .at-man .section { scroll-margin-top: 24px; } /* 点目录跳过来时标题离导航条留 24（同正文区上内边距）；导航条高度已由 html 的 scroll-padding-top 让过 */
.at-man .chapter__title { margin: 0 0 40px; font-size: 26px; font-weight: 600; line-height: 34px; color: #131313; }
.at-man .chapter__title--with-intro { margin-bottom: 32px; }
.at-man .chapter__intro { margin: 0 0 40px; color: #191919; }
.at-man .section + .section { margin-top: 40px; }
.at-man .section > * + * { margin-top: 32px; }
.at-man .section__title { margin: 0 0 32px; font-size: 24px; font-weight: 600; line-height: 32px; color: #131313; }
.at-man .block > * + * { margin-top: 24px; }
.at-man .block--loose > * + * { margin-top: 32px; }
.at-man .tip + .tip { margin-top: 16px; }
.at-man :where(.doc p, .doc ul, .doc figure) { margin: 0; }
.at-man .doc ul { padding-left: 27px; list-style: disc; }
.at-man .doc ul li::marker { font-size: 0.7em; }
.at-man .doc ul.bullets li + li { margin-top: 24px; }
.at-man .text > * + * { margin-top: 26px; }
.at-man .text ul li + li { margin-top: 26px; }
.at-man .text ul.tight li + li { margin-top: 0; }
.at-man .text .indent { padding-left: 27px; }
.at-man .text ul + .indent { margin-top: 0; }
.at-man .para-group > p { display: inline; }
.at-man .doc strong, .at-man .lead { font-weight: 600; }
.at-man .ico { display: inline-block; width: 20px; height: 20px; margin: 0 2px; vertical-align: -4px; }
.at-man .ico--16 { width: 16px; height: 16px; vertical-align: -2px; }
.at-man .ico--18 { width: 18px; height: 18px; vertical-align: -3px; }
.at-man .ico--24 { width: 24px; height: 24px; vertical-align: -6px; }
.at-man .illo { position: relative; border-radius: 28px; background: #fff; overflow: hidden; }
.at-man .illo img { display: block; width: 100%; max-width: 100%; height: auto; }
/* 手机取景图上画出来的按钮（应用市场卡的「去下载」，358×252 卡里 80×36：iOS 67:29130 在 x68 y183，Android 67:30223 在 x42 y183）上盖的透明链接；PC 图上没有这个按钮 */
.at-man .illo__hit { display: none; position: absolute; border-radius: 24px; color: transparent; font-size: 0; }
.at-man .illo__hit--download { left: 18.99%; top: 72.62%; width: 22.35%; height: 14.29%; }
.at-man .illo__hit--download-android { left: 11.73%; top: 72.62%; width: 22.35%; height: 14.29%; }
.at-man .illo--offset { margin-top: 22.48px; }
.at-man #s2-1 .illo { margin-top: 24px; }
.at-man .illo-row { display: flex; gap: 16px; align-items: flex-start; }
.at-man .illo-row > * { flex: 1 1 0; min-width: 0; }
.at-man .figure figcaption { margin-top: 8px; color: rgba(19, 19, 19, 0.7); font-size: 14px; line-height: 22px; text-align: center; }
.at-man .tip { padding: 22px; border: 1px solid var(--at-brand); border-radius: 28px; background: rgba(240, 86, 39, 0.05); }
.at-man .tip .text > * + * { margin-top: 25px; }
.at-man .tip--purple { border-color: #6f5fd4; background: rgba(111, 95, 212, 0.05); }
.at-man .contact-card { padding: 16px; border-radius: 28px; background: #fff; }
.at-man .contact { display: flex; gap: 22.54px; align-items: stretch; width: 493px; max-width: 100%; height: 333px; }
.at-man .contact__brand { display: flex; flex: 0 0 141.28px; flex-direction: column; gap: 5.95px; align-items: center; justify-content: center; border-radius: 29.73px; background: var(--at-brand); }
.at-man .contact__brand img { width: 60.12px; height: auto; }
.at-man .contact__info { display: flex; flex-direction: column; gap: 38.65px; justify-content: center; }
.at-man .contact__label { margin: 0 0 5.95px; color: #191919; font-size: 22.3px; font-weight: 600; line-height: 30px; }
.at-man .contact__value { display: flex; gap: 5.95px; align-items: center; color: #191919; font-size: 26.76px; line-height: 35px; white-space: nowrap; }
.at-man .contact__value img { width: 35.68px; height: 35.68px; }
@media (max-width: 1023px) {
  /* 章节页签（67:29088）：白底，左右 16、上下 8，页签间距 16；每项内边距 8/8/0，18/26 Semibold，当前项下方 8 处 60×2 橙线；横向可滑、不显示滚动条 */
  .at-man__tabs { display: flex; position: sticky; top: var(--at-header-h); z-index: 90; gap: 16px; padding: 8px 16px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; background: #fff; }
  .at-man__tabs::-webkit-scrollbar { display: none; }
  .at-man__tab { display: flex; flex: none; flex-direction: column; gap: 8px; align-items: center; padding: 8px 8px 0; color: #191919; font-size: 18px; font-weight: 600; line-height: 26px; white-space: nowrap; }
  .at-man__tab::after { content: ""; width: 60px; height: 2px; background: var(--at-brand); opacity: 0; transition: opacity var(--at-dur) var(--at-ease); }
  .at-man__tab.is-active::after { opacity: 1; }
  .at-man__layout { display: block; background: none; }
  .at-man__toc { display: none; }
  /* 正文（67:29099）：左右 16、页签下 32；章节标题 24/32，小节标题 22/30，章节之间 40 */
  .at-man__main { max-width: none; padding: 32px 16px 40px; }
  .at-man__crumb { display: none; }
  .at-man .doc + .doc { margin-top: 40px; }
  .at-man .chapter__title { font-size: 24px; line-height: 32px; }
  .at-man .section__title { font-size: 22px; line-height: 30px; }
  .at-man .doc, .at-man .section { scroll-margin-top: 85px; } /* 锚点跳转让开页签（约 61）再留 24；导航条高度已由 html 的 scroll-padding-top 让过 */
  /* 手机稿里连在一起的几句拆成独立段落，段间空一行（26） */
  .at-man .para-group > p { display: block; }
  .at-man .para-group > p + p { margin-top: 26px; }
  .at-man .tip { line-height: 24px; }
  .at-man .tip .text > * + * { margin-top: 24px; }
  .at-man .illo-row { flex-direction: column; align-items: stretch; }
  .at-man .illo-row > * { flex: none; }
  .at-man .illo__hit { display: block; }
  /* 客服电话卡（67:30102）：358×236 白卡，左侧 94×224 橙块（圆角 20，左 8）；右侧两组 15 Semibold 标题 + 24 图标 18 号字，组间 26 */
  .at-man .contact-card { padding: 6px 8px; }
  .at-man .contact { gap: 15px; width: auto; height: 224px; }
  .at-man .contact__brand { flex: 0 0 94px; gap: 4px; border-radius: 20px; }
  .at-man .contact__brand img { width: 40px; }
  .at-man .contact__info { gap: 26px; }
  .at-man .contact__label { margin: 0 0 4px; font-size: 15px; line-height: 20px; }
  .at-man .contact__value { gap: 4px; font-size: 18px; line-height: 24px; }
  .at-man .contact__value img { width: 24px; height: 24px; }
}
.at-man__debug { margin: 0 0 24px; padding: 16px 20px; border: 1px solid #d63638; border-radius: 12px; background: #fff; color: #d63638; font-size: 14px; line-height: 22px; } /* 只给管理员看的排查提示（page-manual.php） */
body.at-site #ast-scroll-top { display: none !important; } /* Astra 的「回到顶部」按钮（wp_footer 输出）：新版模板不加载 Astra 样式，它会以裸箭头 + 一截白条露在页尾下面（2026-10-20 使用指南页截图），新版页面不用它 */

/* ==========================================================================
   导航随第一屏滚走、滚过后从顶部滑入（反馈 2026-10-20：「所有页面除产品页外，导航栏在第一页下拉跟着页面，然后再出来，跟产品页的灵动岛一样，现在重叠了而且没有模糊」）。
   原来导航吸顶（sticky）：压在首屏上往下滚时还是透明白字，和首屏标题叠在一起、也没有模糊。现在：
   - 第一屏内导航留在页面顶部、随页面滚走：脱离文档流（absolute），外层 main 让出同样高的上内边距，各页排版与原来完全一样（首屏仍按各自的负外边距压在导航下）；
   - 滚过第一屏（有首屏 #at-hero 的按首屏底边，没有的按一屏高）后改成固定在视口顶部、从上方滑入（.is-docked.is-shown，时长曲线同产品页悬浮条），此时已是毛玻璃底；
   - 往回滚过第一屏时先向上滑出（.is-leaving），再回到页面顶部。类名由 main.js headerDock 切换，并在 <html> 上加 .at-head-docked 供吸顶元素让位。
   产品页不变（导航随首屏滚走、由悬浮条接管）。
   ========================================================================== */
html body.at-site:not(.single-at_product):not(.page-template-page-manual) .at-header { position: absolute; top: 0; left: 0; right: 0; }
body.at-site:not(.single-at_product):not(.page-template-page-manual) .at-header ~ .at-main { padding-top: var(--at-header-h); }
/* 滑入 / 滑出改 top 而不用 transform：导航一旦带 transform，里面 fixed 定位的元素（手机端右下角的客服按钮、手机菜单面板）会改以导航为定位基准——
   滑动途中客服按钮被拽进导航、从右上角露出半个白圈（反馈 2026-10-20 录屏 飞书20261020-161407）。藏在视口上方时多藏 2px，免得露出底边。 */
html body.at-site:not(.single-at_product):not(.page-template-page-manual) .at-header.is-docked { position: fixed; top: calc(-1 * var(--at-header-h) - 2px); opacity: 0; }
html body.at-site:not(.single-at_product):not(.page-template-page-manual) .at-header.is-docked.is-shown { top: 0; opacity: 1; }
/* 滑入 / 滑出的过渡：照产品页悬浮条（灵动岛 .at-subnav）的动画——同样从上方滑入并淡入、反向滑出并淡出，时长曲线都是 var(--at-mega-dur) / var(--at-mega-ease)（0.65s，反馈 2026-10-20「参考灵动岛的动画」）。
   悬浮条用 transform 平移，导航这里改用 top 做同样的位移（导航不能带 transform，见上）。手机菜单开合期间（html / body 上的 .at-nav-open）不覆盖菜单那套底色延时过渡 */
html:not(.at-nav-open) body.at-site:not(.single-at_product):not(.page-template-page-manual):not(.at-nav-open) .at-header.is-docked.is-shown {
  transition: top var(--at-mega-dur) var(--at-mega-ease), opacity var(--at-mega-dur) var(--at-mega-ease), background var(--at-dur) var(--at-ease), border-color var(--at-dur) var(--at-ease);
}
html:not(.at-nav-open) body.at-site:not(.single-at_product):not(.page-template-page-manual):not(.at-nav-open) .at-header.is-docked.is-leaving {
  transition: top var(--at-mega-dur) var(--at-mega-ease), opacity var(--at-mega-dur) var(--at-mega-ease), background var(--at-dur) var(--at-ease), border-color var(--at-dur) var(--at-ease);
}
/* 手机端：毛玻璃画在导航的 ::before 上（导航条本身不能带 backdrop-filter，见手机端导航规则），而父元素一旦 opacity < 1，子元素的背景模糊就采样不到页面——
   淡入途中只有一层白 60%、没有模糊，到 opacity 回到 1 才突然糊开，看起来没有过渡（反馈 2026-10-20「没有过渡，仿照 PC 端」；PC 的模糊在导航条自身上，不受影响）。
   所以手机端导航条本身不做淡入淡出，改成毛玻璃层、标志、汉堡各自淡入淡出（时长曲线同上），模糊随透明度一起渐显；客服悬浮按钮也不再跟着闪。过渡只挂在 .is-shown / .is-leaving 上：刚加 .is-docked 时要瞬间落到透明，再滑入淡入。
   手机菜单开合期间（.at-nav-open）不覆盖菜单那套隐去 / 复原毛玻璃和变色的过渡。 */
@media (max-width: 767px) {
  html body.at-site:not(.single-at_product):not(.page-template-page-manual) .at-header.is-docked { opacity: 1; }
  html body.at-site:not(.single-at_product):not(.page-template-page-manual) .at-header.is-docked:not(.is-shown)::before,
  html body.at-site:not(.single-at_product):not(.page-template-page-manual) .at-header.is-docked:not(.is-shown) .at-logo,
  html body.at-site:not(.single-at_product):not(.page-template-page-manual) .at-header.is-docked:not(.is-shown) .at-burger { opacity: 0; }
  html:not(.at-nav-open) body.at-site:not(.single-at_product):not(.page-template-page-manual):not(.at-nav-open) .at-header.is-docked:is(.is-shown, .is-leaving)::before,
  html:not(.at-nav-open) body.at-site:not(.single-at_product):not(.page-template-page-manual):not(.at-nav-open) .at-header.is-docked:is(.is-shown, .is-leaving) .at-burger { transition: opacity var(--at-mega-dur) var(--at-mega-ease); }
  html:not(.at-nav-open) body.at-site:not(.single-at_product):not(.page-template-page-manual):not(.at-nav-open) .at-header.is-docked:is(.is-shown, .is-leaving) .at-logo { transition: opacity var(--at-mega-dur) var(--at-mega-ease), color var(--at-dur) var(--at-ease); }
}
/* 后台工具条（登录后）：让出工具条高度，同上方 admin-bar 规则；≤600 时工具条随页面滚走，固定后贴视口顶 */
html body.at-site.admin-bar:not(.single-at_product):not(.page-template-page-manual) .at-header { top: var(--wp-admin--admin-bar--height, 32px); }
html body.at-site.admin-bar:not(.single-at_product):not(.page-template-page-manual) .at-header.is-docked { top: calc(var(--wp-admin--admin-bar--height, 32px) - var(--at-header-h) - 2px); }
html body.at-site.admin-bar:not(.single-at_product):not(.page-template-page-manual) .at-header.is-docked.is-shown { top: var(--wp-admin--admin-bar--height, 32px); }
@media (max-width: 600px) {
  html body.at-site.admin-bar:not(.single-at_product):not(.page-template-page-manual) .at-header { top: 0; }
  html body.at-site.admin-bar:not(.single-at_product):not(.page-template-page-manual) .at-header.is-docked { top: calc(-1 * var(--at-header-h) - 2px); }
  html body.at-site.admin-bar:not(.single-at_product):not(.page-template-page-manual) .at-header.is-docked.is-shown { top: 0; }
}
/* 使用指南页不参与上面的「随第一屏滚走、再滑入」：按反馈 2026-10-20 保持原来的吸顶 + 毛玻璃（见「使用指南页导航」），目录栏 / 小栏仍贴在导航条下方 */