/* ============================================================
   layout.css —— 全局布局：Header / 主区 / 侧边栏 / Footer / 悬浮 / 抽屉
   ============================================================ */
html {
  /* 整页吸附偏移：模块顶部对齐到固定头部下方 20px 处（同时供锚点导航避让头部） */
  --snap-offset: calc(var(--header-h) + 20px);
  scroll-padding-top: var(--snap-offset);
}
/* 首页与关于页整页吸附（fullpage）专属：其余子页面内容不多，保持普通长页滚动、不启用吸附 */
html.snap-fullpage {
  scroll-snap-type: y mandatory;
}
/* 首页模块整屏 + 顶部吸附点（仅 snap-fullpage 生效）：模块外区域即页面同色背景（遮罩），
   吸附后视口内不露出相邻模块内容；高模块内容超出视口时容器随之增高，退化为自然内部滚动 */
html.snap-fullpage .section {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  scroll-snap-align: start;
  /* 强制停靠：每次滚动都锁定一个模块，不跳屏、不半屏悬停（PPT 整屏效果的 CSS 兜底，
     主力由 js/main.js 的整屏锁定控制器驱动；两者目标一致） */
  scroll-snap-stop: always;
  /* 居中补偿：snap 把模块顶部推到 y=--snap-offset、底部同量探出折叠线（不可见），
     故下内边距增加 2×--snap-offset，使内容组中心精确落在视口中心（顶部 padding 不变） */
  padding-bottom: calc(var(--sp-12) + 2 * var(--snap-offset));
}
/* 区块显示控制（后台「区块显示控制」开关 / partners.js applyShow 用 hidden 属性）：
   snap-fullpage 下 .section 的 display:flex 特异性更高，会覆盖 [hidden] 的 display:none，
   导致开关无效——补一条更高特异性规则让 hidden 生效（2026-08-19 修复） */
html.snap-fullpage .section[hidden] {
  display: none;
}
html.snap-fullpage .hero,
html.snap-fullpage .vision-space {
  scroll-snap-align: start;
  scroll-snap-stop: always;
}
/* 超高区块退吸附（hero 与普通整屏锚点共用）：内容超一屏时退出 CSS 整屏吸附，允许原生滚动
   浏览完整内容。JS 翻页逻辑对超高块已放行原生滚动（step 不拦截），CSS mandatory 若不退出
   会把滚动吸回区块顶，导致底部内容滚不到（hero 2026-08-18、普通区块 2026-08-19 修复） */
html.snap-fullpage .hero.snap-free,
html.snap-fullpage .vision-space.snap-free,
html.snap-fullpage .section.snap-free,
html.snap-fullpage .thanks.snap-free {
  scroll-snap-align: none;
  scroll-snap-stop: normal;
}
/* 超高区块自由滚动时去掉整屏吸附的底部居中补偿（2×snap-offset ≈ 176px）：
   吸附停靠时该段探出折叠线不可见，但自由滚动到底会暴露成大片空白带，
   让用户误以为滚进空白区（2026-08-20 修复） */
html.snap-fullpage .section.snap-free {
  padding-bottom: var(--sp-12);
}
/* hero 超高时整页吸附由强制（mandatory）降级为接近式（proximity）：
   hero 移出锚点后若仍保持 mandatory，浏览器会把视口强制吸到下一个锚点（如 why 块顶），
   导致切换语言/滚动时整个 hero 跳出视口；proximity 仅靠近锚点才吸附，位置不跳变（2026-08-18） */
html.snap-fullpage.snap-soft {
  scroll-snap-type: y proximity;
}
/* 超高区块存在时整页完全退出吸附（none）：单区块/超高内容场景下，即使降级为 proximity，
   超高区块前的小锚点（如合作伙伴页 page-head）仍在吸附半径内，滚轮/键盘每滚一小步就会被
   吸回顶部，内容滚不到；退出后页面按普通长页自由滚动，翻屏交给 JS 整屏锁定接管（2026-08-19 修复） */
html.snap-fullpage.snap-none {
  scroll-snap-type: none;
}
/* footer 采用“底边对齐（end）”→ 滚到底时 footer 完整贴住视口底，终点即页面底部，
   最后一个超高模块滚出边界后不再悬停在视口下方失衡（对齐整屏而非半屏） */
html.snap-fullpage .site-footer {
  scroll-snap-align: end;
}

.container {
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--sp-5);
}

/* ---------------- 顶部导航 Header ---------------- */
.site-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: var(--z-header);
  height: var(--header-h);
  background: var(--glass-bg);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(150%);
  backdrop-filter: blur(var(--glass-blur)) saturate(150%);
  border-bottom: 1px solid var(--border);
  transition: background var(--t-base) var(--ease);
}
.site-header.is-scrolled {
  background: var(--glass-bg-strong);
}
/* 不支持 backdrop-filter 时回退实色，保证导航可读 */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .site-header { background: var(--bg-base); }
  .site-header.is-scrolled { background: var(--bg-base-2); }
}
.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-5);
  height: var(--header-h);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-3);
  min-width: 0;
}
.brand-name {
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1.15;
  white-space: nowrap;
}
.brand-name small {
  display: block;
  font-size: var(--fs-xs);
  font-weight: 400;
  letter-spacing: 0.2em;
  color: var(--text-3);
}

.nav {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
}
.nav a {
  position: relative;
  padding: 0.45rem 0.95rem;
  /* 大屏微增、封顶 1.125rem（18px）：导航字整体偏大，与 --header-h 的 clamp 配套 */
  font-size: clamp(0.9375rem, 0.9rem + 0.1vw, 1.125rem);
  color: var(--text-2);
  border-radius: 0;
  transition: color var(--t-fast) var(--ease), background var(--t-fast);
}
.nav a:hover {
  color: var(--text-1);
  background: rgba(159, 178, 212, 0.08);
}
.nav a::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 2px;
  width: 0;
  height: 2px;
  background: var(--primary);
  transform: translateX(-50%);
  transition: width var(--t-base) var(--ease);
}
.nav a:hover::after,
.nav a.is-active::after {
  width: 60%;
}
.nav a.is-active {
  color: var(--brand);
}

.header-actions {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
}

.lang-switch {
  display: inline-flex;
  border: 1px solid var(--border-strong);
  border-radius: 0;
  overflow: hidden;
}
.lang-switch button {
  min-width: 44px;
  text-align: center;
  padding: 0.4rem 0.85rem;
  font-size: var(--fs-xs);
  font-family: var(--font-display);
  letter-spacing: 0.06em;
  color: var(--text-3);
  transition: background var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.lang-switch button:hover {
  color: var(--text-1);
}
/* 触屏按压反馈（替代被移除的默认高亮；is-active 按钮按压保持高亮色，避免闪烁） */
.lang-switch button:active:not(.is-active) {
  color: var(--text-1);
  background: var(--bg-base-2);
}
.lang-switch button.is-active {
  background: var(--primary);
  color: var(--text-on-primary);
}

/* 主题切换按钮：太阳 / 月亮 图标（深色显示太阳→切浅色，浅色显示月亮→切深色），
   与 lang-switch 同高同列，hover 转主色 */
.theme-toggle {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  color: var(--text-3);
  transition: color var(--t-fast) var(--ease);
}
.theme-toggle:hover {
  color: var(--primary);
}
/* 触屏按压反馈 */
.theme-toggle:active {
  color: var(--primary);
}
.theme-toggle .tt-ic {
  display: block;
  line-height: 0;
}
.theme-toggle .tt-ic--alt {
  display: none;
}
.theme-toggle.is-light .tt-ic {
  display: none;
}
.theme-toggle.is-light .tt-ic--alt {
  display: block;
}

.burger {
  display: none;
  width: 42px;
  height: 42px;
  place-items: center;
  color: var(--text-1);
}
/* 触屏按压反馈 */
.burger:active {
  color: var(--primary);
}
.burger span {
  position: relative;
  display: block;
  width: 18px;
  height: 2px;
  background: currentColor;
  border-radius: 2px;
}
.burger span::before,
.burger span::after {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  background: currentColor;
  border-radius: 2px;
}
.burger span::before {
  top: -6px;
}
.burger span::after {
  bottom: -6px;
}

/* ---------------- 首屏 Hero（P3：近全屏 + 背景图 + 深色遮罩 + 单主 CTA + 滚动提示） ---------------- */
.hero {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  min-height: 100vh;
  padding: calc(var(--header-h) + var(--sp-10)) 0 var(--sp-12);
  overflow: hidden;
}
.hero-bg {
  position: absolute;
  inset: 0;
  z-index: -2;
}
.hero-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.88) brightness(0.7);
  /* 底部 20vh 宽幅渐隐透明：整页吸附翻页时 hero 底部会短暂残留在视口顶部，
     若图片不透明会与下方「透出星云」的背景形成明显分界 → 图片底缘宽幅淡出，
     直接融入背景（露出全局星云层），过渡带足够高、任何底色下都无缝（2026-08-14 修复） */
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 calc(100% - 20vh), transparent 100%);
  mask-image: linear-gradient(to bottom, #000 0%, #000 calc(100% - 20vh), transparent 100%);
}
/* 深色遮罩：唯一允许的渐变（保证文字可读性；2026-08-13 随背景提亮，透明度略降）。
   底部与图片同步 mask 宽幅渐隐，避免遮罩底缘在残留带处形成硬边 */
.hero-overlay {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(16, 24, 40, 0.64) 0%, rgba(16, 24, 40, 0.84) 100%);
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 calc(100% - 20vh), transparent 100%);
  mask-image: linear-gradient(to bottom, #000 0%, #000 calc(100% - 20vh), transparent 100%);
}
.hero-inner {
  position: relative;
  z-index: 1;
  max-width: 780px;
}
.hero-eyebrow {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--text-2);
}
.hero-title {
  margin-top: var(--sp-5);
  font-size: var(--fs-hero);
  letter-spacing: 0.01em;
  color: var(--brand);
}
.hero-title .accent {
  color: var(--primary);
}
.hero-sub {
  margin-top: var(--sp-4);
  font-size: clamp(1rem, 1.6vw, 1.15rem);
  color: var(--text-2);
  max-width: 640px;
}
.hero-cta {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  margin-top: var(--sp-6);
  flex-wrap: wrap;
}
/* hero 内容超高（英文长文案 / 小视口）时的压缩兜底：收紧标题字号与各区块间距，
   尽量把完整内容压进一屏（由 js syncHeroSnap 按实测高度挂 .snap-compact） */
html.snap-fullpage .hero.snap-compact {
  --fs-hero: clamp(2.1rem, 5.2vw, 3.2rem);
  padding-top: calc(var(--header-h) + var(--sp-5));
  padding-bottom: var(--sp-6);
}
html.snap-fullpage .hero.snap-compact .hero-title {
  margin-top: var(--sp-3);
}
html.snap-fullpage .hero.snap-compact .hero-sub {
  margin-top: var(--sp-2);
  font-size: clamp(0.875rem, 1.4vw, 1rem);
  line-height: 1.55;
}
html.snap-fullpage .hero.snap-compact .hero-cta {
  margin-top: var(--sp-4);
}

/* ---------------- 页面主区（单栏；侧边面板已并入悬浮角标） ---------------- */
.layout-two {
  display: block;
}
.layout-main {
  min-width: 0;
}
/* 子页面（非首页）：为 fixed 顶栏让位（首页 hero 自带 padding-top 补偿，受 snap-fullpage 排除） */
html:not(.snap-fullpage) .layout-main {
  padding-top: var(--header-h);
}
/* snap-none（超高区块退出整页吸附，页面退化为普通长页滚动）时恢复 layout-main 对 fixed 顶栏的避让：
   否则首区块贴视口顶、仅靠自身 padding 撑开，页头隐藏后首个内容区块标题紧贴导航（2026-08-19 修复） */
html.snap-fullpage.snap-none .layout-main {
  padding-top: var(--header-h);
}

.contact-list li {
  display: flex;
  align-items: flex-start;
  gap: var(--sp-2);
  padding: var(--sp-2) 0;
  color: var(--text-2);
  font-size: var(--fs-sm);
  word-break: break-all;
}
.contact-list svg {
  flex-shrink: 0;
  color: var(--primary);
  margin-top: 3px;
}

/* PPT 结束页（仅首页）：滚到底时"与您同行，驶向未来"占据 footer 上方剩余空间，与 footer 合成一整屏；
   作为整屏锁定的最后一个停靠模块（scroll-snap-align: start） */
html.snap-fullpage .thanks {
  min-height: calc(100vh - var(--footer-h, 0px));
  display: grid;
  place-items: center;
  scroll-snap-align: start;
  padding: var(--sp-8) var(--sp-5);
  text-align: center;
}
html.snap-fullpage .thanks-title {
  font-family: var(--font-display);
  font-size: clamp(2.75rem, 7vw, 5.25rem);
  font-weight: 700;
  letter-spacing: 0.05em;
  color: var(--text-2);
}
html.snap-fullpage .site-footer {
  margin-top: 0;
}

/* ---------------- 页脚 Footer ---------------- */
.site-footer {
  position: relative;
  margin-top: var(--sp-12);
  border-top: 1px solid var(--border);
  background: var(--bg-base-2);
}
.footer-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--sp-6);
  padding: var(--sp-8) 0 var(--sp-6);
}
/* 网格列允许收缩到内容最小宽度以下，避免长英文/URL 把列撑破视窗 */
.footer-grid > * {
  min-width: 0;
}
/* 长文本兜底断行：邮箱、官网 URL、英文地址等无空格长串在窄屏/缩放后不会横向溢出 */
.footer-contact span,
.footer-brand p,
.footer-bottom span,
.footer-bottom a {
  overflow-wrap: anywhere;
}
/* 备案号链接：低调融入页脚底栏，仅悬停时高亮 */
.footer-icp {
  color: inherit;
  text-decoration: none;
}
.footer-icp:hover {
  color: var(--accent);
  text-decoration: underline;
}
/* 页脚列数自适应：后台可隐藏部分列，按实际渲染列数调整网格（默认 4 列等宽；
   品牌列显示时加宽为 1.5fr，其余列等宽；窄屏覆盖见下方 media） */
.footer-grid.cols-3 { grid-template-columns: repeat(3, 1fr); }
.footer-grid.cols-2 { grid-template-columns: repeat(2, 1fr); }
.footer-grid.cols-1 { grid-template-columns: 1fr; }
.footer-grid.has-brand.cols-4 { grid-template-columns: 1.5fr 1fr 1fr 1fr; }
.footer-grid.has-brand.cols-3 { grid-template-columns: 1.5fr 1fr 1fr; }
.footer-grid.has-brand.cols-2 { grid-template-columns: 1.5fr 1fr; }
.footer-col h4 {
  font-size: var(--fs-h3);
  font-weight: 600;
  margin-bottom: var(--sp-4);
}
.footer-col ul li {
  margin-bottom: var(--sp-2);
}
.footer-col a {
  color: var(--text-2);
  font-size: var(--fs-sm);
  transition: color var(--t-fast);
}
.footer-col a:hover {
  color: var(--primary);
}
.footer-brand .brand {
  margin-bottom: var(--sp-3);
}
/* 页脚 logo 保持原字号：仅 header 品牌放大，页脚避免与版权区比例失衡 */
.footer-brand .brand-name {
  font-size: 1.04rem;
}
.footer-brand p {
  color: var(--text-3);
  font-size: var(--fs-sm);
  margin-top: var(--sp-3);
  max-width: 320px;
}

.footer-contact li {
  display: flex;
  gap: var(--sp-2);
  align-items: flex-start;
  color: var(--text-2);
  font-size: var(--fs-sm);
  margin-bottom: var(--sp-2);
}
.footer-contact svg {
  flex-shrink: 0;
  color: var(--primary);
  margin-top: 3px;
}
.footer-bottom {
  border-top: 1px solid var(--border);
  padding: var(--sp-4) 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--sp-4);
  flex-wrap: wrap;
  color: var(--text-3);
  font-size: var(--fs-xs);
}

/* ---------------- 右侧悬浮角标（极简隐身：平时低透明缩小，悬停/聚焦浮现；
   胶囊毛玻璃 + 星环描边，hover 如星光点亮，与星空背景融合；不支持 backdrop-filter 回退近似实底） ---------------- */
.float-tabs {
  position: fixed;
  right: var(--sp-5);
  top: 50%;
  z-index: var(--z-float);
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  opacity: 0.38;
  transform: translateY(-50%) scale(0.86);
  transform-origin: right center;
  transition: opacity var(--t-base) var(--ease), transform var(--t-base) var(--ease);
}
.float-tabs:hover,
.float-tabs:focus-within {
  opacity: 1;
  transform: translateY(-50%) scale(1);
}
.float-tab {
  position: relative;
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  color: rgba(224, 234, 255, 0.9);
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: var(--radius-full);
  background: rgba(255, 255, 255, 0.1);
  transition: color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .float-tab {
    background: rgba(255, 255, 255, 0.13);
    -webkit-backdrop-filter: blur(14px) saturate(160%);
    backdrop-filter: blur(14px) saturate(160%);
  }
}
.float-tab:hover,
.float-tab.is-open {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.5);
  box-shadow: 0 0 20px rgba(170, 205, 255, 0.35), inset 0 0 0 1px rgba(255, 255, 255, 0.12);
}
.ft-ic {
  display: grid;
  place-items: center;
}

/* ---------------- 移动端抽屉 ---------------- */
.drawer {
  position: fixed;
  inset: 0;
  z-index: var(--z-drawer);
  pointer-events: none;
}
.drawer-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(4, 7, 14, 0.72);
  opacity: 0;
  transition: opacity var(--t-base) var(--ease);
}
.drawer-panel {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(84vw, 340px);
  /* 深空星野：两团星云光斑 + 深空渐变底（细碎星点由 ::before 层提供，与全局星空同语言） */
  background:
    radial-gradient(110% 75% at 88% -12%, rgba(46, 124, 246, 0.18), transparent 62%),
    radial-gradient(110% 80% at -15% 105%, rgba(122, 92, 230, 0.13), transparent 60%),
    linear-gradient(180deg, #1D2942 0%, #23304E 55%, #1D2942 100%);
  border-left: 1px solid var(--border);
  transform: translateX(100%);
  will-change: transform; /* 面板自身独立合成层，过渡期间不重合成子树，消除开合闪烁 */
  transition: transform var(--t-base) var(--ease);
  display: flex;
  flex-direction: column;
  overflow-y: auto;
}
/* 星点层：静态细碎星光（不设呼吸动画——持续 opacity 动画在面板过渡期间会触发子树重合成闪烁） */
.drawer-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0; /* 星野在内容之下：内容层 z-index 1 盖住 */
  pointer-events: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><circle cx='18' cy='42' r='1.5' fill='%23E3ECFD' opacity='.8'/><circle cx='150' cy='24' r='1' fill='%23E3ECFD' opacity='.55'/><circle cx='92' cy='118' r='1.9' fill='%23E3ECFD' opacity='.9'/><circle cx='204' cy='148' r='1' fill='%23E3ECFD' opacity='.45'/><circle cx='52' cy='182' r='1.2' fill='%23E3ECFD' opacity='.7'/><circle cx='170' cy='96' r='.9' fill='%23E3ECFD' opacity='.4'/></svg>");
  background-size: 300px 300px;
  opacity: 0.75;
}
/* 内容层抬到星野之上 */
.drawer-head,
.drawer-body {
  position: relative;
  z-index: 1;
}
.drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--sp-4) var(--sp-5);
  /* 无分割线：标题直接悬在星野上 */
}
.drawer-head__label {
  font-family: var(--font-display);
  font-size: var(--fs-xs);
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--text-3);
}
.drawer-body {
  padding: var(--sp-5);
  display: flex;
  flex-direction: column;
  gap: var(--sp-5);
}
.drawer-nav {
  display: flex;
  flex-direction: column;
}
.drawer-nav a {
  position: relative;
  padding: 0.72rem 0;
  font-size: var(--fs-body);
  color: var(--text-2);
  transition: color var(--t-fast), padding-left var(--t-fast);
}
.drawer-nav a:hover {
  color: var(--text-1);
  padding-left: var(--sp-2);
}
.drawer-nav a.is-active {
  color: var(--text-1);
  padding-left: var(--sp-3);
}
/* 激活项：发光星点指示（替代分隔线，呼应星空语言） */
.drawer-nav a.is-active::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--primary);
  box-shadow: 0 0 8px rgba(46, 124, 246, 0.9);
}
.drawer-contact {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  color: var(--text-2);
  font-size: var(--fs-sm);
}
/* 抽屉内公众号入口：二维码 + 公众号名称（无分割线，靠间距分区） */
.drawer-wechat {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--sp-1);
  color: var(--text-2);
  font-size: var(--fs-sm);
  text-align: left;
}
.drawer-wechat .dw-label {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
}
/* 二维码 + 公众号名称作为整体：内部居中成组，组块整体靠左 */
.drawer-wechat .dw-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-1);
  margin-top: var(--sp-2);
}
.drawer-wechat .dw-id {
  color: var(--text-3);
  font-size: var(--fs-xs);
}
.drawer.is-open {
  pointer-events: auto;
}
.drawer.is-open .drawer-backdrop {
  opacity: 1;
}
.drawer.is-open .drawer-panel {
  transform: none;
}
/* ---------------- 移动端返回顶部悬浮球（右下角；桌面端不显示，返回顶部仍在右侧角标内） ---------------- */
.float-ball {
  position: fixed;
  right: var(--sp-5);
  bottom: calc(var(--sp-5) + env(safe-area-inset-bottom, 0px));
  z-index: var(--z-float);
  width: 44px;
  height: 44px;
  display: none;
  place-items: center;
  border-radius: var(--radius-full);
  border: 1px solid var(--border-strong);
  /* Apple 毛玻璃（与 float-tabs 同款）：半透明深底 + 背景模糊，滚动时背后内容变化可见 */
  background: rgba(20, 29, 48, 0.85);
  color: var(--text-2);
  box-shadow: 0 8px 24px rgba(4, 7, 14, 0.35);
  transition: color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease),
    transform var(--t-fast) var(--ease);
}
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .float-ball {
    background: rgba(20, 29, 48, 0.55);
    -webkit-backdrop-filter: blur(12px) saturate(160%);
    backdrop-filter: blur(12px) saturate(160%);
  }
}
.float-ball:hover,
.float-ball:active {
  color: var(--primary);
  border-color: var(--primary);
}
/* 圆形按钮按压反馈：轻按缩小（取代被移除的默认矩形高亮） */
.float-ball:active {
  transform: scale(0.88);
}
/* 球内箭头图标放大（44px 球内 20px 图标，视觉更饱满；不影响桌面端 float-tab 图标） */
.float-ball svg {
  width: 20px;
  height: 20px;
}
/* ---------------- 响应式 ---------------- */
@media (max-width: 1024px) {
  /* 平板：所有列数变体统一两列（逐条覆盖更高优先级的 cols-*/has-brand 列数规则，否则折叠不生效） */
  .footer-grid,
  .footer-grid.cols-2,
  .footer-grid.cols-3,
  .footer-grid.cols-4,
  .footer-grid.has-brand.cols-2,
  .footer-grid.has-brand.cols-3,
  .footer-grid.has-brand.cols-4 {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 860px) {
  .nav {
    display: none;
  }
  .burger {
    display: grid;
  }
  /* 移动端：页面底部常驻浮条遮挡图片，隐藏；操作（咨询入抽屉、返回顶部入悬浮球） */
  #global-float {
    display: none;
  }
  .float-ball {
    display: grid;
  }
}

@media (max-width: 560px) {
  /* 手机：多列变体统一单列（覆盖更高优先级的列数规则，修复三列/品牌列不折叠问题） */
  .footer-grid,
  .footer-grid.cols-2,
  .footer-grid.cols-4,
  .footer-grid.has-brand.cols-2,
  .footer-grid.has-brand.cols-4 {
    grid-template-columns: 1fr;
  }
  /* 三列 → 2x2：品牌列通栏置顶，其余两列并排；无品牌时末列通栏 */
  .footer-grid.cols-3 {
    grid-template-columns: 1fr 1fr;
  }
  .footer-grid.cols-3 .footer-brand {
    grid-column: 1 / -1;
  }
  .footer-grid.cols-3:not(.has-brand) .footer-col:last-child {
    grid-column: 1 / -1;
  }
  .hero {
    padding-top: calc(var(--header-h) + var(--sp-8));
  }
}