/* ============================================================
 * CXZZT 销售落地页样式
 * 命名空间：.cxzzt-sales__*
 * 仅在 page-template-sales-page 启用时加载
 * ============================================================ */

.cxzzt-sales {
    /* 主容器不设置 background，继承父主题全局背景。
       --cs-bg 在区块渐变里仅作为"渐变到透明"的语义占位。 */
    --cs-bg: transparent;
    --cs-card: #ffffff;
    --cs-text: #1f2937;
    --cs-text-soft: #4b5563;
    --cs-text-mute: #6b7280;
    --cs-border: #eef0f4;
    --cs-shadow-sm: 0 4px 16px rgba(15, 23, 42, 0.06);
    --cs-shadow-md: 0 12px 32px rgba(15, 23, 42, 0.08);
    --cs-shadow-lg: 0 24px 60px rgba(15, 23, 42, 0.12);
    --cs-radius-sm: 10px;
    --cs-radius: 16px;
    --cs-radius-lg: 24px;

    --cs-brand: #5b6cff;
    --cs-brand-2: #a07bff;
    --cs-brand-soft: #eef0ff;
    --cs-accent: #ff6a3d;
    --cs-success: #21c989;
    --cs-pink: #ff6aa0;
    --cs-blue: #4a8bff;
    --cs-purple: #7c5cff;
    --cs-orange: #ff8a3d;
    --cs-green: #21c989;
    --cs-cyan: #2bc4d6;
    --cs-indigo: #5e6bff;
    --cs-red: #ff5d6c;
    --cs-yellow: #f5b400;

    color: var(--cs-text);
    line-height: 1.6;
    font-size: 15px;
    overflow: hidden;
}

.cxzzt-sales *,
.cxzzt-sales *::before,
.cxzzt-sales *::after {
    box-sizing: border-box;
}

.cxzzt-sales img {
    max-width: 100%;
    height: auto;
    display: block;
}

.cxzzt-sales__container {
    /* 与 zibll 父主题 .container 完全一致：max-width 1300 / 左右 padding 15
     * 让 sales 页与父主题导航、面包屑、其他全局 widget 视觉对齐
     * container 内容实际可用宽度 = 1300 - 30 = 1270px
     */
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 15px;
}

/* 全局 section 间距与标题 */
.cxzzt-sales__section {
    padding: 80px 0;
    position: relative;
}

.cxzzt-sales__section-head {
    text-align: center;
    max-width: 720px;
    margin: 0 auto 48px;
}

.cxzzt-sales__section-head--left {
    text-align: left;
    margin-left: 0;
    margin-right: 0;
}

.cxzzt-sales__section-title {
    font-size: clamp(24px, 3.2vw, 36px);
    font-weight: 800;
    line-height: 1.25;
    margin: 0 0 12px;
    letter-spacing: -0.02em;
    color: var(--cs-text);
}

.cxzzt-sales__section-subtitle {
    font-size: 16px;
    color: var(--cs-text-mute);
    margin: 0;
}

/* ============================================================
 * CTA 按钮
 * ============================================================ */
.cxzzt-sales__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 46px;
    padding: 0 26px;
    border-radius: 999px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    cursor: pointer;
    border: 1px solid transparent;
    white-space: nowrap;
}

.cxzzt-sales__cta--primary {
    background: linear-gradient(135deg, var(--cs-brand), var(--cs-brand-2));
    color: #fff;
    box-shadow: 0 10px 24px rgba(91, 108, 255, 0.35);
}

.cxzzt-sales__cta--primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 32px rgba(91, 108, 255, 0.45);
    color: #fff;
}

.cxzzt-sales__cta--secondary {
    background: #fff;
    color: var(--cs-brand);
    border-color: rgba(91, 108, 255, 0.25);
    box-shadow: var(--cs-shadow-sm);
}

.cxzzt-sales__cta--secondary:hover {
    transform: translateY(-2px);
    border-color: var(--cs-brand);
    color: var(--cs-brand);
    box-shadow: var(--cs-shadow-md);
}

.cxzzt-sales__cta--ghost {
    background: transparent;
    color: var(--cs-text-soft);
    border-color: rgba(75, 85, 99, 0.2);
}

.cxzzt-sales__cta--ghost:hover {
    color: var(--cs-text);
    border-color: var(--cs-text-soft);
    background: rgba(255, 255, 255, 0.6);
}

/* ============================================================
 * Hero
 * 主容器无背景、无装饰光斑，完全继承父主题全局背景
 * ============================================================ */
.cxzzt-sales__hero {
    position: relative;
    padding: 88px 0 96px;
    overflow: hidden;
}

.cxzzt-sales__hero-inner {
    position: relative;
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 56px;
    align-items: center;
}

/* ---------- 左栏：文案 ---------- */
.cxzzt-sales__hero-left {
    position: relative;
    z-index: 2;
}

.cxzzt-sales__hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    background: rgba(91, 108, 255, 0.1);
    color: var(--cs-brand);
    border: 1px solid rgba(91, 108, 255, 0.18);
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    margin: 0 0 22px;
}

.cxzzt-sales__hero-badge i {
    font-size: 14px;
}

.cxzzt-sales__hero-title {
    font-size: clamp(32px, 4.6vw, 56px);
    font-weight: 800;
    line-height: 1.12;
    margin: 0 0 22px;
    letter-spacing: -0.02em;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cxzzt-sales__hero-title-line {
    display: block;
}

.cxzzt-sales__hero-title-line--primary {
    color: var(--cs-text);
}

.cxzzt-sales__hero-title-line--secondary {
    color: var(--cs-text);
}

.cxzzt-sales__hero-title-hl {
    background: linear-gradient(135deg, var(--cs-brand), var(--cs-brand-2));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.cxzzt-sales__hero-subtitle {
    font-size: 16px;
    color: var(--cs-text-soft);
    margin: 0 0 24px;
    max-width: 560px;
    line-height: 1.7;
}

.cxzzt-sales__hero-features {
    list-style: none;
    padding: 0;
    margin: 0 0 28px;
    display: flex;
    flex-wrap: wrap;
    gap: 14px 24px;
}

.cxzzt-sales__hero-features li {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--cs-text-soft);
    font-size: 14px;
}

.cxzzt-sales__hero-features li i {
    width: 26px;
    height: 26px;
    border-radius: 8px;
    background: var(--cs-brand-soft);
    color: var(--cs-brand);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
}

/* ---------- Hero 价格盒 ---------- */
.cxzzt-sales__hero-price {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    padding: 14px 20px;
    background: rgba(255, 106, 61, 0.06);
    border: 1px solid rgba(255, 106, 61, 0.15);
    border-radius: var(--cs-radius);
    margin: 0 0 24px;
}

.cxzzt-sales__hero-price-main {
    display: inline-flex;
    align-items: baseline;
    color: var(--cs-accent);
    font-weight: 800;
    line-height: 1;
}

.cxzzt-sales__hero-price-prefix {
    font-size: 18px;
    margin-right: 2px;
}

.cxzzt-sales__hero-price-amount {
    font-size: clamp(32px, 3.6vw, 44px);
    background: linear-gradient(135deg, #ff6a3d, #ff8c5d);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.cxzzt-sales__hero-price-suffix {
    font-size: 13px;
    margin-left: 4px;
    color: var(--cs-text-mute);
    font-weight: 600;
}

.cxzzt-sales__hero-price-meta {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.cxzzt-sales__hero-price-badge {
    display: inline-block;
    padding: 2px 8px;
    background: linear-gradient(135deg, var(--cs-accent), #ff8c5d);
    color: #fff;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
}

.cxzzt-sales__hero-price-original {
    font-size: 13px;
    color: var(--cs-text-mute);
    text-decoration: line-through;
}

/* ---------- Hero CTAs ---------- */
.cxzzt-sales__hero-ctas {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 22px;
}

/* 按钮内的 badge（如 "30 天"），相对父按钮定位在右上角 */
.cxzzt-sales__cta-badge {
    display: inline-block;
    margin-left: 6px;
    padding: 2px 7px;
    background: var(--cs-yellow);
    color: #fff;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.4;
    vertical-align: middle;
}

/* ---------- 信任栏 ---------- */
.cxzzt-sales__hero-trust {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 12px 22px;
}

.cxzzt-sales__hero-trust li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--cs-text-mute);
    font-size: 13px;
}

.cxzzt-sales__hero-trust li i {
    color: var(--cs-brand);
    font-size: 14px;
}

/* ---------- 右栏：三设备图叠加 ---------- */
.cxzzt-sales__hero-right {
    position: relative;
    z-index: 1;
    perspective: 1500px;
}

/* tilt 变量约定（JS 通过 setProperty 控制）：
 *   --cxzzt-tilt-rx / --cxzzt-tilt-ry：容器 X/Y 旋转角度
 *   --cxzzt-tilt-tx / --cxzzt-tilt-ty：子元素视差位移（独立变量，互不影响）
 * CSS 完整声明 transform，JS 仅改变量，避免覆写 translateX(-50%) 等基础位移
 */
/* showcase 容器：1:1 正方形（1:1 还原 zibll-pay 的 605×605 设计）
 * 子设备图用「百分比定位 + scale 变换」复刻 zibll 的视觉层级，详见各 item 注释。
 */
.cxzzt-sales__hero-showcase {
    position: relative;
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    aspect-ratio: 1 / 1;
    transform-style: preserve-3d;
    transform: rotateX(var(--cxzzt-tilt-rx, 0deg)) rotateY(var(--cxzzt-tilt-ry, 0deg));
    transition: transform 0.5s cubic-bezier(0.03, 0.98, 0.52, 0.99);
    will-change: transform;
}

.cxzzt-sales__hero-showcase-item {
    position: absolute;
    transform-style: preserve-3d;
    transform-origin: center;
    transition: transform 0.5s cubic-bezier(0.03, 0.98, 0.52, 0.99);
    will-change: transform;
}

/* 主图（PC mockup PNG，含浏览器/桌面外壳）：z-index 最低 = 1 */
.cxzzt-sales__hero-showcase-item--desktop {
    width: 79%;
    aspect-ratio: 4 / 5;        /* zibll 原图 475×605 ≈ 4:5 */
    top: 1%;
    left: 16%;
    z-index: 1;
    transform: translate3d(var(--cxzzt-tilt-tx, 0px), var(--cxzzt-tilt-ty, 0px), 0) scale(0.95);
    filter: drop-shadow(0 24px 40px rgba(20, 22, 28, 0.18));
}

/* 平板 mockup PNG：z-index 中间 = 3，左下溢出形成包围感 */
.cxzzt-sales__hero-showcase-item--tablet {
    width: 100%;
    aspect-ratio: 4 / 3;        /* zibll 原图 605×454 ≈ 4:3 */
    top: 30%;
    left: -30%;                 /* 故意左侧溢出容器，呈现"飘出"效果 */
    z-index: 3;
    transform: translate3d(var(--cxzzt-tilt-tx, 0px), var(--cxzzt-tilt-ty, 0px), 0) scale(0.7);
    filter: drop-shadow(0 20px 30px rgba(20, 22, 28, 0.22));
}

/* 手机 mockup PNG：z-index 最高 = 4，右侧覆盖 */
.cxzzt-sales__hero-showcase-item--phone {
    width: 58%;
    aspect-ratio: 9 / 16;       /* zibll 原图 349×605 ≈ 9:16，含手机外壳 */
    top: 10%;
    left: 60%;
    z-index: 4;
    transform: translate3d(var(--cxzzt-tilt-tx, 0px), var(--cxzzt-tilt-ty, 0px), 0) scale(0.7);
    filter: drop-shadow(0 16px 28px rgba(20, 22, 28, 0.28));
}

.cxzzt-sales__hero-showcase-img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none;
    user-select: none;
}

.cxzzt-sales__hero-showcase-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(91, 108, 255, 0.08), rgba(160, 123, 255, 0.12));
    border: 1px dashed rgba(91, 108, 255, 0.25);
    border-radius: var(--cs-radius);
    color: rgba(91, 108, 255, 0.5);
    font-size: 56px;
}

/* ---------- 浮动装饰小图标 ---------- */
.cxzzt-sales__hero-showcase-icons {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.cxzzt-sales__hero-float-icon {
    position: absolute;
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(91, 108, 255, 0.22);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--cs-brand);
    font-size: 22px;
    transform-style: preserve-3d;
    transform: translate3d(var(--cxzzt-tilt-tx, 0px), var(--cxzzt-tilt-ty, 0px), 0);
    transition: transform 0.5s cubic-bezier(0.03, 0.98, 0.52, 0.99);
    will-change: transform;
    z-index: 5; /* 浮在所有设备图之上 */
}

/* 位置策略：
 * - tl（左上）：showcase 容器顶部左侧，避开 desktop 主图（desktop 从 top:8%、left:9% 开始）
 * - tr（右上）：showcase 容器顶部右侧，贴近 desktop 主图右上方
 * - bl（左下）：tablet 与 phone 之间的中部下方空隙（tablet:left -4%~48%、phone:left 60%~84%）
 * - br（右下中）：贴近 phone 右侧（phone 在 right:8%，icon 略凸出到 right:0）
 * 全部位置都用正百分比（除 right 可微弱负值），避免溢出到文案区（hero-left）
 */
.cxzzt-sales__hero-float-icon--tl { top: 0;       left: 2%;   background: linear-gradient(135deg, #fff, #f5f0ff); }
.cxzzt-sales__hero-float-icon--tr { top: 4%;      right: 2%;  background: linear-gradient(135deg, #fff, #fff0e8); color: var(--cs-accent); }
.cxzzt-sales__hero-float-icon--bl { bottom: 2%;   left: 46%;  background: linear-gradient(135deg, #fff, #fff7d6); color: var(--cs-yellow); }
.cxzzt-sales__hero-float-icon--br { bottom: 30%;  right: 0;   background: linear-gradient(135deg, #fff, #e7faf2); color: var(--cs-green); }

/* ---------- 响应式：≤991px 改单列 ---------- */
@media (max-width: 991px) {
    .cxzzt-sales__hero {
        padding: 56px 0 64px;
    }
    .cxzzt-sales__hero-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .cxzzt-sales__hero-right {
        order: 2;
    }
    .cxzzt-sales__hero-showcase {
        max-width: 560px;
        margin: 0 auto;
    }
}

@media (max-width: 640px) {
    .cxzzt-sales__hero-features,
    .cxzzt-sales__hero-trust {
        gap: 10px 16px;
    }
    .cxzzt-sales__hero-price {
        padding: 12px 14px;
        gap: 10px;
    }
    .cxzzt-sales__hero-float-icon {
        width: 38px;
        height: 38px;
        font-size: 18px;
        border-radius: 12px;
    }
}

/* ============================================================
 * 价格方案（1:1 还原 zibll-pay 的 .zibapi-pricing-plans）
 *
 * Accent 颜色变量（卡片局部作用域）：
 *   --plan-color：主色（价格 / check / outline 按钮 / 默认 badge 渐变）
 *   --plan-color-soft：浅化色（用于 trust-icon 背景）
 *   --plan-shadow：卡片阴影（普通卡片）
 *
 * 三种 accent：blue / pink / purple，pink 通常 featured
 * ============================================================ */

/* 整段容器（卡片 + 信任栏 + footnote 都在内） */
.cxzzt-sales__pricing-plans {
    --plan-radius: 18px;
}

/* 卡片栅格（3 列等宽，宽度跟随 .cxzzt-sales__container = 1270） */
.cxzzt-sales__plan-cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

/* 单卡片：外层只是占位，真正样式在 .cxzzt-sales__plan-inner */
.cxzzt-sales__plan {
    --plan-color: #5b9bff;
    --plan-color-soft: rgba(91, 155, 255, 0.12);
    --plan-shadow: 0 0 10px 0 rgba(116, 116, 116, 0.08);
    position: relative;
    display: flex;
}

/* 三种 accent 主色 */
.cxzzt-sales__plan--accent-blue {
    --plan-color: #5b9bff;
    --plan-color-soft: rgba(91, 155, 255, 0.12);
}
.cxzzt-sales__plan--accent-pink {
    --plan-color: #e9407a;
    --plan-color-soft: rgba(233, 64, 122, 0.12);
}
.cxzzt-sales__plan--accent-purple {
    --plan-color: #a274dd;
    --plan-color-soft: rgba(162, 116, 221, 0.12);
}

/* 推荐卡片：粉色阴影 + 边框 */
.cxzzt-sales__plan--featured {
    --plan-shadow: 0 14px 42px -16px rgba(255, 94, 138, 0.5);
}
.cxzzt-sales__plan--featured .cxzzt-sales__plan-inner {
    border: 1.6px solid rgba(255, 94, 138, 0.5);
}

/* 卡片内层：背景、阴影、圆角、padding。height:100% 确保 3 张卡片等高 */
.cxzzt-sales__plan-inner {
    position: relative;
    width: 100%;
    height: 100%;
    background: #fff;
    border-radius: var(--plan-radius);
    box-shadow: var(--plan-shadow);
    padding: 28px 24px 24px;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    box-sizing: border-box;
}

.cxzzt-sales__plan-inner:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 36px -12px rgba(31, 34, 51, 0.18);
}

.cxzzt-sales__plan--featured .cxzzt-sales__plan-inner:hover {
    box-shadow: 0 22px 48px -14px rgba(255, 94, 138, 0.55);
}

/* 右上角徽章（30天 / 推荐） */
.cxzzt-sales__plan-badge {
    position: absolute;
    top: 14px;
    right: 14px;
    padding: 4px 10px;
    border-radius: 999px;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
    z-index: 2;
}
.cxzzt-sales__plan-badge--blue {
    background: linear-gradient(99deg, #55c8be 0%, #3a87fb 100%);
}
.cxzzt-sales__plan-badge--pink {
    background: linear-gradient(99deg, #fc6161 0%, #ee34d8 100%);
}
.cxzzt-sales__plan-badge--purple {
    background: linear-gradient(99deg, #c084fc 0%, #7c3aed 100%);
}

/* ============================================================
 * P0: 已购方案状态（取货闭环 UI 反馈）
 *  - 渲染时 cxzztclean_sales_get_plan_paid_state() 检测当前用户已购买后启用
 *  - 视觉策略：柔化卡片销售感 + 添加"✓ 已购"角标 + 提供"查看订单"快捷入口
 * ============================================================ */

/* 已购卡片：边框淡绿、轻微泛灰背景，弱化销售感不与未购方案争夺视觉焦点 */
.cxzzt-sales__plan--paid .cxzzt-sales__plan-inner {
    border: 1.5px solid rgba(34, 197, 94, 0.35);
    background: linear-gradient(180deg, #f7fdf9 0%, #ffffff 30%);
    box-shadow: 0 10px 28px -16px rgba(34, 197, 94, 0.25);
}
.cxzzt-sales__plan--paid .cxzzt-sales__plan-inner:hover {
    transform: translateY(-2px);  /* 已购卡片悬浮幅度减小，避免抢镜 */
    box-shadow: 0 16px 36px -14px rgba(34, 197, 94, 0.35);
}

/* 已购 + featured 双状态：以已购为主，覆盖原 featured 的粉色边框 */
.cxzzt-sales__plan--paid.cxzzt-sales__plan--featured .cxzzt-sales__plan-inner {
    border: 1.5px solid rgba(34, 197, 94, 0.5);
    animation: none;  /* 关掉 featured 的呼吸动画，已购态不需要继续招揽 */
}

/* 左上角"✓ 已购买"角标 */
.cxzzt-sales__plan-paid-ribbon {
    position: absolute;
    top: 14px;
    left: 14px;
    padding: 5px 12px 5px 10px;
    border-radius: 999px;
    background: linear-gradient(99deg, #34d399 0%, #10b981 100%);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.4px;
    z-index: 3;
    box-shadow: 0 4px 12px -4px rgba(16, 185, 129, 0.55);
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.cxzzt-sales__plan-paid-ribbon .fa {
    font-size: 13px;
}

/* "查看订单详情"快捷按钮：在主 CTA 下方，调起 zibll order_details_modal */
.cxzzt-sales__plan-view-order-wrap {
    margin-top: 10px;
    text-align: center;
}
.cxzzt-sales__plan-view-order {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 8px;
    background: rgba(34, 197, 94, 0.08);
    color: #047857;
    font-size: 12.5px;
    font-weight: 500;
    line-height: 1.4;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
    border: 1px solid rgba(34, 197, 94, 0.15);
}
.cxzzt-sales__plan-view-order:hover,
.cxzzt-sales__plan-view-order:focus {
    background: rgba(34, 197, 94, 0.18);
    color: #065f46;
    transform: translateY(-1px);
    text-decoration: none;
}
.cxzzt-sales__plan-view-order .fa {
    font-size: 12px;
}

/* 暗色模式适配 */
body.theme-dark .cxzzt-sales__plan--paid .cxzzt-sales__plan-inner {
    background: linear-gradient(180deg, rgba(34, 197, 94, 0.08) 0%, #1b1e25 30%);
    border-color: rgba(52, 211, 153, 0.4);
}
body.theme-dark .cxzzt-sales__plan-view-order {
    background: rgba(52, 211, 153, 0.12);
    color: #6ee7b7;
    border-color: rgba(52, 211, 153, 0.25);
}
body.theme-dark .cxzzt-sales__plan-view-order:hover {
    background: rgba(52, 211, 153, 0.25);
    color: #a7f3d0;
}

/* 标题 */
.cxzzt-sales__plan-title {
    font-size: 26px;
    font-weight: 800;
    margin: 0 0 8px;
    color: #1f2233;
    line-height: 1.2;
}

/* 副标题 */
.cxzzt-sales__plan-sub {
    font-size: 14px;
    color: #999;
    margin: 0 0 18px;
    line-height: 1.5;
}

/* 价格区 */
.cxzzt-sales__plan-price {
    margin-bottom: 0;
}
.cxzzt-sales__plan-price-row {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 10px;
}
.cxzzt-sales__plan-price-main {
    font-size: 46px;
    font-weight: 800;
    color: var(--plan-color);
    line-height: 1;
    letter-spacing: -0.02em;
}
.cxzzt-sales__plan-price-prefix {
    font-size: 20px;
    color: var(--plan-color);
    margin-right: 6px;
    font-weight: 800;
}
.cxzzt-sales__plan-price-unit {
    font-size: 14px;
    color: #999;
}
.cxzzt-sales__plan-price-original {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    margin-left: auto;
}
.cxzzt-sales__plan-price-original-badge {
    font-size: 11px;
    color: #fff;
    background: linear-gradient(99deg, #fc6161 0%, #ee34d8 100%);
    padding: 2px 8px;
    border-radius: 4px;
    font-weight: 600;
}
.cxzzt-sales__plan-price-original-num {
    font-size: 12px;
    color: #999;
    text-decoration: line-through;
}

/* 分隔线 */
.cxzzt-sales__plan-divider {
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(0, 0, 0, 0.06) 20%, rgba(0, 0, 0, 0.06) 80%, transparent);
    margin: 18px 0 18px;
}

/* 特性列表 */
.cxzzt-sales__plan-features {
    list-style: none;
    padding: 0;
    margin: 0 0 22px;
    flex: 1;
}
.cxzzt-sales__plan-feature {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 14px;
    color: #4e5358;
    margin-bottom: 10px;
    line-height: 1.5;
}
.cxzzt-sales__plan-feature:last-child {
    margin-bottom: 0;
}
.cxzzt-sales__plan-feature-check {
    color: var(--plan-color);
    font-size: 13px;
    flex-shrink: 0;
    margin-top: 4px;
}
.cxzzt-sales__plan-feature--highlight {
    color: var(--plan-color);
    font-weight: 600;
}

/* CTA 按钮区 */
.cxzzt-sales__plan-action {
    margin-top: auto;
}

/* 按钮基础（在 .cxzzt-sales__cta 上叠加） */
.cxzzt-sales__plan-btn {
    width: 100%;
    height: 46px;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 600;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    box-sizing: border-box;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.cxzzt-sales__plan-btn:hover {
    transform: translateY(-2px);
}

/* outline 风格（蓝色/紫色卡片用） */
.cxzzt-sales__plan-btn--outline {
    background: transparent;
    border: 1.6px solid var(--plan-color);
    color: var(--plan-color);
}
.cxzzt-sales__plan-btn--outline:hover {
    background: var(--plan-color);
    color: #fff;
    box-shadow: 0 8px 18px -6px var(--plan-color);
}

/* gradient 风格（推荐卡片用） */
.cxzzt-sales__plan-btn--gradient {
    background: linear-gradient(135deg, #ff5e8a 0%, #c86dd7 100%);
    border: 0;
    color: #fff;
    box-shadow: 0 8px 18px -6px rgba(255, 94, 138, 0.55);
}
.cxzzt-sales__plan-btn--gradient:hover {
    box-shadow: 0 12px 24px -6px rgba(255, 94, 138, 0.75);
}

/* CTA 内 span/i/badge 间距修正（override 默认 cta） */
.cxzzt-sales__plan-btn .cxzzt-sales__cta-badge {
    margin-left: 6px;
    background: rgba(255, 255, 255, 0.22);
    color: inherit;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 999px;
}
.cxzzt-sales__plan-btn--outline .cxzzt-sales__cta-badge {
    background: var(--plan-color-soft);
    color: var(--plan-color);
}

/* ---------- 信任栏（6 项一字排开） ---------- */
.cxzzt-sales__plan-trust-bar {
    margin: 30px 0 16px;
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 0 10px 0 rgba(116, 116, 116, 0.08);
    padding: 20px 22px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px 20px;
}

.cxzzt-sales__plan-trust-item {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1 1 auto;
    min-width: 0;
}

.cxzzt-sales__plan-trust-icon {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: linear-gradient(145deg, rgba(81, 188, 254, 0.1), rgba(81, 254, 254, 0.1));
    color: #51bcfe;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.cxzzt-sales__plan-trust-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    line-height: 1.3;
}

.cxzzt-sales__plan-trust-title {
    font-size: 14px;
    font-weight: 700;
    color: #4e5358;
}

.cxzzt-sales__plan-trust-desc {
    font-size: 12px;
    color: #999;
}

/* ---------- 底部声明 ---------- */
.cxzzt-sales__plan-foot {
    text-align: center;
    color: #999;
    font-size: 12.6px;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

/* ============================================================
 * 功能介绍 × 4（1:1 还原 zibll-pay 的 .zibapi-feature-intro 图文双栏）
 *
 * 整页中部 4 个独立 section 交替左右图文布局：
 *   .cxzzt-sales__fi--media-right：左文 + 右图
 *   .cxzzt-sales__fi--media-left ：右文 + 左图
 *
 * 文案区：标题渐变（inline style 注入）+ 描述 + 大数字 + tab 切换
 * 媒体区：Mac 风格浏览器框架（红黄绿三圆点）+ tab 对应截图
 * ============================================================ */

/* section 整体：背景图通过父主题 zib-widget-wrap 处理，本页保持透明 */
.cxzzt-sales__fi {
    background: transparent;
}

/* 双栏 grid：左文右图（默认）或右文左图。两栏各占 1fr，gap 80 让视觉舒展 */
.cxzzt-sales__fi-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 80px;
    align-items: center;
}
.cxzzt-sales__fi--media-left .cxzzt-sales__fi-text  { order: 2; }
.cxzzt-sales__fi--media-left .cxzzt-sales__fi-media { order: 1; }

/* ---- 文案区 ---- */
.cxzzt-sales__fi-text {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* 标题：36px 800，含渐变高亮 + 普通色 */
.cxzzt-sales__fi-title {
    font-size: 36px;
    font-weight: 800;
    line-height: 1.25;
    margin: 0 0 16px;
    color: #1f2233;
}
.cxzzt-sales__fi-title-em {
    /* background 由 inline style 注入，此处只确保 text-clip 生效 */
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-weight: 800;
}
.cxzzt-sales__fi-title-normal {
    color: inherit;
    font-weight: 800;
}

/* 描述：15px #4e5358，行高 1.75 */
.cxzzt-sales__fi-desc {
    font-size: 15px;
    color: #4e5358;
    line-height: 1.75;
    margin: 0 0 28px;
    max-width: 480px;
}

/* 大数字统计 */
.cxzzt-sales__fi-stat {
    display: flex;
    align-items: flex-end;
    gap: 14px;
    margin-bottom: 60px;
}
.cxzzt-sales__fi-stat-num {
    font-size: 70px;
    font-weight: 800;
    color: #1f2233;
    line-height: 1;
    letter-spacing: -0.02em;
}
.cxzzt-sales__fi-stat-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    padding-bottom: 8px;
}
.cxzzt-sales__fi-stat-label {
    font-size: 18px;
    color: #4e5358;
    line-height: 1;
}
.cxzzt-sales__fi-stat-plus {
    font-size: 30px;
    color: #1f2233;
    font-weight: 700;
    line-height: 1;
}

/* tab 切换胶囊 */
.cxzzt-sales__fi-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.cxzzt-sales__fi-tab {
    font-size: 14px;
    padding: 8px 18px;
    background: rgba(0, 0, 0, 0.05);
    color: #4e5358;
    border: 0;
    border-radius: 999px;
    cursor: pointer;
    transition: background 0.25s ease, color 0.25s ease, transform 0.2s ease;
    font-weight: 500;
}
.cxzzt-sales__fi-tab:hover {
    background: rgba(0, 0, 0, 0.08);
    transform: translateY(-1px);
}
/* active tab：inline style 注入渐变背景，这里只保证文字白色 */
.cxzzt-sales__fi-tab.is-active {
    color: #fff;
    box-shadow: 0 8px 18px -8px rgba(31, 36, 51, 0.35);
}

/* ---- 媒体区：浏览器框架 ---- */
.cxzzt-sales__fi-media {
    width: 100%;
    max-width: 585px;
    justify-self: end;
}
.cxzzt-sales__fi--media-left .cxzzt-sales__fi-media {
    justify-self: start;
}

.cxzzt-sales__fi-panels {
    position: relative;
    width: 100%;
}

/* 单 panel：默认隐藏，is-active 显示 */
.cxzzt-sales__fi-panel {
    display: none;
}
.cxzzt-sales__fi-panel.is-active {
    display: block;
}

/* Mac 风格浏览器框架 */
.cxzzt-sales__fi-browser {
    width: 100%;
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 16px 48px -24px rgba(41, 55, 99, 0.35);
    overflow: hidden;
}

/* 顶部标题栏（红黄绿三圆点） */
.cxzzt-sales__fi-browser-bar {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 14px;
    background: rgba(31, 36, 51, 0.04);
    border-bottom: 1px solid rgba(31, 36, 51, 0.04);
}
.cxzzt-sales__fi-browser-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}
.cxzzt-sales__fi-browser-dot--red    { background: #ff5f57; }
.cxzzt-sales__fi-browser-dot--yellow { background: #febc2e; }
.cxzzt-sales__fi-browser-dot--green  { background: #28c840; }

/* 内容区：保持 70% 高度比（浏览器视觉） */
.cxzzt-sales__fi-browser-body {
    position: relative;
    padding-bottom: 70%;
    overflow: hidden;
    background: linear-gradient(135deg, rgba(43, 124, 255, 0.04), rgba(30, 200, 168, 0.04));
}
.cxzzt-sales__fi-browser-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.cxzzt-sales__fi-browser-placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    color: rgba(31, 36, 51, 0.18);
    font-size: 36px;
}
.cxzzt-sales__fi-browser-placeholder span {
    font-size: 14px;
    font-weight: 500;
}

/* ---- 暗色模式 ---- */
body.theme-dark .cxzzt-sales__fi-title {
    color: rgba(255, 255, 255, 0.92);
}
body.theme-dark .cxzzt-sales__fi-stat-num,
body.theme-dark .cxzzt-sales__fi-stat-plus {
    color: rgba(255, 255, 255, 0.92);
}
body.theme-dark .cxzzt-sales__fi-stat-label,
body.theme-dark .cxzzt-sales__fi-desc {
    color: rgba(255, 255, 255, 0.72);
}
body.theme-dark .cxzzt-sales__fi-tab {
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.82);
}
body.theme-dark .cxzzt-sales__fi-browser {
    background: #1b1e25;
    box-shadow: 0 16px 48px -24px rgba(0, 0, 0, 0.6);
}
body.theme-dark .cxzzt-sales__fi-browser-bar {
    background: rgba(255, 255, 255, 0.05);
    border-bottom-color: rgba(255, 255, 255, 0.06);
}

/* ============================================================
 * 生态/功能介绍（1:1 还原 zibll-pay 的 .zibapi-highlights 3 行非对称布局）
 *
 * 3 种尺寸 + 6 种 accent 色调，每张卡片用 CSS 变量 --feat-color / --feat-bg-1 / --feat-bg-2
 * 定义双 radial-gradient 背景，参考 zibll-pay 实际抓取的 rgba 数值
 * ============================================================ */
.cxzzt-sales__features-highlights {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.cxzzt-sales__features-row {
    display: grid;
    gap: 20px;
}
.cxzzt-sales__features-row--large  { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cxzzt-sales__features-row--medium { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cxzzt-sales__features-row--small  { grid-template-columns: repeat(5, minmax(0, 1fr)); }

/* 卡片基础：双 radial-gradient 主色叠白底 */
.cxzzt-sales__feature {
    --feat-color: #5b9bff;
    --feat-bg-1: rgba(82, 153, 251, 0.15);
    --feat-bg-2: rgba(135, 175, 255, 0.10);
    --feat-btn-border: rgba(91, 155, 255, 0.38);
    --feat-icon-1: #6aa6ff;
    --feat-icon-2: #5b9bff;
    position: relative;
    background:
        radial-gradient(85% 75% at 92% 8%, var(--feat-bg-1) 0%, rgba(0,0,0,0) 52%),
        radial-gradient(70% 60% at 0% 100%, var(--feat-bg-2) 0%, rgba(0,0,0,0) 45%),
        #fff;
    border-radius: 18px;
    box-shadow: 0 5px 20px 0 rgba(116, 116, 116, 0.08);
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    isolation: isolate;
}

.cxzzt-sales__feature:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 28px -8px rgba(116, 116, 116, 0.18);
}

/* 6 种 accent 颜色（zibll-pay 抓取的精确 rgba） */
.cxzzt-sales__feature--pink {
    --feat-color: #d83067;
    --feat-bg-1: rgba(255, 120, 160, 0.10);
    --feat-bg-2: rgba(255, 160, 185, 0.07);
    --feat-btn-border: rgba(216, 48, 103, 0.38);
    --feat-icon-1: #ff5e8a;
    --feat-icon-2: #ff7ba3;
}
.cxzzt-sales__feature--blue {
    --feat-color: #2a6fde;
    --feat-bg-1: rgba(82, 153, 251, 0.15);
    --feat-bg-2: rgba(135, 175, 255, 0.10);
    --feat-btn-border: rgba(42, 111, 222, 0.38);
    --feat-icon-1: #6aa6ff;
    --feat-icon-2: #4d8aff;
}
.cxzzt-sales__feature--green {
    --feat-color: #1f9c63;
    --feat-bg-1: rgba(60, 200, 140, 0.09);
    --feat-bg-2: rgba(100, 210, 160, 0.06);
    --feat-btn-border: rgba(31, 156, 99, 0.38);
    --feat-icon-1: #4cd9a4;
    --feat-icon-2: #2ec48b;
}
.cxzzt-sales__feature--orange {
    --feat-color: #d97b2e;
    --feat-bg-1: rgba(255, 175, 90, 0.10);
    --feat-bg-2: rgba(255, 200, 130, 0.06);
    --feat-btn-border: rgba(217, 123, 46, 0.38);
    --feat-icon-1: #ffb86b;
    --feat-icon-2: #ff9d3d;
}
.cxzzt-sales__feature--purple {
    --feat-color: #6a5acd;
    --feat-bg-1: rgba(130, 115, 255, 0.09);
    --feat-bg-2: rgba(160, 148, 255, 0.06);
    --feat-btn-border: rgba(106, 90, 205, 0.38);
    --feat-icon-1: #8a78ff;
    --feat-icon-2: #6e5ce6;
}
.cxzzt-sales__feature--red {
    --feat-color: #d94343;
    --feat-bg-1: rgba(255, 100, 100, 0.09);
    --feat-bg-2: rgba(255, 140, 140, 0.06);
    --feat-btn-border: rgba(217, 67, 67, 0.38);
    --feat-icon-1: #ff7878;
    --feat-icon-2: #ff5555;
}

/* 不同尺寸 padding */
.cxzzt-sales__feature--large .cxzzt-sales__feature-body  { padding: 28px 36px; }
.cxzzt-sales__feature--medium .cxzzt-sales__feature-body { padding: 18px; }
.cxzzt-sales__feature--small .cxzzt-sales__feature-body  { padding: 18px; }

/* 卡片右侧装饰图（仅 large / medium） */
.cxzzt-sales__feature-media {
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
    height: 100%;
    pointer-events: none;
    overflow: hidden;
    z-index: 0;
}
.cxzzt-sales__feature--medium .cxzzt-sales__feature-media { width: 40%; }
.cxzzt-sales__feature-image {
    position: absolute;
    right: -20px;
    top: 50%;
    transform: translateY(-50%);
    max-width: 100%;
    max-height: 90%;
    opacity: 0.85;
}

/* body 层 */
.cxzzt-sales__feature-body {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    height: 100%;
    box-sizing: border-box;
}

/* head: icon + 标题描述 */
.cxzzt-sales__feature-head {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* icon block: 52x52 圆角矩形渐变 */
.cxzzt-sales__feature-icon {
    width: 52px;
    height: 52px;
    border-radius: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    color: #fff;
    flex-shrink: 0;
    background: linear-gradient(145deg, var(--feat-icon-1), var(--feat-icon-2));
    box-shadow: 0 6px 14px -4px rgba(0, 0, 0, 0.15);
}

/* small 卡片 icon 略小 */
.cxzzt-sales__feature--small .cxzzt-sales__feature-icon {
    width: 44px;
    height: 44px;
    font-size: 20px;
    border-radius: 11px;
}

/* text 部分 */
.cxzzt-sales__feature-text {
    flex: 1;
    min-width: 0;
}

.cxzzt-sales__feature-title {
    font-size: 22px;
    font-weight: 700;
    color: #1f2233;
    margin: 0;
    line-height: 1.3;
}
.cxzzt-sales__feature--small .cxzzt-sales__feature-title {
    font-size: 16px;
}
.cxzzt-sales__feature--medium .cxzzt-sales__feature-title {
    font-size: 19px;
}

.cxzzt-sales__feature-desc {
    color: #999;
    font-size: 14px;
    margin: 4px 0 0;
    line-height: 1.4;
}
.cxzzt-sales__feature--small .cxzzt-sales__feature-desc {
    font-size: 12.5px;
}

/* features 列表 */
.cxzzt-sales__feature-points {
    list-style: none;
    margin: 14px 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.cxzzt-sales__feature-points li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #777;
    line-height: 1.4;
}
.cxzzt-sales__feature-tick {
    color: #b1b1b1;
    font-size: 13px;
    flex-shrink: 0;
}
.cxzzt-sales__feature--medium .cxzzt-sales__feature-points li { font-size: 13px; }

/* 了解更多按钮（圆角胶囊 + 主色细描边） */
.cxzzt-sales__feature-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 22px;
    border-radius: 999px;
    border: 0.8px solid var(--feat-btn-border);
    color: var(--feat-color);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    margin-top: 18px;
    align-self: flex-start;
    background: rgba(255, 255, 255, 0.6);
    transition: all 0.2s ease;
}
.cxzzt-sales__feature-btn:hover {
    background: var(--feat-color);
    color: #fff;
    border-color: var(--feat-color);
    box-shadow: 0 6px 14px -4px var(--feat-color);
    transform: translateY(-1px);
}
.cxzzt-sales__feature-btn i {
    font-size: 12px;
    transition: transform 0.2s ease;
}
.cxzzt-sales__feature-btn:hover i {
    transform: translateX(2px);
}

/* ============================================================
 * 页面演示（1:1 还原 zibll-pay 的 .icon-cover-card 4 列横向小卡片）
 *
 * 整体白底大卡片（18 radius / padding 10）→ 4 列网格 → 每张横向 flex 卡片
 *   icon block: 45×45 / radius 4 / 浅彩色背景 + 深主色字体（6 色）
 *   text: 标题 16.8px 700 + 描述 14px #777
 * ============================================================ */

/* 整体白底大卡片包装（宽度跟随 .cxzzt-sales__container） */
.cxzzt-sales__showcase-wrap {
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 0 10px 0 rgba(116, 116, 116, 0.08);
    padding: 10px;
}

/* 4 列网格 */
.cxzzt-sales__showcase-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

/* 单卡片：横向 flex */
.cxzzt-sales__showcase-card {
    --showcase-color: #09a4a1;
    --showcase-bg: rgba(8, 196, 193, 0.10);
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    background: transparent;
    border: 0;
    border-radius: 12px;
    text-decoration: none;
    color: #4e5358;
    transition: background 0.2s ease, transform 0.2s ease;
}
.cxzzt-sales__showcase-card:hover {
    background: rgba(0, 0, 0, 0.02);
    color: var(--showcase-color);
    transform: translateY(-1px);
}

/* 6 种 accent 色（zibll-pay 实测精确值） */
.cxzzt-sales__showcase-card--cyan {
    --showcase-color: #09a4a1;
    --showcase-bg: rgba(8, 196, 193, 0.10);
}
.cxzzt-sales__showcase-card--red {
    --showcase-color: #ff5473;
    --showcase-bg: rgba(255, 84, 115, 0.10);
}
.cxzzt-sales__showcase-card--yellow {
    --showcase-color: #ff6f06;
    --showcase-bg: rgba(255, 111, 6, 0.10);
}
.cxzzt-sales__showcase-card--green {
    --showcase-color: #6a933e;
    --showcase-bg: rgba(72, 135, 24, 0.10);
}
.cxzzt-sales__showcase-card--purple {
    --showcase-color: #8e4aff;
    --showcase-bg: rgba(154, 72, 245, 0.10);
}
.cxzzt-sales__showcase-card--blue {
    --showcase-color: #2997f7;
    --showcase-bg: rgba(41, 151, 247, 0.10);
}

/* icon block: 45×45 圆角小方块 */
.cxzzt-sales__showcase-icon {
    width: 45px;
    height: 45px;
    border-radius: 4px;
    background: var(--showcase-bg);
    color: var(--showcase-color);
    font-size: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: transform 0.2s ease;
}
.cxzzt-sales__showcase-card:hover .cxzzt-sales__showcase-icon {
    transform: scale(1.05);
}

/* text 区 */
.cxzzt-sales__showcase-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* 标题（含右侧 angle-right 箭头） */
.cxzzt-sales__showcase-title {
    font-size: 16px;
    font-weight: 700;
    color: #4e5358;
    line-height: 1.3;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cxzzt-sales__showcase-arrow {
    font-size: 14px;
    color: #b1b1b1;
    transition: transform 0.2s ease, color 0.2s ease;
}
.cxzzt-sales__showcase-card:hover .cxzzt-sales__showcase-arrow {
    color: var(--showcase-color);
    transform: translateX(2px);
}

/* 描述 */
.cxzzt-sales__showcase-desc {
    font-size: 13px;
    color: #777;
    line-height: 1.4;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* hover 时标题颜色继承 accent */
.cxzzt-sales__showcase-card:hover .cxzzt-sales__showcase-title {
    color: var(--showcase-color);
}

/* 暗色模式 */
body.theme-dark .cxzzt-sales__showcase-wrap {
    background: rgba(27, 30, 37, 0.85);
    box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.4);
}
body.theme-dark .cxzzt-sales__showcase-card:hover {
    background: rgba(255, 255, 255, 0.04);
}
body.theme-dark .cxzzt-sales__showcase-title {
    color: rgba(255, 255, 255, 0.92);
}
body.theme-dark .cxzzt-sales__showcase-desc {
    color: rgba(255, 255, 255, 0.65);
}

/* ============================================================
 * 用户评价（1:1 还原 zibll-pay 的 .zibapi-reviews 横滚轮播）
 *
 * 卡片 302×208, padding 24, white bg, radius 18, no shadow
 * 含头像 + 名字 + role + 5 星 + 评论 + 右下角引号装饰
 * ============================================================ */
.cxzzt-sales__reviews {
    background: transparent;
}

.cxzzt-sales__reviews-marquee {
    width: 100%;
    overflow: hidden;
    mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}

.cxzzt-sales__reviews-track {
    display: flex;
    gap: 18px;
    animation: cxzzt-sales-marquee 60s linear infinite;
    width: max-content;
}

.cxzzt-sales__reviews-marquee:hover .cxzzt-sales__reviews-track {
    animation-play-state: paused;
}

@keyframes cxzzt-sales-marquee {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* 单卡片 */
.cxzzt-sales__review {
    position: relative;
    flex: 0 0 auto;
    width: 302px;
    min-height: 208px;
    background: #fff;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 4px 18px -8px rgba(116, 116, 116, 0.18);
    display: flex;
    flex-direction: column;
    gap: 12px;
    overflow: hidden;
    box-sizing: border-box;
}

/* head: 头像 + 名字/角色 */
.cxzzt-sales__review-head {
    display: flex;
    align-items: center;
    gap: 10px;
}

.cxzzt-sales__review-avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(85, 200, 190, 0.2), rgba(58, 135, 251, 0.2));
    color: #3a87fb;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    overflow: hidden;
    flex-shrink: 0;
}
.cxzzt-sales__review-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cxzzt-sales__review-meta {
    flex: 1;
    min-width: 0;
}

.cxzzt-sales__review-name {
    font-size: 14px;
    font-weight: 700;
    color: #1f2233;
    line-height: 1.3;
}
.cxzzt-sales__review-name b {
    font-weight: 700;
}

.cxzzt-sales__review-role {
    font-size: 12px;
    color: #999;
    margin-top: 2px;
    line-height: 1.3;
}

/* 5 星 */
.cxzzt-sales__review-stars {
    display: flex;
    gap: 2px;
    color: #e5e7eb;
    font-size: 14px;
}
.cxzzt-sales__review-stars .is-on {
    color: #ffb800;
}

/* 评价文本 */
.cxzzt-sales__review-content {
    color: #4e5358;
    font-size: 14px;
    margin: 0;
    line-height: 1.7;
    flex: 1;
}

/* 右下角引号装饰（淡色） */
.cxzzt-sales__review-quote {
    position: absolute;
    right: 18px;
    bottom: 14px;
    font-size: 48px;
    color: rgba(91, 155, 255, 0.08);
    pointer-events: none;
    line-height: 1;
}

/* ============================================================
 * 数据信任栏（1:1 还原 zibll-pay 的 .zibapi-stats.layout-split）
 * 左右双栏布局：左 = 介绍文案 + 2 trust，右 = 4 数字卡片
 * ============================================================ */
.cxzzt-sales__stats {
    background: linear-gradient(135deg, rgba(255, 106, 160, 0.04) 0%, rgba(160, 123, 255, 0.06) 100%);
}

.cxzzt-sales__stats-split {
    display: grid;
    grid-template-columns: 1fr 1.05fr;
    gap: 48px;
    align-items: center;
}

/* ---------- 左栏：介绍区 ---------- */
.cxzzt-sales__stats-intro {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.cxzzt-sales__stats-intro-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 999px;
    background: linear-gradient(99deg, rgba(85, 200, 190, 0.15) 0%, rgba(58, 135, 251, 0.15) 100%);
    color: #3a87fb;
    font-size: 13px;
    font-weight: 600;
    align-self: flex-start;
}
.cxzzt-sales__stats-intro-badge i {
    font-size: 14px;
}

.cxzzt-sales__stats-intro-title {
    font-size: 28px;
    font-weight: 800;
    color: #1f2233;
    margin: 0;
    line-height: 1.35;
}
.cxzzt-sales__stats-intro-title em {
    font-style: normal;
    background: linear-gradient(135deg, #ff5e8a 0%, #c86dd7 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    margin: 0 4px;
    font-size: 32px;
}

.cxzzt-sales__stats-intro-subtitle {
    font-size: 13px;
    color: #999;
    margin: 0;
    line-height: 1.7;
}

/* 2 个 trust 信任项 */
.cxzzt-sales__stats-intro-trust {
    display: flex;
    gap: 18px;
    margin-top: 6px;
}
.cxzzt-sales__stats-intro-trust-item {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
}
.cxzzt-sales__stats-intro-trust-icon {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: linear-gradient(145deg, rgba(81, 188, 254, 0.12), rgba(81, 254, 254, 0.12));
    color: #51bcfe;
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.cxzzt-sales__stats-intro-trust-text h6 {
    font-size: 14px;
    font-weight: 700;
    color: #4e5358;
    margin: 0 0 2px;
}
.cxzzt-sales__stats-intro-trust-text p {
    font-size: 12px;
    color: #999;
    margin: 0;
    line-height: 1.3;
}

/* ---------- 右栏：4 张数字卡片（精致版） ----------
 * 设计要点：
 *   - 卡片背景：白 → 顶部 accent 超淺微渐变（以不干扰文字设谊）
 *   - 顶部 accent 色细线（3px）点睹
 *   - 图标块：44×44 + 渐变背景 + hover scale
 *   - 数字：48px 800 + accent 渐变 text-clip（震撼感）
 *   - hover：整卡 lift -8px + 阴影加深 + 图标 scale
 */
.cxzzt-sales__stats-cards {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

/* 单卡片 */
.cxzzt-sales__stats-card {
    --stats-color: #2a6fde;
    --stats-color-2: #5ba0ff;          /* 渐变第二色 */
    --stats-color-soft: rgba(82, 153, 251, 0.12);
    --stats-color-softer: rgba(82, 153, 251, 0.05);
    --stats-decor-back: rgba(82, 153, 251, 0.10);
    --stats-decor-front: rgba(82, 153, 251, 0.20);
    position: relative;
    background: linear-gradient(180deg, #fff 0%, #fff 65%, var(--stats-color-softer) 100%);
    border-radius: 22px;
    padding: 24px 18px 56px;
    box-shadow: 0 4px 16px -8px rgba(31, 36, 51, 0.12);
    overflow: hidden;
    transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1),
                box-shadow 0.4s cubic-bezier(0.22, 1, 0.36, 1);
    isolation: isolate;
}
/* 顶部 accent 细线（8 堆叠亢点睹色） */
.cxzzt-sales__stats-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--stats-color), var(--stats-color-2));
    opacity: 0.85;
    z-index: 2;
}
.cxzzt-sales__stats-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 24px 48px -20px rgba(31, 36, 51, 0.20);
}
.cxzzt-sales__stats-card:hover .cxzzt-sales__stats-card-icon {
    transform: scale(1.08) rotate(-3deg);
}

/* 6 种 accent（加 --stats-color-2 作为渐变第二色 + --stats-color-softer 背景极淺） */
.cxzzt-sales__stats-card--pink {
    --stats-color: #e9407a;
    --stats-color-2: #ff7aa0;
    --stats-color-soft: rgba(233, 64, 122, 0.12);
    --stats-color-softer: rgba(233, 64, 122, 0.05);
    --stats-decor-back: rgba(255, 120, 160, 0.12);
    --stats-decor-front: rgba(255, 94, 138, 0.22);
}
.cxzzt-sales__stats-card--purple {
    --stats-color: #6a5acd;
    --stats-color-2: #9888ee;
    --stats-color-soft: rgba(106, 90, 205, 0.12);
    --stats-color-softer: rgba(106, 90, 205, 0.05);
    --stats-decor-back: rgba(130, 115, 255, 0.12);
    --stats-decor-front: rgba(106, 90, 205, 0.20);
}
.cxzzt-sales__stats-card--orange {
    --stats-color: #d97b2e;
    --stats-color-2: #ffa55c;
    --stats-color-soft: rgba(217, 123, 46, 0.12);
    --stats-color-softer: rgba(217, 123, 46, 0.05);
    --stats-decor-back: rgba(255, 175, 90, 0.14);
    --stats-decor-front: rgba(255, 145, 60, 0.20);
}
.cxzzt-sales__stats-card--blue {
    --stats-color: #2a6fde;
    --stats-color-2: #5ba0ff;
    --stats-color-soft: rgba(82, 153, 251, 0.12);
    --stats-color-softer: rgba(82, 153, 251, 0.05);
    --stats-decor-back: rgba(82, 153, 251, 0.12);
    --stats-decor-front: rgba(42, 111, 222, 0.20);
}
.cxzzt-sales__stats-card--green {
    --stats-color: #1f9c63;
    --stats-color-2: #4dd296;
    --stats-color-soft: rgba(31, 156, 99, 0.12);
    --stats-color-softer: rgba(31, 156, 99, 0.05);
    --stats-decor-back: rgba(60, 200, 140, 0.12);
    --stats-decor-front: rgba(31, 156, 99, 0.20);
}
.cxzzt-sales__stats-card--red {
    --stats-color: #d94343;
    --stats-color-2: #ff7a7a;
    --stats-color-soft: rgba(217, 67, 67, 0.12);
    --stats-color-softer: rgba(217, 67, 67, 0.05);
    --stats-decor-back: rgba(255, 100, 100, 0.12);
    --stats-decor-front: rgba(217, 67, 67, 0.20);
}

/* 卡片 icon block：44×44 + accent 渐变背景 + hover scale */
.cxzzt-sales__stats-card-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--stats-color-soft), var(--stats-color-softer));
    color: var(--stats-color);
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 14px;
    position: relative;
    z-index: 1;
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
    /* 软阴影 + 边框 */
    box-shadow: 0 4px 12px -6px var(--stats-color-soft),
                inset 0 0 0 1px var(--stats-color-softer);
}

/* 数字 + 单位（渐变 text-clip，字号自适应卡片宽度）*/
.cxzzt-sales__stats-card-value {
    display: flex;
    align-items: baseline;
    gap: 3px;
    position: relative;
    z-index: 1;
    /* 防止 5 位数字溢出窄卡片，nowrap + 容器收紧 */
    white-space: nowrap;
    min-width: 0;
}
.cxzzt-sales__stats-card-num {
    /* clamp 自适应：5 位数字（如 50000）在 145px 卡片内不溢出
     *   窗口 1440 → 容器宽 ~145，可用 ~109px
     *   5 字符 × 0.55em × font-size = 字符总宽
     *   font-size 32: 5×0.55×32 = 88px + 单位 + gap ≈ 99px ✓
     */
    font-size: clamp(24px, 2.4vw, 32px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.04em;          /* 字间距收紧 1px */
    font-variant-numeric: tabular-nums; /* 等宽数字，避免字宽抖动 */
    /* 渐变 text-clip：accent 纯色 → accent 亮色 */
    background: linear-gradient(135deg, var(--stats-color) 0%, var(--stats-color-2) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}
.cxzzt-sales__stats-card-unit {
    font-size: clamp(13px, 1.2vw, 16px);
    font-weight: 700;
    color: var(--stats-color);
    line-height: 1;
}

.cxzzt-sales__stats-card-label {
    font-size: 14px;
    color: #6b7280;
    margin-top: 8px;
    position: relative;
    z-index: 1;
    font-weight: 500;
}

/* 分隔线（暂时不展示，留位） */
.cxzzt-sales__stats-card-divider {
    display: none;
}

/* 底部波浪装饰 SVG（用主色填充，高度减柔和） */
.cxzzt-sales__stats-card-decor {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 42%;
    pointer-events: none;
    z-index: 0;
    transition: opacity 0.35s ease;
    opacity: 0.85;
}
.cxzzt-sales__stats-card:hover .cxzzt-sales__stats-card-decor {
    opacity: 1;
}
.cxzzt-sales__stats-card-decor .decor-back  { fill: var(--stats-decor-back); }
.cxzzt-sales__stats-card-decor .decor-front { fill: var(--stats-decor-front); }

/* 暗色模式 */
body.theme-dark .cxzzt-sales__stats-card {
    background: linear-gradient(180deg, rgba(27, 30, 37, 0.85) 0%, rgba(27, 30, 37, 0.85) 65%, var(--stats-color-softer) 100%);
    box-shadow: 0 4px 16px -8px rgba(0, 0, 0, 0.4);
}
body.theme-dark .cxzzt-sales__stats-card:hover {
    box-shadow: 0 24px 48px -20px rgba(0, 0, 0, 0.55);
}
body.theme-dark .cxzzt-sales__stats-card-label {
    color: rgba(255, 255, 255, 0.65);
}
body.theme-dark .cxzzt-sales__stats-card-unit {
    color: var(--stats-color-2);
}

/* ============================================================
 * FAQ + 教程文档（1:1 还原 zibll-pay 的 .zibapi-faq-block 双栏布局）
 *
 * 整体结构：搜索框 → 主体（左 FAQ 2 列 870 + 右 aside 376）
 *   搜索框：白底 999 radius，紫蓝渐变按钮
 *   FAQ summary 卡片：430 宽 / 18 radius / 浅阴影 / 28×28 圆角徽章 5 色循环
 *   aside doc-card：376 宽 / 18 radius / 浅阴影 / 渐变图标 + 教程列表
 *   aside help-card：376 宽 / 紫蓝渐变背景 / 白色按钮
 * ============================================================ */
.cxzzt-sales__faq-block {
    --faq-radius: 18px;
}

/* ---------- 搜索框 ---------- */
.cxzzt-sales__faq-search-wrap {
    display: flex;
    justify-content: center;
    margin: -10px auto 32px;
}
.cxzzt-sales__faq-search-form {
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 640px;
    height: 52px;
    background: #fff;
    border-radius: 999px;
    padding: 6px 6px 6px 14px;
    box-shadow: 0 1px 10px 0 rgba(72, 80, 140, 0.10);
    gap: 8px;
}
.cxzzt-sales__faq-search-icon {
    color: #999;
    font-size: 16px;
    flex-shrink: 0;
}
.cxzzt-sales__faq-search-input {
    flex: 1;
    border: 0;
    background: transparent;
    color: #4e5358;
    font-size: 14px;
    padding: 10px 8px;
    outline: 0;
    min-width: 0;
}
.cxzzt-sales__faq-search-input::placeholder {
    color: #b1b1b1;
}
.cxzzt-sales__faq-search-btn {
    border: 0;
    background: linear-gradient(135deg, #8e54e9 0%, #4776e6 100%);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    padding: 0 22px;
    height: 40px;
    border-radius: 999px;
    cursor: pointer;
    flex-shrink: 0;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.cxzzt-sales__faq-search-btn:hover {
    box-shadow: 0 8px 18px -6px rgba(71, 118, 230, 0.55);
    transform: translateY(-1px);
}

/* ---------- 主体：左 FAQ 870 + 右 aside 376 ---------- */
.cxzzt-sales__faq-main {
    display: grid;
    grid-template-columns: minmax(0, 870fr) minmax(0, 376fr);
    gap: 24px;
    align-items: start;
}

/* 左栏 FAQ 列表：2 列网格 summary 卡片 */
.cxzzt-sales__faq-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    background: transparent;
    box-shadow: none;
    padding: 0;
}

/* 单条 FAQ summary 卡片 */
.cxzzt-sales__faq-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: #fff;
    border-radius: var(--faq-radius);
    box-shadow: 0 4px 12px -6px rgba(116, 116, 116, 0.08);
    padding: 16px;
    color: #4e5358;
    font-size: 14px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.cxzzt-sales__faq-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 24px -10px rgba(91, 155, 255, 0.20);
}

/* 序号徽章 28×28 方角，5 色循环 */
.cxzzt-sales__faq-badge {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    line-height: 1;
}
.cxzzt-sales__faq-badge--purple { background: linear-gradient(135deg, #8e54e9, #6e49dd); }
.cxzzt-sales__faq-badge--pink   { background: linear-gradient(135deg, #ff5e8a, #e9407a); }
.cxzzt-sales__faq-badge--green  { background: linear-gradient(135deg, #4cd9a4, #2ec48b); }
.cxzzt-sales__faq-badge--orange { background: linear-gradient(135deg, #ffb86b, #ff9d3d); }
.cxzzt-sales__faq-badge--blue   { background: linear-gradient(135deg, #6aa6ff, #4776e6); }

/* 文本块（问题 + 预览答案） */
.cxzzt-sales__faq-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.cxzzt-sales__faq-q {
    font-size: 15px;
    font-weight: 700;
    color: #4e5358;
    line-height: 1.4;
}
.cxzzt-sales__faq-preview {
    font-size: 12.5px;
    color: #999;
    line-height: 1.6;
    /* 多行省略：最多显示 3 行 */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.cxzzt-sales__faq-preview a {
    color: #e9407a;
}

/* 右侧 chevron 箭头 */
.cxzzt-sales__faq-chevron {
    color: #b1b1b1;
    font-size: 12px;
    margin-top: 8px;
    flex-shrink: 0;
}

/* ---------- 右栏 aside（doc-card + help-card） ---------- */
.cxzzt-sales__faq-aside {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* 教程文档卡片 */
.cxzzt-sales__faq-doc-card {
    background: #fff;
    border-radius: var(--faq-radius);
    box-shadow: 0 0 10px 0 rgba(116, 116, 116, 0.08);
    padding: 15px;
}

.cxzzt-sales__faq-doc-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    padding: 0 6px;
}
.cxzzt-sales__faq-doc-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: linear-gradient(135deg, #6e49dd, #5a8cf8);
    color: #fff;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.cxzzt-sales__faq-doc-text {
    flex: 1;
    min-width: 0;
}
.cxzzt-sales__faq-doc-title {
    font-size: 16px;
    font-weight: 700;
    color: #4e5358;
    margin: 0 0 2px;
    line-height: 1.3;
}
.cxzzt-sales__faq-doc-desc {
    font-size: 12.5px;
    color: #999;
    margin: 0;
    line-height: 1.4;
}

/* 教程列表（无背景，每项之间细分隔） */
.cxzzt-sales__faq-doc-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.cxzzt-sales__faq-doc-list li + li {
    border-top: 1px solid rgba(0, 0, 0, 0.04);
}
.cxzzt-sales__faq-doc-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 6px;
    color: #4e5358;
    text-decoration: none;
    transition: color 0.2s ease;
}
.cxzzt-sales__faq-doc-link:hover {
    color: #4776e6;
}
.cxzzt-sales__faq-doc-link-ico {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: linear-gradient(145deg, rgba(81, 188, 254, 0.10), rgba(81, 254, 254, 0.10));
    color: #51bcfe;
    font-size: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.cxzzt-sales__faq-doc-link-mid {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.cxzzt-sales__faq-doc-link-title {
    font-size: 14px;
    font-weight: 600;
    color: inherit;
    line-height: 1.3;
    display: flex;
    align-items: center;
    gap: 6px;
}
.cxzzt-sales__faq-doc-link-badge {
    font-size: 11px;
    color: #e9407a;
    background: rgba(233, 64, 122, 0.10);
    padding: 1px 6px;
    border-radius: 4px;
    font-weight: 500;
    line-height: 1.4;
}
.cxzzt-sales__faq-doc-link-desc {
    font-size: 12px;
    color: #999;
    line-height: 1.3;
}
.cxzzt-sales__faq-doc-link-go {
    font-size: 12.5px;
    color: #b1b1b1;
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
    transition: color 0.2s ease, transform 0.2s ease;
}
.cxzzt-sales__faq-doc-link:hover .cxzzt-sales__faq-doc-link-go {
    color: #4776e6;
    transform: translateX(2px);
}

/* 帮助卡片（紫蓝渐变） */
.cxzzt-sales__faq-help-card {
    background: linear-gradient(135deg, #8e54e9 0%, #4776e6 100%);
    color: #fff;
    border-radius: var(--faq-radius);
    padding: 20px;
    box-shadow: 0 14px 36px -18px rgba(71, 118, 230, 0.55);
}

.cxzzt-sales__faq-help-top {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}
.cxzzt-sales__faq-help-icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.20);
    color: #fff;
    font-size: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.cxzzt-sales__faq-help-text {
    flex: 1;
    min-width: 0;
}
.cxzzt-sales__faq-help-title {
    font-size: 16px;
    font-weight: 700;
    color: #fff;
    margin: 0 0 4px;
    line-height: 1.3;
}
.cxzzt-sales__faq-help-sub {
    font-size: 12.5px;
    color: rgba(255, 255, 255, 0.85);
    margin: 0;
    line-height: 1.5;
}

/* 帮助按钮（白底紫字胶囊） */
.cxzzt-sales__faq-help-btn.cxzzt-sales__cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 18px;
    background: #fff;
    color: #6d4ddf;
    border: 0;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.cxzzt-sales__faq-help-btn.cxzzt-sales__cta:hover {
    transform: translateY(-2px);
    background: #fff;
    color: #4776e6;
    box-shadow: 0 8px 18px -6px rgba(0, 0, 0, 0.18);
}

/* ---------- 暗色模式：FAQ 区 ---------- */
body.theme-dark .cxzzt-sales__faq-search-form {
    background: rgba(27, 30, 37, 0.85);
}
body.theme-dark .cxzzt-sales__faq-search-input {
    color: rgba(255, 255, 255, 0.92);
}
body.theme-dark .cxzzt-sales__faq-item {
    background: rgba(27, 30, 37, 0.85);
    box-shadow: 0 4px 12px -6px rgba(0, 0, 0, 0.4);
}
body.theme-dark .cxzzt-sales__faq-q,
body.theme-dark .cxzzt-sales__faq-doc-title,
body.theme-dark .cxzzt-sales__faq-doc-link-title {
    color: rgba(255, 255, 255, 0.92);
}
body.theme-dark .cxzzt-sales__faq-doc-card {
    background: rgba(27, 30, 37, 0.85);
    box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.4);
}
body.theme-dark .cxzzt-sales__faq-doc-list li + li {
    border-top-color: rgba(255, 255, 255, 0.06);
}

/* ============================================================
 * 响应式
 * ============================================================ */
@media (max-width: 1199px) {
    .cxzzt-sales__features-row--small {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .cxzzt-sales__showcase-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 991px) {
    .cxzzt-sales__section {
        padding: 64px 0;
    }

    .cxzzt-sales__hero {
        padding: 64px 0 72px;
    }

    .cxzzt-sales__hero-inner {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .cxzzt-sales__plan-cards {
        grid-template-columns: 1fr;
        max-width: 460px;
        margin: 0 auto;
        gap: 18px;
    }
    .cxzzt-sales__plan-trust-bar {
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: 18px 14px;
    }
    .cxzzt-sales__plan-trust-item {
        flex: 1 1 calc(50% - 14px);
        min-width: 0;
    }

    .cxzzt-sales__features-row--large,
    .cxzzt-sales__features-row--medium {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    /* fi 区：双栏改单列，图在下文在上 */
    .cxzzt-sales__fi-row,
    .cxzzt-sales__fi--media-left .cxzzt-sales__fi-row {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .cxzzt-sales__fi--media-left .cxzzt-sales__fi-text,
    .cxzzt-sales__fi-text  { order: 1; }
    .cxzzt-sales__fi--media-left .cxzzt-sales__fi-media,
    .cxzzt-sales__fi-media { order: 2; justify-self: stretch; max-width: 100%; }
    .cxzzt-sales__fi-title    { font-size: 28px; line-height: 1.3; }
    .cxzzt-sales__fi-stat-num { font-size: 56px; }
    .cxzzt-sales__fi-stat     { margin-bottom: 40px; }
    .cxzzt-sales__features-row--small {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .cxzzt-sales__feature--large .cxzzt-sales__feature-body {
        padding: 22px 24px;
    }
    .cxzzt-sales__showcase-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cxzzt-sales__stats-split {
        grid-template-columns: 1fr;
        gap: 32px;
    }
    .cxzzt-sales__stats-cards {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .cxzzt-sales__stats-card-num {
        font-size: 32px;
    }

    .cxzzt-sales__faq-main {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .cxzzt-sales__faq-aside {
        flex-direction: row;
        gap: 16px;
    }
    .cxzzt-sales__faq-doc-card,
    .cxzzt-sales__faq-help-card {
        flex: 1;
    }
}

@media (max-width: 640px) {
    .cxzzt-sales__container {
        padding: 0 16px;
    }

    .cxzzt-sales__section {
        padding: 48px 0;
    }

    .cxzzt-sales__hero {
        padding: 48px 0 56px;
    }

    .cxzzt-sales__section-head {
        margin-bottom: 32px;
    }

    .cxzzt-sales__features-row--large,
    .cxzzt-sales__features-row--medium,
    .cxzzt-sales__features-row--small {
        grid-template-columns: 1fr;
    }
    .cxzzt-sales__feature-title {
        font-size: 18px;
    }
    .cxzzt-sales__showcase-grid {
        grid-template-columns: 1fr;
    }

    .cxzzt-sales__stats-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .cxzzt-sales__stats-intro-trust {
        flex-direction: column;
    }
    .cxzzt-sales__stats-intro-title {
        font-size: 24px;
    }
    .cxzzt-sales__stats-intro-title em {
        font-size: 28px;
    }

    .cxzzt-sales__faq-list {
        grid-template-columns: 1fr;
    }
    .cxzzt-sales__faq-aside {
        flex-direction: column;
    }

    .cxzzt-sales__hero-ctas .cxzzt-sales__cta {
        flex: 1 1 auto;
    }

    .cxzzt-sales__review {
        width: min(280px, 78vw);
    }

    .cxzzt-sales__plan-price-main {
        font-size: 36px;
    }
    .cxzzt-sales__plan-price-prefix {
        font-size: 16px;
    }
    .cxzzt-sales__plan-title {
        font-size: 22px;
    }
    .cxzzt-sales__plan-inner {
        padding: 22px 18px 18px;
    }
}

/* ============================================================
 * 暗色模式 - 跟随父主题 body.theme-dark
 * 主容器不强制背景；装饰性区块用半透明叠加，让父主题暗色背景透过
 * ============================================================ */
body.theme-dark .cxzzt-sales,
.cxzzt-sales.is-dark {
    --cs-bg: transparent;
    --cs-card: #1b1e25;
    --cs-text: #e7e9ee;
    --cs-text-soft: #b9bdc6;
    --cs-text-mute: #8a8f9a;
    --cs-border: #262a33;
    --cs-shadow-sm: 0 4px 16px rgba(0, 0, 0, 0.3);
    --cs-shadow-md: 0 12px 32px rgba(0, 0, 0, 0.4);
    --cs-shadow-lg: 0 24px 60px rgba(0, 0, 0, 0.5);
    --cs-brand-soft: rgba(91, 108, 255, 0.18);
}

body.theme-dark .cxzzt-sales__hero-badge {
    background: rgba(91, 108, 255, 0.18);
    border-color: rgba(91, 108, 255, 0.32);
}

body.theme-dark .cxzzt-sales__hero-price {
    background: rgba(255, 106, 61, 0.10);
    border-color: rgba(255, 106, 61, 0.25);
}

body.theme-dark .cxzzt-sales__hero-float-icon {
    background: linear-gradient(135deg, #2a2d36, #1f2229);
    box-shadow: 0 14px 32px rgba(0, 0, 0, 0.45);
}

body.theme-dark .cxzzt-sales__hero-float-icon--tl { background: linear-gradient(135deg, #2a2d36, #2a2336); }
body.theme-dark .cxzzt-sales__hero-float-icon--tr { background: linear-gradient(135deg, #2a2d36, #36281e); }
body.theme-dark .cxzzt-sales__hero-float-icon--bl { background: linear-gradient(135deg, #2a2d36, #2f2a1b); }
body.theme-dark .cxzzt-sales__hero-float-icon--br { background: linear-gradient(135deg, #2a2d36, #1d2f29); }

body.theme-dark .cxzzt-sales__hero-showcase-placeholder {
    background: linear-gradient(135deg, rgba(124, 92, 255, 0.12), rgba(160, 123, 255, 0.18));
    border-color: rgba(124, 92, 255, 0.32);
}

body.theme-dark .cxzzt-sales__reviews {
    background: linear-gradient(180deg, transparent 0%, rgba(124, 92, 255, 0.12) 100%);
}

body.theme-dark .cxzzt-sales__stats {
    background: linear-gradient(135deg, rgba(255, 106, 160, 0.10) 0%, rgba(124, 92, 255, 0.14) 100%);
}

body.theme-dark .cxzzt-sales__stats-card {
    background: rgba(27, 30, 37, 0.85);
    box-shadow: 5px 6px 18px 0 rgba(0, 0, 0, 0.4);
}
body.theme-dark .cxzzt-sales__stats-card-label,
body.theme-dark .cxzzt-sales__stats-intro-subtitle,
body.theme-dark .cxzzt-sales__stats-intro-trust-text p {
    color: rgba(255, 255, 255, 0.65);
}
body.theme-dark .cxzzt-sales__stats-intro-title,
body.theme-dark .cxzzt-sales__stats-intro-trust-text h6 {
    color: rgba(255, 255, 255, 0.92);
}

/* ---------- 暗色模式：价格卡片 ---------- */
body.theme-dark .cxzzt-sales__plan-inner {
    background: #1b1e25;
    box-shadow: 0 0 18px 0 rgba(0, 0, 0, 0.5);
}
body.theme-dark .cxzzt-sales__plan-title {
    color: #f5f5f7;
}
body.theme-dark .cxzzt-sales__plan-feature {
    color: rgba(255, 255, 255, 0.78);
}
body.theme-dark .cxzzt-sales__plan-divider {
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.08) 20%, rgba(255, 255, 255, 0.08) 80%, transparent);
}
body.theme-dark .cxzzt-sales__plan--featured .cxzzt-sales__plan-inner {
    background: #1b1e25;
    border-color: rgba(255, 94, 138, 0.55);
}

/* ---------- 暗色模式：信任栏 + footnote ---------- */
body.theme-dark .cxzzt-sales__plan-trust-bar {
    background: rgba(27, 30, 37, 0.85);
    box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.4);
}
body.theme-dark .cxzzt-sales__plan-trust-title {
    color: rgba(255, 255, 255, 0.92);
}

/* ============================================================
 * ★ 视觉增强 + 交互优化层（最末层覆盖，便于全局调整）
 *
 * 模块清单：
 *   1. 滚动进入渐入动画（IntersectionObserver hook .cxzzt-sales-in）
 *   2. section head 装饰升级（左侧竖条 + 标题悬停下划线）
 *   3. focus-visible 可访问性（键盘 Tab 蓝色描边环）
 *   4. CTA 按钮点击波纹 ripple（::after 伪元素 + JS 触发 class）
 *   5. 价格卡片 hover lift（普通卡 + featured 卡呼吸光晕）
 *   6. 生态卡片 hover lift（多色 accent 阴影）
 *   7. FAQ 展开箭头旋转
 *   8. 锚点滚动后 section flash 高亮
 *   9. fi-tab 切换 panel 淡入
 *  10. Hero 装饰 blob 光晕背景
 * ============================================================ */

/* ---- 1. 滚动渐入：默认隐藏，进入视口后 .cxzzt-sales-in 显示 ---- */
.cxzzt-sales__hero,
.cxzzt-sales__section {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1), transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity, transform;
}
.cxzzt-sales__hero.cxzzt-sales-in,
.cxzzt-sales__section.cxzzt-sales-in {
    opacity: 1;
    transform: translateY(0);
}
/* 减弱动画偏好：禁用所有 transform / opacity，防止晕动 */
@media (prefers-reduced-motion: reduce) {
    .cxzzt-sales__hero,
    .cxzzt-sales__section {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}
/* 子项 stagger：进入后子级延迟出现（仅价格卡 / 生态卡） */
.cxzzt-sales-in .cxzzt-sales__plan,
.cxzzt-sales-in .cxzzt-sales__feature {
    animation: cxzzt-stagger-up 0.6s cubic-bezier(0.22, 1, 0.36, 1) backwards;
}
.cxzzt-sales-in .cxzzt-sales__plan:nth-child(1)    { animation-delay: 0.05s; }
.cxzzt-sales-in .cxzzt-sales__plan:nth-child(2)    { animation-delay: 0.15s; }
.cxzzt-sales-in .cxzzt-sales__plan:nth-child(3)    { animation-delay: 0.25s; }
.cxzzt-sales-in .cxzzt-sales__feature:nth-child(1) { animation-delay: 0.05s; }
.cxzzt-sales-in .cxzzt-sales__feature:nth-child(2) { animation-delay: 0.10s; }
.cxzzt-sales-in .cxzzt-sales__feature:nth-child(3) { animation-delay: 0.15s; }
.cxzzt-sales-in .cxzzt-sales__feature:nth-child(4) { animation-delay: 0.20s; }
.cxzzt-sales-in .cxzzt-sales__feature:nth-child(5) { animation-delay: 0.25s; }
@keyframes cxzzt-stagger-up {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ---- 2. section head 装饰升级 ---- */
.cxzzt-sales__section-head {
    position: relative;
}
.cxzzt-sales__section-title {
    position: relative;
    display: inline-block;
}
/* 标题下方装饰小条（左对齐渐变） */
.cxzzt-sales__section-title::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -10px;
    transform: translateX(-50%);
    width: 56px;
    height: 4px;
    border-radius: 2px;
    background: linear-gradient(90deg, #2b7cff, #1ec8a8);
    opacity: 0.85;
}
.cxzzt-sales__section-subtitle {
    margin-top: 22px;  /* 让出装饰条空间 */
}
/* 暗色模式装饰条更柔和 */
body.theme-dark .cxzzt-sales__section-title::after {
    opacity: 0.7;
}

/* ---- 3. focus-visible 键盘可访问性 ---- */
.cxzzt-sales a:focus-visible,
.cxzzt-sales button:focus-visible,
.cxzzt-sales summary:focus-visible,
.cxzzt-sales [role="button"]:focus-visible,
.cxzzt-sales input:focus-visible {
    outline: 2px solid #4776e6;
    outline-offset: 3px;
    border-radius: 6px;
}
/* 鼠标点击时不显示 outline（仅键盘导航） */
.cxzzt-sales :focus:not(:focus-visible) {
    outline: none;
}

/* ---- 4. CTA 按钮点击波纹 ripple（PHP/JS 给 .cxzzt-cta 加 .is-rippling class） ---- */
.cxzzt-cta,
.cxzzt-sales__plan-btn,
.cxzzt-sales__faq-search-btn {
    position: relative;
    overflow: hidden;
}
.cxzzt-cta::after,
.cxzzt-sales__plan-btn::after,
.cxzzt-sales__faq-search-btn::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.45);
    transform: translate(-50%, -50%);
    pointer-events: none;
    opacity: 0;
}
.cxzzt-cta.is-rippling::after,
.cxzzt-sales__plan-btn.is-rippling::after,
.cxzzt-sales__faq-search-btn.is-rippling::after {
    animation: cxzzt-ripple 0.6s ease-out;
}
@keyframes cxzzt-ripple {
    0%   { width: 0;     height: 0;     opacity: 0.6; }
    100% { width: 320px; height: 320px; opacity: 0;   }
}

/* ---- 5. 价格卡片 hover lift + featured 呼吸光晕 ---- */
.cxzzt-sales__plan-inner {
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
                box-shadow 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}
.cxzzt-sales__plan:hover .cxzzt-sales__plan-inner {
    transform: translateY(-6px);
    box-shadow: 0 16px 40px -16px rgba(31, 36, 51, 0.18);
}
/* featured 卡片基础呼吸光晕（外发光） */
.cxzzt-sales__plan--featured .cxzzt-sales__plan-inner {
    box-shadow: 0 0 0 0 rgba(255, 106, 160, 0.0),
                0 12px 32px -16px rgba(31, 36, 51, 0.16);
    animation: cxzzt-plan-glow 3.6s ease-in-out infinite;
}
.cxzzt-sales__plan--featured:hover .cxzzt-sales__plan-inner {
    animation-play-state: paused;
}
@keyframes cxzzt-plan-glow {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(255, 106, 160, 0.0),
                    0 12px 32px -16px rgba(31, 36, 51, 0.16);
    }
    50% {
        box-shadow: 0 0 0 8px rgba(255, 106, 160, 0.12),
                    0 16px 40px -16px rgba(255, 106, 160, 0.28);
    }
}

/* ---- 6. 生态卡片 hover lift（accent 色阴影） ---- */
.cxzzt-sales__feature {
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
                box-shadow 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}
.cxzzt-sales__feature:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 36px -18px var(--feat-color, rgba(31, 36, 51, 0.18));
}

/* ---- 7. FAQ chevron hover 位移 + 变色（FAQ 当前为静态展示，chevron 仅作视觉反馈） ---- */
.cxzzt-sales__faq-item {
    transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1),
                box-shadow 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}
.cxzzt-sales__faq-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px -14px rgba(31, 36, 51, 0.15);
}
.cxzzt-sales__faq-chevron {
    transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1),
                color 0.25s ease;
    color: rgba(31, 36, 51, 0.4);
}
.cxzzt-sales__faq-item:hover .cxzzt-sales__faq-chevron {
    transform: translateX(3px);
    color: #4776e6;
}

/* ---- 8. 锚点滚动后 section flash 高亮 ---- */
.cxzzt-sales__section.cxzzt-flash::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(43, 124, 255, 0.06), rgba(30, 200, 168, 0.06));
    animation: cxzzt-flash 1.2s ease-out forwards;
    pointer-events: none;
    z-index: 0;
}
@keyframes cxzzt-flash {
    0%   { opacity: 0; }
    20%  { opacity: 1; }
    100% { opacity: 0; }
}

/* ---- 9. fi-tab 切换 panel 淡入 ---- */
.cxzzt-sales__fi-panel.is-active {
    animation: cxzzt-fade-in 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}
@keyframes cxzzt-fade-in {
    from { opacity: 0; transform: scale(0.98); }
    to   { opacity: 1; transform: scale(1);     }
}

/* ---- 10. Hero 区不做自定义背景装饰，保留主题原生风格 ---- */