@charset "UTF-8";
/* ============================================================================
   refine.css — 视觉精修层（Design Refinement Layer）
   ----------------------------------------------------------------------------
   定位：加载于全部既有样式之后，只做「视觉表现」覆盖，不改任何布局逻辑、
        不引入图片 / 字体 / JS 请求。目标是消除模板化的 AI 生成感，建立
        「机房规格书」式的编辑设计语言：克制的墨色、极细的发丝线、等宽数据、
        有节奏的留白、只用于强调单一色的注意力经济。

   约定：
   1) 一律使用 body:not(.market-page) 前缀，与既有样式同层级但后加载取胜；
      应用市场（.market-page）是独立设计体系，不在此层覆盖范围内。
   2) 所有动效仅使用 transform / opacity，不触发布局与重绘。
   3) 不新增 will-change 常驻；只在 hover 瞬间提升合成层。
   ========================================================================== */

/* ---------------------------------------------------------------------------
   1. 设计令牌
   ------------------------------------------------------------------------ */
:root {
  /* 纸与墨 —— 不用纯白纯黑，减少刺眼、增加"印刷"质感 */
  --rf-paper: #fafaf9;
  --rf-paper-2: #f4f4f1;
  --rf-paper-3: #eeeeeb;
  --rf-ink: #0d1016;
  --rf-ink-2: #171b22;
  --rf-dark: #0a0d12;
  --rf-dark-2: #101419;

  /* 文本阶梯：四档足够，避免灰阶过多导致"发虚" */
  --rf-text: #2e343c;
  --rf-text-2: #59606b;
  --rf-text-3: #878e98;
  --rf-text-inv: #f4f6f8;
  --rf-text-inv-2: rgba(244, 246, 248, .68);
  --rf-text-inv-3: rgba(244, 246, 248, .44);

  /* 发丝线 —— 全部用半透明，叠在任何底色上都不脏 */
  --rf-line: rgba(13, 16, 22, .11);
  --rf-line-soft: rgba(13, 16, 22, .065);
  --rf-line-faint: rgba(13, 16, 22, .04);
  --rf-line-inv: rgba(255, 255, 255, .12);
  --rf-line-inv-soft: rgba(255, 255, 255, .07);

  /* 品牌色：保留原有蓝，但只作为"注意力货币"低频使用 */
  --rf-blue: #165dff;
  --rf-blue-deep: #0b46d6;
  --rf-blue-soft: rgba(22, 93, 255, .07);
  --rf-blue-line: rgba(22, 93, 255, .22);
  --rf-amber: #96631c;

  /* 字体：中文走系统栈（零请求），数字与代码走系统等宽栈（零请求） */
  --rf-sans: "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  --rf-mono: ui-monospace, "SFMono-Regular", "SF Mono", "JetBrains Mono", Menlo, Consolas, "Liberation Mono", monospace;

  /* 动效曲线：起步快、收尾长，比 ease 更"贵" */
  --rf-ease: cubic-bezier(.22, .61, .24, 1);
  --rf-ease-out: cubic-bezier(.16, 1, .3, 1);

  /* 阴影：双层结构 —— 近距离硬边定形，远距离软边给体积 */
  --rf-shadow-1: 0 1px 2px rgba(13, 16, 22, .045), 0 10px 26px -14px rgba(13, 16, 22, .18);
  --rf-shadow-2: 0 2px 4px rgba(13, 16, 22, .05), 0 20px 44px -18px rgba(13, 16, 22, .26);
  --rf-shadow-inv: 0 24px 60px -24px rgba(0, 0, 0, .7);
}

/* ---------------------------------------------------------------------------
   2. 基础排版
   ------------------------------------------------------------------------ */
body:not(.market-page) {
  background: var(--rf-paper);
  color: var(--rf-text);
  font-family: var(--rf-sans);
  font-size: 15px;
  line-height: 1.78;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-kerning: normal;
}

/* 中文标题不做 700/800：中黑体粗到 700 以上笔画会粘连，反而显廉价。
   改为 600 + 负字距，是印刷品里"标题"的密度。 */
body:not(.market-page) h1,
body:not(.market-page) h2,
body:not(.market-page) h3,
body:not(.market-page) h4 {
  font-weight: 600;
  letter-spacing: -.018em;
  color: var(--rf-ink);
}

body:not(.market-page) p {
  color: var(--rf-text-2);
}

/* 数字一律等宽对齐：价格、统计、规格列才能"对得上"，这是规格书的核心细节 */
body:not(.market-page) .ccs-plan-card-price,
body:not(.market-page) .ccd-price,
body:not(.market-page) .ccd-stat strong,
body:not(.market-page) .lp-plan-price,
body:not(.market-page) .lp-adv-num,
body:not(.market-page) .lp-feature-num {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

/* ---------------------------------------------------------------------------
   3. 顶部导航
   原来这里只调了字号和颜色，实际页面还是「蓝色下划线 + 蓝色圆角按钮」——
   因为 overrides.css / design-system.css 里那几条的选择器更具体
   （如 body:not(.support-page) .site-header .nav-actions .signup 是 0,4,1），
   旧规则压不住。这次统一按站内的纸色 / 墨色 / 发丝线 / 方角重写，
   并把特异性提到 0,4,x 以上。
   ------------------------------------------------------------------------ */
body:not(.market-page) .site-header {
  background: rgba(250, 250, 249, .92);
  border-bottom: 1px solid var(--rf-line);
  box-shadow: none;
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  backdrop-filter: blur(14px) saturate(140%);
}

body:not(.market-page) .nav-inner {
  border-bottom: 0;
}

/* ---- 菜单项：默认墨灰，悬停/选中收深到墨色 ---- */
body:not(.market-page) .site-header .primary-nav .nav-link,
body:not(.market-page) .site-header .primary-nav .nav-menu-trigger,
body:not(.market-page) .site-header .primary-nav .nav-label {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .015em;
  color: var(--rf-text);
  transition: color 160ms var(--rf-ease);
}

body:not(.market-page) .site-header .primary-nav .nav-link:hover,
body:not(.market-page) .site-header .primary-nav .nav-link:focus-visible,
body:not(.market-page) .site-header .primary-nav .nav-link.is-current,
body:not(.market-page) .site-header .primary-nav .nav-item.is-current > .nav-link,
body:not(.market-page) .site-header .primary-nav .nav-item.is-open > .nav-menu-trigger {
  color: var(--rf-ink);
}

/* 状态指示：底部蓝线 + 色块叠在一起会读成两个指标，改成单一体系——
   块面表示"可点/在悬停"，左侧 2px 墨条表示"当前"，
   和巨型菜单里的选中标签（左条 + 白底）同构，整站只有一种选中语言。 */
body:not(.market-page) .site-header .nav-link .nav-label::after {
  display: none;
}

body:not(.market-page) .site-header .primary-nav .nav-link::before {
  content: "";
  position: absolute;
  left: -9px;
  right: -9px;
  top: 50%;
  height: 28px;
  translate: 0 -50%;
  border-radius: 2px;
  background-color: var(--rf-paper-2);
  opacity: 0;
  transition: opacity 150ms var(--rf-ease), background-color 150ms var(--rf-ease);
  pointer-events: none;
}

body:not(.market-page) .site-header .primary-nav .nav-link:hover::before,
body:not(.market-page) .site-header .primary-nav .nav-link:focus-visible::before,
body:not(.market-page) .site-header .primary-nav .nav-item.is-open > .nav-menu-trigger::before {
  opacity: 1;
}

body:not(.market-page) .site-header .primary-nav .nav-link.is-current::before,
body:not(.market-page) .site-header .primary-nav .nav-item.is-current > .nav-link::before,
body:not(.market-page) .site-header .primary-nav .nav-item.is-open > .nav-menu-trigger::before {
  opacity: 1;
  background-color: #fff;
  box-shadow: inset 0 0 0 1px var(--rf-line-soft);
  background-image: linear-gradient(var(--rf-ink), var(--rf-ink));
  background-size: 2px 14px;
  background-position: 0 50%;
  background-repeat: no-repeat;
}

/* 展开态时，其它项保持墨色而不是蓝色 */
body:not(.market-page) .primary-nav.has-open-menu .nav-entry.is-current:not(:hover),
body:not(.market-page) .primary-nav.has-open-menu .nav-item.is-current:not(.is-open) > .nav-link {
  color: var(--rf-ink);
}

/* 折叠箭头：细一号，方角 */
body:not(.market-page) .site-header .nav-chevron {
  width: 6px;
  height: 6px;
  margin-top: -3px;
  border-right-width: 1.3px;
  border-bottom-width: 1.3px;
  border-color: currentColor;
  transform-origin: 60% 60%;
}

/* 键盘焦点：保留蓝色描边（焦点环用强调色是惯例），只把粗细收一点 */
body:not(.market-page) .site-header .nav-link:focus-visible,
body:not(.market-page) .site-header .nav-dropdown-link:focus-visible {
  outline: 1.5px solid var(--rf-blue);
  outline-offset: 4px;
}

/* ---- 登录按钮：墨色方角实体按钮 ---- */
body:not(.market-page) .site-header .nav-actions .signup,
body:not(.market-page) .site-header .nav-actions .site-header-register,
body:not(.market-page) .site-header .nav-actions a[href="/login"] {
  width: auto;
  min-width: 0;
  height: 36px;
  padding: 0 18px;
  border-radius: 2px;
  background: var(--rf-ink);
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .04em;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .16),
    0 1px 2px rgba(13, 16, 22, .16);
  transition:
    background-color 160ms var(--rf-ease),
    transform 160ms var(--rf-ease),
    box-shadow 160ms var(--rf-ease);
}

body:not(.market-page) .site-header .nav-actions .signup:hover,
body:not(.market-page) .site-header .nav-actions .site-header-register:hover,
body:not(.market-page) .site-header .nav-actions a[href="/login"]:hover {
  background: #1b212a;
  color: #fff;
  transform: translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .2),
    0 6px 14px -6px rgba(13, 16, 22, .5);
}

/* 按钮里补一枚 12px 箭头：站内 CTA（如「查看机型与价格 →」）本来就有箭头语言，
   这里用 mask 画，不新增标记与请求；悬停时箭头右移 2px。 */
body:not(.market-page) .site-header .nav-actions .signup::after,
body:not(.market-page) .site-header .nav-actions a[href="/login"]::after {
  content: "";
  width: 12px;
  height: 12px;
  margin-left: 8px;
  flex: none;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h13M12 5l7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h13M12 5l7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat;
  transition: translate 180ms var(--rf-ease);
}

body:not(.market-page) .site-header .nav-actions .signup:hover::after,
body:not(.market-page) .site-header .nav-actions a[href="/login"]:hover::after {
  translate: 2px 0;
}

body:not(.market-page) .site-header .nav-actions .signup:active,
body:not(.market-page) .site-header .nav-actions a[href="/login"]:active {
  transform: none;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12);
}

/* ---- 移动端汉堡：三根线改成发丝线，间距收紧 ---- */
@media (max-width: 1180px) {
  body:not(.market-page) .site-header .menu-toggle {
    padding: 10px;
  }

  body:not(.market-page) .site-header .menu-toggle span {
    width: 20px;
    height: 1.5px;
    margin: 4px 0;
    border-radius: 0;
    background: var(--rf-ink);
  }
}

/* ---- 移动端抽屉：按钮与关闭控件跟着头部一起收成墨色方角 ---- */
body:not(.market-page) .site-mobile-drawer .nav-actions .signup {
  height: 42px;
  border-radius: 2px;
  background: var(--rf-ink);
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .04em;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .16),
    0 1px 2px rgba(13, 16, 22, .16);
}

body:not(.market-page) .site-mobile-drawer .site-mobile-drawer-close {
  width: 38px;
  height: 38px;
  border: 1px solid var(--rf-line);
  border-radius: 2px;
  background: transparent;
  color: var(--rf-ink);
}

body:not(.market-page) .site-mobile-drawer .site-mobile-drawer-close:hover {
  border-color: var(--rf-ink);
}

/* ============================================================================
   3b. 云产品巨型菜单（只在桌面 ≥1181px 生效，与 overrides.css 同断点）
   原来：蓝色渐变左轨 + 7~10px 圆角 + 蓝色悬停底。
   现在：纸色面板 + 发丝线分栏 + 方角 + 等宽编号，和正文的规格书语言一致。
   ========================================================================== */
@media (min-width: 1181px) {
  body:not(.market-page) .site-header .nav-item.is-mega > .nav-dropdown {
    background: #fff;
    border-top: 1px solid var(--rf-line);
    box-shadow: 0 28px 52px -34px rgba(13, 16, 22, .5);
  }

  /* 站点主体是 1480 固定宽；面板内层沿用这个宽度时，在 1181~1480 的窗口里
     右侧两列会被裁掉。这里让内层不超过视口，列按可用宽度收缩。 */
  body:not(.market-page) .site-header .nav-mega-inner {
    width: min(var(--fixed-width), 100%);
  }

  /* 左轨：去掉渐变和圆角，改发丝竖线与面板分栏 */
  body:not(.market-page) .site-header .nav-mega-rail {
    align-self: stretch;
    padding: 16px 20px 14px 0;
    border-radius: 0;
    border-right: 1px solid var(--rf-line);
    background: var(--rf-paper-2);
  }

  body:not(.market-page) .site-header .nav-mega-eyebrow {
    position: relative;
    margin: 0 0 14px;
    padding-left: 12px;
    font-family: var(--rf-mono);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .18em;
    color: var(--rf-text-3);
  }

  body:not(.market-page) .site-header .nav-mega-eyebrow::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 4px;
    height: 4px;
    translate: 0 -50%;
    background: var(--rf-blue);
  }

  body:not(.market-page) .site-header .nav-mega-tabs {
    gap: 2px;
  }

  body:not(.market-page) .site-header .nav-mega-tab {
    height: 34px;
    padding: 0 12px;
    border-radius: 2px;
    color: var(--rf-text-2);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: .01em;
  }

  body:not(.market-page) .site-header .nav-mega-tab:hover {
    color: var(--rf-ink);
    background: var(--rf-paper-2);
  }

  body:not(.market-page) .site-header .nav-mega-tab.is-active {
    position: relative;
    color: var(--rf-ink);
    font-weight: 600;
    background: #fff;
    box-shadow: inset 0 0 0 1px var(--rf-line-soft);
  }

  body:not(.market-page) .site-header .nav-mega-tab.is-active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 2px;
    height: 13px;
    translate: 0 -50%;
    background: var(--rf-ink);
  }

  body:not(.market-page) .site-header .nav-mega-all {
    border-top-color: var(--rf-line-soft);
  }

  body:not(.market-page) .site-header .nav-mega-all-title {
    color: var(--rf-ink);
    font-size: 13px;
  }

  body:not(.market-page) .site-header .nav-mega-all-desc {
    color: var(--rf-text-3);
  }

  body:not(.market-page) .site-header .nav-mega-all-arrow {
    color: var(--rf-ink);
  }

  body:not(.market-page) .site-header .nav-mega-all:hover {
    color: var(--rf-ink);
  }

  /* 列标题前加等宽编号（01/02/03…），像规格书的栏目索引 */
  body:not(.market-page) .site-header .nav-mega-panel {
    counter-reset: mega-col;
  }

  body:not(.market-page) .site-header .nav-mega-col {
    counter-increment: mega-col;
  }

  body:not(.market-page) .site-header .nav-mega-col-title {
    color: var(--rf-ink);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .06em;
  }

  body:not(.market-page) .site-header .nav-mega-col-title::before {
    content: counter(mega-col, decimal-leading-zero);
    margin-right: 8px;
    font-family: var(--rf-mono);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .08em;
    color: var(--rf-text-3);
  }

  /* 列之间补发丝竖线 */
  body:not(.market-page) .site-header .nav-mega-col + .nav-mega-col {
    border-left: 1px solid var(--rf-line);
    padding-left: 20px;
  }

  body:not(.market-page) .site-header .nav-mega-link {
    border-radius: 2px;
    transition: background-color 140ms var(--rf-ease);
  }

  body:not(.market-page) .site-header .nav-mega-link-title {
    color: var(--rf-ink);
    font-size: 13.5px;
  }

  body:not(.market-page) .site-header .nav-mega-link-desc {
    color: var(--rf-text-3);
    font-size: 11.5px;
    line-height: 1.6;
  }

  body:not(.market-page) .site-header .nav-mega-link:hover {
    background: var(--rf-paper-2);
  }

  body:not(.market-page) .site-header .nav-mega-link:hover .nav-mega-link-title {
    color: var(--rf-ink);
  }

  body:not(.market-page) .site-header .nav-mega-link:hover .nav-mega-link-desc {
    color: var(--rf-text-2);
  }
}

/* ---------------------------------------------------------------------------
   4. 首屏 Hero —— 从"3D 视频插画"改为"暗色机房规格"
   ------------------------------------------------------------------------ */
body:not(.market-page) .hero {
  height: 640px;
  background: #090c11;
  overflow: hidden;
}

/* 原两侧的模糊色团是纯 CSS 画的氛围光斑；改用真实机房摄影后
   不需要再用色块"模拟"光，直接撤掉，避免和照片里的冷光打架。 */
body:not(.market-page) .hero::before,
body:not(.market-page) .hero::after {
  display: none;
}

/* 视频层整体停用：1.39MB 主视频 + 4 段交互视频的解码开销归零，
   改由一张 143KB 的 WebP 机房实拍承担首屏主视觉。 */
body:not(.market-page) .hero-media-frame {
  display: block;
  top: 0;
  left: 0;
  right: 0;
  width: auto;
  background: #090c11 url("/site/assets/img/hero/data-hall.webp") center 44% / cover no-repeat;
  /* 只做轻微提亮，让最靠近镜头的机柜细节能读出来；饱和降一档避免"科技蓝"太艳 */
  filter: brightness(1.12) saturate(.86) contrast(1.02);
  -webkit-mask-image: linear-gradient(100deg, transparent 0%, rgba(0, 0, 0, .3) 13%, #000 40%, #000 100%);
  mask-image: linear-gradient(100deg, transparent 0%, rgba(0, 0, 0, .3) 13%, #000 40%, #000 100%);
}

body:not(.market-page) .hero-media-frame .hero-video,
body:not(.market-page) .hero-media-frame .gpu-interaction-zone,
body:not(.market-page) .hero-media-frame .server-room-interaction-zone,
body:not(.market-page) .hero-media-frame .cabinet-interaction-zone,
body:not(.market-page) .hero-media-frame .panel-interaction-zone {
  display: none !important;
}

body:not(.market-page) .hero-overlay {
  /* 全宽铺满：原规则把 overlay 限制在 1480px 画布里并右对齐，
     宽屏（≥1920）时左侧会漏出一段没有遮罩的亮图，压住标题。 */
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: auto;
  height: auto;
  background:
    linear-gradient(90deg, #090c11 0%, rgba(9, 12, 17, .94) 27%, rgba(9, 12, 17, .56) 47%, rgba(9, 12, 17, .08) 70%, transparent 88%),
    linear-gradient(180deg, rgba(9, 12, 17, .62) 0%, rgba(9, 12, 17, .1) 20%, transparent 62%, rgba(9, 12, 17, .88) 100%);
}

body:not(.market-page) .hero-inner {
  height: 640px;
}

body:not(.market-page) .hero-copy {
  width: 660px;
  margin-top: 8px;
}

body:not(.market-page) .hero .hero-inner .hero-copy h1 {
  margin: 0 0 24px;
  color: #f6f8fa;
  font-size: clamp(38px, 3.1vw, 54px);
  font-weight: 600;
  line-height: 1.14;
  letter-spacing: -.028em;
  text-wrap: balance;
}

/* 标题上方的一行等宽标签，替代原来的彩色 eyebrow */
body:not(.market-page) .hero-copy::before {
  content: "SELF-OWNED DATA HALL  /  17 NODES";
  display: block;
  margin-bottom: 22px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(255, 255, 255, .14);
  width: fit-content;
  padding-right: 40px;
  color: rgba(244, 246, 248, .5);
  font-family: var(--rf-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .14em;
  line-height: 1;
}

body:not(.market-page) .hero .hero-inner .hero-copy p {
  max-width: 560px;
  margin: 0 0 34px;
  color: rgba(244, 246, 248, .72);
  font-size: 15.5px;
  line-height: 1.82;
}

/* 主按钮：白底深字，在暗场里是最亮的一块，注意力只给一个点 */
body:not(.market-page) .hero-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 52px;
  padding: 0 28px;
  border-radius: 2px;
  background: #fff;
  color: #0b0e13;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .01em;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 16px 32px -16px rgba(0, 0, 0, .8);
  transition: transform 200ms var(--rf-ease), box-shadow 200ms var(--rf-ease), background-color 200ms var(--rf-ease);
}

body:not(.market-page) .hero-cta:hover {
  background: #fff;
  transform: translateY(-2px);
  box-shadow: 0 2px 4px rgba(0, 0, 0, .3), 0 22px 40px -18px rgba(0, 0, 0, .9);
}

body:not(.market-page) .hero-cta::after {
  content: "→";
  font-size: 15px;
  line-height: 1;
  transition: transform 200ms var(--rf-ease);
}

body:not(.market-page) .hero-cta:hover::after {
  transform: translateX(3px);
}

/* ---------------------------------------------------------------------------
   5. 优势卡（首屏下方压边卡片）
   ------------------------------------------------------------------------ */
body:not(.market-page) .highlights {
  margin-top: -96px;
}

body:not(.market-page) .highlight-grid {
  gap: 0;
  border: 1px solid var(--rf-line-soft);
  border-radius: 3px;
  background: #fff;
  box-shadow: 0 2px 6px rgba(13, 16, 22, .05), 0 30px 60px -30px rgba(13, 16, 22, .35);
  overflow: hidden;
}

/* 四张卡合成一条"规格条"：用发丝竖线分隔，而不是四块浮起的圆角块 */
body:not(.market-page) .tilt-card-shell {
  perspective: none;
  height: auto;
  min-height: 132px;
}

body:not(.market-page) .tilt-card-shell + .tilt-card-shell {
  border-left: 1px solid var(--rf-line-soft);
}

/* 规格条本身就是一个整体信息块，不需要逐卡淡入。
   更重要的是：入场观察器只在进入"视口底部上方 24%"时才加 is-scroll-visible，
   而这条规格条首屏就当在 hero 下缘——窗口高度 760px 左右时会停在 opacity:0，
   露出一整条空白白板。这里直接常显，同时也少跑 4 个动画。 */
body:not(.market-page) .highlights .scroll-reveal,
body:not(.market-page) .highlights .scroll-reveal.is-scroll-visible {
  opacity: 1;
  translate: none;
  animation: none !important;
}

/* 同一类问题：优势区的标题层与整块布局层也是 scroll-reveal，
   但这一区高 1050px，观察器用 rootMargin:-24% + threshold:1% 才触发——
   视口较高（或首屏就把它带进来）时它整块停在 opacity:0，
   打开页面看到的是 1050px 宽的空白纸色带。这里同样直接常显。 */
body:not(.market-page) .product-advantages .scroll-reveal,
body:not(.market-page) .product-advantages .scroll-reveal.is-scroll-visible {
  opacity: 1;
  translate: none;
  animation: none !important;
}

body:not(.market-page) .highlight-card {
  height: auto;
  min-height: 132px;
  padding: 26px 24px;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 16px;
  border: 0;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
  transform: none !important;
  transform-style: flat;
  will-change: auto;
  transition: background-color 200ms var(--rf-ease);
}

/* 图标从「蓝色渐变圆角块」改为无底色的单线条墨稿：
   原来每张卡都有一个高饱和色块，四个并排时视觉噪声很大。 */
body:not(.market-page) .highlight-card-icon {
  width: 44px;
  height: 44px;
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: var(--rf-ink);
}

body:not(.market-page) .highlight-card-icon img {
  width: 26px;
  height: 26px;
  /* 原图是白色描边图标，压成墨色后才能落在白底上 */
  filter: brightness(0) opacity(.72);
}

body:not(.market-page) .highlight-card:hover .highlight-card-icon img {
  filter: brightness(0) opacity(1);
}

body:not(.market-page) .highlight-card:hover {
  background: #fcfcfb;
}

body:not(.market-page) .highlight-card > div {
  transform: none;
}

body:not(.market-page) .highlight-card h2 {
  margin: 0 0 6px;
  font-size: 15.5px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: -.01em;
  color: var(--rf-ink);
  white-space: normal;
  transform: none;
  text-shadow: none;
}

body:not(.market-page) .highlight-card p {
  font-size: 12px;
  line-height: 1.66;
  color: var(--rf-text-3);
  white-space: normal;
  text-wrap: balance;
  transform: none;
}

/* ---------------------------------------------------------------------------
   6. 公告条
   ------------------------------------------------------------------------ */
body:not(.market-page) .home-notice {
  margin-top: 56px;
  border-top: 1px solid var(--rf-line-soft);
  border-bottom: 1px solid var(--rf-line-soft);
  background: transparent;
}

/* ---------------------------------------------------------------------------
   7. 区块标题：去掉圆点装饰，改为"编号 + 细线"的编辑排版
   ------------------------------------------------------------------------ */
body:not(.market-page) .section-title-v10__dots,
body:not(.market-page) .advantages-dots,
body:not(.market-page) .section-title-v10 > h2::before,
body:not(.market-page) .section-title-v10 > h2::after {
  display: none !important;
}

body:not(.market-page) .section-title-v10 > h2,
body:not(.market-page) .section-title-v10__row h2 {
  font-size: clamp(26px, 2vw, 34px);
  font-weight: 600;
  line-height: 1.28;
  letter-spacing: -.022em;
  color: var(--rf-ink);
}

body:not(.market-page) .section-title-v10 > p:last-child {
  color: var(--rf-text-3);
  font-size: 13.5px;
  line-height: 1.7;
}

/* ---------------------------------------------------------------------------
   8. 产品区（机型卡片网格）
   ------------------------------------------------------------------------ */
body:not(.market-page) .ccs-showcase {
  background: var(--rf-paper);
}

body:not(.market-page) .ccs-tabs {
  justify-content: flex-start;
  gap: 0;
  border-bottom: 1px solid var(--rf-line);
}

body:not(.market-page) .ccs-tab {
  padding: 0 22px 14px;
  border-radius: 0;
  background: none;
  color: var(--rf-text-2);
  font-size: 14px;
  font-weight: 500;
}

body:not(.market-page) .ccs-tab:first-child {
  padding-left: 0;
}

body:not(.market-page) .ccs-tab::after {
  height: 1.5px;
  background: var(--rf-ink);
}

body:not(.market-page) .ccs-tab.is-active {
  color: var(--rf-ink);
  font-weight: 600;
}

/* 二级标签：从蓝色胶囊改为"方角描边"，选中用极浅蓝底而不是整块实色 */
body:not(.market-page) .ccs-subtab,
body:not(.market-page) .ccs-plans-more {
  border-radius: 2px;
  border: 1px solid var(--rf-line);
  background: #fff;
  color: var(--rf-text-2);
  font-size: 12.5px;
  font-weight: 500;
  line-height: 30px;
  padding: 0 13px;
  box-shadow: none;
  transition: border-color 160ms var(--rf-ease), color 160ms var(--rf-ease), background-color 160ms var(--rf-ease);
}

body:not(.market-page) .ccs-subtab:hover {
  border-color: var(--rf-line-strong, rgba(13, 16, 22, .2));
  color: var(--rf-ink);
}

body:not(.market-page) .ccs-subtab.is-active {
  border-color: var(--rf-ink);
  background: var(--rf-ink);
  color: #fff;
  font-weight: 500;
}

body:not(.market-page) .ccs-subtab-count {
  color: var(--rf-text-3);
  font-family: var(--rf-mono);
  font-size: 11px;
}

body:not(.market-page) .ccs-subtab.is-active .ccs-subtab-count {
  color: rgba(255, 255, 255, .55);
}

/* 机型卡：发丝边框 + 单层浅影，hover 只抬 2px，不做彩色描边 */
body:not(.market-page) .ccs-plan-card {
  padding: 18px 18px 14px;
  border: 1px solid var(--rf-line-soft);
  border-radius: 2px;
  background: #fff;
  box-shadow: none;
  transition: border-color 180ms var(--rf-ease), box-shadow 180ms var(--rf-ease), transform 180ms var(--rf-ease);
}

body:not(.market-page) .ccs-plan-card:hover {
  border-color: rgba(13, 16, 22, .18);
  box-shadow: 0 14px 28px -16px rgba(13, 16, 22, .28);
  transform: translateY(-2px);
}

body:not(.market-page) .ccs-plan-card-name {
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: -.005em;
  color: var(--rf-ink);
}

body:not(.market-page) .ccs-plan-card-spec {
  color: var(--rf-text-3);
  font-size: 12px;
  line-height: 1.6;
}

body:not(.market-page) .ccs-plan-card-foot {
  padding-top: 10px;
  border-top: 1px solid var(--rf-line-faint);
}

/* 价格不用品牌蓝（满屏蓝色会贬值），改用墨色；蓝只留给按钮与焦点 */
body:not(.market-page) .ccs-plan-card-price {
  color: var(--rf-ink);
  font-family: var(--rf-mono);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -.02em;
}

body:not(.market-page) .ccs-plan-card-price small {
  color: var(--rf-text-3);
  font-family: var(--rf-sans);
  font-size: 11px;
  font-weight: 400;
}

body:not(.market-page) .ccs-plan-card-buy {
  color: var(--rf-text-3);
  font-size: 12px;
  opacity: 1;
  transition: color 160ms var(--rf-ease);
}

body:not(.market-page) .ccs-plan-card:hover .ccs-plan-card-buy {
  color: var(--rf-blue);
}

/* ---------------------------------------------------------------------------
   9. 产品优势区
   ------------------------------------------------------------------------ */
body:not(.market-page) .product-advantages {
  background: var(--rf-paper-2);
  border-top: 1px solid var(--rf-line-faint);
  border-bottom: 1px solid var(--rf-line-faint);
}

body:not(.market-page) .advantage-item {
  border-top: 1px solid var(--rf-line-soft);
}

/* 激活项原本用冷调 #f7f8fa，落在暖米色底上会显脏；改成纯白 + 左侧小圆角，
   保留它"向右延伸 31px 接住右侧画面"的连接感（那是原本的设计意图）。 */
body:not(.market-page) .advantage-item.is-active {
  background: #fff;
  border-radius: 3px 0 0 3px;
}

body:not(.market-page) .advantage-item:last-child {
  border-bottom: 1px solid var(--rf-line-soft);
}

body:not(.market-page) .advantage-icon {
  border-radius: 3px;
}

body:not(.market-page) .advantage-summary strong {
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -.01em;
  color: var(--rf-ink);
}

body:not(.market-page) .advantage-summary span {
  color: var(--rf-text-3);
  font-size: 12.5px;
  line-height: 1.6;
}

body:not(.market-page) .advantage-detail p {
  color: var(--rf-text-2);
  font-size: 13.5px;
  line-height: 1.82;
}

/* 图标不再用灰度滤镜压暗：默认态已换成「浅中性底 + 墨色字形」的线稿版
   （advantage-*-line.svg），灰度会把激活态的蓝色方片一起洗成灰块。
   注意两层图（default / active）靠各自的 opacity 切换，这里只调默认图的不透明度，
   否则会把 active 那张（蓝底）也顶出来，六项全变成蓝块。 */
body:not(.market-page) .advantage-icon {
  background: none;
  box-shadow: none;
}

body:not(.market-page) .advantage-icon img {
  filter: none;
}

body:not(.market-page) .advantage-icon-default {
  opacity: .9;
}

body:not(.market-page) .advantage-item.is-active .advantage-icon-default {
  opacity: 0;
}

body:not(.market-page) .advantage-icon-active {
  opacity: 0;
}

body:not(.market-page) .advantage-item.is-active .advantage-icon-active {
  opacity: 1;
}

/* 去掉原来的"旋转 + 缩放"弹跳，改成纯交叉淡入——一个规格列表不需要弹跳 */
body:not(.market-page) .advantage-icon,
body:not(.market-page) .advantage-icon img,
body:not(.market-page) .advantage-item:not(.is-active):hover .advantage-icon,
body:not(.market-page) .advantage-item:not(.is-active):focus-within .advantage-icon {
  transform: none;
}

body:not(.market-page) .advantage-icon img {
  transition: opacity 200ms var(--rf-ease);
}

/* 3D 卡片堆叠：降饱和，让它像"印在纸上"而不是浮在空中的塑料。
   非激活的卡片压暗一档（但保留 .5 而不是更低——.42 时整叠纸片几乎糊进米色底，
   读起来像"没渲染出来"）。只让当前项保持清晰，其余退成层叠的纸片。
   2026-11-12：这条 saturate 原来挂在 .advantages-stage 上，舞台上加了持续的光带动画后，
   祖先带 filter 会逼着整块 770×740 每帧重跑滤镜。滤镜下放到 image 本身，
   舞台不再有 filter，动画只动合成层。 */
body:not(.market-page) .advantages-illustration image {
  filter: saturate(.78) contrast(1.03);
}

/* 实拍卡面不吃上面那条降饱和，保留作为"照片"的色相 */
body:not(.market-page) .advantages-illustration image.advantage-layer-texture {
  filter: saturate(1) contrast(1.02);
}

body:not(.market-page) .advantage-visual {
  opacity: .52;
  transition: opacity 240ms var(--rf-ease);
}

body:not(.market-page) .advantage-visual.is-active,
body:not(.market-page) .advantages-stage:hover .advantage-visual {
  opacity: 1;
}

/* ---------------------------------------------------------------------------
   9b. 卡面实拍的分层：压暗 / 内描边
   单张照片直接裁成矩形贴在卡面上，在米白纸色里就是一块生硬的深色板。
   这里补两层：底部压暗把照片和卡片咬合、1px 内描边交代"这是一块屏"。
   动态交给图片本身（adv-*-anim.webp 里烘焙了指示灯呼吸），
   原来这里还有一条 CSS 光带扫过，和图片内的动画重复，已移除。
   ------------------------------------------------------------------------ */
body:not(.market-page) .adv-grade,
body:not(.market-page) .adv-edge {
  opacity: 0;
  transition: opacity 260ms var(--rf-ease);
}

body:not(.market-page) .advantage-visual.is-active .adv-grade {
  opacity: 1;
}

body:not(.market-page) .advantage-visual.is-active .adv-edge {
  opacity: 1;
}

/* ---- 舞台底部的技术图签 ---- */
body:not(.market-page) .adv-spec {
  position: absolute;
  left: 26px;
  bottom: 56px;
  width: min(452px, calc(100% - 52px));
  padding-top: 12px;
  border-top: 1px solid var(--rf-line-soft);
  opacity: 0;
  translate: 0 6px;
  pointer-events: none;
  transition:
    opacity 260ms var(--rf-ease),
    translate 320ms var(--rf-ease);
}

body:not(.market-page) .advantages-stage[data-active-index="0"] .adv-spec[data-adv-spec="0"],
body:not(.market-page) .advantages-stage[data-active-index="1"] .adv-spec[data-adv-spec="1"] {
  opacity: 1;
  translate: 0 0;
}

body:not(.market-page) .adv-spec-head {
  display: flex;
  align-items: baseline;
  gap: 9px;
  margin: 0 0 14px;
  font-size: 12px;
  line-height: 1.5;
  color: var(--rf-text-3);
}

body:not(.market-page) .adv-spec-dot {
  width: 5px;
  height: 5px;
  flex: none;
  translate: 0 -2px;
  background: var(--rf-blue);
  animation: adv-spec-pulse 3.4s ease-in-out infinite;
}

@keyframes adv-spec-pulse {
  0%, 100% { opacity: .28; }
  50%      { opacity: 1; }
}

body:not(.market-page) .adv-spec-head em {
  font-family: var(--rf-mono);
  font-size: 10.5px;
  font-style: normal;
  font-weight: 600;
  letter-spacing: .14em;
  color: var(--rf-text);
  white-space: nowrap;
}

body:not(.market-page) .adv-spec-rows {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

body:not(.market-page) .adv-spec-row {
  display: grid;
  gap: 6px;
  align-content: start;
}

body:not(.market-page) .adv-spec-row span {
  font-family: var(--rf-mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .12em;
  color: var(--rf-text-3);
}

body:not(.market-page) .adv-spec-row em {
  font-style: normal;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .01em;
  color: var(--rf-text);
  white-space: nowrap;
}

/* 三列依次落位，切换优势项时整块图签重新"写"一遍 */
body:not(.market-page) .adv-spec-row {
  opacity: 0;
  translate: 0 5px;
  transition:
    opacity 300ms var(--rf-ease),
    translate 360ms var(--rf-ease);
}

body:not(.market-page) .adv-spec-row:nth-child(2) { transition-delay: 55ms; }
body:not(.market-page) .adv-spec-row:nth-child(3) { transition-delay: 110ms; }

body:not(.market-page) .advantages-stage[data-active-index="0"] .adv-spec[data-adv-spec="0"] .adv-spec-row,
body:not(.market-page) .advantages-stage[data-active-index="1"] .adv-spec[data-adv-spec="1"] .adv-spec-row {
  opacity: 1;
  translate: 0 0;
}

/* 窄屏下舞台连同卡片一起缩到 300–500px 高，图签会和卡片压在一起（实测 ≤900 就重叠），
   这一段直接收起——窄屏本来就只靠左侧列表承载信息。 */
@media (max-width: 960px) {
  body:not(.market-page) .adv-spec {
    display: none;
  }
}

/* ---------------------------------------------------------------------------
   10. 合作伙伴 / 新闻 / 统计
   ------------------------------------------------------------------------ */
body:not(.market-page) .ccp-partners {
  background: var(--rf-paper);
  border-bottom: 1px solid var(--rf-line-faint);
}

/* 合作伙伴长条一律保持原彩色：品牌 logo 一旦转灰就丢了辨识度。
   这里只用极轻的整体透明度把亮色收敛一点，避免在米白底上过于跳。 */
body:not(.market-page) .ccp-row img {
  filter: none;
  opacity: .92;
  transition: opacity 200ms var(--rf-ease);
}

body:not(.market-page) .ccp-row:hover img {
  filter: none;
  opacity: 1;
}

body:not(.market-page) .ccd-card {
  border: 1px solid var(--rf-line-soft);
  border-radius: 2px;
  background: #fff;
  box-shadow: none;
  transition: border-color 180ms var(--rf-ease), box-shadow 180ms var(--rf-ease);
}

body:not(.market-page) .ccd-card:hover {
  border-color: rgba(13, 16, 22, .16);
  box-shadow: 0 16px 32px -20px rgba(13, 16, 22, .24);
}

body:not(.market-page) .ccd-card-head h3 {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .01em;
  color: var(--rf-ink);
}

body:not(.market-page) .ccd-card ul li a {
  color: var(--rf-text-2);
  font-size: 13px;
  line-height: 1.6;
  transition: color 160ms var(--rf-ease);
}

body:not(.market-page) .ccd-card ul li a:hover {
  color: var(--rf-ink);
}

body:not(.market-page) .ccd-card ul li time {
  color: var(--rf-text-3);
  font-family: var(--rf-mono);
  font-size: 11px;
  letter-spacing: .02em;
}

body:not(.market-page) .ccd-price {
  color: var(--rf-ink);
  font-family: var(--rf-mono);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: -.01em;
}

body:not(.market-page) .ccd-price small {
  color: var(--rf-text-3);
  font-family: var(--rf-sans);
  font-size: 10.5px;
  font-weight: 400;
}

body:not(.market-page) .ccd-stats {
  border-top: 1px solid var(--rf-line);
  background: transparent;
}

body:not(.market-page) .ccd-stat + .ccd-stat::before {
  background: var(--rf-line-soft);
}

body:not(.market-page) .ccd-stat strong {
  color: var(--rf-ink);
  font-family: var(--rf-mono);
  font-size: 38px;
  font-weight: 500;
  letter-spacing: -.03em;
  line-height: 1;
}

body:not(.market-page) .ccd-stat strong sup {
  font-size: 15px;
  font-weight: 500;
  top: -.6em;
}

body:not(.market-page) .ccd-stat span {
  margin-top: 10px;
  color: var(--rf-text-3);
  font-size: 11.5px;
  letter-spacing: .06em;
}

/* ---------------------------------------------------------------------------
   11. 全站 CTA 区
   ------------------------------------------------------------------------ */
body:not(.market-page) .global-cta {
  background: #0a0d12 url("/site/assets/img/hero/data-hall.webp") center 58% / cover no-repeat;
  border-radius: 0;
}

/* 压暗但不要把照片压成纯黑：左侧留给标题（深），右侧露出一点机柜结构。
   上一层 .96/.9/.58 时右半边只剩 42% 亮度，再乘照片本身的暗调，肉眼等于一块黑。
   原先是 36px 的白色 CSS 网格，属于"用代码画装饰"，换成实拍后更耐看。 */
body:not(.market-page) .global-cta::before {
  background:
    linear-gradient(90deg, rgba(8, 11, 16, .93) 0%, rgba(8, 11, 16, .82) 44%, rgba(8, 11, 16, .44) 100%),
    linear-gradient(180deg, rgba(8, 11, 16, .38) 0%, transparent 44%, rgba(8, 11, 16, .34) 100%);
  opacity: 1;
  -webkit-mask-image: none;
  mask-image: none;
}

body:not(.market-page) .global-cta-copy > p {
  color: rgba(244, 246, 248, .42);
  font-family: var(--rf-mono);
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: .18em;
}

body:not(.market-page) .global-cta-copy h2 {
  color: #f6f8fa;
  font-size: clamp(26px, 2.2vw, 34px);
  font-weight: 600;
  letter-spacing: -.022em;
  line-height: 1.3;
}

body:not(.market-page) .global-cta-copy > span {
  color: rgba(244, 246, 248, .62);
  font-size: 13.5px;
  line-height: 1.75;
}

body:not(.market-page) .global-cta-button {
  border-radius: 2px;
  border-color: rgba(255, 255, 255, .26);
  font-size: 13.5px;
  font-weight: 500;
  letter-spacing: .01em;
  transition: background-color 180ms var(--rf-ease), border-color 180ms var(--rf-ease), transform 180ms var(--rf-ease);
}

body:not(.market-page) .global-cta-button-primary {
  border-color: #fff;
  background: #fff;
  color: #0b0e13;
}

/* ---------------------------------------------------------------------------
   12. 页脚
   ------------------------------------------------------------------------ */
body:not(.market-page) .site-footer {
  background: #080b10;
  border-top: 1px solid rgba(255, 255, 255, .07);
  color: rgba(244, 246, 248, .58);
}

body:not(.market-page) .footer-column h3,
body:not(.market-page) .footer-column h2,
body:not(.market-page) .footer-column-header {
  color: rgba(244, 246, 248, .92);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .1em;
}

body:not(.market-page) .footer-column a {
  color: rgba(244, 246, 248, .66);
  font-size: 12.5px;
  line-height: 2.05;
  transition: color 160ms var(--rf-ease);
}

body:not(.market-page) .footer-column a:hover {
  color: #fff;
}

body:not(.market-page) .footer-legal {
  border-top: 1px solid rgba(255, 255, 255, .06);
  color: rgba(244, 246, 248, .34);
  font-size: 11.5px;
  letter-spacing: .02em;
}

/* ---------------------------------------------------------------------------
   12.5 产品线落地页（/cloud-ecs /dedicated /cdn-acc /idle）
   四个页面上线时共用同一套模板，只在文案与配图上换皮，因此「像模板」的
   观感最重。这里统一把蓝色降频、把圆角收到方角、把英文标签改成等宽灰稿。
   ------------------------------------------------------------------------ */
body:not(.market-page) .lp-hero,
body:not(.market-page) .lp-hero-dedicated,
body:not(.market-page) .lp-hero-cdn,
body:not(.market-page) .lp-hero-idle {
  background:
    radial-gradient(680px 320px at 88% 6%, rgba(22, 93, 255, .06), transparent 66%),
    linear-gradient(180deg, #fbfbfa 0%, #fafaf9 100%);
  border-bottom: 1px solid var(--rf-line-faint);
}

/* 原来这里有一层「图纸网格」::after（repeating-linear-gradient 画的细方格），
   本意是暗示技术感，实际上四个落地页右上方都浮着一块纯 CSS 生成的纹理，
   和整站已经换成实拍的视觉语言冲突。2026-11-12 移除，改由卡片内的产品实拍图承担。 */

body:not(.market-page) .lp-eyebrow,
body:not(.market-page) .lp-kicker {
  gap: 10px;
  margin-bottom: 18px;
  color: var(--rf-text-3);
  font-family: var(--rf-mono);
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: .16em;
}

/* 全大写英文小标是模板感的最大来源之一：保留它作为节奏标记，
   但压到 10.5px 等宽灰字，让它退成"注释"而不是"标题"。 */
body:not(.market-page) .lp-kicker {
  display: block;
  margin: 0 0 14px;
}

body:not(.market-page) .lp-head h2 {
  font-size: clamp(26px, 2vw, 34px);
  font-weight: 600;
  letter-spacing: -.024em;
  color: var(--rf-ink);
}

body:not(.market-page) .lp-head-sub {
  color: var(--rf-text-3);
  font-size: 13px;
  line-height: 1.7;
}

body:not(.market-page) .lp-eyebrow > span {
  width: 18px;
  height: 1px;
  background: var(--rf-text-3);
}

body:not(.market-page) .lp-hero-title {
  margin: 0 0 22px;
  font-size: clamp(34px, 2.9vw, 46px);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.03em;
  color: var(--rf-ink);
  text-wrap: balance;
}

/* 关键词高亮从「换成品牌蓝」改为「荧光笔」：墨字不变，底部压一道浅色带。
   满屏蓝色强调是模板感的来源，改成底色高亮后颜色只作装饰而非文字色。 */
body:not(.market-page) .lp-hero-title em {
  color: inherit;
  background-image: linear-gradient(to top, rgba(22, 93, 255, .16) 0 .28em, transparent .28em);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  padding: 0 .04em;
}

body:not(.market-page) .lp-hero-desc {
  margin: 0 0 30px;
  font-size: 15px;
  line-height: 1.82;
  color: var(--rf-text-2);
}

body:not(.market-page) .lp-hero-points {
  gap: 22px;
  font-size: 12.5px;
  color: var(--rf-text-3);
}

body:not(.market-page) .lp-hero-points b {
  width: 16px;
  height: 16px;
  margin-right: 6px;
  border-radius: 1px;
  background: transparent;
  border: 1px solid var(--rf-line);
  color: var(--rf-text-2);
  font-size: 9px;
  font-weight: 600;
}

/* 按钮：主按钮从「品牌蓝实心」改为「墨色实心」。
   蓝色只留给焦点态与少量数据，才不会廉价。 */
body:not(.market-page) .lp-btn {
  height: 46px;
  padding: 0 24px;
  border-radius: 2px;
  font-size: 13.5px;
  font-weight: 500;
  letter-spacing: .01em;
}

body:not(.market-page) .lp-btn-lg {
  height: 52px;
  padding: 0 30px;
  font-size: 14.5px;
}

body:not(.market-page) .lp-btn-primary {
  background: var(--rf-ink);
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 1px 2px rgba(13, 16, 22, .14);
}

body:not(.market-page) .lp-btn-primary:hover {
  background: #1b212a;
  transform: translateY(-1px);
}

body:not(.market-page) .lp-btn-ghost {
  border-color: var(--rf-line);
  color: var(--rf-text-2);
  background: #fff;
}

body:not(.market-page) .lp-btn-ghost:hover {
  border-color: rgba(13, 16, 22, .26);
  color: var(--rf-ink);
}

body:not(.market-page) .lp-btn-disabled,
body:not(.market-page) .lp-btn-disabled:hover {
  background: var(--rf-paper-3);
  color: var(--rf-text-3);
  border-color: transparent;
}

/* 右上角的资源卡：从「圆角浮层」改为「规格牌」——方角、发丝边、无彩色底 */
body:not(.market-page) .lp-resource-card {
  border: 1px solid var(--rf-line-soft);
  border-radius: 2px;
  background: #fff;
  box-shadow: var(--rf-shadow-1);
}

/* 原右下角有一枚淡蓝圆形色斑（::after，z-index:-1 溢出卡片），
   在浅底上会透成一块脏灰，直接去掉——装饰不应该是可见的"块"。 */
body:not(.market-page) .lp-resource-card::after {
  display: none;
}

/* 卡片内的图示位：原来这里是一幅细蓝线稿 SVG + 一圈径向渐变光斑，
   在 458px 宽的槽位里只占中间 240px，四周全是空的，读起来像占位图。
   改成通栏产品实拍：宽度撑满、高度与原来的槽位等高，卡片总高不变。
   径向渐变底同时去掉，避免照片下面再垫一层色斑。 */
body:not(.market-page) .lp-resource-figure {
  background: none;
}

/* 实拍不是直接摆一个矩形：外面套一层 .lp-shot 负责圆角裁切 + 投影 + 压暗，
   图片本身缓慢缩放，读起来是"设备在运行"而不是一张贴上去的图。 */
body:not(.market-page) .lp-shot {
  position: relative;
  overflow: hidden;
  border-radius: 6px;
  isolation: isolate;
  box-shadow:
    0 1px 2px rgba(13, 16, 22, .08),
    0 16px 32px -22px rgba(13, 16, 22, .5);
  animation: lp-shot-in 680ms var(--rf-ease) both;
}

@keyframes lp-shot-in {
  from {
    opacity: 0;
    transform: translateY(10px) scale(.986);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

body:not(.market-page) .lp-shot::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(
      to top,
      rgba(7, 11, 18, .84) 0%,
      rgba(8, 12, 22, .34) 34%,
      rgba(10, 16, 26, .04) 66%,
      rgba(123, 164, 255, .12) 100%
    );
}

body:not(.market-page) .lp-hero-shot {
  display: block;
  width: 100%;
  height: 184px;
  border-radius: 6px;
  object-fit: cover;
}

/* 图片本身是动画 WebP（指示灯在呼吸），不再叠加 CSS 缩放——
   两层动效同时跑会互相干扰，也让"设备在亮灯"这件事变得不明确。 */

body:not(.market-page) .lp-shot-tag {
  position: absolute;
  left: 16px;
  bottom: 13px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--rf-mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .88);
}

body:not(.market-page) .lp-shot-tag::before {
  content: "";
  width: 5px;
  height: 5px;
  flex: none;
  background: #5b8cff;
}

body:not(.market-page) .lp-resource-mark {
  border-radius: 2px;
  background: var(--rf-paper-2);
  color: var(--rf-ink);
}

/* 原来这里是一个文字字形（☁ ⚡ ▤ ▣），系统字体渲染出来的粗细和形状随平台漂移，
   小尺寸下又灰又虚，很像占位符。换成 icon-*.svg 线性图标文件（26px 视觉尺寸，
   52px 方块留 13px 内边距），四个落地页共用同一套视觉语言。 */
body:not(.market-page) img.lp-resource-mark {
  display: block;
  box-sizing: border-box;
  padding: 13px;
  border-radius: 2px;
  background: var(--rf-paper-2);
  object-fit: contain;
}

body:not(.market-page) .lp-resource-title h2 {
  font-size: 19px;
  font-weight: 600;
  letter-spacing: -.02em;
  color: var(--rf-ink);
}

body:not(.market-page) .lp-resource-title p,
body:not(.market-page) .lp-resource-title small {
  color: var(--rf-text-3);
  font-size: 11.5px;
  letter-spacing: .04em;
}

body:not(.market-page) .lp-resource-options > div {
  padding: 14px 10px;
  border: 0;
  border-radius: 0;
  background: transparent;
}

body:not(.market-page) .lp-resource-options > div + div {
  border-left: 1px solid var(--rf-line-faint);
}

body:not(.market-page) .lp-resource-options strong {
  font-family: var(--rf-mono);
  font-size: 12.5px;
  font-weight: 600;
  color: var(--rf-ink);
}

body:not(.market-page) .lp-resource-options span {
  color: var(--rf-text-3);
  font-size: 11px;
}

/* 快捷导航：四个格子连成一条通栏，用发丝线分隔，不再各自浮起 */
body:not(.market-page) .lp-quick-bar {
  border: 1px solid var(--rf-line-soft);
  border-radius: 2px;
  background: #fff;
  box-shadow: none;
  overflow: hidden;
}

body:not(.market-page) .lp-quick-item {
  border-radius: 0;
  background: transparent;
  transition: background-color 180ms var(--rf-ease);
}

body:not(.market-page) .lp-quick-item + .lp-quick-item {
  border-left: 1px solid var(--rf-line-faint);
}

body:not(.market-page) .lp-quick-item:hover {
  background: #fcfcfb;
}

body:not(.market-page) .lp-quick-text strong {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--rf-ink);
}

body:not(.market-page) .lp-quick-text span {
  color: var(--rf-text-3);
  font-size: 11.5px;
}

body:not(.market-page) .lp-quick-arrow {
  color: var(--rf-text-3);
}

/* 一级/二级筛选：胶囊 -> 方角描边；选中态用墨色实心，不用品牌蓝 */
body:not(.market-page) .lp-region {
  border-radius: 2px;
  border: 1px solid var(--rf-line);
  background: #fff;
  color: var(--rf-text-2);
  font-size: 12.5px;
  font-weight: 500;
  transition: background-color 160ms var(--rf-ease), color 160ms var(--rf-ease), border-color 160ms var(--rf-ease);
}

body:not(.market-page) .lp-region:hover {
  border-color: rgba(13, 16, 22, .22);
  color: var(--rf-ink);
}

body:not(.market-page) .lp-region.is-active,
body:not(.market-page) .lp-region[aria-selected="true"] {
  background: var(--rf-ink);
  border-color: var(--rf-ink);
  color: #fff;
  font-weight: 500;
}

/* 机型卡 */
body:not(.market-page) .lp-plan {
  padding: 22px 22px 18px;
  border: 1px solid var(--rf-line-soft);
  border-radius: 2px;
  background: #fff;
  box-shadow: none;
  transition: border-color 180ms var(--rf-ease), box-shadow 180ms var(--rf-ease), transform 180ms var(--rf-ease);
}

body:not(.market-page) .lp-plan:hover {
  border-color: rgba(13, 16, 22, .18);
  box-shadow: 0 18px 36px -20px rgba(13, 16, 22, .26);
  transform: translateY(-2px);
}

body:not(.market-page) .lp-plan-spec {
  border-top: 1px solid var(--rf-line-faint);
  border-bottom: 1px solid var(--rf-line-faint);
}

/* 规格行：原来是 9px 上下 + 虚线分隔，密而碎；改成实线发丝 + 收一点行距，
   数值列等宽右对齐，整列数字能对齐成一竖条，才有"规格表"的秩序感。 */
body:not(.market-page) .lp-plan-spec li {
  padding: 8px 0;
  border-bottom: 1px solid var(--rf-line-faint);
  font-size: 12.5px;
}

body:not(.market-page) .lp-plan-spec li:last-child {
  border-bottom: 0;
}

body:not(.market-page) .lp-plan-spec li,
body:not(.market-page) .lp-plan-points li {
  color: var(--rf-text-3);
  font-size: 12.5px;
}

body:not(.market-page) .lp-plan-spec li b,
body:not(.market-page) .lp-plan-spec li strong {
  color: var(--rf-ink);
  font-family: var(--rf-mono);
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

/* 价格：墨色等宽，货币符号缩小——比彩色大数字更像标价而不是促销 */
body:not(.market-page) .lp-plan-price {
  color: var(--rf-ink);
  font-family: var(--rf-mono);
  font-size: 26px;
  font-weight: 500;
  letter-spacing: -.035em;
}

body:not(.market-page) .lp-plan-price small {
  margin-left: 6px;
  color: var(--rf-text-3);
  font-family: var(--rf-sans);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0;
}

body:not(.market-page) .lp-offer-tag {
  border-radius: 1px;
  background: var(--rf-paper-3);
  color: var(--rf-text-2);
  font-family: var(--rf-mono);
  font-size: 9.5px;
  font-weight: 500;
  letter-spacing: .1em;
}

body:not(.market-page) .lp-offer-more {
  color: var(--rf-text-2);
  font-size: 12.5px;
}

body:not(.market-page) .lp-scene {
  padding: 26px 24px;
  border: 1px solid var(--rf-line-soft);
  border-radius: 2px;
  background: #fff;
  transition: border-color 180ms var(--rf-ease), box-shadow 180ms var(--rf-ease);
}

body:not(.market-page) .lp-scene:hover {
  border-color: rgba(13, 16, 22, .16);
  box-shadow: 0 18px 36px -22px rgba(13, 16, 22, .22);
}

body:not(.market-page) .lp-scene h3 {
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -.01em;
  color: var(--rf-ink);
}

body:not(.market-page) .lp-scene-desc,
body:not(.market-page) .lp-scene-sub {
  color: var(--rf-text-3);
  font-size: 12.5px;
  line-height: 1.72;
}

body:not(.market-page) .lp-plan-badge {
  border-radius: 1px;
  background: var(--rf-paper-3);
  color: var(--rf-text-2);
  font-family: var(--rf-mono);
  font-size: 9.5px;
  font-weight: 500;
  letter-spacing: .08em;
}

/* 编号（01 / 02 / 03）改成等宽灰字，替代原本的彩色圆点编号 */
body:not(.market-page) .lp-adv-num,
body:not(.market-page) .lp-feature-num {
  color: var(--rf-text-3);
  font-family: var(--rf-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .1em;
}

body:not(.market-page) .lp-adv,
body:not(.market-page) .lp-feature {
  border-top: 1px solid var(--rf-line-soft);
  padding-top: 22px;
}

body:not(.market-page) .lp-adv h3,
body:not(.market-page) .lp-feature h3 {
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -.01em;
  color: var(--rf-ink);
}

body:not(.market-page) .lp-adv p,
body:not(.market-page) .lp-feature p {
  color: var(--rf-text-3);
  font-size: 12.5px;
  line-height: 1.72;
}

body:not(.market-page) .lp-cta-band {
  background:
    radial-gradient(720px 340px at 84% 10%, rgba(22, 93, 255, .16), transparent 64%),
    linear-gradient(180deg, #0a0d12, #0d1118);
  border-radius: 0;
}

body:not(.market-page) .lp-cta-copy h2 {
  font-size: clamp(24px, 2vw, 30px);
  font-weight: 600;
  letter-spacing: -.022em;
}

body:not(.market-page) .lp-cta-copy p {
  color: rgba(244, 246, 248, .6);
  font-size: 13px;
  line-height: 1.75;
}

/* ---------------------------------------------------------------------------
   12.6 次级内容页（/news /help /contact）
   这三页共用一套浅蓝渐晕 hero + 圆角卡片，和首页的暗色机房语境脱节。
   这里把 hero 统一到纸色 + 工程网格，卡片收到方角，蓝色只留在真正的主按钮上。
   ------------------------------------------------------------------------ */
body:not(.market-page) .news-hero,
body:not(.market-page) .ccx-hero {
  background:
    radial-gradient(620px 300px at 92% 0%, rgba(22, 93, 255, .05), transparent 68%),
    linear-gradient(180deg, #fbfbfa 0%, #fafaf9 100%);
  border-bottom: 1px solid var(--rf-line-faint);
}

body:not(.market-page) .news-kicker,
body:not(.market-page) .ccx-eyebrow {
  display: inline-block;
  margin-bottom: 16px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: var(--rf-text-3);
  font-family: var(--rf-mono);
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: .16em;
}

body:not(.market-page) .news-hero h1,
body:not(.market-page) .news-hero-inner h1,
body:not(.market-page) .ccx-hero h1 {
  font-size: clamp(30px, 2.4vw, 40px);
  font-weight: 600;
  letter-spacing: -.028em;
  line-height: 1.2;
  color: var(--rf-ink);
}

body:not(.market-page) .news-hero-desc,
body:not(.market-page) .ccx-hero-desc {
  color: var(--rf-text-2);
  font-size: 14px;
  line-height: 1.8;
}

/* 列表页的筛选页签与搜索框 */
body:not(.market-page) .news-tab {
  border-radius: 2px;
  border: 1px solid var(--rf-line);
  background: #fff;
  color: var(--rf-text-2);
  font-size: 12.5px;
  font-weight: 500;
}

body:not(.market-page) .news-tab.is-active {
  background: var(--rf-ink);
  border-color: var(--rf-ink);
  color: #fff;
}

body:not(.market-page) .news-search input,
body:not(.market-page) .news-search button,
body:not(.market-page) .news-search .news-search-btn {
  border-radius: 2px;
  font-size: 13px;
}

body:not(.market-page) .news-search input {
  border-color: var(--rf-line);
  background: #fff;
  color: var(--rf-ink);
}

body:not(.market-page) .news-search input::placeholder {
  color: var(--rf-text-3);
}

body:not(.market-page) .news-search button,
body:not(.market-page) .news-search .news-search-btn {
  background: var(--rf-ink);
  border-color: var(--rf-ink);
  color: #fff;
  font-weight: 500;
}

/* 列表条目：去掉整块卡片感，改成"条目 + 发丝分隔"，信息密度更高也更像文档 */
body:not(.market-page) .news-list > * {
  border-radius: 2px;
}

body:not(.market-page) .news-list a {
  transition: color 160ms var(--rf-ease);
}

/* 联系页 */
body:not(.market-page) .ccx-card,
body:not(.market-page) .ccx-info-card,
body:not(.market-page) .ccx-promise {
  border: 1px solid var(--rf-line-soft);
  border-radius: 2px;
  background: #fff;
  box-shadow: none;
  transition: border-color 180ms var(--rf-ease), box-shadow 180ms var(--rf-ease);
}

body:not(.market-page) .ccx-promise:hover {
  border-color: rgba(13, 16, 22, .16);
  box-shadow: 0 16px 32px -22px rgba(13, 16, 22, .2);
}

body:not(.market-page) .ccx-promise h3,
body:not(.market-page) .ccx-card h3 {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: -.005em;
  color: var(--rf-ink);
}

body:not(.market-page) .ccx-promise p,
body:not(.market-page) .ccx-card p {
  color: var(--rf-text-3);
  font-size: 12.5px;
  line-height: 1.72;
}

body:not(.market-page) .ccx-btn {
  border-radius: 2px;
  font-size: 13.5px;
  font-weight: 500;
  letter-spacing: .01em;
  transition: background-color 160ms var(--rf-ease), border-color 160ms var(--rf-ease), color 160ms var(--rf-ease), transform 160ms var(--rf-ease);
}

body:not(.market-page) .ccx-btn-primary {
  background: var(--rf-ink);
  border-color: var(--rf-ink);
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 1px 2px rgba(13, 16, 22, .14);
}

body:not(.market-page) .ccx-btn-primary:hover {
  background: #1b212a;
  border-color: #1b212a;
}

body:not(.market-page) .ccx-btn-ghost {
  border-color: var(--rf-line);
  color: var(--rf-text-2);
  background: #fff;
}

body:not(.market-page) .ccx-btn-ghost:hover {
  border-color: rgba(13, 16, 22, .26);
  color: var(--rf-ink);
}

body:not(.market-page) .ccx-fact {
  border-top: 1px solid var(--rf-line-faint);
}

body:not(.market-page) .ccx-fact strong {
  font-family: var(--rf-mono);
  font-size: 13px;
  font-weight: 600;
  color: var(--rf-ink);
  letter-spacing: -.01em;
}

body:not(.market-page) .ccx-fact span {
  color: var(--rf-text-3);
  font-size: 11.5px;
}

/* ---------------------------------------------------------------------------
   13. 动效：只做一次轻量的入场，且尊重 prefers-reduced-motion
   ------------------------------------------------------------------------ */
@keyframes rf-rise {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: no-preference) {
  body:not(.market-page) .hero-copy > * {
    animation: rf-rise 620ms var(--rf-ease-out) both;
  }
  body:not(.market-page) .hero-copy::before { animation-delay: 0ms; }
  body:not(.market-page) .hero-copy h1 { animation-delay: 70ms; }
  body:not(.market-page) .hero-copy p { animation-delay: 140ms; }
  body:not(.market-page) .hero-cta { animation-delay: 210ms; }
}

@media (prefers-reduced-motion: reduce) {
  body:not(.market-page) *,
  body:not(.market-page) *::before,
  body:not(.market-page) *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* ---------------------------------------------------------------------------
   14. 响应式收敛
   ------------------------------------------------------------------------ */
@media (max-width: 1100px) {
  body:not(.market-page) .hero,
  body:not(.market-page) .hero-inner {
    height: 560px;
  }
  body:not(.market-page) .hero-copy {
    width: min(560px, 100%);
  }
  body:not(.market-page) .highlight-card {
    min-height: 120px;
    padding: 22px 18px;
  }
}

@media (max-width: 760px) {
  body:not(.market-page) .hero,
  body:not(.market-page) .hero-inner {
    height: auto;
    min-height: 520px;
  }
  body:not(.market-page) .hero-inner {
    padding-top: 84px;
    padding-bottom: 96px;
  }
  /* 选择器必须与基础规则同为 (0,3,1)，否则被上面的 clamp(38px…) 压住，
     手机上会保留桌面字号，长标题被迫多行且在 <380px 触到裁切边缘。 */
  body:not(.market-page) .hero .hero-inner .hero-copy h1 {
    font-size: clamp(27px, 7.4vw, 34px);
    line-height: 1.2;
    letter-spacing: -.02em;
    text-wrap: pretty;
    overflow-wrap: break-word;
    word-break: break-word;
  }
  body:not(.market-page) .hero .hero-inner .hero-copy p {
    font-size: 14.5px;
    line-height: 1.75;
    text-wrap: pretty;
  }
  body:not(.market-page) .hero-media-frame::before,
  body:not(.market-page) .hero-media-frame::after {
    opacity: .32;
  }
  /* 窄屏时文案占满整宽，左侧 100deg 渐隐会把照片几乎全遮掉。
     改成纵向遮罩：上方压暗承载标题，下方露出机房实拍。 */
  body:not(.market-page) .hero-media-frame {
    background-position: 58% 50%;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .22) 38%, #000 74%);
    mask-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .22) 38%, #000 74%);
  }
  body:not(.market-page) .hero-overlay {
    background:
      linear-gradient(180deg, rgba(9, 12, 17, .9) 0%, rgba(9, 12, 17, .78) 46%, rgba(9, 12, 17, .34) 74%, rgba(9, 12, 17, .82) 100%);
  }
  body:not(.market-page) .highlights {
    margin-top: 0;
  }
  body:not(.market-page) .highlight-grid {
    grid-template-columns: 1fr;
  }
  body:not(.market-page) .tilt-card-shell + .tilt-card-shell {
    border-left: 0;
    border-top: 1px solid var(--rf-line-soft);
  }
  body:not(.market-page) .ccs-tabs {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}