@charset "utf-8";
/* ==========================================================================
   NexNode V4 — 视觉体系（对齐 hncloud.com 设计语言）
   简体中文 · 主色 #3860F4 · 栅格 1200px · 头部 64px · 模块间距 64px
   目录：
   01 设计变量  02 基础重置  03 通用栅格/按钮/标签/表格  04 头部导航
   05 首页 Hero  06 产品模块（一级/二级标签 + 方案表格）  07 优势/数据/公司简介
   08 文章模块  09 悬浮咨询  10 页脚  11 表单与内容页  12 移动端适配
   ========================================================================== */

/* ------------------------------ 01 设计变量 ------------------------------ */
:root {
    --nx-primary: #3860F4;
    --nx-primary-dark: #2155FF;
    --nx-primary-deep: #1968F8;
    --nx-blue: #409EFF;
    --nx-link: #2E63F6;
    --nx-accent: #FF4E00;
    --nx-accent-soft: #FE9E49;
    --nx-danger: #E53535;
    --nx-success: #23E7A9;

    --nx-ink: #2C3353;
    --nx-title: #333333;
    --nx-text: #374567;
    --nx-body: #666666;
    --nx-muted: #8794AC;
    --nx-faint: #BFC8D8;
    --nx-dark-ink: #1A1A1A;

    --nx-line: #DDDDDD;
    --nx-line-light: #ECECEC;
    --nx-th: #ECF4FC;
    --nx-bg: #F6F7FF;
    --nx-bg-soft: #FAFBFC;
    --nx-bg-grey: #F5F7FA;
    --nx-footer: #1B1E38;

    --nx-radius: 4px;
    --nx-radius-lg: 8px;
    --nx-shadow-card: 0 0 30px 1px rgba(6, 38, 78, .1);
    --nx-shadow-soft: 0 4px 10px 1px rgba(55, 99, 170, .1);
    --nx-ease: .3s cubic-bezier(.4, 0, .2, 1);
    --nx-container: 1200px;
    --nx-header-h: 64px;
}

/* ------------------------------ 02 基础重置 ------------------------------ */
html body {
    margin: 0;
    padding: 0;
    font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.6;
    color: var(--nx-title);
    background: #fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

html body *,
html body *:before,
html body *:after {
    box-sizing: border-box;
}

html body img {
    max-width: 100%;
    border: 0;
    vertical-align: middle;
}

html body a {
    color: var(--nx-blue);
    text-decoration: none;
    cursor: pointer;
    transition: color var(--nx-ease);
}

html body ul,
html body ol,
html body li {
    margin: 0;
    padding: 0;
    list-style: none;
}

html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6,
html body p {
    margin: 0;
    padding: 0;
    font-weight: normal;
}

html body table {
    border-collapse: collapse;
    border-spacing: 0;
}

html body button,
html body input,
html body select,
html body textarea {
    font-family: inherit;
    font-size: inherit;
    outline: none;
}

html body .nx-clear:after {
    content: "";
    display: block;
    clear: both;
}

/* 隐藏历史遗留的旧头部/页脚（若页面仍引用旧控件） */
html body .nx4-on .header,
html body .nx4-on #header-old,
html body .nx4-on .wrapper > .header {
    display: none !important;
}

/* -------------------------- 03 通用栅格 / 按钮 / 标签 -------------------------- */
.nx-wrap {
    width: var(--nx-container);
    margin: 0 auto;
}

.nx-wrap-wide {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 24px;
}

.nx-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 96px;
    padding: 10px 22px;
    line-height: 20px;
    border: 1px solid var(--nx-primary);
    border-radius: var(--nx-radius);
    background: var(--nx-primary);
    color: #fff;
    font-size: 14px;
    white-space: nowrap;
    cursor: pointer;
    transition: all var(--nx-ease);
}

.nx-btn:hover {
    background: var(--nx-primary-dark);
    border-color: var(--nx-primary-dark);
    color: #fff;
}

.nx-btn + .nx-btn {
    margin-left: 12px;
}

.nx-btn.is-lg {
    padding: 13px 32px;
    font-size: 16px;
}

.nx-btn.is-ghost {
    background: transparent;
    border-color: var(--nx-primary);
    color: var(--nx-primary);
}

.nx-btn.is-ghost:hover {
    background: var(--nx-primary);
    color: #fff;
}

.nx-btn.is-white {
    background: #fff;
    border-color: #fff;
    color: var(--nx-primary);
}

.nx-btn.is-white:hover {
    background: #fff;
    color: var(--nx-primary-dark);
    border-color: #fff;
}

.nx-btn.is-white-line {
    background: transparent;
    border-color: #fff;
    color: #fff;
}

.nx-btn.is-white-line:hover {
    background: #fff;
    color: var(--nx-primary);
}

.nx-btn.is-accent {
    background: var(--nx-accent);
    border-color: var(--nx-accent);
}

.nx-btn.is-accent:hover {
    background: #E64500;
    border-color: #E64500;
}

.nx-tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 6px;
    font-size: 12px;
    line-height: 1;
    color: #fff;
    background: var(--nx-blue);
    border-radius: var(--nx-radius);
}

.nx-tag.is-hot {
    background: var(--nx-accent);
}

.nx-tag.is-danger {
    background: var(--nx-danger);
}

.nx-tag.is-new {
    background: var(--nx-primary);
}

/* 通用区块 */
.nx-module {
    padding: 64px 0;
}

.nx-module.is-grey {
    background: var(--nx-bg-soft);
}

.nx-module.is-tint {
    background: var(--nx-bg);
}

.nx-module-head {
    text-align: center;
    margin-bottom: 40px;
}

.nx-module-title {
    font-size: 28px;
    line-height: 1.3;
    color: var(--nx-title);
    font-weight: 600;
}

.nx-module-sub {
    margin-top: 12px;
    font-size: 15px;
    color: var(--nx-body);
}

.nx-eyebrow {
    display: inline-block;
    margin-bottom: 12px;
    font-size: 12px;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--nx-primary);
    font-weight: 600;
}

/* 方案数据表 */
.nx-table {
    width: 100%;
    background: #fff;
    font-size: 14px;
}

.nx-table th {
    padding: 15px 16px;
    background: var(--nx-th);
    color: var(--nx-text);
    font-size: 15px;
    font-weight: 600;
    text-align: left;
    white-space: nowrap;
    border: 0;
}

/* 数据单元格允许在「实在放不下」时折行：美国机房有个 IP 取值是
   5+253/4*61/8*29(1C/4C/8C)，nowrap 会把整张表撑到 1313px（容器 1200px），
   右侧订购按钮被挤出可视区。列宽够时（绝大多数单元格）不会发生折行。 */
.nx-table td {
    position: relative;
    padding: 26px 16px;
    color: var(--nx-text);
    border-bottom: 1px solid #EEF1F6;
    white-space: normal;
    word-break: break-all;
}

/* 表格里的订购按钮收窄一点：末列的最小内容宽度（按钮 + 内边距）是整张表
   能不能塞进 1200px 的最后一颗钉子 —— 收 6px 就能把「获取报价」完整留在视野里 */
.nx-table td.nx-cell-action .nx-btn {
    min-width: 88px;
    padding-left: 16px;
    padding-right: 16px;
}

.nx-table tbody tr {
    position: relative;
    transition: transform var(--nx-ease), box-shadow var(--nx-ease), border-radius var(--nx-ease);
}

.nx-table tbody tr:hover,
.nx-table tbody tr.is-featured {
    background: #fff;
    border-radius: var(--nx-radius-lg);
    box-shadow: 0 0 30px 1px rgba(6, 38, 78, .1);
    /* 原来这里是 scale(1.01)：整行被放大后比容器宽出 12px，
       .nx-table-scroll 因此永远有一条横向滚动条（用户看到的就是
       「右边获取报价被挡着，要往右滑」）。改成只向上浮，不横向撑宽。 */
    transform: translateY(-2px);
    z-index: 2;
}

.nx-table .nx-price {
    display: inline-block;
    font-size: 12px;
    color: var(--nx-muted);
    line-height: 1.5;
}

.nx-table .nx-price .now {
    color: var(--nx-muted);
}

.nx-table .nx-price .now .num {
    font-size: 24px;
    font-weight: 600;
    color: var(--nx-accent);
    margin: 0 2px;
}

.nx-table .nx-price .old {
    color: var(--nx-faint);
    text-decoration: line-through;
}

.nx-table .nx-row-tag {
    position: absolute;
    top: 0;
    left: 20px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1;
    color: #fff;
    background: var(--nx-accent);
    border-radius: 0 0 var(--nx-radius) var(--nx-radius);
}

.nx-table .nx-btn {
    padding: 11px 24px;
    min-width: 100px;
}

.nx-table tr.is-featured .nx-btn {
    background: var(--nx-accent);
    border-color: var(--nx-accent);
}

.nx-table tr.is-featured .nx-btn:hover {
    background: #E64500;
    border-color: #E64500;
}

.nx-table .nx-spec-note {
    display: block;
    font-size: 12px;
    color: var(--nx-faint);
    margin-top: 4px;
}

/* 方案分组说明行 */
.nx-line-note {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 16px;
    padding: 12px 18px;
    background: #F2F6FF;
    border-left: 3px solid var(--nx-primary);
    border-radius: 0 var(--nx-radius) var(--nx-radius) 0;
    color: var(--nx-text);
    font-size: 13px;
}

.nx-line-note .nx-line-note-text {
    flex: 1;
    min-width: 280px;
}

.nx-duration {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.nx-duration span {
    padding: 4px 14px;
    border: 1px solid var(--nx-line);
    border-radius: var(--nx-radius);
    background: #fff;
    cursor: pointer;
    font-size: 13px;
    color: var(--nx-text);
    transition: all var(--nx-ease);
}

.nx-duration span.is-on {
    background: var(--nx-primary);
    border-color: var(--nx-primary);
    color: #fff;
}

/* ------------------------------ 04 头部导航 ------------------------------ */
.nx-header {
    position: relative;
    z-index: 2022;
    height: var(--nx-header-h);
    width: 100%;
    background: #fff;
    color: var(--nx-dark-ink);
    border-bottom: 1px solid #F0F2F7;
}

.nx-header .nx-wrap {
    height: 100%;
    display: flex;
    align-items: center;
    position: relative;
}

.nx-logo {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 100%;
    flex-shrink: 0;
}

.nx-logo img {
    height: 34px;
    width: auto;
    display: block;
}

.nx-logo-text {
    display: flex;
    flex-direction: column;
    line-height: 1.1;
}

.nx-logo-text strong {
    font-size: 19px;
    font-weight: 700;
    color: var(--nx-ink);
    letter-spacing: .01em;
}

.nx-logo-text small {
    font-size: 9px;
    letter-spacing: .18em;
    color: var(--nx-muted);
}

.nx-nav {
    flex: 1;
    height: 100%;
    display: flex;
    align-items: center;
    margin: 0 24px;
}

.nx-nav-item {
    position: relative;
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0 12px;
    margin: 0 12px;
    font-size: 16px;
    color: var(--nx-dark-ink);
    cursor: pointer;
    white-space: nowrap;
}

.nx-nav-item > a {
    color: inherit;
    display: block;
    line-height: var(--nx-header-h);
}

.nx-nav-item:hover,
.nx-nav-item.is-active {
    color: var(--nx-primary);
}

.nx-nav-item.is-active:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 3px;
    background: var(--nx-primary);
    border-radius: 3px 3px 0 0;
}

.nx-nav-item .nx-caret {
    display: inline-block;
    margin-left: 6px;
    font-size: 12px;
    line-height: 1;
    transform-origin: 50% 45%;
    transition: transform var(--nx-ease);
}

.nx-nav-item:hover .nx-caret {
    transform: rotate(180deg);
}

/* 下拉面板 */
.nx-sub {
    position: absolute;
    left: 0;
    top: 100%;
    transform: translate(0, 8px);
    display: none;
    padding: 20px 24px;
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-radius: 0 0 var(--nx-radius-lg) var(--nx-radius-lg);
    box-shadow: 0 12px 32px rgba(6, 38, 78, .14);
    border-top: 2px solid var(--nx-primary);
}

.nx-nav-item.is-right .nx-sub {
    left: auto;
    right: 0;
}

.nx-nav-item:hover .nx-sub {
    display: flex;
    gap: 12px;
}

.nx-sub .card {
    width: 262px;
    padding: 4px 0;
}

.nx-sub .card + .card {
    border-left: 1px solid #F0F2F7;
    padding-left: 20px;
}

.nx-sub-title {
    display: flex;
    align-items: center;
    gap: 6px;
    position: relative;
    padding-bottom: 12px;
    margin-bottom: 10px;
    font-size: 15px;
    font-weight: 600;
    color: var(--nx-ink);
    border-bottom: 1px solid var(--nx-line-light);
}

.nx-sub-title:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 28px;
    height: 2px;
    background: var(--nx-primary);
}

.nx-sub-item {
    display: block;
    padding: 10px 12px;
    font-size: 14px;
    color: var(--nx-title);
    border-radius: var(--nx-radius-lg);
    transition: all var(--nx-ease);
}

.nx-sub-item:hover {
    background: rgba(56, 96, 244, .06);
    color: var(--nx-primary);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
}

.nx-sub-item strong {
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.nx-sub-item em {
    display: block;
    font-style: normal;
    font-size: 12px;
    color: var(--nx-muted);
    margin-top: 2px;
}

.nx-sub-item .nx-tag {
    margin-left: 6px;
}

.nx-auth {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.nx-auth a {
    font-size: 14px;
    color: var(--nx-text);
    margin-left: 16px;
}

.nx-auth a:hover {
    color: var(--nx-primary);
}

.nx-auth .is-reg {
    padding: 7px 18px;
    background: var(--nx-primary);
    color: #fff;
    border-radius: var(--nx-radius);
}

.nx-auth .is-reg:hover {
    background: var(--nx-primary-dark);
    color: #fff;
}

.nx-lang {
    display: inline-flex;
    align-items: center;
    margin-left: 16px;
    border: 1px solid var(--nx-line);
    border-radius: 999px;
    overflow: hidden;
    flex-shrink: 0;
}

.nx-lang a {
    padding: 4px 12px;
    font-size: 12px;
    color: var(--nx-muted);
    line-height: 1.5;
}

.nx-lang a.active {
    background: var(--nx-primary);
    color: #fff;
}

.nx-nav-toggle {
    display: none;
    width: 40px;
    height: 40px;
    border: 0;
    background: transparent;
    cursor: pointer;
    padding: 8px;
}

.nx-nav-toggle i,
.nx-nav-toggle i:before,
.nx-nav-toggle i:after {
    display: block;
    height: 2px;
    width: 100%;
    background: var(--nx-ink);
    position: relative;
    transition: all var(--nx-ease);
}

.nx-nav-toggle i:before,
.nx-nav-toggle i:after {
    content: "";
    position: absolute;
}

.nx-nav-toggle i:before {
    top: -7px;
}

.nx-nav-toggle i:after {
    top: 7px;
}

/* ------------------------------ 05 首页 Hero ------------------------------ */
/* 高度与产品页 .nx-banner 对齐（420px），保证首屏第一眼能看到下方方案区。
   2026-09-20：原为 560px，并含一组「10+ / 72 / 24G / 7×24」数据条（已下线）。 */
.nx-hero {
    position: relative;
    min-height: 420px;
    display: flex;
    align-items: center;
    background-color: #0F1A3C;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    overflow: hidden;
}

.nx-hero:before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(9, 18, 48, .94) 0%, rgba(14, 32, 90, .82) 46%, rgba(20, 48, 130, .40) 100%);
}

.nx-hero .nx-wrap {
    position: relative;
    z-index: 2;
    padding: 46px 0;
}

.nx-hero-inner {
    max-width: 620px;
    color: #fff;
}

.nx-hero h1 {
    font-size: 36px;
    line-height: 1.22;
    font-weight: 700;
    letter-spacing: .01em;
    color: #fff;
}

.nx-hero .nx-hero-sub {
    margin-top: 16px;
    font-size: 15px;
    line-height: 1.8;
    color: rgba(255, 255, 255, .82);
}

.nx-hero .nx-hero-proof {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
    margin-top: 20px;
}

.nx-hero .nx-hero-proof span {
    position: relative;
    padding-left: 16px;
    font-size: 14px;
    color: rgba(255, 255, 255, .88);
}

.nx-hero .nx-hero-proof span:before {
    content: "";
    position: absolute;
    left: 0;
    top: 8px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--nx-accent-soft);
}

.nx-hero .nx-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 22px;
}

.nx-hero .nx-hero-actions .nx-btn + .nx-btn {
    margin-left: 0;
}

/* 注：首页 Hero 的数据条（10+ / 72 / 24G / 7×24）已于 2026-09-20 下线，
   以下样式当前无引用，保留备用（如需恢复：在 build_v4.py 的 hero 模板里补回 .nx-hero-stats 结构）。 */
.nx-hero-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    margin-top: 40px;
    padding-top: 28px;
    border-top: 1px solid rgba(255, 255, 255, .18);
}

.nx-hero-stats div strong {
    display: block;
    font-size: 24px;
    font-weight: 700;
    color: #fff;
    line-height: 1.2;
}

.nx-hero-stats div span {
    font-size: 13px;
    color: rgba(255, 255, 255, .68);
}

/* ------------------------------ 05b 首页 Hero 轮播 ------------------------------ */
/* 预留位说明：新增一屏 = 复制一个 <article class="nx-slide">；
   换成活动图 = 给该 slide 加 style="background-image:url('/Resources/ZOStyle/images/v4/xxx.jpg')"，
   文案与结构都不用动，圆点指示器由 JS 自动按 slide 数量生成。 */
.nx-slider {
    position: relative;
    z-index: 1;
    width: 100%;
    min-height: 420px;
}

.nx-slide {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    background-color: #0F1A3C;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    opacity: 0;
    visibility: hidden;
    transition: opacity .8s ease, visibility .8s ease;
}

.nx-slide.is-on {
    position: relative;
    opacity: 1;
    visibility: visible;
    z-index: 2;
}

.nx-slide.is-alt {
    background-image: linear-gradient(118deg, #0F1A3C 0%, #1B3AA8 58%, #2E63F6 100%);
}

.nx-slide.is-deep {
    background-image: linear-gradient(118deg, #131A35 0%, #21346F 55%, #3860F4 100%);
}

.nx-slide-mask {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(9, 18, 48, .94) 0%, rgba(14, 32, 90, .82) 46%, rgba(20, 48, 130, .40) 100%);
    pointer-events: none;
}

.nx-slide .nx-wrap {
    position: relative;
    z-index: 2;
    padding-top: 40px;
    padding-bottom: 62px;   /* 底部留出轮播圆点（dots 固定 bottom:52px）所需空间 */
}

.nx-slide-body {
    max-width: 820px;
    color: #fff;
}

.nx-slide-title {
    font-size: 30px;
    line-height: 1.28;
    font-weight: 700;
    color: #fff;
}

.nx-slide-sub {
    margin-top: 12px;
    font-size: 15px;
    line-height: 1.8;
    color: rgba(255, 255, 255, .82);
}

.nx-slide-regions {
    display: flex;
    gap: 16px;
    margin-top: 18px;
}

.nx-slide-region {
    position: relative;
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 16px;
    background: rgba(255, 255, 255, .10);
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: var(--nx-radius-lg);
    color: #fff;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    transition: all var(--nx-ease);
}

.nx-slide-region:hover {
    background: rgba(255, 255, 255, .18);
    transform: translateY(-4px);
}

.nx-slide-region .code {
    position: absolute;
    right: 18px;
    top: 14px;
    font-size: 24px;
    font-weight: 800;
    letter-spacing: .04em;
    color: rgba(255, 255, 255, .16);
}

.nx-slide-region strong {
    font-size: 17px;
    font-weight: 700;
    color: #fff;
}

.nx-slide-region .from {
    font-size: 14px;
    font-weight: 700;
    color: var(--nx-accent-soft);
}

.nx-slide-region .line {
    font-size: 12.5px;
    color: rgba(255, 255, 255, .66);
}

.nx-slide-points {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 24px;
    margin-top: 24px;
}

.nx-slide-points span {
    position: relative;
    padding-left: 16px;
    font-size: 14px;
    color: rgba(255, 255, 255, .88);
}

.nx-slide-points span:before {
    content: "";
    position: absolute;
    left: 0;
    top: 8px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--nx-accent-soft);
}

.nx-slider-arrow {
    position: absolute;
    top: 46%;
    z-index: 5;
    width: 46px;
    height: 46px;
    margin-top: -23px;
    padding: 0;
    background: rgba(255, 255, 255, .10);
    border: 1px solid rgba(255, 255, 255, .32);
    border-radius: 50%;
    cursor: pointer;
    opacity: 0;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    transition: all var(--nx-ease);
}

.nx-slider-arrow:before {
    content: "";
    position: absolute;
    left: 17px;
    top: 16px;
    width: 12px;
    height: 12px;
    border: 2px solid #fff;
    border-right-color: transparent;
    border-bottom-color: transparent;
}

.nx-slider-arrow.is-prev {
    left: 24px;
}

.nx-slider-arrow.is-prev:before {
    left: 19px;
    transform: rotate(-45deg);
}

.nx-slider-arrow.is-next {
    right: 24px;
}

.nx-slider-arrow.is-next:before {
    transform: rotate(135deg);
}

.nx-slider:hover .nx-slider-arrow,
.nx-slider-arrow:focus-visible {
    opacity: 1;
}

.nx-slider-arrow:hover {
    background: var(--nx-primary);
    border-color: var(--nx-primary);
}

.nx-slider-dots {
    position: absolute;
    left: 50%;
    bottom: 52px;
    z-index: 5;
    display: flex;
    gap: 10px;
    transform: translateX(-50%);
}

.nx-slider-dots button {
    width: 10px;
    height: 10px;
    padding: 0;
    background: rgba(255, 255, 255, .38);
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    transition: all var(--nx-ease);
}

.nx-slider-dots button.is-on {
    width: 28px;
    border-radius: 6px;
    background: #fff;
}

/* Hero 底部四张浮动卖点卡 */
.nx-hero-cards {
    position: relative;
    z-index: 3;
    margin-top: -46px;
    padding-bottom: 0;
}

.nx-hero-cards .nx-wrap {
    display: flex;
    gap: 16px;
}

.nx-hero-card {
    flex: 1;
    min-width: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    padding: 16px 20px 16px 68px;
    background: linear-gradient(135deg, #FFFFFF 0%, #F0F6FF 100%);
    border: 2px solid #fff;
    border-radius: var(--nx-radius);
    box-shadow: var(--nx-shadow-soft);
    transition: all var(--nx-ease);
}

.nx-hero-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(55, 99, 170, .22);
}

.nx-hero-card:before {
    content: "";
    position: absolute;
    left: 18px;
    top: 50%;
    transform: translateY(-50%);
    width: 34px;
    height: 34px;
    border-radius: 9px;
    background: linear-gradient(135deg, var(--nx-primary) 0%, var(--nx-primary-deep) 100%);
    box-shadow: 0 6px 14px rgba(56, 96, 244, .32);
}

.nx-hero-card:after {
    content: "";
    position: absolute;
    left: 27px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    border: 2px solid #fff;
    border-radius: 4px;
    border-right-color: transparent;
    border-bottom-color: transparent;
}

.nx-hero-card .t {
    font-size: 16px;
    font-weight: 700;
    color: var(--nx-ink);
}

.nx-hero-card .t b {
    color: var(--nx-accent);
    font-weight: 700;
}

.nx-hero-card .d {
    font-size: 13px;
    color: #5E6D81;
}

.nx-hero-card .d b {
    color: var(--nx-accent);
    font-weight: 700;
}

/* 产品页顶部横幅 */
.nx-banner {
    position: relative;
    min-height: 420px;
    display: flex;
    align-items: center;
    background: var(--nx-primary);
    overflow: hidden;
}

.nx-banner .nx-banner-bg {
    position: absolute;
    inset: 0;
    background-repeat: no-repeat;
    background-position: center right;
    background-size: cover;
    opacity: .5;
}

.nx-banner:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(30, 60, 190, .96) 0%, rgba(56, 96, 244, .88) 42%, rgba(56, 96, 244, .25) 100%);
}

.nx-banner .nx-wrap {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    padding: 52px 0;
}

.nx-banner-left {
    max-width: 620px;
    color: #fff;
}

.nx-banner-left h1 {
    font-size: 40px;
    font-weight: 700;
    line-height: 1.25;
    color: #fff;
}

.nx-banner-left p {
    margin-top: 18px;
    font-size: 15px;
    line-height: 1.9;
    color: rgba(255, 255, 255, .82);
}

.nx-banner-left .nx-banner-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 18px;
    margin-top: 22px;
    font-size: 13px;
}

.nx-banner-left .nx-banner-meta span {
    padding: 4px 12px;
    border: 1px solid rgba(255, 255, 255, .38);
    border-radius: 999px;
    color: rgba(255, 255, 255, .9);
}

.nx-banner-left .nx-banner-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

.nx-banner-left .nx-banner-actions .nx-btn + .nx-btn {
    margin-left: 0;
}

/* .nx-banner-right（banner 右侧 420x260 圆角小图）已于 2026-09-22 下线：
   用户反馈 banner 上悬浮小图看着乱，改为只留背景图 + 左栏文案。
   要恢复请同时把 div 加回 build_v4.py 的 build_product() 模板里。 */
/* 面包屑 */
.nx-crumb {
    padding: 16px 0;
    font-size: 13px;
    color: var(--nx-muted);
    border-bottom: 1px solid #F0F2F7;
    background: #fff;
}

.nx-crumb a {
    color: var(--nx-muted);
}

.nx-crumb a:hover {
    color: var(--nx-primary);
}

.nx-crumb span.sep {
    margin: 0 8px;
    /* --nx-faint(#BFC8D8) 在白底上只有 1.68，面包屑的「/」等于看不见，改用次级文字灰 */
    color: var(--nx-muted);
}

/* ------------------------ 06 产品模块（标签 + 表格） ------------------------ */
.nx-tabbar {
    display: flex;
    padding: 8px;
    background: var(--nx-primary);
    border-radius: var(--nx-radius);
    margin-bottom: 8px;
}

.nx-tabbar .tab {
    flex: 1;
    text-align: center;
    padding: 12px 8px;
    font-size: 16px;
    color: #fff;
    border-radius: var(--nx-radius);
    cursor: pointer;
    transition: all var(--nx-ease);
    white-space: nowrap;
}

.nx-tabbar .tab:hover {
    background: rgba(255, 255, 255, .14);
}

.nx-tabbar .tab.is-on {
    background: #fff;
    color: var(--nx-primary);
    font-weight: 600;
}

.nx-subtabs {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0 28px;
    margin-bottom: 22px;
}

.nx-subtabs .tab {
    padding: 16px 2px;
    font-size: 15px;
    color: var(--nx-text);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    transition: all var(--nx-ease);
    white-space: nowrap;
}

.nx-subtabs .tab:hover {
    color: var(--nx-primary);
}

.nx-subtabs .tab.is-on {
    color: var(--nx-primary);
    font-weight: 600;
    border-bottom-color: var(--nx-primary);
}

.nx-panel {
    display: none;
}

.nx-panel.is-on {
    display: block;
}

/* 首页一级标签对应的机房分组 */
.nx-panel-group {
    display: none;
}

.nx-panel-group.is-on {
    display: block;
}

.nx-table-scroll {
    width: 100%;
    overflow-x: auto;
}

/* 首页推荐方案卡片组 */
.nx-region-block + .nx-region-block {
    margin-top: 40px;
}

.nx-region-head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid #EEF1F6;
}

.nx-region-head .code {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 46px;
    height: 30px;
    padding: 0 10px;
    background: rgba(56, 96, 244, .1);
    color: var(--nx-primary);
    border-radius: var(--nx-radius);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .06em;
}

.nx-region-head strong {
    font-size: 19px;
    color: var(--nx-ink);
    font-weight: 600;
}

.nx-region-head .more {
    margin-left: auto;
    font-size: 14px;
    color: var(--nx-primary);
}

.nx-plan-grid {
    display: flex;
    gap: 20px;
}

.nx-plan {
    flex: 1;
    min-width: 0;
    position: relative;
    padding: 26px 24px 24px;
    background: #fff;
    border: 1px solid #EEF1F6;
    border-radius: var(--nx-radius-lg);
    transition: all var(--nx-ease);
}

.nx-plan:hover {
    border-color: var(--nx-primary);
    box-shadow: var(--nx-shadow-card);
    transform: translateY(-4px);
}

.nx-plan .badge {
    position: absolute;
    top: -1px;
    left: 22px;
    padding: 5px 12px;
    font-size: 12px;
    line-height: 1;
    color: #fff;
    background: var(--nx-accent);
    border-radius: 0 0 var(--nx-radius) var(--nx-radius);
}

.nx-plan h3 {
    font-size: 19px;
    font-weight: 600;
    color: var(--nx-ink);
    margin-bottom: 12px;
}

.nx-plan .nx-plan-price {
    font-size: 14px;
    color: var(--nx-muted);
    margin-bottom: 18px;
}

.nx-plan .nx-plan-price .symbol {
    font-size: 16px;
    color: var(--nx-accent);
    margin-right: 2px;
}

.nx-plan .nx-plan-price .num {
    font-size: 32px;
    font-weight: 700;
    color: var(--nx-accent);
    line-height: 1;
}

.nx-plan .nx-plan-price em {
    font-style: normal;
    margin-left: 4px;
    color: var(--nx-muted);
}

.nx-plan ul {
    border-top: 1px dashed #EEF1F6;
    padding-top: 14px;
    margin-bottom: 20px;
}

.nx-plan ul li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 5px 0;
    font-size: 13px;
    line-height: 1.7;
}

.nx-plan ul li span {
    flex-shrink: 0;
    width: 62px;
    color: var(--nx-muted);
}

.nx-plan ul li strong {
    flex: 1;
    min-width: 0;
    font-weight: 400;
    color: var(--nx-text);
    word-break: break-all;
}

.nx-plan .nx-plan-actions {
    display: flex;
    gap: 10px;
}

.nx-plan .nx-plan-actions .nx-btn {
    flex: 1;
    min-width: auto;
}

.nx-plan .nx-plan-actions .nx-btn.is-ghost {
    flex: 0 0 auto;
}

/* ------------------ 07 优势 / 数据 / 公司简介 / 特性卡 ------------------ */
.nx-cards {
    display: flex;
    gap: 20px;
}

.nx-card {
    flex: 1;
    min-width: 0;
    padding: 28px 24px;
    background: #fff;
    border: 1px solid #EEF1F6;
    border-radius: var(--nx-radius-lg);
    transition: all var(--nx-ease);
}

.nx-card:hover {
    border-color: var(--nx-primary);
    box-shadow: var(--nx-shadow-card);
    transform: translateY(-4px);
}

.nx-card .ico {
    width: 46px;
    height: 46px;
    margin-bottom: 16px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(56, 96, 244, .12), rgba(25, 104, 248, .18));
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 图标：原先是「渐变底 + 一个描边小方框」的占位写法（用户反馈看着像没画完），
   改成与文案对应的线性图标 */
.nx-card .ico svg {
    width: 24px;
    height: 24px;
    fill: none;
    stroke: var(--nx-primary);
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.nx-card h3 {
    font-size: 17px;
    font-weight: 600;
    color: var(--nx-ink);
    margin-bottom: 10px;
}

.nx-card p {
    font-size: 14px;
    line-height: 1.9;
    color: var(--nx-body);
}

.nx-advantage {
    position: relative;
    min-height: 460px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.nx-advantage-core {
    position: relative;
    width: 620px;
    height: 360px;
    border-radius: 20px;
    overflow: hidden;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    box-shadow: 0 24px 60px rgba(6, 38, 78, .22);
}

.nx-advantage-core:before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(56, 96, 244, .55), rgba(9, 18, 48, .45));
}

.nx-advantage-core .core-text {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    padding: 0 40px;
}

.nx-advantage-core .core-text strong {
    font-size: 30px;
    font-weight: 700;
}

.nx-advantage-core .core-text span {
    margin-top: 10px;
    font-size: 14px;
    color: rgba(255, 255, 255, .82);
    line-height: 1.9;
}

.nx-advantage-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px 40px;
    margin-top: 48px;
}

.nx-advantage-grid article h3 {
    position: relative;
    padding-left: 18px;
    font-size: 17px;
    font-weight: 600;
    color: var(--nx-ink);
    margin-bottom: 10px;
}

.nx-advantage-grid article h3:before {
    content: "";
    position: absolute;
    left: 0;
    top: 6px;
    width: 4px;
    height: 16px;
    border-radius: 2px;
    background: var(--nx-primary);
}

.nx-advantage-grid article p {
    font-size: 14px;
    line-height: 1.95;
    color: var(--nx-body);
}

.nx-stats {
    position: relative;
    overflow: hidden;
    padding: 84px 0 64px;
    background: linear-gradient(135deg, #1968F8 0%, #3860F4 55%, #2155FF 100%);
    color: #fff;
}

.nx-stats:before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(255, 255, 255, .22) 1px, transparent 1px);
    background-size: 22px 22px;
    opacity: .5;
    mask-image: radial-gradient(ellipse at 50% 40%, #000 20%, transparent 78%);
    -webkit-mask-image: radial-gradient(ellipse at 50% 40%, #000 20%, transparent 78%);
}

.nx-stats .nx-wrap {
    position: relative;
    z-index: 2;
}

.nx-stats-head {
    text-align: center;
    margin-bottom: 52px;
}

.nx-stats-head h2 {
    font-size: 30px;
    font-weight: 700;
    color: #fff;
}

.nx-stats-head p {
    margin-top: 12px;
    font-size: 15px;
    color: rgba(255, 255, 255, .76);
}

.nx-stats-row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
}

.nx-stats-row .item {
    flex: 1;
    text-align: center;
}

.nx-stats-row .item .num {
    font-size: 40px;
    font-weight: 700;
    line-height: 1.1;
    color: #fff;
}

.nx-stats-row .item .num i {
    font-style: normal;
    font-size: 20px;
    font-weight: 600;
    margin-left: 4px;
}

.nx-stats-row .item .label {
    margin-top: 10px;
    font-size: 14px;
    color: rgba(255, 255, 255, .76);
}

.nx-stats-row .split {
    width: 1px;
    height: 56px;
    background: rgba(255, 255, 255, .35);
}

.nx-intro {
    display: flex;
    align-items: stretch;
    gap: 0;
    background: #fff;
    box-shadow: 0 2px 12px rgba(0, 0, 0, .08);
    border-radius: var(--nx-radius-lg);
    overflow: hidden;
}

.nx-intro .logo-box {
    flex: 0 0 340px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 48px 32px;
    background: linear-gradient(135deg, #F6F8FF, #EDF2FF);
}

.nx-intro .logo-box img {
    max-height: 78px;
}

.nx-intro .text {
    flex: 1;
    min-width: 0;
    padding: 44px 48px;
    background: var(--nx-bg-soft);
}

.nx-intro .text h2 {
    position: relative;
    padding-left: 18px;
    font-size: 24px;
    font-weight: 600;
    color: var(--nx-ink);
    margin-bottom: 24px;
}

.nx-intro .text h2:before {
    content: "";
    position: absolute;
    left: 0;
    top: 4px;
    width: 5px;
    height: 24px;
    background: var(--nx-blue);
    border-radius: 3px;
}

.nx-intro .text p {
    font-size: 15px;
    line-height: 2;
    color: var(--nx-body);
    margin-bottom: 12px;
}

/* ------------------------------ 08 文章模块 ------------------------------ */
.nx-articles {
    display: flex;
    gap: 40px;
}

.nx-articles .col {
    flex: 1;
    min-width: 0;
}

.nx-articles .col-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 16px;
    margin-bottom: 8px;
    border-bottom: 1px solid var(--nx-line);
}

.nx-articles .col-head h3 {
    font-size: 18px;
    font-weight: 600;
    color: var(--nx-ink);
}

.nx-articles .col-head a {
    font-size: 14px;
    color: var(--nx-muted);
}

.nx-articles .col-head a:hover {
    color: var(--nx-primary);
}

.nx-articles a.art {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 0;
    color: var(--nx-title);
    font-size: 14px;
    line-height: 36px;
}

.nx-articles a.art:hover {
    color: var(--nx-primary);
}

.nx-articles a.art .t {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nx-articles a.art .d {
    flex-shrink: 0;
    color: var(--nx-muted);
    font-size: 13px;
}

/* ------------------------------ 09 悬浮咨询 ------------------------------ */
.nx-float {
    position: fixed;
    right: 18px;
    bottom: 90px;
    z-index: 2050;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.nx-float a,
.nx-float button {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: 64px;
    height: 64px;
    padding: 0;
    border: 0;
    border-radius: var(--nx-radius-lg);
    background: #fff;
    color: var(--nx-text);
    font-size: 12px;
    line-height: 1.2;
    cursor: pointer;
    box-shadow: 0 6px 20px rgba(6, 38, 78, .16);
    transition: all var(--nx-ease);
}

.nx-float a:hover,
.nx-float button:hover {
    background: var(--nx-primary);
    color: #fff;
    transform: translateY(-2px);
}

/* 图标：原来是 currentColor 的实心小方框（用户反馈像「黑色的空方块」），
   换成 WhatsApp / Telegram 等对应应用的线性图标 */
.nx-float a svg,
.nx-float button svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.nx-float a.is-wa svg {
    stroke: #25D366;
}

.nx-float a.is-tg svg {
    stroke: #2AABEE;
}

.nx-float a.is-quote svg {
    stroke: var(--nx-primary);
}

.nx-float button.is-top svg {
    stroke: var(--nx-text);
}

.nx-float a:hover svg,
.nx-float button:hover svg {
    stroke: #fff;
}

/* ------------------------------ 10 页脚 ------------------------------ */
.nx-footer {
    padding: 56px 0 0;
    background: var(--nx-footer);
    color: #fff;
}

.nx-footer .features {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding-bottom: 36px;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
}

.nx-footer .features .item {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 16px;
    color: #fff;
}

.nx-footer .features .item .dot {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 6px;
    background: rgba(255, 255, 255, .18);
    color: #fff;          /* 图标描边走 currentColor */
    flex-shrink: 0;
}

.nx-footer .features .split {
    /* 原来是 rgba(255,255,255,.28)：压在 #1B1E38 页脚上合成出 #5B5D70，
       对比度只有 2.51，分隔符几乎看不见。提到 .5 后约 5.9。 */
    color: rgba(255, 255, 255, .5);
    font-size: 20px;
}

.nx-footer .body {
    display: flex;
    align-items: flex-start;
    gap: 40px;
    padding: 44px 0;
}

.nx-footer .col-brand {
    flex: 0 0 300px;
    text-align: center;
    padding-top: 12px;
}

.nx-footer .col-brand img {
    max-height: 46px;
    filter: brightness(0) invert(1);
    opacity: .95;
}

.nx-footer .col-brand .brand-name {
    margin-top: 18px;
    font-size: 17px;
    font-weight: 600;
    color: #fff;
}

.nx-footer .col-brand .text {
    margin-top: 16px;
    font-size: 13px;
    line-height: 1.9;
    color: #9AA0B8;
}

.nx-footer .col-links {
    flex: 1;
    min-width: 0;
    display: flex;
    gap: 24px;
}

.nx-footer .col-links .column {
    flex: 1;
    min-width: 0;
}

.nx-footer .col-links .title,
.nx-footer .col-support .title {
    height: 36px;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
}

.nx-footer .col-links a {
    display: block;
    line-height: 38px;
    font-size: 14px;
    color: #9AA0B8;
}

.nx-footer .col-links a:hover {
    color: #fff;
}

.nx-footer .col-support {
    flex: 0 0 250px;
}

.nx-footer .col-support .btn {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 20px;
    margin-bottom: 12px;
    border-radius: var(--nx-radius);
    background: rgba(255, 255, 255, .12);
    color: #fff;
    font-size: 14px;
}

.nx-footer .col-support .btn:hover {
    background: rgba(255, 255, 255, .22);
    color: #fff;
}

.nx-footer .col-support .btn .dot {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    color: #fff;
}

/* 品牌色与右侧浮动客服条保持一致（hover 规则写在后面，否则同特异性被覆盖） */
.nx-footer .col-support .btn .dot.is-wa {
    color: #25D366;
}

.nx-footer .col-support .btn .dot.is-tg {
    color: #2AABEE;
}

.nx-footer .col-support .btn:hover .dot {
    color: #fff;
}

.nx-footer .bottom {
    padding: 20px 0;
    border-top: 1px solid rgba(255, 255, 255, .1);
    font-size: 13px;
    color: #838AA3;
    text-align: center;
}

.nx-footer .bottom a {
    color: #838AA3;
}

.nx-footer .bottom a:hover {
    color: #fff;
}

/* -------------------------- 11 表单 / 内容页 -------------------------- */
.nx-page-head {
    padding: 56px 0;
    background: linear-gradient(135deg, #3860F4 0%, #2155FF 100%);
    color: #fff;
    text-align: center;
}

.nx-page-head h1 {
    font-size: 34px;
    font-weight: 700;
    color: #fff;
}

.nx-page-head p {
    margin-top: 14px;
    font-size: 15px;
    color: rgba(255, 255, 255, .8);
}

.nx-doc {
    padding: 56px 0 72px;
}

.nx-doc h2 {
    position: relative;
    padding-left: 16px;
    font-size: 20px;
    font-weight: 600;
    color: var(--nx-ink);
    margin: 36px 0 14px;
}

.nx-doc h2:first-child {
    margin-top: 0;
}

.nx-doc h2:before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;
    width: 4px;
    height: 18px;
    border-radius: 2px;
    background: var(--nx-primary);
}

.nx-doc p,
.nx-doc li {
    font-size: 15px;
    line-height: 2;
    color: var(--nx-text);
}

.nx-doc ul li {
    position: relative;
    padding-left: 16px;
}

.nx-doc ul li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 13px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--nx-primary);
    opacity: .55;
}

.nx-form fieldset {
    border: 0;
    padding: 0;
    margin: 0;
}

.nx-form .field {
    margin-bottom: 18px;
}

.nx-form label {
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
    color: var(--nx-text);
}

.nx-form label em {
    color: var(--nx-danger);
    font-style: normal;
    margin-left: 4px;
}

.nx-form input[type="text"],
.nx-form input[type="email"],
.nx-form input[type="tel"],
.nx-form select,
.nx-form textarea {
    width: 100%;
    padding: 11px 14px;
    border: 1px solid var(--nx-line);
    border-radius: var(--nx-radius);
    color: var(--nx-title);
    background: #fff;
    transition: border-color var(--nx-ease), box-shadow var(--nx-ease);
}

.nx-form input:focus,
.nx-form select:focus,
.nx-form textarea:focus {
    border-color: var(--nx-primary);
    box-shadow: 0 0 0 3px rgba(56, 96, 244, .12);
}

.nx-form textarea {
    min-height: 120px;
    resize: vertical;
}

.nx-form .grid-2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 20px;
}

/* FAQ 折叠 */
.nx-faq {
    border: 1px solid #EEF1F6;
    border-radius: var(--nx-radius-lg);
    overflow: hidden;
}

.nx-faq details {
    border-bottom: 1px solid #EEF1F6;
}

.nx-faq details:last-child {
    border-bottom: 0;
}

.nx-faq summary {
    padding: 18px 22px;
    font-size: 15px;
    font-weight: 600;
    color: var(--nx-ink);
    cursor: pointer;
    list-style: none;
    position: relative;
    transition: background var(--nx-ease);
}

.nx-faq summary::-webkit-details-marker {
    display: none;
}

.nx-faq summary:hover {
    background: var(--nx-bg-soft);
}

.nx-faq summary:after {
    content: "+";
    position: absolute;
    right: 22px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 20px;
    color: var(--nx-muted);
    font-weight: 400;
}

.nx-faq details[open] summary:after {
    content: "\2013";
    color: var(--nx-primary);
}

.nx-faq .ans {
    padding: 0 22px 20px;
    font-size: 14px;
    line-height: 1.95;
    color: var(--nx-body);
}

/* 锚点导航（产品页吸顶） */
.nx-anchor {
    background: #fff;
    border-bottom: 1px solid #F0F2F7;
    position: sticky;
    top: 0;
    z-index: 2000;
}

.nx-anchor .nx-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
}

.nx-anchor a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 60px;
    padding: 0 40px;
    font-size: 15px;
    color: var(--nx-text);
    transition: color var(--nx-ease);
}

.nx-anchor a:hover {
    color: var(--nx-primary);
}

.nx-anchor a.is-on {
    color: var(--nx-primary);
    font-weight: 600;
}

.nx-anchor a.is-on:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 3px;
    background: var(--nx-primary);
}

/* 提示条 */
.nx-notice {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 20px;
    background: var(--nx-bg);
    border: 1px solid #E3E9FB;
    border-radius: var(--nx-radius-lg);
    font-size: 13px;
    line-height: 1.9;
    color: var(--nx-text);
}

.nx-notice strong {
    color: var(--nx-primary);
    flex-shrink: 0;
}

/* 页尾 CTA */
.nx-cta {
    padding: 56px 0;
    background: linear-gradient(135deg, #2155FF 0%, #3860F4 100%);
    color: #fff;
}

.nx-cta .nx-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    flex-wrap: wrap;
}

.nx-cta h2 {
    font-size: 26px;
    font-weight: 700;
    color: #fff;
}

.nx-cta p {
    margin-top: 10px;
    font-size: 14px;
    color: rgba(255, 255, 255, .8);
}

/* ============================ 12 移动端适配 ============================ */
@media (max-width: 1240px) {
    :root {
        --nx-container: 100%;
    }

    .nx-wrap {
        width: 100%;
        padding: 0 20px;
    }

    /* Hero 轮播的容器：显式补回左右内边距（higher specificity 规则会覆盖上面的 .nx-wrap） */
    .nx-slide .nx-wrap {
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media (max-width: 992px) {
    .nx-nav,
    .nx-auth,
    .nx-lang {
        display: none;
    }

    .nx-nav-toggle {
        display: block;
        margin-left: auto;
    }

    .nx-header.is-open .nx-nav {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        position: absolute;
        left: 0;
        top: var(--nx-header-h);
        width: 100%;
        /* 必须覆盖基类的 height:100%，否则展开菜单会被压成头部高度的 64px 而被裁掉 */
        height: auto;
        max-height: calc(100vh - var(--nx-header-h));
        overflow-y: auto;
        margin: 0;
        padding: 12px 20px 24px;
        background: #fff;
        box-shadow: 0 20px 40px rgba(6, 38, 78, .14);
    }

    .nx-header.is-open .nx-nav-item {
        height: auto;
        display: block;
        padding: 0;
        margin: 0;
        border-bottom: 1px solid #F0F2F7;
    }

    .nx-header.is-open .nx-nav-item > a {
        line-height: 52px;
        font-size: 16px;
    }

    .nx-header.is-open .nx-nav-item.is-active:after {
        display: none;
    }

    .nx-header.is-open .nx-sub {
        position: static;
        transform: none;
        display: block;
        padding: 4px 0 12px 12px;
        background: transparent;
        box-shadow: none;
        border-top: 0;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .nx-header.is-open .nx-sub-title {
        /* 移动端下拉的卡片标题与一级菜单同名，重复显示显得啰嗦 */
        display: none;
    }

    .nx-header.is-open .nx-sub .card {
        width: 100%;
    }

    .nx-header.is-open .nx-sub .card + .card {
        border-left: 0;
        padding-left: 0;
    }

    .nx-header.is-open .nx-auth {
        display: flex;
        margin-top: 18px;
    }

    .nx-header.is-open .nx-lang {
        display: inline-flex;
        margin: 14px 0 0;
    }

    .nx-hero-card .t {
        font-size: 15px;
    }

    .nx-hero h1 {
        font-size: 34px;
    }

    .nx-plan-grid,
    .nx-cards {
        flex-direction: column;
    }

    .nx-articles {
        flex-direction: column;
        gap: 32px;
    }

    .nx-advantage-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .nx-advantage-core {
        width: 100%;
        height: 260px;
    }

    .nx-intro {
        flex-direction: column;
    }

    .nx-intro .logo-box {
        flex: 0 0 auto;
        padding: 32px;
    }

    .nx-intro .text {
        padding: 28px 24px;
    }

    .nx-footer .body {
        flex-direction: column;
        gap: 28px;
    }

    .nx-footer .col-brand {
        flex: 1 1 auto;
        text-align: left;
    }

    .nx-footer .col-links {
        flex-wrap: wrap;
        gap: 0 24px;
    }

    .nx-footer .col-links .column {
        flex: 0 0 calc(50% - 12px);
    }

    .nx-footer .col-support {
        flex: 1 1 auto;
    }

    .nx-footer .features {
        justify-content: flex-start;
        gap: 10px 18px;
    }

    .nx-footer .features .split {
        display: none;
    }

    .nx-form .grid-2 {
        grid-template-columns: minmax(0, 1fr);
    }

    .nx-float {
        right: 10px;
        bottom: 70px;
    }
}

@media (max-width: 768px) {
    .nx-module {
        padding: 40px 0;
    }

    .nx-module-title {
        font-size: 22px;
    }

    .nx-hero {
        min-height: 0;
        background-image: none !important;
    }

    .nx-hero:before {
        background: linear-gradient(140deg, #0F1A3C 0%, #1B3AA8 55%, #3860F4 100%);
    }

    .nx-hero .nx-wrap {
        padding: 44px 0 56px;
    }

    .nx-hero h1 {
        font-size: 27px;
    }

    .nx-hero .nx-hero-sub {
        font-size: 14px;
    }

    .nx-hero-stats {
        gap: 20px;
        margin-top: 28px;
        padding-top: 20px;
    }

    .nx-hero-stats div {
        flex: 1 1 40%;
    }

    .nx-hero-stats div strong {
        font-size: 20px;
    }

    .nx-hero-cards {
        margin-top: 0;
        padding-top: 16px;
    }

    .nx-hero-cards .nx-wrap {
        flex-direction: column;
        gap: 12px;
    }

    .nx-hero-card {
        padding: 16px 16px 16px 60px;
    }

    /* 轮播（移动端）：隐藏箭头、圆点下移、取消卡片上浮以免遮住圆点 */
    .nx-slider {
        min-height: 0;
    }

    .nx-slide .nx-wrap {
        padding: 34px 20px 56px;
    }

    .nx-slide .nx-hero-inner {
        max-width: none;
    }

    .nx-hero .nx-hero-proof {
        display: none;
    }

    .nx-slide-title {
        font-size: 23px;
    }

    .nx-slide-sub {
        margin-top: 12px;
        font-size: 13.5px;
        line-height: 1.8;
    }

    .nx-hero .nx-hero-actions {
        margin-top: 22px;
        gap: 10px;
    }

    .nx-hero .nx-hero-actions .nx-btn {
        flex: 1 1 46%;
        padding: 0 14px;
    }

    .nx-slider-arrow {
        display: none;
    }

    .nx-slider-dots {
        bottom: 20px;
        gap: 8px;
    }

    .nx-slider-dots button {
        width: 8px;
        height: 8px;
    }

    .nx-slider-dots button.is-on {
        width: 22px;
    }

    .nx-slide-regions {
        flex-direction: column;
        gap: 10px;
        margin-top: 20px;
    }

    .nx-slide-region {
        padding: 16px 18px;
    }

    .nx-slide-region .code {
        font-size: 20px;
    }

    .nx-slide-region strong {
        font-size: 16px;
    }

    .nx-slide-points {
        gap: 8px 18px;
        margin-top: 18px;
    }

    .nx-slide-points span {
        font-size: 13px;
    }

    .nx-banner {
        min-height: 0;
    }

    .nx-banner .nx-wrap {
        padding: 32px 0 40px;
    }

    .nx-banner-left h1 {
        font-size: 26px;
    }

    .nx-tabbar {
        padding: 6px;
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
    }

    .nx-tabbar::-webkit-scrollbar {
        display: none;
    }

    .nx-tabbar .tab {
        flex: 0 0 auto;
        min-width: 110px;
        font-size: 14px;
        padding: 10px 12px;
    }

    .nx-subtabs {
        gap: 0 20px;
        justify-content: flex-start;
        overflow-x: auto;
        flex-wrap: nowrap;
        margin-bottom: 16px;
        -webkit-overflow-scrolling: touch;
    }

    .nx-subtabs::-webkit-scrollbar {
        display: none;
    }

    .nx-subtabs .tab {
        flex: 0 0 auto;
        padding: 12px 2px;
        font-size: 14px;
    }

    /* 表格转卡片 */
    .nx-table,
    .nx-table thead,
    .nx-table tbody,
    .nx-table tr,
    .nx-table td {
        display: block;
        width: 100%;
    }

    .nx-table thead {
        display: none;
    }

    .nx-table tbody tr {
        margin-bottom: 14px;
        padding: 18px 18px 16px;
        border: 1px solid #EEF1F6;
        border-radius: var(--nx-radius-lg);
        background: #fff;
        box-shadow: 0 2px 10px rgba(6, 38, 78, .06);
    }

    .nx-table tbody tr:hover,
    .nx-table tbody tr.is-featured {
        transform: none;
    }

    .nx-table td {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        padding: 6px 0;
        border-bottom: 0;
        white-space: normal;
        font-size: 14px;
    }

    .nx-table td:before {
        content: attr(data-label);
        flex: 0 0 68px;
        color: var(--nx-muted);
        font-size: 13px;
    }

    .nx-table td:first-child {
        padding-right: 0;
        font-size: 16px;
        font-weight: 600;
        color: var(--nx-ink);
    }

    .nx-table td:first-child:before {
        display: none;
    }

    .nx-table td.nx-cell-price {
        margin-top: 8px;
        padding-top: 12px;
        border-top: 1px dashed #EEF1F6;
        align-items: center;
    }

    .nx-table td.nx-cell-action {
        margin-top: 12px;
    }

    .nx-table td.nx-cell-action .nx-btn {
        width: 100%;
    }

    .nx-table .nx-row-tag {
        left: 18px;
    }

    .nx-line-note {
        flex-direction: column;
        align-items: flex-start;
    }

    .nx-stats {
        padding: 48px 0 40px;
    }

    .nx-stats-head h2 {
        font-size: 22px;
    }

    .nx-stats-row {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px 12px;
    }

    .nx-stats-row .item .num {
        font-size: 28px;
    }

    .nx-stats-row .split {
        display: none;
    }

    .nx-cta .nx-wrap {
        flex-direction: column;
        align-items: flex-start;
    }

    .nx-anchor .nx-wrap {
        justify-content: flex-start;
        overflow-x: auto;
    }

    .nx-anchor a {
        height: 50px;
        padding: 0 18px;
        font-size: 14px;
        flex: 0 0 auto;
    }

    .nx-float {
        display: none;
    }
}

/* ================= 13 内容页（Info/**：帮助中心 / 关于我们） =================
   与产品页共用头部、页脚、按钮、CTA。本段只处理「文档型页面」的版式：
   渐变页头 + 面包屑 + 双栏（正文卡 + 侧栏要点卡）。
   命名一律 nx-doc- / nx-aside- / nx-ip- / nx-method- 前缀，
   不要用 .nx-panel（那是产品页分组面板，基础规则是 display:none）。
   注意：本段刻意放在文件末尾（即第 12 段移动端适配之后）。
   媒体查询本身不增加优先级，同名规则后写者胜 —— 放在最后才能保证
   这里的 992 / 768 断点覆盖上面的基础规则，不必回头改第 12 段。
   ========================================================================== */
.nx-page-head {
    position: relative;
    overflow: hidden;
}

.nx-page-head .nx-wrap {
    position: relative;
    z-index: 2;
}

.nx-page-head:after {
    content: "";
    position: absolute;
    left: 50%;
    top: -260px;
    width: 760px;
    height: 760px;
    margin-left: -380px;
    background: radial-gradient(circle, rgba(255, 255, 255, .16) 0%, rgba(255, 255, 255, 0) 62%);
    pointer-events: none;
}

.nx-page-head .nx-eyebrow {
    color: rgba(255, 255, 255, .72);
}

.nx-page-head p {
    max-width: 780px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.9;
}

/* 正文区 */
.nx-doc-wrap {
    padding: 40px 0 72px;
    background: var(--nx-bg-soft);
}

.nx-doc-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 28px;
    align-items: start;
}

.nx-doc-box {
    padding: 34px 40px;
    background: #fff;
    border: 1px solid #EEF1F6;
    border-radius: var(--nx-radius-lg);
}

.nx-doc-box + .nx-doc-box {
    margin-top: 24px;
}

.nx-doc-box h2 {
    margin-top: 0;
}

/* 表格已被 .nx-doc 的 h3 / p / ul 覆盖，这里只补 h3 与行内链接 */
.nx-doc h3 {
    margin: 26px 0 10px;
    font-size: 16px;
    font-weight: 600;
    color: var(--nx-ink);
}

.nx-doc h3:first-child {
    margin-top: 0;
}

.nx-doc p + p {
    margin-top: 12px;
}

/* 只作用于「正文里的行内链接」。必须排除按钮 ——
   `.nx-doc a`(0,1,1) 会压过 `.nx-btn`(0,1,0)，把按钮的文字色从 #fff 改成链接蓝，
   于是蓝底蓝字（对比度 1.02）等于看不见，只有 :hover 时 `.nx-btn:hover`(0,2,0)
   才把它救回来，表现为「鼠标放上去才看得到字」。 */
.nx-doc a:not(.nx-btn) {
    color: var(--nx-link);
    border-bottom: 1px solid rgba(46, 99, 246, .28);
}

.nx-doc a:not(.nx-btn):hover {
    border-bottom-color: var(--nx-link);
}

/* 定义表：左侧术语 / 右侧说明 */
.nx-kv {
    width: 100%;
    margin-top: 6px;
    border: 1px solid #EEF1F6;
    border-radius: var(--nx-radius-lg);
    overflow: hidden;
}

.nx-kv tr + tr {
    border-top: 1px solid #EEF1F6;
}

.nx-kv th {
    width: 220px;
    padding: 15px 20px;
    text-align: left;
    vertical-align: top;
    font-size: 14px;
    font-weight: 600;
    color: var(--nx-ink);
    background: #F7F9FE;
}

.nx-kv td {
    padding: 15px 20px;
    font-size: 14px;
    line-height: 1.9;
    color: var(--nx-text);
}

/* 正文底部按钮组 */
.nx-doc-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 26px;
}

.nx-doc-actions .nx-btn + .nx-btn {
    margin-left: 0;
}

.nx-doc-actions .nx-btn.is-ghost {
    border-color: var(--nx-line);
    color: var(--nx-text);
}

.nx-doc-actions .nx-btn.is-ghost:hover {
    border-color: var(--nx-primary);
    color: var(--nx-primary);
}

/* 侧栏要点卡 */
.nx-aside {
    display: flex;
    flex-direction: column;
    gap: 16px;
    position: sticky;
    top: 88px;
}

.nx-aside-card {
    padding: 20px 22px;
    background: #fff;
    border: 1px solid #EEF1F6;
    border-radius: var(--nx-radius-lg);
}

.nx-aside-card span {
    display: block;
    font-size: 11px;
    line-height: 1.4;
    letter-spacing: .14em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--nx-primary);
}

.nx-aside-card strong {
    display: block;
    margin: 8px 0 6px;
    font-size: 15px;
    font-weight: 600;
    color: var(--nx-ink);
}

.nx-aside-card p {
    font-size: 13px;
    line-height: 1.8;
    color: var(--nx-body);
}

.nx-badges {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    margin-top: 24px;
}

/* 相关方案卡片 */
.nx-linkcards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.nx-linkcard {
    display: block;
    padding: 26px 24px;
    background: #fff;
    border: 1px solid #EEF1F6;
    border-radius: var(--nx-radius-lg);
    transition: all var(--nx-ease);
}

.nx-linkcard:hover {
    border-color: var(--nx-primary);
    box-shadow: var(--nx-shadow-card);
    transform: translateY(-4px);
}

.nx-linkcard span {
    font-size: 11px;
    letter-spacing: .14em;
    font-weight: 600;
    color: var(--nx-primary);
}

.nx-linkcard strong {
    display: block;
    margin: 10px 0 8px;
    font-size: 17px;
    font-weight: 600;
    color: var(--nx-ink);
}

.nx-linkcard p {
    font-size: 13px;
    line-height: 1.85;
    color: var(--nx-body);
}

.nx-linkcard em {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 14px;
    font-size: 13px;
    font-style: normal;
    color: var(--nx-primary);
}

.nx-linkcard:hover em svg {
    transform: translateX(3px);
}

.nx-linkcard em svg {
    transition: transform var(--nx-ease);
}

/* 联系方式 */
.nx-contact-grid {
    display: grid;
    /* 左栏 360 → 400：卡片里加了 40px 图标块之后，560/993–1239 这两个断点的左栏
       会把 support@nexnodehost.com 挤成两行（实测量得它需要 211px，而 360 栏下
       文字区只剩 186px，靠缩 gap / padding 最多补回十几 px，补不上）。
       加宽 40px 后文字区 228px，一行放得下；右栏仍有 772px，需求表单的两列栅格不受影响。 */
    grid-template-columns: 400px minmax(0, 1fr);
    gap: 28px;
    align-items: start;
}

.nx-methods {
    display: grid;
    gap: 12px;
    margin-top: 20px;
}

.nx-method {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 15px 18px;
    background: var(--nx-bg-soft);
    border: 1px solid #EEF1F6;
    border-radius: var(--nx-radius-lg);
    transition: all var(--nx-ease);
}

.nx-method:hover {
    background: #fff;
    border-color: var(--nx-primary);
    box-shadow: var(--nx-shadow-soft);
}

.nx-method span {
    display: block;
    font-size: 11px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--nx-muted);
}

.nx-method strong {
    display: block;
    margin: 6px 0 4px;
    font-size: 15px;
    font-weight: 600;
    color: var(--nx-ink);
    word-break: break-all;
}

.nx-method em {
    font-size: 12px;
    font-style: normal;
    color: var(--nx-body);
}

/* 卡片左侧的渠道图标：四张卡原来只有纯文字，加一组小方块做视觉锚点。
   颜色按渠道走（WhatsApp 绿 / Telegram 蓝 / 邮箱蓝与青），一眼能分清是哪个渠道，
   所以这里刻意不用统一的品牌主色。

   两个结构上的坑：
   · 图标容器用 <i> 而不是 <span> —— 上面的 `.nx-method span` 会命中它，
     把图标块撑成 11px 字号的块级元素；
   · 文字容器用 <div> 而不是 <span> —— `.nx-method span` 带 text-transform:uppercase，
     它是可继承属性，套在 span 上会把里面的邮箱地址一起变成大写。
   也就是说：这两条选择器依赖的是元素类型，改结构时别顺手把 i / div 换成 span。 */
.nx-method-ico {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: #fff;
    border: 1px solid #EEF1F6;
    color: var(--nx-muted);
}

.nx-method-ico svg {
    width: 20px;
    height: 20px;
}

.nx-method-ico.is-wa {
    color: #17A34A;
    background: #F1FBF4;
    border-color: #D6F0DF;
}

.nx-method-ico.is-tg {
    color: #1B90C4;
    background: #F1F8FD;
    border-color: #DAEBF7;
}

.nx-method-ico.is-sale {
    color: var(--nx-primary);
    background: #F2F6FE;
    border-color: #DEE7FC;
}

.nx-method-ico.is-sup {
    color: #0E9C8A;
    background: #F0FAF8;
    border-color: #D5EFEA;
}

.nx-method-txt {
    flex: 1 1 auto;
    min-width: 0;
}

.nx-org {
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid #EEF1F6;
}

.nx-org strong {
    display: block;
    font-size: 14px;
    color: var(--nx-ink);
}

.nx-org p {
    margin-top: 8px;
    font-size: 13px;
    line-height: 1.85;
    color: var(--nx-body);
}

/* 测试 IP 卡片 */
.nx-ips {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    margin-top: 24px;
}

.nx-ip-card {
    padding: 26px 24px;
    background: #fff;
    border: 1px solid #EEF1F6;
    border-radius: var(--nx-radius-lg);
}

.nx-ip-card span {
    font-size: 11px;
    letter-spacing: .14em;
    font-weight: 600;
    color: var(--nx-primary);
}

.nx-ip-card h3 {
    margin: 10px 0 14px;
    font-size: 17px;
    font-weight: 600;
    color: var(--nx-ink);
}

.nx-ip-card strong {
    display: block;
    padding: 12px 14px;
    background: var(--nx-bg);
    border-radius: var(--nx-radius);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 17px;
    color: var(--nx-primary);
}

.nx-ip-card p {
    margin-top: 14px;
    font-size: 13px;
    line-height: 1.85;
    color: var(--nx-body);
}

.nx-ip-card a {
    display: inline-block;
    margin-top: 14px;
    font-size: 13px;
}

/* 图文分栏（图文说明 + 示意图） */
.nx-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 400px;
    gap: 32px;
    align-items: center;
}

.nx-figure {
    overflow: hidden;
    background: #fff;
    border: 1px solid #EEF1F6;
    border-radius: var(--nx-radius-lg);
}

.nx-figure .cap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid #EEF1F6;
    font-size: 12px;
    color: var(--nx-muted);
}

.nx-figure .cap strong {
    font-size: 13px;
    font-weight: 600;
    color: var(--nx-ink);
}

.nx-figure img {
    display: block;
    width: 100%;
}

.nx-figure figcaption {
    padding: 12px 16px;
    font-size: 12px;
    line-height: 1.8;
    color: var(--nx-muted);
}

/* 表单卡 */
.nx-form-panel {
    padding: 34px 40px;
    background: #fff;
    border: 1px solid #EEF1F6;
    border-radius: var(--nx-radius-lg);
}

.nx-form-panel h2 {
    font-size: 20px;
    font-weight: 600;
    color: var(--nx-ink);
}

.nx-form-panel > p {
    margin-top: 10px;
    font-size: 13px;
    line-height: 1.9;
    color: var(--nx-body);
}

.nx-form-alert {
    margin-top: 18px;
    padding: 12px 16px;
    background: #FEF6F6;
    border: 1px solid #F6D7D7;
    border-radius: var(--nx-radius);
    font-size: 13px;
    line-height: 1.8;
    color: #C23B3B;
}

.nx-form .grid-3 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0 20px;
}

.nx-form .full {
    grid-column: 1 / -1;
}

.nx-form .help {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    line-height: 1.7;
    color: var(--nx-muted);
}

.nx-form .submit-row {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.nx-form .submit-row small {
    flex: 1;
    min-width: 220px;
    font-size: 12px;
    line-height: 1.75;
    color: var(--nx-muted);
}

.nx-hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

@media (max-width: 992px) {
    .nx-doc-grid,
    .nx-contact-grid,
    .nx-split {
        grid-template-columns: minmax(0, 1fr);
    }

    .nx-aside {
        position: static;
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    }

    .nx-linkcards,
    .nx-ips,
    .nx-badges,
    .nx-form .grid-3 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .nx-page-head {
        padding: 44px 0;
    }

    .nx-page-head h1 {
        font-size: 28px;
    }

    .nx-split .nx-figure {
        order: -1;
    }
}

@media (max-width: 768px) {
    .nx-doc-wrap {
        padding: 24px 0 48px;
    }

    .nx-doc-box,
    .nx-form-panel {
        padding: 22px 18px;
    }

    .nx-linkcards,
    .nx-ips,
    .nx-badges,
    .nx-form .grid-2,
    .nx-form .grid-3 {
        grid-template-columns: minmax(0, 1fr);
    }

    .nx-page-head {
        padding: 34px 0;
    }

    .nx-page-head h1 {
        font-size: 23px;
    }

    .nx-page-head p {
        font-size: 14px;
    }

    .nx-kv th,
    .nx-kv td {
        display: block;
        width: auto;
        padding: 13px 16px;
    }

    .nx-kv td {
        padding-top: 0;
    }

    .nx-kv th {
        padding-bottom: 4px;
        background: #F7F9FE;
    }

    .nx-doc h2 {
        font-size: 18px;
    }

    .nx-doc p,
    .nx-doc li,
    .nx-kv td {
        font-size: 14px;
    }
}

/* ------------------ 16 按钮文字色兜底（放在文件最末，靠「同特异性后写者胜」） ------------------
   教训：任何一个「容器 + a」的链接色规则（`.nx-doc a` / `.nx-articles a` 之类）特异性都在
   (0,1,1) 以上，而 `.nx-btn` 只有 (0,1,0) —— 会被悄悄压掉，按钮就变成「底色上的一行隐形字」。
   更坑的是 :hover 规则 (0,2,0) 又能把它压回来，所以症状是「鼠标放上去才看得见」。
   这里用 a.nx-btn (0,1,1) 在文件最末尾统一兜底；各修饰类的 :hover 特异性更高，不受影响。 */
a.nx-btn,
a.nx-btn:link,
a.nx-btn:visited {
    color: #fff;
}

a.nx-btn.is-ghost,
a.nx-btn.is-white {
    color: var(--nx-primary);
}

a.nx-btn.is-white-line,
a.nx-btn.is-accent {
    color: #fff;
}


/* ------------------ 17 方案区块首屏紧凑化（仅 ≥993px） ------------------
   背景：banner 420px 之下，「浮动卖点卡 → 区块标题组 → 两级 tab → 线路说明 → 表头」
   累计约 480px chrome，把第一行产品推到 1039px —— 常见 900px 视口里连一个报价都看不到。
   用户诉求：收掉 banner 下方的多余留白，让第一眼能看到第一个产品。
   处理：不动任何文案与结构，只收纵向留白 + 表头/单元格内边距。
   作用范围：#plans 在首页与三个机房产品页都有，收紧后几张表密度保持一致；
   ≤992px 走移动卡片布局（thead 隐藏、td 变卡片），间距需求不同，故加 min-width 守卫。
   注意：`.nx-hero-cards` 的负外边距上限是 -46px —— 轮播圆点底边在 hero 下方 52px 处，
   卡片顶必须留在 438 以下，否则会盖住圆点。

   [20260920-5 回调] 上一版收得过狠：td 上下内边距 26→14px，行距只剩 28px，
   用户反馈「文字有点拥挤」。首页同时去掉了「机房介绍」行（腾回约 60px），
   因此把收紧幅度回调一档：表格行恢复到 20px，标题组/标签区都松 2~6px。
   净值仍是「第一屏能看到第一个产品」，但表格不再发挤。
   注：产品页保留 .nx-line-note，这里的内边距同步放宽，四张表密度继续一致。 */
/* 窄桌面（993–1279px）：4 张浮动卖点卡每列只有 230~280px，原来 68px 的图标占位
   会让说明文字折到 3 行，卡片从 88px 涨到 135px —— 首行产品又被推回首屏外。
   这里收图标位与字号，让卡片在所有桌面宽度都稳定在两行。 */
@media (min-width: 993px) and (max-width: 1239px) {
    .nx-hero-card {
        padding: 12px 14px 12px 48px;
        gap: 3px;
    }

    .nx-hero-card:before {
        left: 11px;
        width: 26px;
        height: 26px;
        border-radius: 7px;
    }

    .nx-hero-card:after {
        left: 17px;
        width: 13px;
        height: 13px;
    }

    .nx-hero-card .t {
        font-size: 14px;
    }

    .nx-hero-card .d {
        font-size: 11.5px;
    }
}

@media (min-width: 993px) {
    #plans.nx-module {
        padding-top: 24px;
    }

    #plans .nx-module-head {
        margin-bottom: 18px;
    }

    #plans .nx-eyebrow {
        margin-bottom: 6px;
    }

    #plans .nx-module-sub {
        margin-top: 8px;
    }

    #plans .nx-module-title {
        font-size: 27px;
    }

    #plans .nx-tabbar {
        padding: 6px;
        margin-bottom: 0;
    }

    #plans .nx-tabbar .tab {
        padding: 9px;
    }

    #plans .nx-subtabs {
        margin-bottom: 10px;
    }

    #plans .nx-subtabs .tab {
        padding: 10px 2px;
    }

    #plans .nx-line-note {
        padding: 10px 18px;
        margin-bottom: 10px;
    }

    #plans .nx-table th {
        padding: 12px 16px;
    }

    #plans .nx-table td {
        padding: 20px 16px;
    }
}