/* ===========================================================================
   Hams 官网共享样式 — 基于 Hams 官网 Design System v1.0
   Design System 是视觉与交互的唯一权威。页面专属样式写在各页面的 <style> 中。
   =========================================================================== */

/* ============ 设计令牌（亮色 · 桌面为默认） ============ */
:root {
  color-scheme: light;

  /* 深色区块（页头 / 页脚 / CTA，两种主题下都保持深色） */
  --dbg: #0b1220;
  --dbg2: #111827;
  --dsf: #1e293b;
  --dsfr: #1e293b;
  --dbd: #263247;
  --dbd2: #475569;
  --d1: #f8fafc;
  --d2: #cbd5e1;
  --d3: #94a3b8;
  --dlk: #93c5fd;

  /* 亮色主题 */
  --bg: #fff;
  --bg2: #f8fafc;
  --sf: #fff;
  --sfa: #eff6ff;
  --t1: #0f172a;
  --t2: #475569;
  --t3: #64748b;
  --bd: #e2e8f0;
  --bd2: #cbd5e1;
  --lk: #1d4ed8;
  --ac2: #1d4ed8;
  --fc: #1d4ed8;
  --legalBg: #fafaf8;
  --acBd: #93c5fd;
  --acText: #1d4ed8;
  --vipText: #6d28d9;
  --svipText: #0f766e;
  --phBg1: #f1f5f9;
  --phBg2: #e2e8f0;
  --numC: #e2e8f0;
  --ctrlBw: 1px;
  --ctrlBw2: 2px;

  /* 强调色（不随主题变化的品牌操作色） */
  --brand: #2563eb;

  /* 文字缩放（标准） */
  --ts: 1;
  --hs: 1;
  --cs: 1;

  /* 排版（桌面 ≥1200px 为默认） */
  --dxl: 72px;
  --h1: 56px;
  --h2: 44px;
  --h3: 32px;
  --h4: 24px;
  --lead: 21px;
  --bodyL: 19px;
  --body: 17px;
  --legalH1: 60px;
  --legalH2: 34px;
  --legalH3: 23px;
  --legalBody: 18px;

  /* 布局 */
  --container-reading: 736px;
  --container-legal: 800px;
  --container-content: 1200px;
  --container-wide: 1320px;
  --container-media: 1440px;
  --container-chrome: calc(var(--container-content) + (var(--px) * 2));
  --px: 40px;
  --sy: 88px;
  --sy2: 64px;
  --secGap: 56px;
  --gap1: 96px;
  --gap2: 72px;
  --gap3: 56px;
  --heroPT: 32px;
  --heroPB: 80px;
  --legalHeroY: 32px;
  --legalSecY: 80px;
  --hdrH: 72px;
  --hdrGap: 40px;
  --rowDir: row;
  --rowAlign: center;
  --numW: 56px;
  --shotW: 760px;
  --phoneW: 330px;
  --heroPhoneW: min(var(--phoneW), 300px);
  --tl3: repeat(3, 1fr);
  --tl4: repeat(4, 1fr);
  --tl5: repeat(5, 1fr);
  --planCols: repeat(3, 1fr);
  --navD: flex;
  --menuD: none;
  --ctaLbl: inline;
  --popLbl: none;
  --langLbl: none;
  --footCols: 1.4fr 1fr 1fr 1fr 1fr;
  --panelDir: row;
  --panelGap: 72px;
  --heroDir: row;
  --heroGap: 40px;
  --stepDir: row;
  --stepDirR: row-reverse;
  --qrD: flex;

  /* 页头状态（默认：未滚动） */
  --hdrBg: var(--dbg);
  --hdrBd: transparent;
  --hdrBlur: none;
}

@media (min-width: 1440px) {
  :root { --px: 48px; }
}

/* ============ 暗色主题（用户明确选择 > 系统偏好 > 默认亮色） ============ */
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0b1220;
  --bg2: #111827;
  --sf: #172033;
  --sfa: #172554;
  --t1: #f8fafc;
  --t2: #cbd5e1;
  --t3: #94a3b8;
  --bd: #263247;
  --bd2: #475569;
  --lk: #93c5fd;
  --ac2: #93c5fd;
  --fc: #93c5fd;
  --legalBg: #0f1626;
  --acBd: #1d4ed8;
  --acText: #93c5fd;
  --vipText: #ddd6fe;
  --svipText: #99f6e4;
  --phBg1: #172033;
  --phBg2: #111827;
  --numC: #1e293b;
  --dbg: #020617;
  --dbg2: #0b1220;
  --dsf: #111827;
  --dsfr: #172033;
  --dbd: #1e293b;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #0b1220;
    --bg2: #111827;
    --sf: #172033;
    --sfa: #172554;
    --t1: #f8fafc;
    --t2: #cbd5e1;
    --t3: #94a3b8;
    --bd: #263247;
    --bd2: #475569;
    --lk: #93c5fd;
    --ac2: #93c5fd;
    --fc: #93c5fd;
    --legalBg: #0f1626;
    --acBd: #1d4ed8;
    --acText: #93c5fd;
    --vipText: #ddd6fe;
    --svipText: #99f6e4;
    --phBg1: #172033;
    --phBg2: #111827;
    --numC: #1e293b;
    --dbg: #020617;
    --dbg2: #0b1220;
    --dsf: #111827;
    --dsfr: #172033;
    --dbd: #1e293b;
  }
}

/* ============ 高对比度（亮色基础） ============ */
[data-contrast="high"] {
  --ctrlBw: 2px;
  --ctrlBw2: 3px;
  --bg: #fff;
  --bg2: #fff;
  --sf: #fff;
  --sfa: #fff;
  --t1: #000;
  --t2: #111;
  --t3: #111;
  --bd: #000;
  --bd2: #000;
  --lk: #0037b3;
  --ac2: #0037b3;
  --fc: #ffb800;
  --acBd: #000;
  --acText: #0037b3;
  --vipText: #000;
  --svipText: #000;
  --legalBg: #fff;
  --phBg1: #fff;
  --phBg2: #fff;
  --numC: #111;
}

/* ============ 高对比度 + 暗色 ============ */
:root[data-theme="dark"][data-contrast="high"] {
  --bg: #000;
  --bg2: #000;
  --sf: #000;
  --sfa: #000;
  --t1: #fff;
  --t2: #f2f2f2;
  --t3: #f2f2f2;
  --bd: #fff;
  --bd2: #fff;
  --lk: #80c5ff;
  --ac2: #80c5ff;
  --fc: #ffd400;
  --acText: #80c5ff;
  --vipText: #fff;
  --svipText: #fff;
  --legalBg: #000;
  --phBg1: #000;
  --phBg2: #000;
  --numC: #f2f2f2;
  --dbg: #000;
  --dbg2: #000;
  --dsf: #000;
  --dsfr: #000;
  --dbd: #fff;
  --dbd2: #fff;
  --d1: #fff;
  --d2: #f2f2f2;
  --d3: #f2f2f2;
  --dlk: #80c5ff;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"])[data-contrast="high"] {
    --bg: #000;
    --bg2: #000;
    --sf: #000;
    --sfa: #000;
    --t1: #fff;
    --t2: #f2f2f2;
    --t3: #f2f2f2;
    --bd: #fff;
    --bd2: #fff;
    --lk: #80c5ff;
    --ac2: #80c5ff;
    --fc: #ffd400;
    --acText: #80c5ff;
    --vipText: #fff;
    --svipText: #fff;
    --legalBg: #000;
    --phBg1: #000;
    --phBg2: #000;
    --dbg: #000;
    --dbg2: #000;
    --dsf: #000;
    --dsfr: #000;
    --dbd: #fff;
    --dbd2: #fff;
    --d1: #fff;
    --d2: #f2f2f2;
    --d3: #f2f2f2;
    --dlk: #80c5ff;
  }
}

/* 强制颜色模式：让系统颜色接管，不保留品牌色 */
@media (forced-colors: active) {
  .btn-primary, .btn-hdr-cta, .btn-outline, .btn-outline-dark, .btn-reset {
    forced-color-adjust: auto;
    border: 1px solid ButtonBorder;
  }
  .shot-ph, .qr-ph, .video-ph { background: Canvas; }
}

/* ============ 文字大小 ============ */
:root[data-textsize="large"] { --ts: 1.18; --hs: 1.06; --cs: 1.08; }
:root[data-textsize="xlarge"] { --ts: 1.3; --hs: 1.12; --cs: 1.16; }

@media (min-width: 1200px) {
  :root[data-textsize="large"],
  :root[data-textsize="xlarge"] {
    --hdrH: 80px;
    --hdrGap: 24px;
    --legalH1: 52px;
    --footCols: 1fr 1fr 1fr;
    --tl3: repeat(2, 1fr);
    --tl4: repeat(2, 1fr);
    --tl5: repeat(3, 1fr);
    --planCols: repeat(2, 1fr);
  }
  :root[data-textsize="xlarge"] {
    --tl3: 1fr;
    --tl4: 1fr;
    --tl5: 1fr;
    --planCols: 1fr;
  }
}
@media (min-width: 1200px) and (max-width: 1439.98px) {
  :root[data-textsize="large"],
  :root[data-textsize="xlarge"] {
    --navD: none;
    --menuD: inline-flex;
  }
}

/* ============ 平板 <1200px ============ */
@media (max-width: 1199.98px) {
  :root {
    --px: 32px;
    --sy: 80px;
    --sy2: 64px;
    --secGap: 52px;
    --gap1: 80px;
    --gap2: 64px;
    --gap3: 48px;
    --heroPT: 36px;
    --heroPB: 72px;
    --legalHeroY: 36px;
    --legalSecY: 72px;
    --hdrH: 68px;
    --hdrGap: 16px;
    --dxl: 60px;
    --h1: 48px;
    --h2: 38px;
    --h3: 29px;
    --h4: 23px;
    --lead: 20px;
    --bodyL: 19px;
    --body: 17px;
    --legalH1: 48px;
    --legalH2: 32px;
    --legalH3: 22px;
    --legalBody: 18px;
    --rowDir: column;
    --rowAlign: stretch;
    --numW: auto;
    --shotW: 100%;
    --phoneW: 320px;
    --tl3: repeat(2, 1fr);
    --tl4: repeat(2, 1fr);
    --tl5: repeat(3, 1fr);
    --planCols: repeat(2, 1fr);
    --navD: none;
    --menuD: inline-flex;
    --popLbl: none;
    --langLbl: none;
    --footCols: 1fr 1fr;
    --panelDir: column;
    --panelGap: 56px;
    --heroDir: column;
    --heroGap: 56px;
    --stepDir: column;
    --stepDirR: column;
  }
  :root[data-textsize="large"],
  :root[data-textsize="xlarge"] {
    --tl3: 1fr;
    --tl4: 1fr;
    --tl5: repeat(2, 1fr);
    --planCols: 1fr;
  }
}

/* ============ 手机 <768px ============ */
@media (max-width: 767.98px) {
  :root {
    --px: 20px;
    --sy: 64px;
    --sy2: 56px;
    --secGap: 44px;
    --gap1: 64px;
    --gap2: 56px;
    --gap3: 40px;
    --heroPT: 24px;
    --heroPB: 56px;
    --legalHeroY: 32px;
    --legalSecY: 56px;
    --hdrH: 64px;
    --hdrGap: 12px;
    --dxl: 48px;
    --h1: 40px;
    --h2: 32px;
    --h3: 25px;
    --h4: 21px;
    --lead: 19px;
    --bodyL: 18px;
    --body: 17px;
    --legalH1: 40px;
    --legalH2: 29px;
    --legalH3: 21px;
    --legalBody: 17px;
    --tl3: 1fr;
    --tl4: 1fr;
    --tl5: 1fr;
    --planCols: 1fr;
    --ctaLbl: none;
    --footCols: 1fr;
    --panelGap: 44px;
    --heroGap: 48px;
    --phoneW: 84vw;
    --qrD: none;
  }
}

/* ============ 基础 ============ */
html, body { margin: 0; padding: 0; }
body {
  background: var(--bg);
  color: var(--t1);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", "Noto Sans SC", Helvetica, Arial, sans-serif;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  min-height: 100%;
}
* { box-sizing: border-box; }
a { color: var(--lk); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--ac2); text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--fc); outline-offset: 3px; border-radius: 4px; }
button { font: inherit; color: inherit; }
img { max-width: 100%; height: auto; }
[hidden] { display: none !important; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}
:root[data-motion="reduce"] *,
:root[data-motion="reduce"] *::before,
:root[data-motion="reduce"] *::after {
  animation-duration: .01ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: .01ms !important;
  scroll-behavior: auto !important;
}

.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.wrap,
.wrap-wide { max-width: var(--container-content); margin: 0 auto; }
.wrap-readable,
.g-sec--readable > .wrap,
.g-sec--readable > .wrap-wide,
.faq-sec--readable > .wrap-wide {
  max-width: min(880px, var(--container-content));
  margin-inline: auto;
}
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
.skip-link {
  position: absolute;
  inset-inline-start: -9999px;
  top: 0;
  z-index: 400;
  padding: 12px 20px;
  background: var(--brand);
  color: #fff;
  border-radius: 0 0 12px 0;
  font-weight: 600;
  text-decoration: none;
}
.skip-link:focus { inset-inline-start: 0; color: #fff; }

/* ============ 页头 ============ */
.site-header {
  position: sticky;
  top: 0;
  z-index: 200;
  background: var(--hdrBg);
  border-bottom: 1px solid var(--hdrBd);
  backdrop-filter: var(--hdrBlur);
  transition: background 200ms cubic-bezier(.2, .8, .2, 1), border-color 200ms cubic-bezier(.2, .8, .2, 1);
}
html.is-scrolled {
  --hdrBg: rgba(11, 18, 32, .86);
  --hdrBd: #263247;
  --hdrBlur: blur(14px);
}
html.is-scrolled[data-contrast="high"] { --hdrBg: var(--dbg); }
.hdr-inner {
  max-width: var(--container-chrome);
  margin: 0 auto;
  padding: 0 var(--px);
  min-height: var(--hdrH);
  display: flex;
  align-items: center;
  gap: var(--hdrGap);
}
.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: calc(44px * var(--cs));
  text-decoration: none;
  color: #f8fafc;
  flex: none;
}
.brand-mark {
  width: 30px;
  height: 30px;
  border-radius: 9px;
  border: 0;
  background: #172554 url("/assets/images/shared/icons/hams-app-icon-header.png") center/cover no-repeat;
  display: grid;
  place-items: center;
  font: 700 13px/1 ui-monospace, Menlo, monospace;
  color: transparent;
  overflow: hidden;
}
.brand-name { font-size: calc(19px * var(--ts)); font-weight: 700; letter-spacing: -.01em; }
.site-nav {
  display: var(--navD);
  align-items: center;
  gap: var(--hdrGap);
  margin-inline-start: 8px;
}
.site-nav a {
  color: #cbd5e1;
  font-size: calc(15px * var(--ts));
  font-weight: 500;
  text-decoration: none;
}
.site-nav a.is-current { color: #f8fafc; }
.hdr-actions { margin-inline-start: auto; display: flex; align-items: center; gap: 8px; }
.pop-wrap { position: relative; }
.pop-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  width: calc(44px * var(--cs));
  min-height: calc(44px * var(--cs));
  padding: 0;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 12px;
  color: #cbd5e1;
  font-size: calc(15px * var(--ts));
  font-weight: 500;
  cursor: pointer;
}
.pop-btn .btn-lbl { display: var(--popLbl); }
#lang-btn {
  justify-content: center;
  width: calc(44px * var(--cs));
  padding: 0;
}
#lang-btn .btn-lbl { display: var(--langLbl); }
.pop-panel {
  position: absolute;
  inset-inline-end: 0;
  top: calc(100% + 8px);
  background: #1e293b;
  border: 1px solid #475569;
  border-radius: 16px;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .3);
  z-index: 300;
}
.lang-panel { width: 260px; padding: 8px; }
.lang-note { padding: 8px 12px 10px; font-size: 13px; color: #94a3b8; }
.lang-item {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 0 12px;
  border-radius: 12px;
  color: #cbd5e1;
  text-decoration: none;
  font-size: 15px;
}
.lang-item.is-current { justify-content: space-between; color: #f8fafc; background: #172554; }
.lang-item[lang="ar"] { direction: rtl; }
.lang-all { border-top: 1px solid #475569; margin: 8px 4px 4px; padding-top: 8px; }
.lang-all a {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 0 8px;
  color: #93c5fd;
  text-decoration: none;
  font-size: 14px;
}
.disp-panel { width: 300px; padding: 18px; color: #f8fafc; text-align: start; }
.disp-title { font-size: 16px; font-weight: 600; margin-bottom: 16px; }
.disp-panel fieldset { border: 0; margin: 0 0 18px; padding: 0; }
.disp-panel legend { padding: 0; font-size: 13px; color: #94a3b8; margin-bottom: 8px; }
.disp-opts { display: flex; flex-direction: column; gap: 2px; }
.disp-opt {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 0 8px;
  border-radius: 10px;
  font-size: 15px;
  cursor: pointer;
}
.disp-opt input { width: 20px; height: 20px; accent-color: #93c5fd; }
.disp-opt .aa-std { font-size: 15px; }
.disp-opt .aa-lg { font-size: 18px; }
.disp-opt .aa-xl { font-size: 21px; }
.disp-motion { margin-bottom: 8px; }
.disp-foot {
  border-top: 1px solid #475569;
  padding-top: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.btn-reset {
  min-height: 44px;
  padding: 0 14px;
  background: transparent;
  border: 1px solid #475569;
  border-radius: 12px;
  color: #f8fafc;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}
.pref-status { font-size: 13px; color: #94a3b8; }
.btn-hdr-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: calc(48px * var(--cs));
  padding: 0 20px;
  background: var(--brand);
  color: #fff;
  border-radius: 12px;
  font-size: calc(16px * var(--ts));
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  flex: none;
}
.btn-hdr-cta:hover { color: #fff; }
.btn-hdr-cta .cta-lbl { display: var(--ctaLbl); }
.menu-toggle {
  display: var(--menuD);
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  background: transparent;
  border: 1px solid #263247;
  border-radius: 12px;
  color: #f8fafc;
  cursor: pointer;
  flex: none;
}
.nav-sheet { background: #111827; border-top: 1px solid #263247; padding: 8px var(--px) 20px; }
.nav-sheet a {
  display: flex;
  align-items: center;
  min-height: 56px;
  color: #f8fafc;
  font-size: 17px;
  text-decoration: none;
  border-bottom: 1px solid #263247;
}
.nav-sheet a:last-child { border-bottom: 0; }

/* ============ 面包屑 ============ */
.crumb-strip { display: none !important; height: 0; overflow: hidden; background: var(--dbg); color: var(--d1); }
.crumbs {
  max-width: var(--container-chrome);
  margin: 0 auto;
  padding: 20px var(--px) 0;
  font-size: calc(14px * var(--ts));
  color: var(--d3);
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
/* 用等量的内外边距把点击区撑到 44px，视觉位置不变 */
.crumbs a {
  color: var(--d2);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  padding-block: calc((44px * var(--cs) - 1lh) / 2);
  margin-block: calc((44px * var(--cs) - 1lh) / -2);
}
@supports not (height: 1lh) {
  .crumbs a { padding-block: 10px; margin-block: -10px; }
}
.crumbs [aria-current="page"] { color: var(--d1); }

/* ============ 按钮 ============ */
.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: calc(56px * var(--cs));
  padding: 0 26px;
  background: var(--brand);
  color: #fff;
  border-radius: 12px;
  font-size: calc(17px * var(--ts));
  font-weight: 600;
  text-decoration: none;
  border: 0;
  cursor: pointer;
}
.btn-primary:hover { color: #fff; }
.gp-badge-link {
  --gp-badge-height: 48px;
  --gp-badge-max-width: 210px;
  --gp-badge-min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  max-width: 100%;
  min-height: calc(var(--gp-badge-min-height) * var(--cs));
  text-decoration: none;
  border-radius: 8px;
  line-height: 0;
  flex: none;
}
.gp-badge-link:focus-visible { outline-offset: 4px; }
.google-play-badge {
  display: block;
  width: auto;
  height: var(--gp-badge-height);
  max-width: min(var(--gp-badge-max-width), 100%);
  object-fit: contain;
}
.gp-badge-link--header { --gp-badge-height: 36px; --gp-badge-max-width: 152px; --gp-badge-min-height: 36px; }
.gp-badge-link--inline { --gp-badge-height: 40px; --gp-badge-max-width: 172px; --gp-badge-min-height: 40px; }
.gp-badge-link--primary { --gp-badge-height: 56px; --gp-badge-max-width: 236px; --gp-badge-min-height: 56px; }
.gp-badge-link--footer { --gp-badge-height: 40px; --gp-badge-max-width: 172px; --gp-badge-min-height: 40px; }
.gp-badge-link--sticky { --gp-badge-height: 48px; --gp-badge-max-width: 204px; --gp-badge-min-height: 48px; }
@media (max-width: 767.98px) {
  .gp-badge-link--header { --gp-badge-height: 34px; --gp-badge-max-width: 144px; --gp-badge-min-height: 34px; display: none; }
  .gp-badge-link--inline { --gp-badge-height: 38px; --gp-badge-max-width: 160px; --gp-badge-min-height: 38px; }
  .gp-badge-link--primary { --gp-badge-height: 52px; --gp-badge-max-width: 220px; --gp-badge-min-height: 52px; }
}
.btn-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: calc(56px * var(--cs));
  padding: 0 24px;
  background: transparent;
  color: var(--t1);
  border: var(--ctrlBw) solid var(--bd2);
  border-radius: 12px;
  font-size: calc(17px * var(--ts));
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
}
.btn-outline:hover { color: var(--t1); }
.btn-outline-dark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: calc(56px * var(--cs));
  padding: 0 24px;
  background: transparent;
  color: var(--d1);
  border: var(--ctrlBw) solid var(--dbd2);
  border-radius: 12px;
  font-size: calc(17px * var(--ts));
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
}
.btn-outline-dark:hover { color: var(--d1); }
.link-arrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: calc(44px * var(--cs));
  font-size: calc(16px * var(--ts));
  font-weight: 600;
  color: var(--lk);
  text-decoration: none;
}

/* ============ 提示框 ============ */
.note { display: flex; gap: 10px; padding: 16px 18px; border-radius: 16px; max-width: 44em; }
.note-mark { flex: none; font: 700 13px/1.6 ui-monospace, SFMono-Regular, Menlo, monospace; }
.note p { margin: 0; font-size: calc(15px * var(--ts)); line-height: 1.7; }
.note--vault { background: #f8f5f4; border: var(--ctrlBw) solid #d6c8c4; }
.note--vault .note-mark, .note--vault p { color: #6b4f4a; }
.note--warn { background: #fffbeb; border: var(--ctrlBw) solid #fcd34d; }
.note--warn .note-mark, .note--warn p { color: #8a641d; }
.note--info { background: var(--bg2); border: var(--ctrlBw) solid var(--bd2); }
.note--info .note-mark, .note--info p { color: var(--t2); }
.note--ok {
  display: flex;
  gap: 10px;
  align-items: baseline;
  padding: 14px 16px;
  border-radius: 14px;
  background: #f0fdf4;
  border: var(--ctrlBw) solid #86efac;
  max-width: 44em;
}
.note--ok .ok-mark { flex: none; font-weight: 700; color: #166534; }
.note--ok p { margin: 0; font-size: calc(15px * var(--ts)); line-height: 1.6; color: #166534; }
.note-block { margin: 0 0 18px; }

/* ============ 区块外壳 ============ */
.g-sec { color: var(--t1); padding: var(--legalSecY) var(--px); scroll-margin-top: calc(var(--hdrH) + 12px); }
.g-sec--bg { background: var(--bg); }
.g-sec--alt { background: var(--legalBg); border-block: 1px solid var(--bd); }
/* 相邻同底色区块之间只保留一条分隔线，避免上下边框叠成双线 */
.g-sec--alt + .g-sec--alt { border-top: 0; }
.g-sec--dark { background: var(--dbg); color: var(--d1); }
.sec-title {
  margin: 0 0 28px;
  font-size: calc(var(--h2) * var(--hs));
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: -.015em;
}
.sec-title--tight { margin-bottom: 16px; }
.sec-lead {
  margin: 0 0 28px;
  font-size: calc(var(--lead) * var(--ts));
  line-height: 1.65;
  color: var(--t2);
  max-width: 40em;
}
.body-text {
  margin: 0 0 16px;
  font-size: calc(var(--legalBody) * var(--ts));
  line-height: 1.8;
  color: var(--t2);
  max-width: 44em;
}
.kicker {
  display: inline-flex;
  font: 600 13px/1 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .08em;
  color: var(--acText);
  margin-bottom: 18px;
}

/* ============ 通用页面头部（指南 / 语言 / 非法律长文） ============ */
.guide-hero { background: var(--dbg); color: var(--d1); padding: var(--legalHeroY) var(--px); }
.guide-hero .kicker { color: var(--dlk); }
.guide-hero .wrap { max-width: var(--container-content); }
.hero-head { max-width: 56rem; margin: 0 auto; text-align: center; }
.hero-title {
  margin: 0 0 18px;
  font-size: calc(var(--legalH1) * var(--hs));
  line-height: 1.1;
  font-weight: 700;
  letter-spacing: -.02em;
}
.hero-lead {
  margin: 0 auto 28px;
  font-size: calc(var(--lead) * var(--ts));
  line-height: 1.65;
  color: var(--d2);
  max-width: 42em;
}
.hero-ctas { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: center; margin-bottom: 20px; }
.guide-hero .btn-outline {
  color: var(--d1);
  border-color: var(--dbd2);
}
.guide-hero .btn-outline:hover { color: var(--d1); }
.hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  align-items: center;
  justify-content: center;
  font-size: calc(15px * var(--ts));
  color: var(--d3);
}
.hero-note { margin-top: 24px; }
.hero-note .note {
  margin-inline: auto;
  justify-content: center;
}
.hero-note .note p { text-align: center; }

/* 法律长文保留浅色 Hero，优先服务阅读与风险提示 */
.guide-hero--legal { background: var(--legalBg); color: var(--t1); }
.guide-hero--legal .kicker { color: var(--acText); }
.guide-hero--legal .hero-lead { color: var(--t2); }
.guide-hero--legal .hero-meta { color: var(--t3); }
.guide-hero--legal .btn-outline {
  color: var(--t1);
  border-color: var(--bd2);
}
.guide-hero--legal .btn-outline:hover { color: var(--t1); }

/* 快速结论 */
.quick { margin-top: 44px; padding-top: 36px; border-top: 2px solid var(--acBd); }
.quick-title {
  margin: 0 0 20px;
  font-size: calc(var(--legalH3) * var(--hs));
  line-height: 1.4;
  font-weight: 600;
}
.q-num { font: 700 13px/1 ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--dlk); margin-bottom: 10px; }
.q-title { font-size: calc(18px * var(--ts)); font-weight: 600; line-height: 1.45; margin-bottom: 8px; }
.q-body { margin: 0; font-size: calc(16px * var(--ts)); line-height: 1.7; color: var(--d2); }
.guide-hero--legal .q-num { color: var(--acText); }
.guide-hero--legal .q-body { color: var(--t2); }

/* ============ 本页目录 ============ */
.toc {
  position: sticky;
  top: var(--hdrH);
  z-index: 100;
  background: var(--sf);
  border-block: 1px solid var(--bd);
}
.toc-inner {
  max-width: var(--container-chrome);
  margin: 0 auto;
  padding: 0 var(--px);
  min-height: 52px;
  display: flex;
  gap: 4px;
  align-items: center;
  overflow-x: auto;
}
.toc-label {
  flex: none;
  font: 600 12px/1 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .08em;
  color: var(--t3);
  padding-inline-end: 12px;
  white-space: nowrap;
}
.toc-link {
  display: inline-flex;
  align-items: center;
  min-height: calc(44px * var(--cs));
  padding: 0 14px;
  border-radius: 10px;
  white-space: nowrap;
  font-size: calc(15px * var(--ts));
  font-weight: 500;
  text-decoration: none;
  color: var(--t2);
  background: transparent;
}
.toc-link.is-active { color: var(--acText); background: var(--sfa); }

/* ============ 网格 ============ */
.tl3-grid { display: grid; grid-template-columns: var(--tl3); gap: 24px; }
.tl4-grid { display: grid; grid-template-columns: var(--tl4); gap: 24px; }
.duo-grid { display: grid; grid-template-columns: var(--planCols); gap: 36px; margin: 0 0 18px; }
.wrap.duo-grid,
.wrap-wide.duo-grid { margin-inline: auto; }
/* 真正的两列：内容只有两组时用它，避免落进三列栅格留出空列 */
.duo-grid--2 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 767.98px) { .duo-grid--2 { grid-template-columns: 1fr; } }
:root[data-textsize="xlarge"] .duo-grid--2 { grid-template-columns: 1fr; }
.card-grid { display: grid; grid-template-columns: var(--planCols); gap: 16px; margin: 0 0 18px; }
/* 恰好两张卡片时用它，同 .duo-grid--2 的理由 */
.card-grid--2 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 767.98px) { .card-grid--2 { grid-template-columns: 1fr; } }
:root[data-textsize="xlarge"] .card-grid--2 { grid-template-columns: 1fr; }
.rel-grid { display: grid; grid-template-columns: var(--tl3); gap: 16px; }
.duo-title {
  margin: 0 0 12px;
  font-size: calc(var(--legalH3) * var(--hs));
  line-height: 1.4;
  font-weight: 600;
}

/* ============ 列表 ============ */
.check-list {
  margin: 0;
  padding-inline-start: 20px;
  display: flex;
  flex-direction: column;
  gap: 9px;
  font-size: calc(16px * var(--ts));
  line-height: 1.7;
  color: var(--t2);
}
.check-list--wide { margin: 0 0 18px; padding-inline-start: 22px; max-width: 44em; }

/* ============ 支持信息准备卡片 ============ */
.support-prep-wrap {
  max-width: min(1040px, var(--container-content));
  margin: 0 auto;
}
.support-prep-head {
  max-width: 720px;
  margin: 0 auto 34px;
  text-align: center;
}
.support-prep-head .sec-title {
  margin-bottom: 12px;
  text-align: center;
}
.support-prep-lead {
  margin: 0;
  font-size: calc(var(--body) * var(--ts));
  line-height: 1.7;
  color: var(--t2);
}
.support-prep-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(300px, .95fr);
  gap: 20px;
  align-items: stretch;
}
.support-prep-card {
  background: var(--sf);
  border: var(--ctrlBw) solid var(--bd);
  border-radius: 18px;
  padding: 26px;
}
.support-prep-card--good { border-top: 4px solid var(--brand); }
.support-prep-card--avoid { border-top: 4px solid #991b1b; }
.support-prep-card-label {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  margin-bottom: 14px;
  padding: 0 10px;
  border-radius: 999px;
  background: var(--sfa);
  color: var(--acText);
  font-size: calc(13px * var(--ts));
  font-weight: 700;
  line-height: 1.2;
}
.support-prep-card--avoid .support-prep-card-label {
  background: #fef2f2;
  color: #991b1b;
}
.support-prep-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.support-prep-list li {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
.support-prep-icon {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: var(--sfa);
  color: var(--brand);
  font: 700 13px/1 ui-monospace, SFMono-Regular, Menlo, monospace;
}
.support-prep-body {
  margin: 0;
  font-size: calc(var(--body) * var(--ts));
  line-height: 1.7;
  color: var(--t2);
}
.support-dont {
  margin: 0 0 18px;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.support-dont li {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 40px;
  padding: 8px 12px;
  border-radius: 12px;
  background: #fef2f2;
  font-size: calc(var(--body) * var(--ts));
  line-height: 1.45;
  color: var(--t2);
}
.support-dont-x {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  color: #991b1b;
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
}
.support-prep-note {
  max-width: 860px;
  margin: 22px auto 0;
  padding: 18px 20px;
  display: flex;
  gap: 14px;
  align-items: flex-start;
  background: #fffbeb;
  border: var(--ctrlBw) solid #fcd34d;
  border-radius: 16px;
}
.support-prep-note-mark {
  flex: none;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: #fef3c7;
  color: #8a641d;
  font: 700 14px/1 ui-monospace, SFMono-Regular, Menlo, monospace;
}
.support-prep-note p {
  margin: 0;
  font-size: calc(15px * var(--ts));
  line-height: 1.7;
  color: #8a641d;
}
.support-prep-note p + p { margin-top: 8px; }
.support-prep-wrap .support-ctas {
  max-width: 860px;
  margin: 22px auto 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  text-align: center;
}
.support-prep-wrap .support-ctas .btn-primary { margin-inline-end: 0; }
@media (max-width: 767.98px) {
  .support-prep-head { margin-bottom: 26px; }
  .support-prep-grid { grid-template-columns: 1fr; }
  .support-prep-card { padding: 22px; }
  .support-prep-note { flex-direction: column; }
}
:root[data-textsize="xlarge"] .support-prep-grid { grid-template-columns: 1fr; }

/* ============ 编号行 ============ */
.num-rows { margin: 0 0 18px; }
.num-row {
  display: flex;
  flex-direction: var(--rowDir);
  gap: 20px;
  padding: 22px 0;
  border-top: 1px solid var(--bd);
}
.num-row-n {
  flex: 0 0 var(--numW);
  font: 700 calc(19px * var(--hs))/1 ui-monospace, SFMono-Regular, Menlo, monospace;
  color: var(--t3);
}
.num-row-body { flex: 1; min-width: 0; }
.row-title {
  margin: 0 0 8px;
  font-size: calc(19px * var(--ts));
  line-height: 1.45;
  font-weight: 600;
}
.row-body {
  margin: 0;
  font-size: calc(16px * var(--ts));
  line-height: 1.75;
  color: var(--t2);
  max-width: 42em;
}
.row-body--gap { margin-bottom: 10px; }
.row-sub {
  margin: 0;
  font-size: calc(15px * var(--ts));
  line-height: 1.6;
  color: var(--t3);
  max-width: 42em;
}

/* ============ 步骤 ============ */
.steps {
  list-style: none;
  margin: 0 0 18px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--gap3);
}
.step { scroll-margin-top: calc(var(--hdrH) + 12px); border-inline-start: 2px solid var(--bd); padding-inline-start: 24px; }
.step-kicker {
  display: block;
  font: 600 12px/1 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .08em;
  color: var(--acText);
  margin-bottom: 12px;
}
.step-title {
  margin: 0 0 14px;
  font-size: calc(var(--h3) * var(--hs));
  line-height: 1.3;
  font-weight: 600;
}
.step-body {
  margin: 0 0 16px;
  font-size: calc(var(--legalBody) * var(--ts));
  line-height: 1.8;
  color: var(--t2);
  max-width: 44em;
}
.step-list {
  margin: 0 0 16px;
  padding-inline-start: 22px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: calc(16px * var(--ts));
  line-height: 1.7;
  color: var(--t2);
}
.step .note--ok, .step .note { margin-top: 16px; }

/* ============ 卡片 ============ */
.card { padding: 22px; border-radius: 16px; background: var(--sf); border: var(--ctrlBw) solid var(--bd); }
.card-title {
  margin: 0 0 10px;
  font-size: calc(19px * var(--ts));
  line-height: 1.45;
  font-weight: 600;
}
.card-body { margin: 0 0 10px; font-size: calc(16px * var(--ts)); line-height: 1.75; color: var(--t2); }
.card-next { margin: 0; font-size: calc(15px * var(--ts)); line-height: 1.6; color: var(--t3); }
.card-next b { font-weight: 600; }

.rel-card {
  padding: 24px;
  border-radius: 20px;
  background: var(--sf);
  border: var(--ctrlBw) solid var(--bd);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.rel-title { margin: 0; font-size: calc(19px * var(--ts)); line-height: 1.45; font-weight: 600; }
.rel-card p { margin: 0; flex: 1; font-size: calc(16px * var(--ts)); line-height: 1.7; color: var(--t2); }
.rel-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: calc(44px * var(--cs));
  font-size: calc(16px * var(--ts));
  font-weight: 600;
  color: var(--lk);
  text-decoration: none;
}

/* ============ 占位资源（截图 / 视频 / 二维码） ============ */
.shot-ph {
  width: 100%;
  max-width: var(--shotW);
  aspect-ratio: 16/10;
  border-radius: 24px;
  background: repeating-linear-gradient(135deg, var(--phBg1) 0 12px, var(--phBg2) 12px 24px);
  border: 1px solid var(--bd);
  display: grid;
  place-items: center;
  text-align: center;
  padding: 20px;
  margin: 0 0 18px;
}
.shot-ph span { font: 400 12px/1.7 ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--t3); }
.video-ph {
  width: 100%;
  aspect-ratio: 16/9;
  border-radius: 24px;
  background: repeating-linear-gradient(135deg, var(--phBg1) 0 12px, var(--phBg2) 12px 24px);
  border: 1px solid var(--bd);
  display: grid;
  place-items: center;
  text-align: center;
  padding: 20px;
}
.video-ph span { font: 400 12px/1.7 ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--t3); }
.qr-ph {
  width: 150px;
  height: 150px;
  border-radius: 20px;
  background: var(--dsfr);
  border: var(--ctrlBw) solid var(--dbd2);
  display: grid;
  place-items: center;
  text-align: center;
  padding: 14px;
}
.qr-ph span { font: 400 11px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--d3); }

/* 发布态媒体资产：保留原 `.shot-ph` / `.video-ph` / `.qr-ph` 尺寸约束，
   但内容由本地 PNG 呈现，避免页面显示设计期占位说明。 */
.shot-ph.has-media,
.video-ph.has-media,
.art-dark.has-media,
.hw-screen.has-media,
.hw-player.has-media,
.vd-ph.has-media,
.vsel-thumb.has-media,
.gs-vcard-cover.has-media {
  position: relative;
  overflow: hidden;
  padding: 0;
  background: var(--phBg1);
}

.shot-ph.has-media .media-img,
.video-ph.has-media .media-img,
.art-dark.has-media .media-img,
.hw-screen.has-media .media-img,
.hw-player.has-media .media-img,
.vd-ph.has-media .media-img,
.vsel-thumb.has-media .media-img,
.gs-vcard-cover.has-media .media-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}

.qr-ph.has-media {
  overflow: hidden;
  padding: 10px;
  background: #fff;
  border-color: var(--dbd2);
}

.qr-ph.has-media .media-img--qr {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 10px;
}

.video-ph.has-media[data-video-status="pending"],
.hw-player.has-media[data-video-status="pending"],
button.video-ph.has-media[data-video-status="pending"] {
  cursor: default;
}

button.video-ph.has-media[disabled] {
  color: inherit;
}

.video-ph.has-media .media-badge,
.hw-player.has-media .media-badge {
  position: absolute;
  inset-inline-start: 16px;
  bottom: 16px;
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  padding: 0 12px;
  border-radius: 10px;
  background: rgba(11, 18, 32, .82);
  color: #f8fafc;
  border: 1px solid rgba(148, 163, 184, .45);
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
}

[data-contrast="high"] .brand-mark,
[data-contrast="high"] .foot-mark {
  background-image: none;
  border: 1px solid ButtonBorder;
  color: CanvasText;
}

/* ============ 诊断树 ============ */
.tree-card {
  padding: 24px;
  border-radius: 20px;
  background: var(--sf);
  border: var(--ctrlBw) solid var(--bd);
  max-width: 900px;
  margin: 0 0 18px;
}
.tree, .tree ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.tree ul { padding-inline-start: 22px; margin-top: 10px; border-inline-start: 1px solid var(--bd); }
.tree-item {
  display: flex;
  gap: 10px;
  align-items: baseline;
  font-size: calc(16px * var(--ts));
  line-height: 1.7;
  color: var(--t2);
  font-weight: 400;
}
.tree-item .tree-b { flex: none; color: var(--t3); }
.tree-item--action { color: var(--acText); font-weight: 600; }

/* ============ 支持 CTA ============ */
.support-ctas {
  margin: 0 0 16px;
  font-size: calc(var(--legalBody) * var(--ts));
  line-height: 1.8;
  color: var(--t2);
  max-width: 44em;
}
.support-ctas .btn-primary { margin-inline-end: 12px; }
.support-mail {
  display: inline-flex;
  align-items: center;
  min-height: calc(44px * var(--cs));
  font-size: calc(16px * var(--ts));
  font-weight: 600;
  color: var(--lk);
}

/* ============ 底部 CTA ============ */
.cta-sec { background: var(--dbg); color: var(--d1); padding: var(--sy) var(--px); }
.cta-inner {
  max-width: var(--container-content);
  margin: 0 auto;
  display: flex;
  flex-direction: var(--panelDir);
  gap: var(--panelGap);
  align-items: var(--rowAlign);
}
.cta-main { flex: 1 1 62%; min-width: 0; }
.cta-title {
  margin: 0 0 18px;
  font-size: calc(var(--h2) * var(--hs));
  line-height: 1.18;
  font-weight: 700;
  letter-spacing: -.015em;
}
.cta-lead {
  margin: 0 0 30px;
  font-size: calc(var(--bodyL) * var(--ts));
  line-height: 1.7;
  color: var(--d2);
  max-width: 34em;
}
.cta-btns { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }
.cta-qr { flex: 1 1 38%; min-width: 0; display: var(--qrD); flex-direction: column; align-items: center; gap: 14px; }
.qr-cap { margin: 0; font-size: calc(14px * var(--ts)); color: var(--d2); text-align: center; }

/* ============ 页脚 ============ */
.site-footer {
  background: var(--dbg2);
  color: var(--d2);
  padding: var(--sy2) var(--px) 40px;
  border-top: 1px solid var(--dbd);
}
.foot-inner { max-width: var(--container-content); margin: 0 auto; }
.foot-grid { display: grid; grid-template-columns: var(--footCols); gap: 40px; margin-bottom: 48px; }
.foot-brand-row { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.foot-mark {
  width: 28px;
  height: 28px;
  border-radius: 9px;
  border: 0;
  background: #172554 url("/assets/images/shared/icons/hams-app-icon-header.png") center/cover no-repeat;
  display: grid;
  place-items: center;
  font: 700 12px/1 ui-monospace, Menlo, monospace;
  color: transparent;
  overflow: hidden;
}
.foot-brand-name { font-size: calc(19px * var(--ts)); font-weight: 700; color: var(--d1); }
.foot-tag { margin: 0; font-size: calc(15px * var(--ts)); line-height: 1.6; color: var(--d3); max-width: 22em; }
.foot-col-title {
  margin: 0 0 14px;
  font-size: calc(14px * var(--ts));
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--d3);
}
.foot-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  font-size: calc(15px * var(--ts));
}
.foot-list a {
  display: flex;
  align-items: center;
  min-height: calc(44px * var(--cs));
  color: var(--d2);
  text-decoration: none;
}
.foot-list a.foot-email {
  color: var(--dlk);
  font: 400 14px/1.5 ui-monospace, Menlo, monospace;
  direction: ltr;
  unicode-bidi: isolate;
}
.foot-list a.foot-play { color: var(--dlk); }
.foot-lang-current { color: var(--d1); }
.foot-bottom {
  border-top: 1px solid var(--dbd);
  padding-top: 24px;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: space-between;
  align-items: center;
}
.foot-bottom p { margin: 0; font-size: calc(13px * var(--ts)); color: var(--d3); }
.mono-inline { font-family: ui-monospace, Menlo, monospace; direction: ltr; unicode-bidi: isolate; }

/* ============ 移动端固定 CTA ============ */
.sticky-cta {
  position: fixed;
  inset-inline: 0;
  bottom: 0;
  z-index: 100;
  padding: 12px 20px calc(12px + env(safe-area-inset-bottom));
  background: rgba(11, 18, 32, .92);
  backdrop-filter: blur(12px);
  border-top: 1px solid #263247;
  display: none;
}
.sticky-cta a:not(.gp-badge-link) {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: calc(56px * var(--cs));
  background: var(--brand);
  color: #fff;
  border-radius: 12px;
  font-size: calc(17px * var(--ts));
  font-weight: 600;
  text-decoration: none;
}
.gp-badge-link--sticky {
  min-height: 0;
  background: transparent;
  border-radius: 8px;
}
@media (max-width: 767.98px) {
  .sticky-cta.is-visible { display: block; }
}
