/* ==========================================================================
   冰蓝网络 · 前台样式
   配色取自「站叔叔」Logo 两色：蓝 #0383BC（主）+ 橙 #F79A01（辅 · 点缀）
   布局：默认容器 1440px，全站 H5 响应式
   ========================================================================== */

/* ---------- 设计令牌 ---------- */
:root {
    /* 品牌蓝（Logo 蓝 #0383BC）—— 主导色：导航 / 标题 / 按钮 / 链接 / 深色区块 */
    --brand: #0383BC;
    --brand-2: #0E97D2;
    --brand-3: #35AFDF;
    --brand-deep: #026A9B;
    --brand-darkest: #0A4467;
    --brand-soft: #E9F5FB;
    --brand-soft-2: #D5EAF6;
    --brand-line: #BFE0F1;
    --brand-rgb: 3, 131, 188;

    /* 品牌橙（Logo 橙 #F79A01）—— 点缀色：价格 / 热销 / 角标 / 转化按钮 */
    --accent: #F79A01;
    --accent-2: #FFB43A;
    --accent-3: #FFC96B;
    --accent-deep: #D17E00;
    --accent-soft: #FFF6E5;
    --accent-line: #FFE2A8;
    --accent-rgb: 247, 154, 1;

    /* 深蓝墨（标题 / 深色区块底） */
    --navy: #0E3A58;
    --navy-2: #12466A;
    --navy-3: #2A5B7A;
    --navy-soft: #F1F7FB;

    /* 文字 */
    --ink: #12324B;
    --ink2: #4C6B84;
    --ink3: #7E97AC;
    --ink4: #A9BCCB;

    /* 线条与背景 */
    --line: #E0EBF3;
    --line-2: #D5E4EE;
    --bg: #F1F7FC;
    --bg-top: #DAEFFF;
    --white: #fff;

    /* 语义色 */
    --green: #4EC76A;
    --green-soft: #EAF9EE;
    --warn: #F79A01;
    --warn-soft: #FFF6E5;
    --danger: #F5222D;
    --danger-soft: #FFF1F0;
    --blue: #0383BC;
    --blue-soft: #E9F5FB;

    /* 尺寸 */
    --radius-sm: 4px;
    --radius: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --container: 1440px;

    /* 阴影（蓝调） */
    --shadow-xs: 0 1px 3px rgba(14, 58, 88, .06);
    --shadow-sm: 0 2px 10px rgba(14, 58, 88, .07);
    --shadow: 0 6px 24px rgba(14, 58, 88, .09);
    --shadow-lg: 0 14px 44px rgba(14, 58, 88, .15);
    --shadow-brand: 0 8px 24px rgba(3, 131, 188, .26);
    --shadow-accent: 0 8px 24px rgba(247, 154, 1, .28);

    /* 兼容旧变量名（后台内页仍在用） */
    --brand-dark: #0E3A58;
}

/* ---------- 基础重置 ---------- */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
                 "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
    font-size: 14px;
    line-height: 1.6;
    color: var(--ink);
    background: var(--bg);
    -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; transition: color .15s; }
a:hover { color: var(--brand); }

img { max-width: 100%; display: block; }

h1, h2, h3, h4 { margin: 0; font-weight: 600; color: var(--navy); line-height: 1.35; }
p { margin: 0 0 10px; }
p:last-child { margin-bottom: 0; }

code {
    background: var(--navy-soft); padding: 2px 6px; border-radius: var(--radius-sm);
    font-family: ui-monospace, "SFMono-Regular", Consolas, monospace; font-size: 12.5px;
    color: var(--navy-3);
}

.container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 24px; }
/* iframe 嵌套页（样板库/案例库）：官方样式 高1800/宽1440，桌面端满宽 1440，窄屏保留页边距 */
.container-flush { padding-left: 0; padding-right: 0; }
@media (max-width: 1487px) { .container-flush { padding-left: 24px; padding-right: 24px; } }
.muted { color: var(--ink3); }
.small { font-size: 12.5px; }
.hint { font-size: 12.5px; color: var(--ink3); margin-top: 4px; }
.g2 > *:nth-child(n+3) { margin-top: 0; }

/* ---------- 按钮 ---------- */
.btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    height: 38px; padding: 0 18px;
    border: 1px solid var(--line); border-radius: var(--radius);
    background: var(--white); color: var(--ink2);
    font-size: 14px; font-weight: 500; font-family: inherit;
    cursor: pointer; white-space: nowrap;
    transition: all .18s ease;
}
.btn:hover { border-color: var(--brand); color: var(--brand); background: var(--brand-soft); }
.btn:active { transform: translateY(1px); }
.btn:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

.btn-primary {
    background: linear-gradient(135deg, var(--brand-3), var(--brand));
    border-color: transparent; color: #fff; font-weight: 600;
    box-shadow: var(--shadow-brand);
}
.btn-primary:hover {
    background: linear-gradient(135deg, var(--brand), var(--brand-deep));
    color: #fff; box-shadow: 0 10px 28px rgba(3, 131, 188, .38);
    transform: translateY(-1px);
}

.btn-danger { background: var(--danger); border-color: transparent; color: #fff; }
.btn-danger:hover { background: #d9363e; color: #fff; border-color: transparent; }

.btn-ghost { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .45); color: #fff; }
.btn-ghost:hover { background: rgba(255, 255, 255, .24); color: #fff; border-color: #fff; }

.btn-lg { height: 46px; padding: 0 30px; font-size: 15px; border-radius: 23px; }
.btn-sm { height: 30px; padding: 0 13px; font-size: 12.5px; }
.btn-block { width: 100%; }

/* ---------- 表格行内操作按钮（编辑/查看/删除 直排） ---------- */
.row-actions { white-space: nowrap; }
.row-actions .btn { margin-right: 6px; }
.row-actions .btn:last-child { margin-right: 0; }

/* ---------- 标签 ---------- */
.tag {
    display: inline-block; padding: 1px 8px; border-radius: var(--radius-sm);
    font-size: 12px; line-height: 18px; white-space: nowrap;
    background: var(--navy-soft); color: var(--ink2);
}
.tag-blue   { background: var(--blue-soft);   color: var(--blue); }
.tag-green  { background: var(--green-soft);  color: #31A34C; }
.tag-orange { background: var(--accent-soft); color: var(--accent-deep); }
.tag-red    { background: var(--danger-soft); color: var(--danger); }
.tag-gray   { background: #EEF3F7;            color: var(--ink3); }

.pill { display: inline-block; padding: 1px 9px; border-radius: 20px; font-size: 12px; font-weight: 500; }
.pill.r { background: var(--danger-soft); color: var(--danger); }
.pill.a { background: var(--accent-soft); color: var(--accent-deep); }
.pill.n { background: var(--blue-soft); color: var(--blue); }
.pill.g { background: var(--green-soft); color: #31A34C; }

/* ---------- 通知条 ---------- */
.alert { padding: 11px 16px; border-radius: var(--radius); margin-bottom: 16px; font-size: 13px; border: 1px solid transparent; }
.alert-success { background: var(--green-soft); border-color: #B7E8C4; color: #237A3A; }
.alert-error   { background: var(--danger-soft); border-color: #FFCCC7; color: #A8071A; }

/* ==========================================================================
   顶部信息条 + 主导航
   ========================================================================== */
.top-bar {
    background: var(--navy); color: #A7AEC3; font-size: 12.5px; line-height: 34px;
}
.top-bar .container { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.top-bar a { color: #A7AEC3; }
.top-bar a:hover { color: #fff; }
.top-bar .tb-left { display: flex; align-items: center; gap: 10px; min-width: 0; }
.top-bar .tb-badge {
    background: var(--brand); color: #fff; padding: 0 7px; border-radius: 3px;
    font-size: 11px; line-height: 18px; flex: none;
}
.top-bar .tb-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.top-bar .tb-right { display: flex; align-items: center; gap: 16px; flex: none; }
.top-bar .tb-tel { color: var(--brand-3); font-weight: 600; }

/* ---------- 头部 ---------- */
.site-header {
    background: #fff; position: sticky; top: 0; z-index: 100;
    box-shadow: 0 1px 0 var(--line), 0 4px 18px rgba(43, 49, 68, .05);
}
.site-header .container { display: flex; align-items: center; gap: 20px; height: 68px; }

/* 双品牌 Logo：左侧「站叔叔」图形 + 竖线分隔 + 右侧「冰蓝网络」文字 */
.logo { display: flex; align-items: center; gap: 13px; font-weight: 700; color: var(--navy); flex: none; }
.logo:hover { color: var(--navy); }
.logo .logo-img { height: 40px; width: auto; display: block; flex: none; }
.logo .logo-split { width: 1px; height: 30px; background: var(--line-2); flex: none; }
.logo .logo-brand {
    font-size: 17px; font-weight: 700; color: var(--navy);
    line-height: 1.25; letter-spacing: .4px; white-space: nowrap;
}
.logo .logo-brand i {
    display: block; font-style: normal; font-size: 10.5px; font-weight: 400;
    color: var(--ink3); letter-spacing: .2px; margin-top: 2px;
}
/* 旧版单字块（保留兼容） */
.logo .logo-mark {
    width: 34px; height: 34px; border-radius: 9px; flex: none;
    background: linear-gradient(135deg, var(--brand-3), var(--brand));
    display: flex; align-items: center; justify-content: center;
    color: #fff; font-size: 18px; font-weight: 800;
    box-shadow: var(--shadow-brand);
}

.nav { display: flex; align-items: center; gap: 2px; flex: 1; min-width: 0; overflow: hidden; }
.nav > a {
    padding: 8px 13px; border-radius: var(--radius); font-size: 14.5px; font-weight: 500;
    color: var(--navy-3); white-space: nowrap; position: relative;
}
.nav > a:hover { color: var(--brand); background: var(--brand-soft); }
.nav > a.active { color: var(--brand); font-weight: 600; }
.nav > a.active::after {
    content: ''; position: absolute; left: 13px; right: 13px; bottom: 0;
    height: 2.5px; border-radius: 2px; background: var(--brand);
}

.header-actions { display: flex; align-items: center; gap: 10px; flex: none; }

/* ==========================================================================
   Hero 首屏
   ========================================================================== */
.hero {
    position: relative; overflow: hidden; color: #fff;
    background: linear-gradient(120deg, #2FA3DB 0%, var(--brand) 46%, #026A9B 100%);
    padding: 68px 0 78px;
}
.hero::before {
    content: ''; position: absolute; width: 620px; height: 620px; border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, .22), transparent 62%);
    top: -230px; right: -140px; pointer-events: none;
}
.hero::after {
    content: ''; position: absolute; inset: 0; pointer-events: none;
    background-image: linear-gradient(rgba(255, 255, 255, .07) 1px, transparent 1px),
                      linear-gradient(90deg, rgba(255, 255, 255, .07) 1px, transparent 1px);
    background-size: 46px 46px;
    -webkit-mask-image: radial-gradient(ellipse at 22% 40%, #000, transparent 76%);
            mask-image: radial-gradient(ellipse at 22% 40%, #000, transparent 76%);
}
.hero .container { position: relative; z-index: 1; }
.hero-inner { display: flex; align-items: center; gap: 46px; }
.hero-copy { flex: 1; min-width: 0; }
.hero-eyebrow {
    display: inline-flex; align-items: center; gap: 7px;
    background: rgba(255, 255, 255, .18); border: 1px solid rgba(255, 255, 255, .32);
    padding: 5px 14px; border-radius: 20px; font-size: 12.5px; margin-bottom: 18px;
    backdrop-filter: blur(6px);
}
.hero h1 {
    color: #fff; font-size: 42px; font-weight: 700; line-height: 1.24;
    letter-spacing: -.5px; margin-bottom: 16px;
}
.hero h1 em { font-style: normal; color: var(--accent-2); }
.hero .lead { font-size: 16px; color: rgba(255, 255, 255, .9); max-width: 560px; margin-bottom: 26px; }
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.hero-stats {
    display: flex; gap: 34px; margin-top: 34px; padding-top: 26px;
    position: relative;
}
.hero-stats::before {
    content: ''; position: absolute; top: 0; left: 0;
    width: 430px; max-width: 100%; height: 1px;
    background: rgba(255, 255, 255, .25);
}
.hero-stats .hs-num { font-size: 26px; font-weight: 700; line-height: 1.2; }
.hero-stats .hs-label { font-size: 12.5px; color: rgba(255, 255, 255, .82); }

/* Hero 右侧产品快捷入口卡片 */
.hero-panel {
    flex: none; width: 352px;
    background: rgba(255, 255, 255, .97); border-radius: var(--radius-xl);
    padding: 22px; box-shadow: 0 20px 56px rgba(4, 60, 92, .28);
}
.hero-panel h3 { font-size: 15px; margin-bottom: 4px; }
.hero-panel .hp-sub { font-size: 12.5px; color: var(--ink3); margin-bottom: 16px; }
.hp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.hp-item {
    display: flex; flex-direction: column; gap: 5px; padding: 12px 13px;
    border: 1px solid var(--line); border-radius: var(--radius);
    background: #FBFDFF; transition: all .18s;
}
.hp-item:hover { border-color: var(--brand-line); background: var(--brand-soft); transform: translateY(-2px); }
.hp-item .hp-name { font-size: 13.5px; font-weight: 600; color: var(--navy); }
.hp-item .hp-desc { font-size: 11.5px; color: var(--ink3); }
.hp-item .hp-price { font-size: 12.5px; color: var(--accent); font-weight: 600; }

/* Hero 面板玻璃浮层（参考 AI 站「深度研究Agent」叠层手法） */
.hero-panel { position: relative; }
.hero-floats { position: absolute; inset: 0; pointer-events: none; z-index: 3; }
.hf-card {
    position: absolute; display: flex; gap: 10px; align-items: flex-start;
    background: rgba(255, 255, 255, .92);
    backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, .78); border-radius: 14px;
    padding: 12px 14px; box-shadow: 0 14px 34px rgba(4, 60, 92, .22);
    animation: hfFloat 4.5s ease-in-out infinite alternate;
}
.hf-icon {
    flex: none; width: 34px; height: 34px; border-radius: 10px;
    display: flex; align-items: center; justify-content: center; color: #fff;
}
.hf-icon svg { width: 18px; height: 18px; }
.hf-body { min-width: 0; }
.hf-title { display: block; font-size: 13px; font-weight: 700; color: var(--navy); line-height: 1.3; }
.hf-desc { display: block; font-size: 11px; color: var(--ink3); margin-top: 2px; line-height: 1.45; }
.hf-tags { display: flex; gap: 5px; margin-top: 7px; flex-wrap: wrap; }
.hf-tag {
    font-style: normal; font-size: 10.5px; line-height: 1; color: #0383BC;
    background: #E8F5FC; border-radius: 20px; padding: 3px 8px;
}
.hf-tag.o { color: #C97A00; background: #FFF4E3; }
.hf-b { right: -24px; top: 46px; width: 226px; animation-delay: 1.2s; }
.hf-b .hf-icon { background: linear-gradient(135deg, #0383BC, #05A3D8); }
.hf-a { left: -96px; top: 96px; width: 252px; }
.hf-a .hf-icon { background: linear-gradient(135deg, #0383BC, #F79A01); }
@keyframes hfFloat { from { transform: translateY(0); } to { transform: translateY(-7px); } }
@media (prefers-reduced-motion: reduce) { .hf-card, .hv-chip { animation: none; } }

/* Hero 右侧「一站式建站」视觉组（替代原产品速览卡，纯 CSS 绘制） */
.hero-visual { flex: none; width: 470px; position: relative; }
.hv-window {
    background: rgba(255, 255, 255, .98); border-radius: var(--radius-xl);
    box-shadow: 0 24px 60px rgba(4, 60, 92, .3); overflow: hidden;
}
.hv-head {
    display: flex; align-items: center; gap: 9px;
    padding: 11px 14px; background: #F6FAFD; border-bottom: 1px solid var(--line);
}
.hv-dots { display: flex; gap: 5px; }
.hv-dots i { width: 8px; height: 8px; border-radius: 50%; }
.hv-dots i:nth-child(1) { background: #FF6B6B; }
.hv-dots i:nth-child(2) { background: #F79A01; }
.hv-dots i:nth-child(3) { background: #12B76A; }
.hv-url {
    flex: 1; font-size: 11.5px; color: var(--ink3); background: #fff;
    border: 1px solid var(--line); border-radius: 8px; padding: 4px 11px;
}
.hv-live {
    display: flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 600;
    color: #0B8A46; background: #E6F7EE; padding: 3px 9px; border-radius: 20px;
}
.hv-live i { width: 6px; height: 6px; border-radius: 50%; background: #12B76A; }
.hv-body { padding: 14px; }
.hv-hero { display: flex; gap: 10px; }
.hv-hero-copy {
    flex: 1.25; border-radius: 12px; padding: 18px 15px;
    background: linear-gradient(160deg, #0383BC, #0AA0C9);
    display: flex; flex-direction: column; gap: 10px; min-height: 126px;
}
.hv-bar { display: block; height: 9px; border-radius: 6px; background: rgba(255, 255, 255, .88); }
.hv-bar.w70 { width: 72%; }
.hv-bar.w45 { width: 46%; background: rgba(255, 255, 255, .5); }
.hv-btn {
    margin-top: auto; align-self: flex-start; font-size: 10.5px; font-weight: 600;
    color: #fff; background: var(--accent, #F79A01); padding: 5px 12px; border-radius: 14px;
}
.hv-hero-img { flex: 1; border-radius: 12px; background: linear-gradient(150deg, #E8F5FC, #FFF4E3); padding: 13px 12px; }
.hv-hero-img span { display: block; height: 8px; border-radius: 6px; background: #CFE3EF; }
.hv-hero-img span + span { width: 62%; background: #F3D9AE; margin-top: 9px; }
.hv-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin-top: 11px; }
.hv-cards i { display: block; height: 54px; border-radius: 10px; background: #F5FAFD; border: 1px solid #E2EEF7; }
.hv-cards i:nth-child(1) { border-top: 2px solid #0383BC; }
.hv-cards i:nth-child(2) { border-top: 2px solid #F79A01; }
.hv-cards i:nth-child(3) { border-top: 2px solid #0AA0C9; }
.hv-steps { display: flex; align-items: center; gap: 9px; padding: 11px 15px 15px; }
.hv-step { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--ink3); }
.hv-step b {
    width: 18px; height: 18px; border-radius: 50%; flex: none;
    background: #EDF3F8; color: var(--ink3); font-size: 10.5px;
    display: flex; align-items: center; justify-content: center;
}
.hv-step.on { color: var(--navy); font-weight: 600; }
.hv-step.on b { background: #0383BC; color: #fff; }
.hv-line { flex: 1; height: 1px; background: var(--line); }
.hv-chip {
    position: absolute; display: flex; align-items: center; gap: 6px;
    background: rgba(255, 255, 255, .92); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, .78); border-radius: 20px;
    padding: 7px 13px; font-size: 11.5px; font-weight: 600; color: var(--navy);
    box-shadow: 0 10px 26px rgba(4, 60, 92, .2);
    animation: hfFloat 4.5s ease-in-out infinite alternate;
}
.hv-chip svg { width: 13px; height: 13px; }
.hv-chip.c1 { top: -16px; left: -24px; color: #0B7A43; animation-delay: .6s; }
.hv-chip.c1 svg { color: #12B76A; }
.hv-chip.c2 { right: -12px; bottom: 74px; color: #C97A00; animation-delay: 2s; }
.hv-chip.c2 svg { color: #F79A01; }

/* ==========================================================================
   区块与标题（大字英文底纹 + 橙色中文，参考 72e 的 FOCUS 手法）
   ========================================================================== */
.section { padding: 62px 0; }
.section.alt { background: #fff; }
.section.dark { background: var(--navy); color: #fff; }
.section.dark .sec-cn { color: #fff; }
.section.dark .sec-desc { color: rgba(255, 255, 255, .72); }
.section.dark .sec-ghost { color: rgba(255, 255, 255, .07); }

.sec-head { margin-bottom: 34px; position: relative; }
.sec-head.center { text-align: center; }
.sec-ghost {
    position: absolute; left: 0; top: -14px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 60px; font-weight: 700; letter-spacing: 2px; line-height: 1;
    color: #E7F0F8; user-select: none; pointer-events: none; white-space: nowrap;
    text-transform: uppercase;
}
.sec-head.center .sec-ghost { left: 50%; transform: translateX(-50%); }
.sec-head.center .sec-cn { display: inline-block; }
.sec-head.center .sec-cn::before,
.sec-head.center .sec-cn::after { display: none; }
.sec-head.center::after {
    content: ''; display: block; width: 56px; height: 3px; border-radius: 2px;
    margin: 15px auto 0;
    background: linear-gradient(90deg, var(--brand), var(--accent));
}
.sec-cn {
    position: relative; font-size: 26px; font-weight: 700; color: var(--navy);
    display: inline-flex; align-items: center; gap: 11px;
}
/* 蓝色竖条（主色） */
.sec-cn::before {
    content: ''; width: 5px; height: 25px; border-radius: 3px; flex: none;
    background: linear-gradient(180deg, var(--brand-3), var(--brand));
}
/* 橙色圆点（点缀色） */
.sec-cn::after {
    content: ''; width: 7px; height: 7px; border-radius: 50%; flex: none;
    background: var(--accent);
}
.sec-cn .sec-cn-sub { color: var(--accent); }
.sec-desc { position: relative; margin-top: 8px; font-size: 14px; color: var(--ink3); }
.sec-desc a.sec-desc-link { color: var(--brand); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.sec-desc a.sec-desc-link:hover { opacity: .82; }
.sec-more { position: absolute; right: 0; bottom: 4px; font-size: 13.5px; color: var(--ink3); }
.sec-more:hover { color: var(--brand); }

/* 兼容旧类名 */
.section-title { position: relative; font-size: 26px; font-weight: 700; color: var(--navy); margin-bottom: 6px; }
.section-title::after {
    content: ''; display: block; width: 40px; height: 3px; border-radius: 2px;
    background: linear-gradient(90deg, var(--brand), var(--accent)); margin-top: 10px;
}

/* ---------- 网格 ---------- */
.grid { display: grid; gap: 18px; }
.g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.g4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* ---------- 产品卡片 ---------- */
.product-card {
    display: flex; flex-direction: column; height: 100%;
    background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg);
    padding: 20px; position: relative; overflow: hidden;
    transition: all .22s cubic-bezier(.4, 0, .2, 1);
}
.product-card::before {
    content: ''; position: absolute; left: 0; top: 0; height: 3px; width: 0;
    background: linear-gradient(90deg, var(--brand), var(--accent)); transition: width .28s;
}
.product-card:hover { border-color: var(--brand-line); box-shadow: var(--shadow); transform: translateY(-4px); }
.product-card:hover::before { width: 100%; }
.product-card h3 { font-size: 16px; margin-bottom: 6px; }
.product-card .pc-desc { font-size: 13px; color: var(--ink3); flex: 1; margin-bottom: 14px; }
.product-card .price {
    display: flex; align-items: baseline; gap: 4px;
    font-size: 24px; font-weight: 700; color: var(--accent); line-height: 1.1;
}
.product-card .price small { font-size: 12.5px; color: var(--ink3); font-weight: 400; }
.product-card .pc-foot {
    margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--line);
    display: flex; align-items: center; justify-content: space-between;
}
.pc-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }

/* ---------- 优势（深色区块） ---------- */
.adv-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.adv-item {
    background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1);
    border-radius: var(--radius-lg); padding: 26px 20px; text-align: center;
    transition: all .22s;
}
.adv-item:hover { background: rgba(3, 131, 188, .13); border-color: rgba(3, 131, 188, .42); transform: translateY(-4px); }
.adv-icon {
    width: 52px; height: 52px; border-radius: 50%; margin: 0 auto 14px;
    background: linear-gradient(135deg, var(--accent-2), var(--accent));
    display: flex; align-items: center; justify-content: center;
    font-size: 23px; color: #fff; box-shadow: 0 8px 22px rgba(247, 154, 1, .32);
}
.adv-item .adv-title { font-size: 15.5px; font-weight: 600; color: #fff; margin-bottom: 7px; }
.adv-item .adv-desc { font-size: 12.8px; color: rgba(255, 255, 255, .68); line-height: 1.65; }

/* ---------- 通用卡片 ---------- */
.card {
    background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg);
    padding: 20px 22px; margin-bottom: 16px; box-shadow: var(--shadow-xs);
}
.card-title {
    font-size: 15px; font-weight: 600; color: #fff;
    margin: 0 0 16px; padding: 0 16px; height: 44px;
    border-radius: var(--radius);
    background: linear-gradient(90deg, var(--brand-deep), var(--brand) 62%, var(--brand-2));
    box-shadow: 0 4px 14px rgba(3, 131, 188, .2);
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
.card-title::before {
    content: ''; width: 3px; height: 16px; border-radius: 2px; margin-right: 10px;
    background: var(--accent); flex: none;
}
.card-title > span:first-child { flex: 1; }

/* ---------- 榜单 / 公告列表 ---------- */
.tabs { display: flex; gap: 22px; border-bottom: 1px solid var(--line); margin-bottom: 16px; }
.tabs a {
    padding: 0 0 11px; font-size: 14.5px; font-weight: 500; color: var(--ink3);
    position: relative;
}
.tabs a.active { color: var(--brand); font-weight: 600; }
.tabs a.active::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 2.5px;
    border-radius: 2px; background: var(--brand);
}

.news-list { list-style: none; padding: 0; margin: 0; }
.news-list li {
    display: flex; align-items: center; gap: 12px; padding: 11px 0;
    border-bottom: 1px dashed var(--line); font-size: 13.5px;
}
.news-list li:last-child { border-bottom: 0; }
.news-list .nl-cat { flex: none; font-size: 12px; color: var(--brand); background: var(--brand-soft); padding: 1px 8px; border-radius: 3px; }
.news-list .nl-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink2); }
.news-list .nl-title:hover { color: var(--brand); }
.news-list .nl-date { flex: none; font-size: 12.5px; color: var(--ink4); }

/* ---------- 面包屑 ---------- */
.crumb { font-size: 13px; color: var(--ink3); padding: 16px 0; }
.crumb a:hover { color: var(--brand); }
.crumb .sep { margin: 0 7px; color: var(--ink4); }

/* ---------- 表格 ---------- */
table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
th {
    text-align: left; padding: 11px 12px; background: var(--navy-soft);
    color: var(--ink2); font-weight: 600; font-size: 13px; white-space: nowrap;
    border-bottom: 1px solid var(--line);
}
th:first-child { border-top-left-radius: var(--radius); }
th:last-child { border-top-right-radius: var(--radius); }
td { padding: 12px; border-bottom: 1px solid var(--line); color: var(--ink2); vertical-align: middle; }
tbody tr:hover td { background: #FBFDFF; }
tbody tr:last-child td { border-bottom: 0; }

/* ---------- 表单 ---------- */
.form-group { margin-bottom: 16px; }
.form-group > label { display: block; font-size: 13px; font-weight: 500; color: var(--ink2); margin-bottom: 6px; }
.form-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; }

.form-control {
    width: 100%; height: 38px; padding: 0 12px;
    border: 1px solid var(--line-2); border-radius: var(--radius);
    background: #fff; color: var(--ink); font-size: 13.5px; font-family: inherit;
    transition: border-color .15s, box-shadow .15s;
}
.form-control:hover { border-color: #BFD4E2; }
.form-control:focus {
    outline: none; border-color: var(--brand);
    box-shadow: 0 0 0 3px rgba(3, 131, 188, .14);
}
select.form-control { cursor: pointer; }
textarea.form-control { height: auto; padding: 10px 12px; line-height: 1.6; resize: vertical; }

/* ==========================================================================
   产品详情页
   ========================================================================== */
.detail-wrap { display: grid; grid-template-columns: 1fr 330px; gap: 22px; align-items: start; }
.detail-hero {
    background: linear-gradient(120deg, #EEF7FD, #FAFDFF);
    border: 1px solid var(--brand-line); border-radius: var(--radius-lg);
    padding: 28px 30px;
}
.detail-hero h1 { font-size: 28px; margin-bottom: 10px; }
.detail-hero .dh-sub { color: var(--ink3); font-size: 14px; margin-bottom: 18px; }
.detail-price { display: flex; align-items: baseline; gap: 6px; }
.detail-price .dp-num { font-size: 36px; font-weight: 700; color: var(--accent); line-height: 1; }
.detail-price .dp-unit { font-size: 13.5px; color: var(--ink3); }

.sku-list { display: flex; flex-direction: column; gap: 9px; }
.sku-item {
    display: flex; align-items: center; justify-content: space-between; gap: 14px;
    padding: 13px 16px; border: 1.5px solid var(--line); border-radius: var(--radius);
    transition: all .18s; cursor: pointer;
}
.sku-item:hover, .sku-item.on { border-color: var(--brand); background: var(--brand-soft); }
.sku-item .sku-name { font-size: 14px; font-weight: 600; color: var(--navy); }
.sku-item .sku-meta { font-size: 12.5px; color: var(--ink3); margin-top: 3px; }
.sku-item .sku-price { font-size: 19px; font-weight: 700; color: var(--accent); white-space: nowrap; }

.spec-list { list-style: none; padding: 0; margin: 0; }
.spec-list li {
    display: flex; gap: 10px; padding: 9px 0; font-size: 13.5px;
    border-bottom: 1px dashed var(--line); color: var(--ink2);
}
.spec-list li:last-child { border-bottom: 0; }
.spec-list li::before {
    content: ''; width: 6px; height: 6px; border-radius: 50%; margin-top: 7px;
    background: var(--brand); flex: none;
}

/* ==========================================================================
   侧边 / 客户中心
   ========================================================================== */
.side-nav { list-style: none; padding: 0; margin: 0; }
.side-nav a {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
    padding: 11px 14px; border-radius: var(--radius); font-size: 14px;
    color: var(--ink2); margin-bottom: 4px;
}
.side-nav a:hover { background: var(--brand-soft); color: var(--brand); }
.side-nav a.active { background: var(--brand); color: #fff; font-weight: 600; }

.expire-bar { height: 6px; border-radius: 3px; background: var(--navy-soft); overflow: hidden; margin-top: 7px; }
.expire-bar > i {
    display: block; height: 100%; border-radius: 3px;
    background: linear-gradient(90deg, var(--brand-3), var(--brand));
}

/* 空状态 */
.empty { text-align: center; padding: 46px 20px; color: var(--ink3); }
.empty .empty-icon { font-size: 40px; opacity: .32; margin-bottom: 12px; }

/* ==========================================================================
   登录页
   ========================================================================== */
.login-wrap {
    min-height: 100vh; display: flex; align-items: center; justify-content: center;
    padding: 30px 20px; position: relative; overflow: hidden;
    background: linear-gradient(135deg, #EAF5FD 0%, #F5F6F9 52%, #E8F4FC 100%);
}
.login-wrap::before {
    content: ''; position: absolute; width: 520px; height: 520px; border-radius: 50%;
    background: radial-gradient(circle, rgba(3, 131, 188, .16), transparent 66%);
    top: -180px; left: -140px;
}
.login-wrap::after {
    content: ''; position: absolute; width: 460px; height: 460px; border-radius: 50%;
    background: radial-gradient(circle, rgba(247, 154, 1, .10), transparent 66%);
    bottom: -170px; right: -120px;
}
.login-box {
    position: relative; z-index: 1; width: 100%; max-width: 408px;
    background: #fff; border-radius: var(--radius-xl); padding: 38px 36px;
    box-shadow: 0 22px 64px rgba(43, 49, 68, .16);
}
.login-box .lb-brand { display: flex; align-items: center; gap: 10px; margin-bottom: 22px; }
.login-box .lb-brand .logo-mark {
    width: 40px; height: 40px; border-radius: 11px;
    background: linear-gradient(135deg, var(--brand-3), var(--brand));
    display: flex; align-items: center; justify-content: center;
    color: #fff; font-size: 21px; font-weight: 800; box-shadow: var(--shadow-brand);
}
.login-box .lb-title { font-size: 23px; font-weight: 700; color: var(--navy); margin-bottom: 6px; }
.login-box .lb-desc { font-size: 13.5px; color: var(--ink3); margin-bottom: 26px; }
.login-box .form-control { height: 44px; }
.login-box .btn { height: 44px; font-size: 15px; }
.login-foot { margin-top: 22px; text-align: center; font-size: 12.5px; color: var(--ink4); }

/* 后台登录页复用：兼容旧标记 */
.login-box .lb-logo { display: flex; align-items: center; gap: 10px; margin-bottom: 20px; font-size: 20px; font-weight: 700; color: var(--navy); }

/* ==========================================================================
   套餐/统计数字
   ========================================================================== */
.stat-card {
    background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg);
    padding: 20px 22px; position: relative; overflow: hidden;
    box-shadow: var(--shadow-xs); transition: all .2s;
}
.stat-card:hover { box-shadow: var(--shadow-sm); transform: translateY(-2px); }
.stat-card::after {
    content: ''; position: absolute; right: -26px; top: -26px; width: 76px; height: 76px;
    border-radius: 50%; background: var(--brand-soft);
}
.stat-card .num {
    position: relative; font-size: 30px; font-weight: 700; color: var(--navy);
    line-height: 1.15; letter-spacing: -.5px;
}
.stat-card .label { position: relative; font-size: 13px; color: var(--ink3); margin-top: 5px; }

/* ---------- 底部 CTA 条 ---------- */
.cta-strip {
    background: linear-gradient(120deg, #2FA3DB, #026A9B);
    border-radius: var(--radius-xl); padding: 38px 40px; color: #fff;
    display: flex; align-items: center; justify-content: space-between;
    gap: 24px; flex-wrap: wrap; position: relative; overflow: hidden;
}
.cta-strip::after {
    content: ''; position: absolute; right: -60px; bottom: -90px; width: 240px; height: 240px;
    border-radius: 50%; background: rgba(255, 255, 255, .13); pointer-events: none;
}
.cta-title { position: relative; font-size: 23px; font-weight: 700; margin-bottom: 6px; }
.cta-sub { position: relative; font-size: 14px; color: rgba(255, 255, 255, .9); }
.cta-actions { position: relative; display: flex; gap: 12px; flex-wrap: wrap; }

/* ==========================================================================
   分类页 / 详情页头
   ========================================================================== */
.page-hero {
    position: relative; overflow: hidden;
    background: linear-gradient(120deg, #2FA3DB 0%, var(--brand) 55%, #026A9B 100%);
    color: #fff; padding: 46px 0 50px;
}
.page-hero::after {
    content: ''; position: absolute; width: 460px; height: 460px; border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, .2), transparent 64%);
    top: -200px; right: -110px;
}
.page-hero .container { position: relative; z-index: 1; }
.page-hero .sec-ghost {
    position: absolute; left: 20px; top: 50%; transform: translateY(-50%);
    color: rgba(255, 255, 255, .13); font-size: 62px; z-index: 0;
}
.page-hero-title { position: relative; color: #fff; font-size: 30px; font-weight: 700; }
.page-hero-desc { position: relative; margin-top: 10px; font-size: 14px; color: rgba(255, 255, 255, .9); max-width: 660px; }

/* 子分类筛选 */
.filter-chips { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; margin-bottom: 22px; }
.fc-label { font-size: 13px; color: var(--ink3); }
.fc-chip {
    padding: 6px 15px; border-radius: 18px; background: #fff;
    border: 1px solid var(--line); font-size: 13px; color: var(--ink2);
}
.fc-chip:hover { border-color: var(--brand); color: var(--brand); background: var(--brand-soft); }

/* 分页 */
.pager { display: flex; justify-content: center; align-items: center; gap: 7px; margin-top: 30px; flex-wrap: wrap; }
.pg-item {
    min-width: 36px; height: 36px; padding: 0 11px; border-radius: var(--radius);
    border: 1px solid var(--line); background: #fff; color: var(--ink2);
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 13.5px; transition: all .16s;
}
a.pg-item:hover { border-color: var(--brand); color: var(--brand); background: var(--brand-soft); }
.pg-current {
    background: linear-gradient(135deg, var(--brand-3), var(--brand));
    border-color: transparent; color: #fff; font-weight: 600;
}
.pg-disabled { color: var(--ink4); background: #F8FBFE; cursor: not-allowed; }
.pg-gap { color: var(--ink4); padding: 0 2px; }

/* ==========================================================================
   产品详情
   ========================================================================== */
.detail-head {
    background: linear-gradient(120deg, #0A2E49 0%, #12466A 58%, #1B5A82 100%);
    color: #fff; padding: 22px 0 34px; position: relative; overflow: hidden;
}
.detail-head::after {
    content: ''; position: absolute; width: 480px; height: 480px; border-radius: 50%;
    background: radial-gradient(circle, rgba(3, 131, 188, .22), transparent 66%);
    top: -230px; right: -130px;
}
.detail-head .container { position: relative; z-index: 1; }
.detail-head-inner { display: flex; align-items: flex-end; justify-content: space-between; gap: 26px; flex-wrap: wrap; }
.detail-head h1 { color: #fff; font-size: 27px; margin-bottom: 9px; }
.detail-head .dh-sub { color: rgba(255, 255, 255, .76); font-size: 14px; margin-bottom: 13px; }
.dh-tag {
    display: inline-block; padding: 2px 11px; border-radius: 14px; font-size: 12px;
    background: rgba(3, 131, 188, .2); border: 1px solid rgba(3, 131, 188, .45); color: #A6DBF5;
}
.dh-price { text-align: right; flex: none; }
.dh-price-label { font-size: 12.5px; color: rgba(255, 255, 255, .68); }
.dh-price-num { font-size: 38px; font-weight: 700; line-height: 1.1; color: var(--accent-2); }
.dh-price-unit { font-size: 13px; color: rgba(255, 255, 255, .72); }

/* 富文本区（后台录入内容） */
.rich-text { font-size: 14px; line-height: 1.85; color: var(--ink2); }
.rich-text h1, .rich-text h2, .rich-text h3, .rich-text h4 { margin: 20px 0 10px; color: var(--navy); }
.rich-text h1 { font-size: 21px; }
.rich-text h2 { font-size: 18px; }
.rich-text h3 { font-size: 16px; }
.rich-text p { margin: 0 0 12px; }
.rich-text ul, .rich-text ol { padding-left: 22px; margin: 0 0 12px; }
.rich-text li { margin-bottom: 6px; }
.rich-text img { border-radius: var(--radius); margin: 12px 0; }
.rich-text table { margin: 14px 0; }
.rich-text a { color: var(--brand); text-decoration: underline; }
.rich-text blockquote {
    margin: 14px 0; padding: 12px 16px; border-left: 3px solid var(--brand);
    background: var(--brand-soft); border-radius: 0 var(--radius) var(--radius) 0; color: var(--ink2);
}

/* 购买卡 */
.buy-card { border-color: var(--brand-line); }
.buy-head { padding-bottom: 15px; border-bottom: 1px dashed var(--line); }
.buy-price { font-size: 30px; font-weight: 700; color: var(--accent); line-height: 1.15; }
.buy-price small { font-size: 13px; color: var(--ink3); font-weight: 400; }
.buy-points {
    list-style: none; padding: 0; margin: 18px 0 0;
    border-top: 1px solid var(--line); padding-top: 15px;
}
.buy-points li {
    position: relative; padding-left: 21px; font-size: 13px; color: var(--ink2);
    margin-bottom: 9px;
}
.buy-points li:last-child { margin-bottom: 0; }
.buy-points li::before {
    content: '✓'; position: absolute; left: 0; top: 0;
    color: var(--brand); font-weight: 700; font-size: 13px;
}

/* ---------- 登录页（分栏式） ---------- */
.login-split { min-height: 100vh; display: grid; grid-template-columns: 1fr 480px; }

.ls-brand {
    position: relative; overflow: hidden; color: #fff; padding: 56px 6% 40px;
    display: flex; flex-direction: column; justify-content: center;
    background: linear-gradient(135deg, #0A4467 0%, var(--brand) 48%, #0E97D2 100%);
}
.ls-brand::after {
    content: ''; position: absolute; inset: 0; pointer-events: none;
    background-image: linear-gradient(rgba(255, 255, 255, .07) 1px, transparent 1px),
                      linear-gradient(90deg, rgba(255, 255, 255, .07) 1px, transparent 1px);
    background-size: 48px 48px;
    -webkit-mask-image: radial-gradient(ellipse at 30% 40%, #000, transparent 74%);
            mask-image: radial-gradient(ellipse at 30% 40%, #000, transparent 74%);
}
.ls-brand .sec-ghost {
    position: absolute; left: 6%; top: 40px; font-size: 92px;
    color: rgba(255, 255, 255, .11); letter-spacing: 6px; z-index: 0;
}
.ls-brand-inner { position: relative; z-index: 1; max-width: 520px; margin: 0 auto; width: 100%; }
.ls-logo { display: flex; align-items: center; gap: 11px; font-size: 21px; font-weight: 700; margin-bottom: 40px; }
.ls-logo .ls-logo-img { height: 52px; width: auto; display: block; flex: none; }
.ls-logo .ls-logo-split { width: 1px; height: 32px; background: rgba(255, 255, 255, .38); flex: none; }
.ls-logo .ls-logo-text { font-size: 16px; font-weight: 600; color: #fff; line-height: 1.3; letter-spacing: .3px; }
.ls-logo .ls-logo-text i { display: block; font-style: normal; font-size: 10.5px; font-weight: 400; color: rgba(255, 255, 255, .78); margin-top: 2px; }
.ls-logo .logo-mark {
    width: 40px; height: 40px; border-radius: 11px;
    background: rgba(255, 255, 255, .2); border: 1px solid rgba(255, 255, 255, .4);
    display: flex; align-items: center; justify-content: center;
    font-size: 20px; font-weight: 800;
}
.ls-brand h1 { color: #fff; font-size: 38px; font-weight: 700; line-height: 1.3; letter-spacing: -.5px; margin-bottom: 16px; }
.ls-desc { font-size: 14.5px; color: rgba(255, 255, 255, .88); line-height: 1.8; margin-bottom: 30px; }
.ls-points { list-style: none; padding: 0; margin: 0; }
.ls-points li {
    position: relative; padding-left: 26px; margin-bottom: 13px;
    font-size: 13.8px; color: rgba(255, 255, 255, .92);
}
.ls-points li::before {
    content: '✓'; position: absolute; left: 0; top: 1px;
    width: 17px; height: 17px; border-radius: 50%;
    background: rgba(255, 255, 255, .24); color: #fff;
    font-size: 11px; display: flex; align-items: center; justify-content: center; font-weight: 700;
}
.ls-foot { position: relative; z-index: 1; max-width: 520px; width: 100%; margin: 40px auto 0; font-size: 12.5px; color: rgba(255, 255, 255, .68); }

.ls-form { background: #fff; display: flex; align-items: center; justify-content: center; padding: 40px 36px; }
.ls-form-inner { width: 100%; max-width: 348px; }
.ls-form h2 { font-size: 25px; font-weight: 700; margin-bottom: 7px; }
.ls-form-desc { font-size: 13.5px; color: var(--ink3); margin-bottom: 28px; }
.ls-form .form-control { height: 44px; }
.ls-notice {
    margin-top: 26px; padding: 13px 15px; border-radius: var(--radius);
    background: var(--accent-soft); border: 1px solid var(--accent-line);
    font-size: 12.5px; color: #955B06; line-height: 1.7;
}
.ls-notice strong { display: block; color: var(--accent-deep); margin-bottom: 3px; }
.ls-alt { margin-top: 22px; text-align: center; font-size: 13px; color: var(--ink3); }
.ls-alt a { color: var(--brand); font-weight: 500; }

@media (max-width: 900px) {
    .login-split { grid-template-columns: 1fr; }
    .ls-brand { display: none; }
    .ls-form { min-height: 100vh; }
}

/* ==========================================================================
   页脚
   ========================================================================== */
.site-footer { background: var(--navy); color: #A7AEC3; padding: 46px 0 24px; margin-top: 0; }
.footer-cols { display: grid; grid-template-columns: 1.6fr repeat(3, 1fr); gap: 34px; padding-bottom: 30px; border-bottom: 1px solid rgba(255, 255, 255, .1); }
.site-footer h4 { color: #fff; font-size: 14.5px; margin-bottom: 14px; }
.site-footer a { color: #A7AEC3; font-size: 13px; display: block; padding: 5px 0; }
.site-footer a:hover { color: var(--brand-3); }
.site-footer .f-brand { margin-bottom: 12px; }
.site-footer .f-brand .f-logo { height: 46px; width: auto; display: block; }
.site-footer .f-brand .logo-mark {
    width: 32px; height: 32px; border-radius: 9px;
    background: linear-gradient(135deg, var(--brand-3), var(--brand));
    display: flex; align-items: center; justify-content: center; font-size: 17px; font-weight: 800;
}
.site-footer .f-company {
    font-size: 14px; font-weight: 600; color: #fff; letter-spacing: .3px; margin-bottom: 8px;
}
.site-footer .f-desc { font-size: 13px; line-height: 1.75; color: #8D95AC; max-width: 330px; }
.footer-bottom { padding-top: 20px; font-size: 12.5px; color: #7C85A0; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.footer-bottom a { display: inline; padding: 0; }

/* ==========================================================================
   响应式
   ========================================================================== */
@media (max-width: 1080px) {
    .hero-panel, .hero-visual { display: none; }
    .hero h1 { font-size: 34px; }
    .g4, .adv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .detail-wrap { grid-template-columns: 1fr; }
    .footer-cols { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 760px) {
    .top-bar { display: none; }
    .site-header .container { height: auto; padding-top: 12px; padding-bottom: 12px; flex-wrap: wrap; gap: 12px; }
    .nav { order: 3; width: 100%; overflow-x: auto; padding-bottom: 4px; }
    .hero { padding: 46px 0 52px; }
    .hero h1 { font-size: 26px; letter-spacing: 0; }
    .hero .lead { font-size: 14px; }
    .hero-stats { gap: 20px; flex-wrap: wrap; }
    .section { padding: 40px 0; }
    .sec-ghost { font-size: 38px; top: -8px; }
    .sec-cn { font-size: 21px; }
    .g2, .g3, .g4, .adv-grid { grid-template-columns: 1fr; }
    .footer-cols { grid-template-columns: 1fr; gap: 22px; }
    .login-box { padding: 28px 22px; }
}

/* ==========================================================================
   双色补充：橙色转化按钮 / 白底蓝字按钮 / 热销角标
   —— 蓝 = 品牌与结构，橙 = 行动与点睛
   ========================================================================== */
.btn-accent {
    background: linear-gradient(135deg, var(--accent-2), var(--accent));
    border-color: transparent; color: #fff; font-weight: 600;
    box-shadow: var(--shadow-accent);
}
.btn-accent:hover {
    background: linear-gradient(135deg, var(--accent), var(--accent-deep));
    color: #fff; transform: translateY(-1px);
    box-shadow: 0 10px 28px rgba(247, 154, 1, .36);
}
.btn-accent:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.btn-brand {
    background: linear-gradient(135deg, var(--brand-2), var(--brand));
    border-color: transparent; color: #fff; font-weight: 600;
    box-shadow: var(--shadow-brand);
}
.btn-brand:hover {
    background: linear-gradient(135deg, var(--brand), var(--brand-deep));
    color: #fff; transform: translateY(-1px);
}

/* 深蓝底上的白底按钮：蓝字（与底色同族，保持克制） */
.btn-on-dark { background: #fff; border-color: #fff; color: var(--brand-deep); font-weight: 600; }
.btn-on-dark:hover { background: var(--brand-soft); border-color: #fff; color: var(--brand-deep); }

/* 深蓝底上的白底按钮：橙字（转化按钮，双色呼应） */
.btn-on-dark-accent { background: #fff; border-color: #fff; color: var(--accent-deep); font-weight: 600; }
.btn-on-dark-accent:hover { background: #FFFAF0; border-color: #fff; color: var(--accent-deep); }

/* 热销 / 推荐角标（橙色） */
.hot-badge {
    position: absolute; right: 0; top: 0; z-index: 2;
    padding: 3px 11px; border-radius: 0 var(--radius-lg) 0 var(--radius-lg);
    background: linear-gradient(135deg, var(--accent-2), var(--accent));
    color: #fff; font-size: 11.5px; font-weight: 600; letter-spacing: .3px;
    box-shadow: 0 4px 12px rgba(247, 154, 1, .28);
}

/* 顶部信息条的公告角标改用橙，形成第一处两色呼应 */
.top-bar .tb-badge { background: var(--accent); }

/* Hero 右侧卡片：顶部一条橙线 */
.hero-panel { border-top: 3px solid var(--accent); }

/* 深色区块里的描边卡片，hover 时用橙色点睛 */
.section.dark .adv-item:hover {
    background: rgba(247, 154, 1, .12);
    border-color: rgba(247, 154, 1, .45);
}

/* ==========================================================================
   移动端导航（纯 CSS，无需 JS）
   ========================================================================== */
.nav-toggle-cb { position: absolute; opacity: 0; pointer-events: none; }
.nav-toggle {
    display: none; align-items: center; justify-content: center;
    width: 38px; height: 38px; border-radius: 9px; flex: none;
    border: 1px solid var(--line); background: #fff; color: var(--navy-3);
    cursor: pointer; transition: all .16s;
}
.nav-toggle:hover { border-color: var(--brand); color: var(--brand); background: var(--brand-soft); }
.nav-toggle svg { width: 19px; height: 19px; }
.nav-toggle .nt-close { display: none; }
.nav-toggle-cb:checked ~ .nav-toggle .nt-open  { display: none; }
.nav-toggle-cb:checked ~ .nav-toggle .nt-close { display: block; }

/* ==========================================================================
   宽度与响应式（默认容器 1440px）
   ========================================================================== */

/* —— 超宽屏：留白与字号适度放大，避免内容被拉散 —— */
@media (min-width: 1560px) {
    .hero { padding: 78px 0 88px; }
    .hero h1 { font-size: 46px; }
    .hero .lead { font-size: 17px; max-width: 620px; }
    .hero-panel { width: 384px; }
    .section { padding: 72px 0; }
    .sec-ghost { font-size: 68px; top: -17px; }
    .sec-cn { font-size: 29px; }
    .sec-desc { font-size: 15px; }
    .grid { gap: 22px; }
    .product-card { padding: 22px; }
    .footer-cols { gap: 40px; }
}

/* —— 大屏笔记本：四列降为三列 —— */
@media (max-width: 1440px) {
    .g4, .adv-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* —— 常规笔记本 —— */
@media (max-width: 1280px) {
    .container { padding: 0 22px; }
    .hero h1 { font-size: 38px; }
    .hero-inner { gap: 34px; }
    .hero-panel { width: 330px; }
}

/* —— 小笔记本 / 横屏平板 —— */
@media (max-width: 1080px) {
    .hero-panel, .hero-visual { display: none; }
    .hero h1 { font-size: 34px; }
    .hero .lead { max-width: 100%; }
    .g3, .g4, .adv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .detail-wrap { grid-template-columns: 1fr; }
    .footer-cols { grid-template-columns: 1fr 1fr; }
}

/* —— 竖屏平板 —— */
@media (max-width: 900px) {
    .login-split { grid-template-columns: 1fr; }
    .ls-brand { display: none; }
    .ls-form { min-height: 100vh; }
    .section { padding: 48px 0; }
    .uc-wrap { grid-template-columns: 1fr; }
    .uc-nav { position: static; }
    .svc-card { grid-template-columns: 1fr; }
    .svc-card .sc-right { justify-content: flex-start; }
    .svc-card .sc-days { text-align: left; }
}

/* —— H5 手机 —— */
@media (max-width: 760px) {
    body { font-size: 13.5px; }
    .container { padding: 0 16px; }

    /* 顶栏收起，信息移到页脚 */
    .top-bar { display: none; }

    /* 头部：logo + 操作 + 汉堡 */
    .site-header .container {
        height: auto; padding-top: 11px; padding-bottom: 11px;
        flex-wrap: wrap; gap: 10px;
    }
    .site-header .logo { order: 1; }
    .site-header .header-actions { order: 2; margin-left: auto; gap: 8px; }
    .site-header .nav-toggle { order: 3; display: flex; }
    .site-header .nav { order: 4; }
    .logo .logo-img { height: 33px; }
    .logo .logo-split { height: 24px; }
    .logo .logo-brand { font-size: 15px; }
    .logo .logo-brand i { font-size: 9.5px; }

    /* 折叠菜单 */
    .nav {
        width: 100%; flex-direction: column; align-items: stretch; gap: 0;
        overflow: hidden; max-height: 0; opacity: 0; padding: 0 4px;
        transition: max-height .3s ease, opacity .2s ease, padding .3s ease;
    }
    .nav-toggle-cb:checked ~ .nav { max-height: 460px; opacity: 1; padding: 6px 4px 12px; }
    .nav > a { padding: 12px 11px; border-radius: 8px; font-size: 15px; }
    .nav > a.active { background: var(--brand-soft); }
    .nav > a.active::after { display: none; }
    .header-actions .btn { height: 34px; padding: 0 13px; font-size: 13px; }
    .header-actions .btn-primary { padding: 0 15px; }

    /* 首屏 */
    .hero { padding: 40px 0 46px; }
    .hero-inner { gap: 0; }
    .hero h1 { font-size: 25px; letter-spacing: 0; }
    .hero h1 br { display: none; }
    .hero .lead { font-size: 13.5px; margin-bottom: 20px; }
    .hero-eyebrow { font-size: 11.5px; padding: 4px 12px; margin-bottom: 14px; }
    .hero-actions { gap: 10px; }
    .hero-actions .btn { flex: 1 1 auto; }
    .hero-stats { gap: 18px; flex-wrap: wrap; margin-top: 26px; padding-top: 20px; }
    .hero-stats .hs-num { font-size: 21px; }
    .hero-stats .hs-label { font-size: 11.5px; }

    /* 区块 */
    .section { padding: 38px 0; }
    .sec-head { margin-bottom: 24px; }
    .sec-ghost { font-size: 34px; top: -8px; }
    .sec-cn { font-size: 20px; gap: 8px; }
    .sec-cn::before { width: 4px; height: 19px; }
    .sec-cn::after { width: 6px; height: 6px; }
    .sec-desc { font-size: 13px; }
    .sec-more { position: static; display: inline-block; margin-top: 9px; }

    /* 内页头 */
    .page-hero { padding: 30px 0 34px; }
    .page-hero-title { font-size: 22px; }
    .page-hero-desc { font-size: 13px; }
    .page-hero .sec-ghost { font-size: 40px; top: 40px; transform: none; }

    /* 栅格统一单列 */
    .grid.g2, .grid.g3, .grid.g4, .adv-grid { grid-template-columns: 1fr; }
    .product-card { padding: 17px; }
    .adv-item { padding: 22px 18px; }

    /* 详情 */
    .detail-wrap { gap: 16px; }
    .detail-head { padding: 16px 0 24px; }
    .detail-head h1 { font-size: 21px; }
    .detail-head-inner { flex-direction: column; align-items: flex-start; gap: 16px; }
    .dh-price { text-align: left; }
    .dh-price-num { font-size: 30px; }
    .detail-hero { padding: 20px 18px; }
    .detail-hero h1 { font-size: 22px; }
    .detail-price .dp-num { font-size: 28px; }
    .sku-item { padding: 11px 13px; }

    /* 其它 */
    .footer-cols { grid-template-columns: 1fr; gap: 22px; }
    .site-footer { padding: 34px 0 20px; }
    .cta-strip { padding: 26px 22px; }
    .cta-title { font-size: 19px; }
    .login-box { padding: 28px 22px; }
    .login-box .lb-title { font-size: 20px; }
    .card { padding: 16px; }
    .card-title { height: 40px; font-size: 14px; padding: 0 13px; }
    .rich-text { font-size: 13.5px; }
    table { font-size: 12.5px; }
    th, td { padding: 9px 10px; }
    .pager { gap: 5px; margin-top: 22px; }
}

/* —— 小屏手机 —— */
@media (max-width: 480px) {
    .hero h1 { font-size: 22px; }
    .hero-stats { gap: 14px; }
    .hero-stats > div { flex: 1 1 30%; }
    .btn-lg { height: 42px; padding: 0 22px; font-size: 14px; }
    .sec-ghost { display: none; }
    .filter-chips { gap: 7px; }
    .fc-chip { padding: 5px 12px; font-size: 12.5px; }
    .pg-item { min-width: 32px; height: 32px; padding: 0 8px; font-size: 12.5px; }
    .dh-price-num { font-size: 26px; }
}

/* ==========================================================================
   H5 折叠菜单内的账号入口（桌面端不显示）
   ========================================================================== */
.nav-h5-wrap { display: none; }

@media (max-width: 760px) {
    /* 头部只留主行动按钮，其余收进菜单 */
    .header-actions .btn:not(.btn-primary) { display: none; }
    .header-actions form { display: none; }

    .nav-h5-wrap { display: block; }
    .nav-h5-sep { display: block; height: 1px; background: var(--line); margin: 8px 4px 6px; }
    .nav-h5 {
        display: flex; align-items: center; gap: 8px;
        padding: 12px 11px; border-radius: 8px;
        font-size: 15px; color: var(--navy-3);
    }
    .nav-h5:hover { background: var(--brand-soft); color: var(--brand); }
    button.nav-h5 {
        width: 100%; background: none; border: 0; font-family: inherit;
        cursor: pointer; text-align: left; color: var(--navy-3);
    }
    .nav-h5 .nh-dot {
        width: 6px; height: 6px; border-radius: 50%; background: var(--line-2); flex: none;
    }
    .nav-h5:hover .nh-dot { background: var(--brand); }
}
/* ==========================================================================
   修复：移动端折叠菜单需独占一行
   （桌面端 .nav 的 flex:1 会把折叠态挤成几十像素的窄条）
   ========================================================================== */
@media (max-width: 760px) {
    .site-header .nav {
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
        align-self: stretch;
    }
    .nav-toggle-cb { order: 0; }
}
/* ==========================================================================
   关于我们：导航下拉 + 内页（公司简介 / 联系我们 / 通知公告）
   约定：主色蓝 #0383BC 负责结构，辅色橙 #F79A01 负责强调（日期、价格、徽标）
   ========================================================================== */

/* ---------- 导航「关于我们」下拉 ---------- */
.nav-dd { position: relative; display: flex; align-items: center; }
.nav-dd-cb { position: absolute; opacity: 0; pointer-events: none; }

.nav-dd-btn {
    display: flex; align-items: center; gap: 5px; cursor: pointer;
    padding: 8px 13px; border-radius: var(--radius); font-size: 14.5px; font-weight: 500;
    color: var(--navy-3); white-space: nowrap; position: relative;
    transition: color .18s ease, background .18s ease;
}
.nav-dd-btn:hover { color: var(--brand); background: var(--brand-soft); }
.nav-dd.is-active .nav-dd-btn { color: var(--brand); font-weight: 600; }
.nav-dd.is-active .nav-dd-btn::after {
    content: ''; position: absolute; left: 13px; right: 13px; bottom: 0;
    height: 2.5px; border-radius: 2px; background: var(--brand);
}
.dd-caret { width: 13px; height: 13px; flex: none; transition: transform .22s ease; }
.nav-dd:hover .dd-caret { transform: rotate(180deg); }

.dd-menu {
    position: absolute; top: 100%; left: 50%; z-index: 130;
    padding-top: 15px; /* 15px 透明桥接区：正好补齐按钮下沿到头部下沿的空隙，兼作 hover 缓冲 */
    opacity: 0; visibility: hidden; pointer-events: none;
    transform: translateX(-50%) translateY(6px);
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
}
.nav-dd:hover .dd-menu,
.nav-dd:focus-within .dd-menu {
    opacity: 1; visibility: visible; pointer-events: auto;
    transform: translateX(-50%) translateY(0);
}
.dd-inner {
    position: relative; min-width: 246px; padding: 8px;
    background: #fff; border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    box-shadow: 0 16px 40px rgba(11, 62, 92, .16);
}
.dd-inner::before {
    content: ''; position: absolute; top: -6px; left: 50%; margin-left: -6px;
    width: 12px; height: 12px; background: #fff; transform: rotate(45deg);
    border-left: 1px solid var(--line); border-top: 1px solid var(--line);
}
.dd-inner a {
    display: block; padding: 10px 13px; border-radius: var(--radius);
    color: var(--navy); transition: background .16s ease;
}
.dd-inner a b { display: block; font-size: 14px; font-weight: 600; }
.dd-inner a i {
    display: block; font-style: normal; font-size: 11.5px;
    color: var(--ink3); margin-top: 3px;
}
.dd-inner a:hover { background: var(--brand-soft); }
.dd-inner a:hover b { color: var(--brand); }
.dd-inner a.active { background: var(--brand-soft); }
.dd-inner a.active b { color: var(--brand); }

/* 桌面端：导航项放得下时才让下拉溢出可见，否则会被 .nav 的 overflow:hidden 裁掉
   实测 1280px 以下装不下「7 项 + 关于我们下拉」，折叠阈值就定在 1280px */
@media (min-width: 1280px) {
    .nav { overflow: visible; }
}

/* ---------- 顶栏补充信息 ---------- */
.top-bar a.tb-badge { color: #fff; }
.top-bar a.tb-badge:hover { color: #fff; background: var(--brand-2); }
.top-bar a.tb-text { color: #A7AEC3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.top-bar .tb-opt { display: none; }
@media (min-width: 1400px) {
    .top-bar .tb-opt { display: inline; }
}

/* ---------- 内页头图 + 面包屑 ---------- */
.page-hero {
    position: relative; overflow: hidden; color: #fff;
    background:
        radial-gradient(760px 300px at 12% 0%, rgba(255, 255, 255, .16), transparent 70%),
        linear-gradient(120deg, #2FA3DB 0%, var(--brand) 46%, #026A9B 100%);
    padding: 40px 0 34px;
}
.page-hero::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 3px;
    background: linear-gradient(90deg, var(--accent), var(--accent-3));
    opacity: .9;
}
.page-hero .ph-ghost {
    font-size: 13px; font-weight: 700; letter-spacing: 3px;
    color: rgba(255, 255, 255, .5); text-transform: uppercase; margin-bottom: 8px;
}
.page-hero .ph-title {
    font-size: 30px; font-weight: 700; line-height: 1.32; margin: 0 0 8px;
    color: #fff;
}
.page-hero .ph-desc {
    font-size: 14px; line-height: 1.7; color: rgba(255, 255, 255, .86);
    max-width: 820px; margin: 0;
}
.crumb {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    margin-top: 16px; font-size: 12.5px; color: var(--ink3);
}
.crumb a { color: var(--ink3); }
.crumb a:hover { color: var(--brand); }
.crumb-sep { color: var(--ink4); }
.crumb-cur { color: var(--accent); }
/* 深色横幅内的面包屑保持白色系（仅 page-hero 内生效） */
.page-hero .crumb { color: rgba(255, 255, 255, .74); }
.page-hero .crumb a { color: rgba(255, 255, 255, .82); }
.page-hero .crumb a:hover { color: #fff; }
.page-hero .crumb-sep { color: rgba(255, 255, 255, .42); }
.page-hero .crumb-cur { color: var(--accent-3); }

/* ---------- 正文排版（后台富文本录入，服务端已剥离危险标签与样式） ---------- */
.article-body { font-size: 14.5px; color: var(--ink2); line-height: 1.95; }
.article-body p { margin: 0 0 15px; }
.article-body p:last-child { margin-bottom: 0; }
.article-body p:first-child { color: var(--navy); }

.article-body h2, .article-body h3, .article-body h4 {
    color: var(--navy); font-weight: 700; line-height: 1.5; margin: 26px 0 12px;
}
.article-body h2 { font-size: 19px; padding-left: 12px; border-left: 4px solid var(--brand); }
.article-body h3 { font-size: 17px; }
.article-body h4 { font-size: 15.5px; }
.article-body > *:first-child { margin-top: 0; }

.article-body ul, .article-body ol { margin: 0 0 15px; padding-left: 24px; }
.article-body ul { list-style: disc; }
.article-body ol { list-style: decimal; }
.article-body li { margin: 6px 0; }
.article-body li::marker { color: var(--brand); }

.article-body blockquote {
    margin: 16px 0; padding: 12px 18px;
    background: var(--brand-soft); border-left: 4px solid var(--brand-3);
    border-radius: 0 8px 8px 0; color: var(--ink); font-size: 14px;
}
.article-body blockquote p:last-child { margin-bottom: 0; }

.article-body img { display: block; max-width: 100%; height: auto; margin: 16px auto; border-radius: 8px; }
.article-body figure { margin: 16px 0; }
.article-body figcaption { font-size: 12.5px; color: var(--ink3); text-align: center; margin-top: 8px; }

.article-body a { color: var(--brand); text-decoration: underline; text-underline-offset: 3px; }
.article-body a:hover { color: var(--brand-deep); }

.article-body hr { border: 0; height: 1px; background: var(--line); margin: 24px 0; }

.article-body table { width: 100%; border-collapse: collapse; margin: 16px 0; font-size: 13.5px; }
.article-body th, .article-body td { border: 1px solid var(--line); padding: 9px 12px; text-align: left; }
.article-body th { background: var(--brand-soft); color: var(--navy); font-weight: 600; }
.article-body tbody tr:nth-child(even) { background: #FAFCFE; }

.article-body code {
    background: var(--bg); border: 1px solid var(--line); border-radius: 4px;
    padding: 1px 6px; font-size: 12.5px; color: var(--accent-deep);
    font-family: Consolas, Monaco, "Courier New", monospace;
}
.article-body pre {
    background: var(--navy); color: #D6E7F2; border-radius: 8px;
    padding: 14px 16px; margin: 16px 0; overflow-x: auto;
    font-size: 12.5px; line-height: 1.7;
}
.article-body pre code { background: none; border: 0; color: inherit; padding: 0; }

/* ---------- 文章详情 ---------- */
.art-title {
    font-size: 25px; font-weight: 700; color: var(--navy);
    line-height: 1.42; margin: 0 0 14px;
}
.art-meta {
    display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
    padding-bottom: 16px; margin-bottom: 20px;
    border-bottom: 1px dashed var(--line);
    font-size: 12.5px; color: var(--ink3);
}
.art-sep { width: 1px; height: 12px; background: var(--line-2); }
.art-nav {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px;
    margin: 26px 0 0; padding-top: 22px; border-top: 1px dashed var(--line);
}
.art-nav-item {
    display: block; padding: 12px 16px; border-radius: var(--radius);
    background: var(--navy-soft); border: 1px solid var(--line);
    transition: border-color .18s ease, background .18s ease, transform .18s ease;
}
.art-nav-item .an-label { display: block; font-size: 11.5px; color: var(--ink3); margin-bottom: 5px; }
.art-nav-item .an-title { display: block; font-size: 13.5px; font-weight: 600; color: var(--navy); line-height: 1.55; }
a.art-nav-item:hover { border-color: var(--brand-line); background: var(--brand-soft); transform: translateY(-1px); }
a.art-nav-item:hover .an-title { color: var(--brand); }
.art-nav-next { text-align: right; }
.an-disabled { opacity: .62; }
.an-disabled .an-title { font-weight: 400; color: var(--ink3); }
.art-foot {
    display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
    margin-top: 24px; padding-top: 20px; border-top: 1px dashed var(--line);
}

/* ---------- 联系方式卡片 ---------- */
.info-cards {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px;
}
.info-card {
    position: relative; overflow: hidden; display: block;
    padding: 24px 22px; background: #fff; border: 1px solid var(--line);
    border-radius: var(--radius-lg); box-shadow: var(--shadow-xs);
    transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.info-card::before {
    content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
    background: linear-gradient(180deg, var(--brand-3), var(--brand));
    opacity: 0; transition: opacity .2s ease;
}
a.info-card:hover,
.info-card:hover { border-color: var(--brand-line); transform: translateY(-2px); box-shadow: var(--shadow-brand); }
a.info-card:hover::before,
.info-card:hover::before { opacity: 1; }
.ic-ico {
    display: inline-flex; align-items: center; justify-content: center;
    width: 42px; height: 42px; border-radius: 12px; margin-bottom: 14px;
    background: linear-gradient(135deg, var(--brand-2), var(--brand));
    color: #fff; box-shadow: 0 6px 16px rgba(3, 131, 188, .24);
}
.ic-ico svg { width: 19px; height: 19px; }
.ic-label { display: block; font-size: 12.5px; color: var(--ink3); margin-bottom: 6px; }
.ic-val {
    display: block; font-size: 19px; font-weight: 700; color: var(--navy);
    letter-spacing: .3px; word-break: break-all;
}
.ic-tip { display: block; margin-top: 8px; font-size: 12px; color: var(--ink4); }
.ic-static .ic-ico {
    background: linear-gradient(135deg, var(--accent-2), var(--accent));
    box-shadow: 0 6px 16px rgba(247, 154, 1, .26);
}
/* 带二维码的卡片（手机 / 微信）：左文右码 */
.info-card.ic-qr { display: flex; align-items: flex-start; gap: 18px; }
.ic-qr .ic-body { flex: 1 1 auto; min-width: 0; }
.ic-qrbox { flex: 0 0 auto; text-align: center; align-self: center; }
.ic-qrbox img {
    display: block; width: 96px; height: 96px; border-radius: 10px;
    border: 1px solid var(--line); background: #fff;
}
.ic-qrbox span { display: block; margin-top: 6px; font-size: 11.5px; line-height: 1.2; color: var(--ink4); }
/* 官网卡片：主副两个域名 */
.ic-sites { display: flex; flex-direction: column; gap: 3px; }
.ic-sites a {
    font-size: 17px; font-weight: 700; color: var(--navy); letter-spacing: .3px;
    word-break: break-all; transition: color .18s ease;
}
.ic-sites a:hover { color: var(--brand); }

/* ---------- 联系我们两栏 ---------- */
.contact-cols,
.about-cols,
.notice-cols {
    display: grid; gap: 20px; align-items: start;
}
.contact-cols { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); }
.about-cols   { grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); }
.notice-cols  { grid-template-columns: minmax(0, 1.85fr) minmax(0, 1fr); }

/* 卡片标题栏里的右侧小字 */
.card-title em.ct-tip {
    font-style: normal; font-size: 11.5px; font-weight: 400;
    color: rgba(255, 255, 255, .78); flex: none;
}

/* ---------- 留言表单 ---------- */
.msg-form .form-control { background: #fff; }
.hp-field {
    position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden;
}

/* ---------- 侧栏：联系方式 / 列表 ---------- */
.side-contact { display: grid; gap: 6px; }
.side-contact .sc-row {
    display: flex; align-items: flex-start; gap: 11px;
    padding: 10px 12px; border-radius: var(--radius);
    background: var(--navy-soft); border: 1px solid transparent;
    transition: background .18s ease, border-color .18s ease;
}
.side-contact a.sc-row:hover { background: var(--brand-soft); border-color: var(--brand-line); }
.side-contact .sc-static { background: #F7FAFD; }
.sc-ico {
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; border-radius: 8px; flex: none;
    background: #fff; color: var(--brand); border: 1px solid var(--line);
}
.sc-ico svg { width: 15px; height: 15px; }
.sc-row b { display: block; font-size: 11.5px; font-weight: 500; color: var(--ink3); margin-bottom: 3px; }
.sc-row i { display: block; font-style: normal; font-size: 14px; font-weight: 600; color: var(--navy); word-break: break-all; }
.side-contact.compact .sc-row { padding: 9px 11px; }
.side-contact.compact .sc-row i { font-size: 13.5px; }

.side-link {
    display: block; padding: 9px 0; font-size: 13.5px; color: var(--ink2);
    border-bottom: 1px dashed var(--line);
}
.side-link:last-child { border-bottom: 0; }
.side-link::after { content: ' →'; color: var(--ink4); }
.side-link:hover { color: var(--brand); }
.side-link:hover::after { color: var(--accent); }

.side-list { list-style: none; padding: 0; margin: 0; }
.side-list li { padding: 10px 0; border-bottom: 1px dashed var(--line); }
.side-list li:last-child { border-bottom: 0; padding-bottom: 0; }
.side-list a { display: block; font-size: 13.5px; color: var(--ink2); line-height: 1.6; }
.side-list a:hover { color: var(--brand); }
.side-list .sl-date { display: block; margin-top: 3px; font-size: 11.5px; color: var(--ink4); }

/* ---------- 通知公告列表 ---------- */
.notice-list { display: grid; }
.notice-row {
    display: flex; align-items: flex-start; gap: 16px;
    padding: 17px 4px; border-bottom: 1px dashed var(--line);
    transition: background .16s ease;
}
.notice-row:last-child { border-bottom: 0; }
.notice-row:hover { background: var(--navy-soft); }
.nr-date {
    flex: none; width: 58px; padding: 7px 0; border-radius: var(--radius);
    text-align: center; background: var(--brand-soft); border: 1px solid var(--brand-line);
}
.nr-date b { display: block; font-size: 19px; font-weight: 700; color: var(--brand); line-height: 1.1; }
.nr-date i { display: block; font-style: normal; font-size: 11px; color: var(--ink3); margin-top: 2px; }
.nr-body { flex: 1; min-width: 0; }
.nr-title {
    display: block; font-size: 15.5px; font-weight: 600; color: var(--navy);
    line-height: 1.5; margin-bottom: 5px;
}
.notice-row:hover .nr-title { color: var(--brand); }
.nr-top {
    display: inline-block; font-style: normal; font-size: 11px; font-weight: 600;
    color: #fff; background: var(--accent); border-radius: var(--radius-sm);
    padding: 1px 7px; margin-right: 7px; vertical-align: 2px;
}
.nr-sum {
    font-size: 13px; color: var(--ink3); line-height: 1.68;
    margin-bottom: 6px;
    overflow: hidden; text-overflow: ellipsis;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
.nr-meta { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: var(--ink4); }
.nr-dot { width: 3px; height: 3px; border-radius: 50%; background: var(--ink4); }
.nr-go { flex: none; align-self: center; font-size: 13px; color: var(--brand); font-weight: 600; opacity: 0; transition: opacity .18s ease; }
.notice-row:hover .nr-go { opacity: 1; }

/* ==========================================================================
   响应式：导航折叠阈值提到 1280px
   （7 个导航项含「关于我们」下拉，1280px 以下横排放不下，统一收进汉堡菜单）
   本段必须在文件末尾，才能覆盖前面 760px 的同类规则
   ========================================================================== */
@media (max-width: 1279px) {
    .site-header .container {
        height: auto; padding-top: 11px; padding-bottom: 11px;
        flex-wrap: wrap; gap: 11px;
    }
    .site-header .logo { order: 1; }
    .site-header .header-actions { order: 2; margin-left: auto; }
    .site-header .nav-toggle { order: 3; display: flex; }
    .site-header .nav { order: 4; }

    .site-header .nav {
        flex: 0 0 100%; width: 100%; max-width: 100%; align-self: stretch;
        flex-direction: column; align-items: stretch; gap: 0;
        overflow: hidden; max-height: 0; opacity: 0; padding: 0 4px;
        transition: max-height .3s ease, opacity .2s ease, padding .3s ease;
    }
    .nav-toggle-cb { order: 0; }
    /* 展开高度要能容纳 7 个导航项 + 关于我们三项 + 账号入口 */
    .nav-toggle-cb:checked ~ .nav { max-height: 860px; opacity: 1; padding: 6px 4px 12px; }

    .nav > a { padding: 12px 11px; border-radius: 8px; font-size: 15px; }
    .nav > a.active { background: var(--brand-soft); }
    .nav > a.active::after { display: none; }

    /* 下拉改为手风琴：点击展开，不再依赖 hover */
    .nav-dd { display: block; width: 100%; align-items: stretch; }
    .nav-dd-btn {
        padding: 12px 11px; border-radius: 8px; font-size: 15px;
        justify-content: space-between; width: 100%;
    }
    .nav-dd-btn:hover { background: transparent; }
    .nav-dd.is-active .nav-dd-btn { background: var(--brand-soft); }
    .nav-dd.is-active .nav-dd-btn::after { display: none; }
    .nav-dd:hover .dd-caret { transform: none; }
    .nav-dd-cb:checked ~ .nav-dd-btn .dd-caret { transform: rotate(180deg); }

    /* 手风琴展开：必须把桌面端的 :hover / :focus-within 规则一起覆盖掉。
       只写 .dd-menu 会被 .nav-dd:hover .dd-menu（0,3,0）的 transform 覆盖，
       导致菜单被 translateX(-50%) 甩到视口左侧看不见。 */
    .nav-dd .dd-menu,
    .nav-dd:hover .dd-menu,
    .nav-dd:focus-within .dd-menu {
        position: static; top: auto; left: auto; transform: none; transition: none;
        padding: 0; opacity: 1; visibility: visible; pointer-events: auto;
    }
    .nav-dd .dd-menu { display: none; }
    .nav-dd-cb:checked ~ .dd-menu { display: block; }
    .dd-inner {
        min-width: 0; margin: 2px 0 6px 10px; padding: 4px;
        border: 0; border-left: 2px solid var(--brand-line);
        border-radius: 0; box-shadow: none; background: transparent;
    }
    .dd-inner::before { display: none; }
    .dd-inner a { padding: 10px 12px; }
    .dd-inner a b { font-size: 14.5px; }
    .dd-inner a i { display: none; }

    /* 移动端折叠菜单里的账号入口 */
    .nav-h5-wrap { display: block; }
    .nav-h5-sep { display: block; height: 1px; background: var(--line); margin: 8px 4px 6px; }
    .nav-h5 {
        display: flex; align-items: center; gap: 10px; width: 100%;
        padding: 12px 11px; border-radius: 8px; font-size: 15px;
        color: var(--navy-3); background: transparent; border: 0;
        text-align: left; cursor: pointer; font-family: inherit;
    }
    .nav-h5:hover { background: var(--brand-soft); color: var(--brand); }
    button.nav-h5 { width: 100%; }
    .nav-h5 .nh-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--ink4); flex: none; }
    .nav-h5:hover .nh-dot { background: var(--brand); }

    .header-actions .btn { height: 34px; padding: 0 13px; font-size: 13px; }
    .header-actions .btn-primary { padding: 0 15px; }
}

/* 页脚：栏目由 4 列扩到 5 列（新增「关于我们」一栏），并给出完整降级阶梯 */
.footer-cols { grid-template-columns: 1.5fr repeat(4, minmax(0, 1fr)); }
@media (max-width: 1279px) {
    .footer-cols { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
    .footer-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
    .footer-cols { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 1080px) {
    .info-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .contact-cols, .about-cols, .notice-cols { grid-template-columns: minmax(0, 1fr); }
    .page-hero { padding: 34px 0 28px; }
    .page-hero .ph-title { font-size: 26px; }
    .ic-val { font-size: 17.5px; }
}

@media (max-width: 760px) {
    .info-cards { grid-template-columns: minmax(0, 1fr); gap: 14px; }
    .info-card { padding: 18px 18px; }
    .ic-ico { width: 36px; height: 36px; border-radius: 10px; margin-bottom: 11px; }
    .ic-ico svg { width: 17px; height: 17px; }
    .ic-val { font-size: 16.5px; }
    .info-card.ic-qr { gap: 14px; }
    .ic-qrbox img { width: 86px; height: 86px; }
    .ic-sites a { font-size: 15.5px; }

    .page-hero { padding: 26px 0 22px; }
    .page-hero .ph-ghost { font-size: 11.5px; letter-spacing: 2px; }
    .page-hero .ph-title { font-size: 21px; }
    .page-hero .ph-desc { font-size: 13px; }
    .crumb { margin-top: 12px; font-size: 11.5px; }

    .art-title { font-size: 19px; }
    .art-nav { grid-template-columns: minmax(0, 1fr); }
    .art-nav-next { text-align: left; }
    .art-foot { gap: 10px; }
    .art-foot .btn { flex: 1 1 auto; }

    .notice-row { gap: 12px; padding: 14px 2px; }
    .nr-date { width: 48px; padding: 5px 0; }
    .nr-date b { font-size: 16px; }
    .nr-date i { font-size: 10px; }
    .nr-title { font-size: 14.5px; }
    .nr-sum { font-size: 12.5px; -webkit-line-clamp: 3; }
    .notice-row .nr-go { display: none; }

    .article-body { font-size: 14px; line-height: 1.9; }
    .side-contact .sc-row i { font-size: 13.5px; }

    .cta-strip { flex-direction: column; align-items: flex-start; }
    .cta-actions { width: 100%; }
    .cta-actions .btn { flex: 1 1 auto; }
}

/* ==========================================================================
   通用小工具（会员 / 订单 / 支付页共用）
   ========================================================================== */

/* 等宽小标签：单号、账号、密钥等「要看清字符」的地方 */
.tt-code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 12px; color: var(--ink2);
    background: var(--bg); border: 1px solid var(--line);
    padding: 2px 7px; border-radius: 4px;
    word-break: break-all;
}

/* 次要说明文字 */
.mini-note { font-size: 11.5px; color: var(--ink3); font-weight: 400; }

/* 数字列右对齐，金额/数量看起来才整齐 */
.num-col { text-align: center; white-space: nowrap; }

/* 注册页协议勾选 */
.reg-agree {
    display: flex; align-items: flex-start; gap: 7px;
    font-size: 12.5px; color: var(--ink3); line-height: 1.6;
    margin-bottom: 18px; cursor: pointer;
}
.reg-agree a { color: var(--brand); }

/* ============================================================
   管理员「切换为会员视图」提示条
   固定吸顶，避免管理员忘记自己正以会员身份操作
   ============================================================ */
.imp-bar {
    position: sticky; top: 0; z-index: 90;
    background: linear-gradient(90deg, #B45309, #D97706);
    color: #fff; font-size: 12.5px;
    box-shadow: 0 2px 10px rgba(180, 83, 9, .28);
}
.imp-inner {
    display: flex; align-items: center; justify-content: space-between;
    gap: 14px; min-height: 42px; padding: 6px 0; flex-wrap: wrap;
}
.imp-txt b { font-weight: 700; }
.imp-actions { display: flex; align-items: center; gap: 8px; }
.imp-actions form { margin: 0; }
.imp-btn {
    display: inline-flex; align-items: center; height: 28px; padding: 0 12px;
    border-radius: 6px; border: 1px solid rgba(255, 255, 255, .5);
    background: rgba(255, 255, 255, .12); color: #fff;
    font-size: 12.5px; font-family: inherit; cursor: pointer; line-height: 1;
    transition: background .15s, border-color .15s;
}
.imp-btn:hover { background: rgba(255, 255, 255, .24); }
.imp-btn-primary { background: #fff; color: #B45309; border-color: #fff; font-weight: 600; }
.imp-btn-primary:hover { background: #FFF6E8; }
@media (max-width: 640px) {
    .imp-inner { font-size: 12px; }
    .imp-actions { width: 100%; }
}

/* ==========================================================================
   主导航右对齐
   需求：主导航菜单整体靠右，与右侧账号区（余额 / 退出 / 登录 / 注册）相邻，
        不再紧贴左侧 Logo，中间留白集中在 Logo 与菜单之间。
   说明：仅在横排断点（≥1280px）生效；≤1279px 时导航收进汉堡菜单，
        由 column 布局接管（justify-content 在纵向自适应高度下无副作用）。
   ========================================================================== */
@media (min-width: 1280px) {
    /* 菜单 ↔ 账号区之间的间隙收紧，视觉上连成一组 */
    .site-header .container { gap: 16px; }
    /* flex:1 占住中间余量，内容右靠 —— 关键一行 */
    .nav { justify-content: flex-end; }
    /* 溢出兜底：菜单项不被压缩变形，超出部分由 .nav 的 overflow:hidden 裁切，
       不会把右侧账号区挤出容器 */
    .nav > a,
    .nav > .nav-dd { flex: 0 0 auto; }

    /* 下拉菜单默认保持水平居中；
       仅「关于我们」（.nav-dd-end，紧贴容器右缘）改「右对齐锚定」：
       原来的居中会把菜单往右撑出 .nav 边界而被 overflow:hidden 裁掉。
       箭头的指示位置同步从居中改为对齐按钮中心。 */
    .nav-dd-end .dd-menu { left: auto; right: 0; transform: translateY(6px); }
    .nav-dd-end:hover .dd-menu,
    .nav-dd-end:focus-within .dd-menu { transform: translateY(0); }
    .nav-dd-end .dd-inner::before { left: auto; right: 45px; margin-left: 0; }
}

/* ==========================================================================
   云企业官网专题页 · 2026-09 重设计（/c/corp-site，site/categories/corp-site.blade.php）
   —— 首屏左右分栏 + 设计器示意 / 流程时间线 / 18 模块紧凑网格 /
      方案三列等高卡 / 深色赠送区；配色归入品牌蓝 + 橙体系
   ========================================================================== */

/* 通用彩色修饰（徽标 / 图标底 / 顶条） */
.cs-c-blue   { --cs-c: var(--brand);   --cs-c-soft: var(--blue-soft); }
.cs-c-sky    { --cs-c: var(--brand-2); --cs-c-soft: var(--brand-soft); }
.cs-c-violet { --cs-c: #635BFF;        --cs-c-soft: #EEEDFF; }
.cs-c-pink   { --cs-c: #E85D9E;        --cs-c-soft: #FDEDF4; }
.cs-c-green  { --cs-c: #31A34C;        --cs-c-soft: var(--green-soft); }
.cs-c-orange { --cs-c: var(--accent);  --cs-c-soft: var(--accent-soft); }

/* ---- S1 首屏 ---- */
.cs-hero {
    background:
        radial-gradient(900px 420px at 88% -12%, rgba(53, 175, 223, .4), transparent 60%),
        radial-gradient(720px 400px at 4% 112%, rgba(247, 154, 1, .14), transparent 55%),
        linear-gradient(158deg, var(--navy) 0%, var(--brand-deep) 100%);
    color: #fff;
    padding: 60px 0 56px;
    position: relative;
    overflow: hidden;
}
.cs-hero::before {   /* 细网格纹理 */
    content: '';
    position: absolute; inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 44px 44px;
    pointer-events: none;
}
.cs-hero-grid {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    gap: 48px;
    align-items: center;
    padding-bottom: 50px;
}
.cs-kicker {
    display: inline-flex; align-items: center; gap: 8px;
    font-size: 13px; font-weight: 600; letter-spacing: .12em;
    color: #fff;
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    padding: 6px 16px;
}
.cs-hero-title {
    margin: 18px 0 12px;
    font-size: 42px;
    line-height: 1.2;
    font-weight: 800;
    color: #fff;   /* 深底上必须显式给白，覆盖全局 h2 深色 */
}
.cs-hero-tags { font-size: 15px; color: rgba(255, 255, 255, .85); letter-spacing: .05em; }
.cs-price {
    margin-top: 26px;
    display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px 12px;
    padding: 16px 22px;
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .16);
    border-left: 4px solid var(--accent);
    border-radius: 12px;
    max-width: 500px;
}
.cs-price-num { font-size: 40px; font-weight: 800; line-height: 1; color: var(--accent-2); font-variant-numeric: tabular-nums; }
.cs-price-unit { font-size: 15px; font-weight: 600; color: rgba(255, 255, 255, .85); }
.cs-price-note { flex-basis: 100%; font-size: 12.5px; color: rgba(255, 255, 255, .62); }
.cs-cta { margin-top: 24px; display: flex; gap: 12px; flex-wrap: wrap; }

/* CSS 手绘「可视化设计器」示意 */
.cs-visual { position: relative; }
.cs-win {
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 30px 70px rgba(4, 32, 52, .45);
    overflow: hidden;
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
}
.cs-win-bar {
    grid-column: 1 / -1;
    display: flex; align-items: center; gap: 6px;
    background: #EDF2F7;
    border-bottom: 1px solid #E1E8F0;
    padding: 10px 14px;
}
.cs-win-bar i { width: 10px; height: 10px; border-radius: 50%; }
.cs-win-bar i:nth-child(1) { background: #FF6B6B; }
.cs-win-bar i:nth-child(2) { background: #FFC24B; }
.cs-win-bar i:nth-child(3) { background: #43CC85; }
.cs-win-bar span {
    margin-left: 10px;
    font-size: 11.5px; color: var(--ink4, #8A97A4);
    background: #fff; border: 1px solid #E1E8F0;
    border-radius: 999px; padding: 3px 12px;
}
.cs-win-side {
    background: #F7FAFD; border-right: 1px solid #E8EEF4;
    padding: 16px 0;
    display: flex; flex-direction: column; align-items: center; gap: 12px;
}
.cs-win-side i { width: 22px; height: 22px; border-radius: 6px; background: #DDE6EF; }
.cs-win-side i.on { background: var(--brand); }
.cs-win-body {
    padding: 16px;
    display: flex; flex-direction: column; gap: 12px;
    background: #FBFDFF;
}
.cs-blk { border-radius: 8px; background: #fff; border: 1px solid #E8EEF4; }
.cs-blk-banner {
    height: 64px; border: 0;
    background: linear-gradient(120deg, var(--brand) 0%, var(--brand-2) 100%);
    position: relative;
}
.cs-blk-banner span { position: absolute; left: 14px; top: 14px; width: 38%; height: 8px; border-radius: 4px; background: rgba(255,255,255,.92); }
.cs-blk-banner b    { position: absolute; left: 14px; top: 30px; width: 26%; height: 6px; border-radius: 3px; background: rgba(255,255,255,.55); }
.cs-blk-banner em   { position: absolute; right: 14px; top: 20px; width: 56px; height: 22px; border-radius: 999px; background: var(--accent); }
.cs-row-a { display: grid; grid-template-columns: 42% minmax(0, 1fr); gap: 12px; }
.cs-row-b { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.cs-blk-img { height: 58px; background: linear-gradient(135deg, #DCE9F3, #C4DDEC); border: 0; }
.cs-blk-txt { padding: 13px 12px; display: flex; flex-direction: column; gap: 9px; }
.cs-blk-txt i { height: 7px; border-radius: 4px; background: #D9E3EC; width: 100%; }
.cs-blk-txt i:first-child { background: #B9CBDA; width: 46%; }
.cs-blk-card { height: 50px; }
.cs-blk-card.is-pick {
    border: 2px solid var(--accent);
    background: var(--accent-soft, #FFF6E8);
    box-shadow: 0 8px 20px rgba(247, 154, 1, .3);
}
.cs-float {
    position: absolute;
    display: flex; align-items: center; gap: 8px;
    background: #fff; color: var(--ink);
    font-size: 12.5px; font-weight: 600;
    border-radius: 999px;
    padding: 9px 16px;
    box-shadow: 0 12px 30px rgba(4, 32, 52, .3);
    animation: csBob 3.8s ease-in-out infinite;
}
.cs-float-1 { left: -14px; bottom: 36px; }
.cs-float-2 { right: -10px; top: 44px; animation-delay: .7s; animation-duration: 4.6s; }
.cs-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--brand); }
.cs-dot-o { background: var(--accent); }
@keyframes csBob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }

/* 四大优势卡（首屏底部） */
.cs-feats {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-top: 8px;
}
.cs-feat {
    background: #fff;
    border-radius: 12px;
    border-top: 4px solid var(--cs-c);
    box-shadow: 0 16px 40px rgba(6, 44, 70, .22);
    padding: 22px 22px 20px;
    color: var(--ink);
}
.cs-feat-ico {
    display: inline-flex; align-items: center; justify-content: center;
    width: 42px; height: 42px;
    border-radius: 10px;
    background: var(--cs-c-soft); color: var(--cs-c);
}
.cs-feat-ico svg { width: 22px; height: 22px; }
.cs-feat b { display: block; margin-top: 14px; font-size: 16.5px; }
.cs-feat p { margin-top: 8px; font-size: 13px; line-height: 1.75; color: var(--ink2); }

/* ---- S2 服务流程：横向时间线 ---- */
.cs-steps {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 36px 0 28px;
}
.cs-step { position: relative; display: flex; align-items: center; gap: 14px; padding: 0 18px; }
.cs-step::before, .cs-step::after {
    content: ''; flex: 1; height: 2px; border-radius: 1px;
    background: linear-gradient(90deg, var(--line), #C9D9E5);
}
.cs-step:first-child::before, .cs-step:last-child::after { display: none; }
.cs-step-no {
    flex: none;
    width: 48px; height: 48px; border-radius: 50%;
    background: var(--brand); color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 18px; font-weight: 800;
    box-shadow: 0 0 0 6px var(--brand-soft);
}
.cs-step:nth-child(2) .cs-step-no { background: #635BFF; box-shadow: 0 0 0 6px #EEEDFF; }
.cs-step:nth-child(3) .cs-step-no { background: var(--brand-2); box-shadow: 0 0 0 6px var(--brand-soft); }
.cs-step:nth-child(4) .cs-step-no { background: #31A34C; box-shadow: 0 0 0 6px var(--green-soft); }
.cs-step-body b { display: block; font-size: 15.5px; color: var(--ink); }
.cs-step-body span { display: block; margin-top: 3px; font-size: 12.5px; color: var(--ink3); }

/* 定制版说明（暖色信息条） */
.cs-infobar {
    background: var(--accent-soft);
    border: 1px solid var(--accent-line);
    border-radius: 14px;
    padding: 20px 26px 22px;
}
.cs-infobar-tag {
    display: inline-block;
    background: var(--accent); color: #fff;
    font-size: 13px; font-weight: 700;
    border-radius: 999px;
    padding: 5px 16px;
}
.cs-infobar-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: 16px;
}
.cs-icc { background: #fff; border-radius: 10px; padding: 16px 18px; }
.cs-icc-k { font-size: 12.5px; color: var(--ink3); }
.cs-icc-v { margin-top: 4px; font-size: 25px; font-weight: 800; color: var(--accent-deep); }
.cs-icc-d { margin-top: 6px; font-size: 12.5px; line-height: 1.65; color: var(--ink3); }

/* 技术亮点（深色横幅） */
.cs-hl {
    margin-top: 24px;
    background: linear-gradient(135deg, var(--navy), var(--brand-deep));
    border-radius: 14px;
    padding: 24px 30px;
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    gap: 22px;
    align-items: center;
    color: #fff;
}
.cs-hl-title {
    font-size: 16px; font-weight: 800; line-height: 1.6;
    border-right: 1px solid rgba(255, 255, 255, .14);
    padding-right: 20px;
}
.cs-hl-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 26px; }
.cs-hl-item { display: flex; align-items: center; gap: 12px; }
.cs-hl-badge {
    flex: none; min-width: 60px; text-align: center;
    background: var(--cs-c); color: #fff;
    font-size: 12px; font-weight: 700;
    border-radius: 6px; padding: 4px 10px;
}
.cs-hl-item b { display: block; font-size: 14px; }
.cs-hl-item small { display: block; margin-top: 2px; font-size: 12px; color: rgba(255, 255, 255, .62); }

/* ---- S3 18 大核心模块：6 列紧凑网格 ---- */
.cs-mods {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 14px;
}
.cs-mod {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 20px 14px 18px;
    text-align: center;
    transition: transform .16s, box-shadow .16s, border-color .16s;
}
.cs-mod:hover {
    transform: translateY(-4px);
    border-color: var(--cs-c);
    box-shadow: 0 12px 26px rgba(3, 131, 188, .12);
}
.cs-mod-ico {
    display: inline-flex; align-items: center; justify-content: center;
    width: 46px; height: 46px;
    border-radius: 12px;
    background: var(--cs-c-soft); color: var(--cs-c);
}
.cs-mod-ico svg { width: 23px; height: 23px; }
.cs-mod b { display: block; margin-top: 12px; font-size: 14px; color: var(--ink); }
.cs-mod small { display: block; margin-top: 5px; font-size: 12px; line-height: 1.6; color: var(--ink3); }

/* ---- S4 AI 智能建站 ---- */
.cs-industries {
    display: flex; flex-wrap: wrap; justify-content: center; gap: 10px;
    margin-bottom: 30px;
}
.cs-ind {
    font-size: 13.5px; color: var(--ink2);
    background: #fff; border: 1px solid var(--line);
    border-radius: 999px;
    padding: 7px 20px;
    transition: color .15s, border-color .15s, background .15s;
}
.cs-ind:hover { color: var(--brand); border-color: var(--brand); background: var(--brand-soft); }
.cs-ai {
    background: #fff;
    border: 1px solid var(--line);
    border-top: 4px solid var(--cs-c);
    border-radius: 12px;
    padding: 26px 24px;
    transition: transform .16s, box-shadow .16s;
}
.cs-ai:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(3, 131, 188, .13); }
.cs-ai-ico {
    display: inline-flex; align-items: center; justify-content: center;
    width: 48px; height: 48px;
    border-radius: 12px;
    background: var(--cs-c-soft); color: var(--cs-c);
}
.cs-ai-ico svg { width: 26px; height: 26px; }
.cs-ai h3 { margin-top: 16px; font-size: 17px; font-weight: 700; }
.cs-ai p { margin-top: 10px; font-size: 13.5px; line-height: 1.8; color: var(--ink2); }

/* ---- S5 三大解决方案：三列等高卡 ---- */
.cs-sols {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    align-items: stretch;
}
.cs-sol {
    position: relative; overflow: hidden;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 26px 24px 24px;
    display: flex; flex-direction: column;
    transition: transform .16s, box-shadow .16s;
}
.cs-sol::before {
    content: '';
    position: absolute; top: 0; left: 0; right: 0; height: 4px;
    background: var(--cs-c);
}
.cs-sol:hover { transform: translateY(-4px); box-shadow: 0 16px 36px rgba(14, 58, 88, .1); }
.cs-sol-head { display: flex; align-items: center; gap: 12px; }
.cs-sol-ico {
    flex: none;
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px;
    border-radius: 11px;
    background: var(--cs-c-soft); color: var(--cs-c);
}
.cs-sol-ico svg { width: 22px; height: 22px; }
.cs-sol-head h3 { font-size: 17px; font-weight: 700; }
.cs-sol-desc { margin-top: 14px; font-size: 13.5px; line-height: 1.8; color: var(--ink2); flex: 1; }
.cs-pills { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.cs-pill {
    font-size: 12px; font-weight: 600;
    color: var(--cs-c); background: var(--cs-c-soft);
    border-radius: 999px;
    padding: 4px 12px;
}
.cs-checks {
    margin-top: 16px;
    border-top: 1px dashed var(--line);
    padding-top: 16px;
    display: grid; gap: 10px;
}
.cs-check { display: flex; gap: 10px; font-size: 13px; line-height: 1.7; color: var(--ink2); }
.cs-check i {
    flex: none;
    width: 20px; height: 20px; border-radius: 50%;
    background: var(--cs-c-soft); color: var(--cs-c);
    font-size: 11px; font-style: normal; font-weight: 800;
    display: inline-flex; align-items: center; justify-content: center;
    margin-top: 2px;
}

/* ---- S6 核心赠送服务（深色区） ---- */
.cs-gift {
    background:
        radial-gradient(800px 360px at 90% -10%, rgba(53, 175, 223, .28), transparent 60%),
        linear-gradient(160deg, var(--navy) 0%, var(--brand-deep) 100%);
    color: #fff;
    padding: 64px 0;
}
.cs-gift .sec-ghost { color: rgba(255, 255, 255, .06); }
.cs-gifts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 16px;
    max-width: 960px;
    margin: 0 auto;
}
.cs-gift-item {
    display: flex; align-items: center; gap: 14px;
    background: rgba(255, 255, 255, .07);
    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 12px;
    padding: 14px 20px;
    transition: background .16s;
}
.cs-gift-item:hover { background: rgba(255, 255, 255, .13); }
.cs-gift-no {
    flex: none;
    display: inline-flex; align-items: center; justify-content: center;
    width: 42px; height: 42px;
    border-radius: 50%;
    background: var(--cs-c); color: #fff;
    font-size: 14px; font-weight: 800;
}
.cs-gift-item b { display: block; font-size: 15px; }
.cs-gift-item small { display: block; margin-top: 2px; font-size: 12.5px; color: rgba(255, 255, 255, .62); }

.cs-promise {
    max-width: 880px;
    margin: 34px auto 0;
    border: 1px solid rgba(247, 154, 1, .5);
    border-radius: 12px;
    padding: 26px 28px 22px;
    text-align: center;
    background: rgba(247, 154, 1, .06);
}
.cs-promise-tag {
    display: inline-block;
    color: var(--accent-2);
    font-size: 13px; font-weight: 700;
    letter-spacing: .1em;
    border-bottom: 2px solid rgba(247, 154, 1, .55);
    padding-bottom: 8px;
}
.cs-years {
    display: flex; align-items: center; justify-content: center;
    gap: 48px;
    margin-top: 20px;
}
.cs-year { display: flex; align-items: baseline; gap: 10px; }
.cs-year b {
    font-size: 52px; font-weight: 800; line-height: 1;
    color: var(--accent-2);
    font-variant-numeric: tabular-nums;
}
.cs-year span { font-size: 15px; font-weight: 600; }
.cs-year-div { width: 1px; height: 46px; background: rgba(255, 255, 255, .25); }
.cs-promise-row {
    margin-top: 18px;
    font-size: 13.5px;
    color: rgba(255, 255, 255, .8);
    display: flex; align-items: center; justify-content: center;
    gap: 16px;
}
.cs-promise-row i { width: 1px; height: 11px; background: rgba(255, 255, 255, .3); }

.cs-ending { text-align: center; margin-top: 40px; }
.cs-ending b { font-size: 21px; font-weight: 800; letter-spacing: .04em; }
.cs-ending p { margin-top: 10px; font-size: 13.5px; color: rgba(255, 255, 255, .65); }

/* ---- 响应式 ---- */
@media (max-width: 1100px) {
    .cs-hero-grid { grid-template-columns: 1fr; gap: 40px; padding-bottom: 44px; }
    .cs-hero-title { font-size: 34px; }
    .cs-feats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cs-mods { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .cs-sols { grid-template-columns: 1fr; }
    .cs-hl { grid-template-columns: 1fr; }
    .cs-hl-title {
        border-right: 0; padding-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, .14);
        padding-bottom: 14px;
    }
}
@media (max-width: 700px) {
    .cs-hero { padding: 48px 0 44px; }
    .cs-hero-title { font-size: 27px; }
    .cs-price-num { font-size: 32px; }
    .cs-feats { grid-template-columns: 1fr; }
    .cs-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 8px; }
    .cs-step { flex-direction: column; text-align: center; gap: 8px; padding: 0; }
    .cs-step::before, .cs-step::after { display: none; }
    .cs-step-body b { font-size: 14px; }
    .cs-infobar-grid { grid-template-columns: 1fr; }
    .cs-hl { padding: 20px 22px; }
    .cs-hl-grid { grid-template-columns: 1fr; }
    .cs-mods { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cs-gifts { grid-template-columns: 1fr; }
    .cs-years { gap: 24px; }
    .cs-year b { font-size: 38px; }
    .cs-promise-row { flex-wrap: wrap; }
    .cs-float-1 { left: 6px; }
    .cs-float-2 { right: 6px; }
}

/* ============================================================
   Round9 · 云建站产品线二级导航（.bsub-*）
   位置：分类横幅（page-hero）下方，产品线各页统一保留
   ============================================================ */
.bsub { background: #fff; border-bottom: 1px solid var(--line); }
.bsub-in { display: flex; align-items: center; gap: 24px; }
.bsub-nav { display: flex; align-items: stretch; overflow-x: auto; scrollbar-width: none; }
.bsub-nav::-webkit-scrollbar { display: none; }
.bsub-nav a {
    position: relative; display: flex; align-items: center; gap: 6px;
    padding: 15px 26px; font-size: 15px; color: var(--ink2);
    white-space: nowrap; transition: color .15s;
}
.bsub-nav a:hover { color: var(--brand); }
.bsub-nav a.active { color: var(--brand); font-weight: 600; }
.bsub-nav a.active::after {
    content: ''; position: absolute; left: 24px; right: 24px; bottom: -1px;
    height: 3px; border-radius: 3px 3px 0 0; background: var(--brand);
}
.bsub-ext { width: 14px; height: 14px; color: var(--ink4); }
.bsub-nav a:hover .bsub-ext, .bsub-nav a.active .bsub-ext { color: var(--brand); }
/* 面包屑同行右对齐（与顶部核心区右缘对齐） */
.bsub .bsub-crumb { margin: 0 0 0 auto; padding: 0; flex: none; }
@media (max-width: 1100px) {
    .bsub .bsub-crumb { display: none; }
}
@media (max-width: 700px) {
    .bsub-nav a { padding: 12px 16px; font-size: 14px; }
    .bsub-nav a.active::after { left: 14px; right: 14px; }
}

/* ============================================================
   Round9 · 产品参数页（.sp-*）  /c/corp-site-spec
   ============================================================ */
.sp-wrap {
    width: 100%; background: #fff;
    border: 1px solid var(--line); border-radius: 14px; overflow: hidden;
    box-shadow: 0 8px 30px rgba(3, 61, 90, .06);
}
.sp-head { background: linear-gradient(135deg, #0383BC, #046A96); padding: 26px 30px; color: #fff; }
.sp-head h1 { font-size: 22px; font-weight: 700; color: #fff; }
.sp-head p { margin-top: 8px; font-size: 13px; color: rgba(255, 255, 255, .85); }
.sp-sec { border-top: 1px solid var(--line); }
.sp-sec-h {
    background: #F2F8FC; padding: 13px 30px; font-size: 16px; font-weight: 700;
    color: var(--brand); border-left: 4px solid var(--brand);
}
.sp-intro { padding: 22px 30px; font-size: 14.5px; line-height: 2.05; color: var(--ink2); text-align: justify; }
.sp-nodes { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding: 22px 30px; }
.sp-node {
    display: flex; gap: 14px; padding: 18px;
    border: 1px solid var(--line); border-radius: 12px; background: #FAFDFF;
}
.sp-node-ico {
    flex: none; width: 42px; height: 42px; border-radius: 10px;
    background: rgba(3, 131, 188, .1); color: var(--brand);
    display: flex; align-items: center; justify-content: center;
}
.sp-node-ico svg { width: 22px; height: 22px; }
.sp-node-t { font-size: 15.5px; font-weight: 700; color: var(--ink); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.sp-node-tag {
    font-size: 11.5px; font-weight: 600; color: var(--accent);
    background: rgba(247, 154, 1, .12); padding: 2px 10px; border-radius: 999px;
}
.sp-node p { margin-top: 6px; font-size: 13.5px; line-height: 1.9; color: var(--ink3); }
.sp-table-wrap { overflow-x: auto; }
.sp-table { width: 100%; min-width: 640px; border-collapse: collapse; font-size: 14px; }
.sp-table th, .sp-table td {
    border-bottom: 1px solid #EDF3F8; padding: 14px 18px;
    text-align: left; vertical-align: top; line-height: 1.85; color: var(--ink2);
}
.sp-table thead th {
    background: #fff; color: var(--ink3); font-size: 13px; font-weight: 600;
    border-bottom: 2px solid var(--line); white-space: nowrap;
}
.sp-table tbody tr:last-child td { border-bottom: none; }
.sp-table tbody tr:hover td { background: #FAFDFF; }
.sp-k { font-weight: 600; color: var(--ink); white-space: nowrap; }
.sp-spec { color: var(--accent); font-weight: 600; }
.sp-yes {
    display: inline-flex; width: 22px; height: 22px; border-radius: 50%;
    background: rgba(3, 131, 188, .1); color: var(--brand);
    align-items: center; justify-content: center; font-size: 13px; font-weight: 700;
}
.sp-note { margin-top: 16px; font-size: 12.5px; color: var(--ink4); text-align: center; }
@media (max-width: 700px) {
    .sp-head { padding: 20px 18px; }
    .sp-head h1 { font-size: 18px; }
    .sp-sec-h { padding: 11px 18px; font-size: 15px; }
    .sp-intro { padding: 18px; font-size: 13.5px; }
    .sp-nodes { grid-template-columns: 1fr; padding: 18px; gap: 12px; }
    .sp-table th, .sp-table td { padding: 11px 12px; font-size: 13px; }
}

/* ============================================================
   Round10 · AI建站 · H5四合一/八合一 复刻页（.ah-*，源站结构+站内配色）
   ============================================================ */
.ah-hero { display: flex; align-items: center; gap: 48px; }
.ah-hero-img { flex: 1.15; min-width: 0; }
.ah-hero-img img { width: 100%; height: auto; display: block; }
.ah-hero-txt { flex: 1; min-width: 0; }
.ah-hero-txt h2 { margin: 0 0 14px; font-size: 30px; line-height: 1.3; }
.ah-hero-txt p { margin: 0 0 26px; font-size: 15px; line-height: 1.9; color: var(--ink2); }
.ah-hero-btns { display: flex; gap: 14px; flex-wrap: wrap; }

.ah-douhao { width: 26px; height: 26px; margin-left: 10px; vertical-align: -4px; opacity: .85; }

.ah-split { display: flex; align-items: center; gap: 48px; }
.ah-featlist {
    flex: 1; min-width: 0; margin: 0; padding: 0; list-style: none;
    display: flex; flex-direction: column; gap: 18px;
}
.ah-featlist li { display: flex; align-items: baseline; font-size: 16.5px; color: var(--ink); line-height: 1.6; }
.ah-fl-n { color: var(--accent); font-weight: 700; margin-right: 8px; flex: none; }
.ah-split-img { flex: 1.1; min-width: 0; }
.ah-split-img img { width: 100%; height: auto; display: block; }

.ah-icons {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px;
    max-width: 1100px; margin: 0 auto;
}
.ah-icon {
    background: #fff; border: 1px solid var(--line); border-radius: 14px;
    padding: 26px 14px 22px; text-align: center;
    transition: box-shadow .18s, transform .18s;
}
.ah-icon:hover { box-shadow: 0 10px 28px rgba(3, 61, 90, .10); transform: translateY(-3px); }
.ah-icon img { width: 56px; height: 56px; object-fit: contain; display: block; margin: 0 auto 14px; }
.ah-icon span { font-size: 14.5px; color: var(--ink2); font-weight: 500; }

.ah-advs { row-gap: 22px; }
.ah-adv {
    background: #fff; border: 1px solid var(--line); border-radius: 14px;
    padding: 24px 24px 22px; position: relative; overflow: hidden;
    transition: box-shadow .18s, transform .18s;
}
.ah-adv:hover { box-shadow: 0 10px 28px rgba(3, 61, 90, .10); transform: translateY(-3px); }
.ah-adv-n {
    position: absolute; right: 14px; top: 6px;
    font-size: 44px; font-weight: 800; color: rgba(3, 131, 188, .10);
    line-height: 1; letter-spacing: -.02em;
}
.ah-adv h3 { margin: 0 0 8px; font-size: 17px; }
.ah-adv p { margin: 0; font-size: 13.5px; color: var(--ink3); line-height: 1.75; }

.ah-cases { row-gap: 22px; }
.ah-case {
    margin: 0; background: #fff; border: 1px solid var(--line);
    border-radius: 14px; overflow: hidden;
    box-shadow: 0 6px 20px rgba(3, 61, 90, .06);
    transition: box-shadow .18s, transform .18s;
}
.ah-case:hover { box-shadow: 0 12px 32px rgba(3, 61, 90, .12); transform: translateY(-3px); }
.ah-case img { width: 100%; height: auto; display: block; }

.ah-quotes { row-gap: 22px; }
.ah-quote {
    margin: 0; background: #fff; border: 1px solid var(--line);
    border-radius: 14px; padding: 24px 26px 20px;
    display: flex; gap: 18px; align-items: flex-start;
}
.ah-quote-face {
    flex: none; width: 64px; height: 64px; border-radius: 50%;
    object-fit: cover; border: 3px solid #eef4f8;
}
.ah-quote blockquote {
    margin: 0 0 10px; font-size: 14px; line-height: 1.85; color: var(--ink2);
    position: relative; padding-left: 14px;
    border-left: 3px solid var(--accent);
}
.ah-quote figcaption { font-size: 12.5px; color: var(--ink4); }

.ah-banner {
    background: linear-gradient(135deg, var(--brand-deep, #036192) 0%, var(--brand, #0383BC) 100%);
    padding: 54px 0; text-align: center;
}
.ah-banner h2 { margin: 0 0 26px; color: #fff; font-size: 26px; line-height: 1.5; }
.ah-banner-btns { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

@media (max-width: 1100px) {
    .ah-icons { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
    .ah-hero { flex-direction: column-reverse; gap: 30px; }
    .ah-split { flex-direction: column; gap: 30px; }
    .ah-hero-txt h2 { font-size: 24px; }
    .ah-banner h2 { font-size: 20px; padding: 0 10px; }
}
@media (max-width: 700px) {
    .ah-hero { gap: 22px; }
    .ah-hero-txt h2 { font-size: 21px; }
    .ah-hero-txt p { font-size: 14px; }
    .ah-split { gap: 22px; }
    .ah-featlist { gap: 12px; }
    .ah-featlist li { font-size: 14.5px; }
    .ah-icons { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .ah-icon { padding: 18px 10px 16px; }
    .ah-icon img { width: 44px; height: 44px; margin-bottom: 10px; }
    .ah-icon span { font-size: 13px; }
    .ah-adv { padding: 20px 18px 18px; }
    .ah-quote { padding: 18px 18px 16px; gap: 14px; }
    .ah-quote-face { width: 48px; height: 48px; }
    .ah-banner { padding: 40px 0; }
    .ah-banner h2 { font-size: 18px; }
}
/* ============================================================ */

/* ============================================================
   Round11 · AI建站 · 外贸独立站 复刻页（.at-*，源站结构+站内配色）
   ============================================================ */
.at-hero-img img { border-radius: 16px; box-shadow: 0 14px 40px rgba(3, 61, 90, .14); }

.at-strip {
    display: flex; align-items: center; justify-content: center; gap: 18px; flex-wrap: wrap;
    background: #fff; border: 1px solid var(--line); border-radius: 999px;
    padding: 14px 30px; font-size: 15px; color: var(--ink2);
}
.at-strip a { color: var(--brand); font-weight: 600; }
.at-strip a:hover { text-decoration: underline; }

.at-adv {
    display: flex; align-items: center; gap: 56px;
    padding: 44px 0;
}
.at-adv + .at-adv { border-top: 1px dashed var(--line); }
.at-adv-rev { flex-direction: row-reverse; }
.at-adv-txt { flex: 1; min-width: 0; }
.at-adv-img { flex: 1; min-width: 0; }
.at-adv-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.at-adv-head > img:first-child { width: 42px; height: 42px; object-fit: contain; flex: none; }
.at-adv-head h3 { margin: 0; font-size: 21px; }
.at-adv-txt p { margin: 0 0 16px; font-size: 14.5px; line-height: 1.9; color: var(--ink2); }
.at-flags { width: 100%; max-width: 460px; height: auto; display: block; border-radius: 8px; }
.at-adv-img img { width: 100%; height: auto; display: block; }
.at-adv-img-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: center; }
.at-adv-img-2 img { border-radius: 12px; }

.at-langs {
    display: flex; flex-wrap: wrap; gap: 12px 14px; justify-content: center;
    max-width: 1000px; margin: 0 auto;
}
.at-lang {
    display: inline-flex; align-items: center;
    background: #fff; border: 1px solid var(--line); border-radius: 999px;
    padding: 10px 22px; font-size: 14.5px; color: var(--ink2); font-weight: 500;
    transition: color .15s, border-color .15s, box-shadow .15s;
}
.at-lang:hover {
    color: var(--brand); border-color: var(--brand);
    box-shadow: 0 6px 16px rgba(3, 131, 188, .12);
}

@media (max-width: 900px) {
    .at-adv, .at-adv-rev { flex-direction: column; gap: 26px; padding: 34px 0; }
    .at-adv-head h3 { font-size: 18px; }
    .at-adv-img-2 { gap: 10px; }
    .at-strip { font-size: 13.5px; padding: 12px 20px; gap: 10px; }
}
@media (max-width: 700px) {
    .at-adv { gap: 20px; padding: 28px 0; }
    .at-adv-head h3 { font-size: 16.5px; }
    .at-adv-head > img:first-child { width: 34px; height: 34px; }
    .at-adv-txt p { font-size: 13.5px; }
    .at-lang { padding: 8px 16px; font-size: 13px; }
}
/* ============================================================ */

/* ============================================================
   Round12 · AI建站 · 版本参数对比页（.ae-*，复用 .sp-* 通栏表格体系）
   ============================================================ */
.ae-table th, .ae-table td { text-align: center; }
.ae-table td.sp-k { text-align: left; padding-left: 20px; }
.ae-table th { font-size: 15px; }
.ae-sec-row td {
    background: #F2F8FC; color: var(--brand); font-weight: 700;
    font-size: 13.5px; letter-spacing: .04em; padding: 10px 20px !important;
    text-align: left !important;
}
.ae-no {
    display: inline-flex; width: 22px; height: 22px; border-radius: 50%;
    background: #F1F3F5; color: #B7C0C8;
    align-items: center; justify-content: center; font-size: 13px; font-weight: 700;
}
.ae-txt { color: var(--accent); font-weight: 600; font-size: 12.5px; }
@media (max-width: 700px) {
    .ae-table th { font-size: 13px; }
    .ae-sec-row td { padding: 8px 14px !important; font-size: 12.5px; }
}
/* ============================================================ */
/* ============================================================
   Round13 · AI 智能建站 MCP+Skill 板块（ai-h5 页 #ai-mcp）
   ============================================================ */
.ah-mcp-top {
    display: grid; grid-template-columns: 1.05fr .95fr; gap: 44px;
    background: #fff; border: 1px solid var(--line); border-radius: 16px;
    padding: 34px 38px; margin-bottom: 34px;
    box-shadow: 0 8px 30px rgba(3, 61, 90, .05);
}
.ah-mcp-desc p {
    margin: 0 0 18px; font-size: 15px; line-height: 1.9; color: var(--ink2);
}
.ah-mcp-desc b { color: var(--brand); }
.ah-mcp-clients { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.ah-mcp-clients-t { font-size: 13px; font-weight: 700; color: var(--ink3); margin-right: 4px; }
.ah-mcp-pill {
    padding: 5px 14px; border-radius: 999px; font-size: 12.5px; font-weight: 600;
    background: rgba(3, 131, 188, .08); color: var(--brand);
}
.ah-mcp-steps {
    list-style: none; margin: 0; padding: 0; position: relative;
    display: flex; flex-direction: column; gap: 16px;
}
.ah-mcp-steps::before {
    content: ''; position: absolute; left: 15px; top: 14px; bottom: 14px;
    width: 2px; background: rgba(3, 131, 188, .18);
}
.ah-mcp-steps li { display: flex; gap: 14px; position: relative; }
.ah-mcp-n {
    flex: none; width: 32px; height: 32px; border-radius: 50%;
    background: var(--brand); color: #fff;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 13px; font-weight: 700; z-index: 1;
}
.ah-mcp-steps b { display: block; font-size: 15px; color: var(--ink); }
.ah-mcp-steps p { margin: 3px 0 0; font-size: 13px; line-height: 1.7; color: var(--ink3); }

.ah-caps { --gap: 18px; }
.ah-cap {
    position: relative; overflow: hidden;
    background: linear-gradient(155deg, #06456B, var(--brand-deep, #033d5a) 55%, #022C43);
    border-radius: 16px; padding: 26px 24px 24px; color: #fff;
}
.ah-cap-n {
    position: absolute; right: 14px; top: 2px;
    font-size: 58px; font-weight: 800; line-height: 1;
    color: rgba(255, 255, 255, .08); letter-spacing: -.02em;
}
.ah-cap h3 {
    position: relative; margin: 0 0 10px; font-size: 17px; color: #fff;
    padding-bottom: 12px;
}
.ah-cap h3::after {
    content: ''; position: absolute; left: 0; bottom: 0;
    width: 26px; height: 3px; border-radius: 3px; background: var(--accent);
}
.ah-cap p {
    position: relative; margin: 0; font-size: 13px; line-height: 1.85;
    color: rgba(255, 255, 255, .78);
}
@media (max-width: 1100px) {
    .ah-mcp-top { grid-template-columns: 1fr; gap: 26px; padding: 26px 24px; }
}
@media (max-width: 700px) {
    .ah-mcp-top { padding: 20px 16px; border-radius: 12px; margin-bottom: 24px; }
    .ah-cap { padding: 20px 18px 18px; }
    .ah-cap-n { font-size: 46px; }
}
/* ============================================================ */
/* ============================================================
   Round14 · 案例展示 / 模板展示 iframe 嵌套页（ai-anli / ai-moban）
   ============================================================ */
.ai-embed-sec { padding: 26px 0 44px; }
.ai-frame {
    display: block; width: 100%;
    border: 1px solid var(--line); border-radius: 14px;
    background: #fff; box-shadow: 0 8px 30px rgba(3, 61, 90, .06);
}
.ai-embed-tip { margin-top: 14px; font-size: 12.5px; color: var(--ink4); text-align: center; }
.ai-embed-tip a { color: var(--brand); }
.ai-embed-tip a:hover { text-decoration: underline; }
@media (max-width: 700px) {
    .ai-embed-sec { padding: 16px 0 30px; }
    .ai-frame { height: 1400px !important; border-radius: 10px; }
}
/* ============================================================ */

/* ===== 版本参数页 · 三版本设计区块（每版一图） ===== */
.ae-choose{display:flex;flex-direction:column;gap:26px}
.ae-vcard{display:flex;gap:30px;background:#fff;border:1px solid #dbe6ee;border-radius:14px;
    padding:28px;box-shadow:0 6px 24px rgba(23,43,66,.06);overflow:hidden}
.ae-vcard.ae-vflip{flex-direction:row-reverse}
.ae-vimg{flex:0 0 380px;display:flex;align-items:center;justify-content:center}
.ae-vimg img{width:100%;border-radius:10px;border:1px solid #e2ecf3;box-shadow:0 4px 16px rgba(23,43,66,.08)}
.ae-vbody{flex:1 1 auto;min-width:0}
.ae-vhead{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;flex-wrap:wrap}
.ae-vtitle{font-size:20px;font-weight:800;color:var(--ink,#16212b);position:relative;display:inline-block}
.ae-vtitle .ae-hot{position:absolute;top:-10px;right:-30px;font-style:normal;font-size:11px;font-weight:700;color:#fff;
    background:var(--accent,#F79A01);border-radius:9px;padding:2px 7px;box-shadow:0 1px 3px rgba(0,0,0,.18)}
.ae-vsub{font-size:13.5px;color:var(--ink3,#6b7a89);margin-top:4px}
.ae-vbuy{text-align:right;flex:0 0 auto}
.ae-vprice{font-size:26px;font-weight:800;color:var(--accent,#F79A01);line-height:1.1}
.ae-vprice span{font-size:15px;font-weight:700;margin-right:2px}
.ae-vprice i{font-style:normal;font-size:12.5px;font-weight:500;color:var(--ink3,#6b7a89);margin-left:3px}
.ae-vbuy .btn{margin-top:8px}
.ae-vdesc{font-size:14px;line-height:1.8;color:var(--ink2,#3a4a5a);margin:12px 0 14px}
.ae-chipgroups{display:grid;grid-template-columns:1fr 1fr;gap:12px 24px}
.ae-cg{display:flex;gap:10px;align-items:flex-start}
.ae-cgt{flex:0 0 74px;font-size:13px;font-weight:700;color:var(--brand,#0383BC);background:#e9f4fb;
    border-radius:6px;padding:5px 0;text-align:center;margin-top:2px}
.ae-cgc{display:flex;flex-wrap:wrap;gap:8px}
.ae-chip{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:var(--ink2,#3a4a5a);
    background:#f4f8fb;border:1px solid #e2ecf3;border-radius:999px;padding:4px 13px}
.ae-chip b{color:var(--brand,#0383BC);font-size:12px;font-weight:800}
.ae-chip-hot{background:#fff7ec;border-color:#f6c583;color:#b26100;font-weight:600}
.ae-chip-hot b{color:var(--accent,#F79A01)}
.ae-vlinks{margin-top:16px;display:flex;gap:18px}
.ae-vlinks a{font-size:13.5px;color:var(--brand,#0383BC);text-decoration:none}
.ae-vlinks a:hover{text-decoration:underline}

@media (max-width:1100px){
    .ae-vcard,.ae-vcard.ae-vflip{flex-direction:column;gap:18px;padding:20px 16px}
    .ae-vimg{flex:none;max-width:440px;margin:0 auto}
    .ae-chipgroups{grid-template-columns:1fr}
    .ae-vbuy{text-align:left}
}

/* 版本面板 · 橙色重点功能项（定时发布 / GEO推广） */
.ae-chip-hot{background:#fff7ec;border-color:#f6c583;color:#b26100;font-weight:600}
.ae-chip-hot b{color:var(--accent,#F79A01)}
/* ===== 版本参数页 · 顶部标签选择（切换三个版本面板） ===== */
.ae-tabs{display:flex;border-bottom:2px solid var(--brand,#0383BC)}
.ae-tab{position:relative;appearance:none;border:1px solid #dbe6ee;border-bottom:none;background:#f4f8fb;color:var(--ink2,#3a4a5a);
    font-size:15.5px;font-weight:600;padding:13px 30px;cursor:pointer;border-radius:10px 10px 0 0;margin-right:8px;
    transition:background .15s,color .15s;line-height:1.2;white-space:nowrap}
.ae-tab:hover{background:#e9f2f8}
.ae-tab.on{background:var(--brand,#0383BC);border-color:var(--brand,#0383BC);color:#fff}
.ae-tab .ae-hot{position:absolute;top:-9px;right:-7px;font-style:normal;font-size:11px;font-weight:700;color:#fff;
    background:var(--accent,#F79A01);border-radius:9px;padding:2px 7px;box-shadow:0 1px 3px rgba(0,0,0,.18)}
.ae-panel{display:none;border:1px solid #dbe6ee;border-top:none;background:#fff;padding:24px 26px}
.ae-panel.on{display:block}
.ae-panel .ae-vcard{border:none;box-shadow:none;padding:0;border-radius:0}
.ae-panel .ae-vcard.ae-vflip{flex-direction:row-reverse}

@media (max-width:900px){
    .ae-tabs{overflow-x:auto;-webkit-overflow-scrolling:touch}
    .ae-tab{padding:11px 18px;font-size:14px}
    .ae-panel{padding:16px 12px}
}

/* ===== 顶部导航下拉「AI建站」荐角标 + 版本面板角标防裁剪 ===== */
.dd-inner a b .dd-hot{display:inline-block;font-style:normal;font-size:11px;font-weight:700;color:#fff;
    background:var(--accent,#F79A01);border-radius:9px;padding:1px 6px;margin-left:6px;
    vertical-align:2px;line-height:1.4;box-shadow:0 1px 3px rgba(0,0,0,.18)}
.dd-inner a:hover b .dd-hot,.dd-inner a.active b .dd-hot{color:#fff}
/* 面板内卡片 padding 被清零，角标超出顶边会被 overflow:hidden 裁掉 */
.ae-panel .ae-vcard{overflow:visible}

/* ===== 首页 AI 建站轮播 Banner（第2张照 jz.fkw.com/aiJz.html 首屏复刻） ===== */
.hero-slider{position:relative;overflow:hidden}
.hs-track{display:flex;transition:transform .65s ease}
.hs-slide{flex:0 0 100%;width:100%;min-width:0;overflow:hidden}
.hs-dots{position:absolute;left:0;right:0;bottom:16px;display:flex;justify-content:center;gap:10px;z-index:6;
    background:rgba(10,30,55,.35);backdrop-filter:blur(4px);width:max-content;margin:0 auto;padding:7px 14px;border-radius:999px}
.hs-dot{width:24px;height:5px;border-radius:3px;border:none;background:rgba(255,255,255,.45);cursor:pointer;padding:0;transition:background .2s,width .2s}
.hs-dot.on{background:#fff;width:38px}

/* --- 第2张：AI 建站（浅蓝科技风） --- */
.hero-ai{color:#16213a;
    background:
        radial-gradient(900px 420px at 86% 8%, rgba(255,255,255,.6), transparent 62%),
        linear-gradient(115deg,#eef4fe 0%,#ddecfc 46%,#c9e0fa 100%)}
.hero-ai::before{content:"";position:absolute;inset:0;pointer-events:none;
    background:
        linear-gradient(115deg,transparent 28%,rgba(255,255,255,.5) 46%,transparent 60%),
        linear-gradient(115deg,transparent 52%,rgba(120,170,240,.22) 70%,transparent 84%)}
.hero-ai .container{position:relative;z-index:1}
.ai-inner{display:flex;align-items:center;gap:46px}
.ai-copy{flex:1;min-width:0}
.ai-badge{display:inline-flex;align-items:center;background:#fff;border:1px solid #cfe0f5;border-radius:999px;
    padding:9px 20px;font-size:13.5px;font-weight:600;color:#3d6bb3;box-shadow:0 4px 14px rgba(31,94,255,.08)}
.ai-title{margin-top:24px;font-size:52px;font-weight:900;line-height:1.2;letter-spacing:1px;color:#16213a}
.ai-title em{font-style:normal;color:#1f5eff}
.ai-sub{margin-top:16px;font-size:16px;color:#5a6a85;letter-spacing:.5px}
.ai-feats{margin-top:26px;display:flex;gap:14px;flex-wrap:wrap}
.ai-feat{display:inline-flex;align-items:center;gap:9px;background:#fff;border:1px solid #d7e5f7;border-radius:10px;
    padding:11px 17px;font-size:14.5px;font-weight:600;color:#2a3c5c;box-shadow:0 4px 12px rgba(31,94,255,.06)}
.ai-feat svg{width:20px;height:20px;color:#1f5eff}
.ai-cta{display:inline-block;margin-top:32px;padding:15px 38px;border-radius:999px;
    background:linear-gradient(90deg,#ffc257,#ff9d2e);color:#fff;font-size:17px;font-weight:800;letter-spacing:1px;
    text-decoration:none;box-shadow:0 10px 26px rgba(255,157,46,.4);transition:transform .15s,box-shadow .15s}
.ai-cta:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(255,157,46,.48)}

/* 右侧仿真视觉 */
.ai-visual{flex:0 0 46%;position:relative;min-height:430px}
.ai-browser{position:relative;z-index:2;background:#fff;border-radius:14px;box-shadow:0 24px 60px rgba(23,52,99,.18);
    padding:18px 18px 20px;margin-left:24px}
.ai-bhead{display:flex;align-items:center;gap:14px}
.ai-logo{font-size:14px;font-weight:800;color:#16213a;white-space:nowrap}
.ai-ask{flex:1;display:flex;align-items:center;gap:10px;background:#eef4ff;border:1px solid #cfe0fa;border-radius:999px;padding:7px 7px 7px 16px;min-width:0}
.ai-ask span{flex:1;font-size:13px;color:#33507e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ai-ask i{flex:0 0 26px;width:26px;height:26px;border-radius:50%;background:#1f5eff;color:#fff;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:13px}
.ai-steps{display:flex;align-items:center;gap:10px;margin-top:16px}
.ai-step{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:#33507e;white-space:nowrap}
.ai-step b{width:18px;height:18px;border-radius:50%;background:#1f5eff;color:#fff;font-size:11px;display:flex;align-items:center;justify-content:center;font-weight:700}
.ai-sline{flex:1;height:1px;background:linear-gradient(90deg,#9fc0f0,#dce8fb)}
.ai-tplrow{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-top:16px}
.ai-shot{height:92px;border-radius:8px;position:relative;overflow:hidden}
.ai-shot-1{background:linear-gradient(160deg,#dfe9fb 0%,#bcd4f7 55%,#8fb4f0 100%)}
.ai-shot-2{background:linear-gradient(160deg,#16213a 0%,#1f5eff 120%)}
.ai-shot::after{content:"";position:absolute;left:10px;right:10px;bottom:10px;height:26px;border-radius:6px;background:rgba(255,255,255,.85)}
.ai-bar{display:block;height:7px;border-radius:4px;background:#e6edf8;margin-top:8px}
.ai-bar.w60{width:60%}.ai-bar.w70{width:70%}.ai-bar.w50{width:50%}.ai-bar.w45{width:45%}.ai-bar.w40{width:40%}.ai-bar.w35{width:35%}
.ai-ct{font-size:12.5px;font-weight:700;color:#2a3c5c}
.ai-sw{display:flex;gap:6px;margin-top:8px}
.ai-sw i{width:22px;height:22px;border-radius:6px;border:1px solid rgba(22,33,58,.08)}
.ai-float{position:absolute;background:#fff;border-radius:12px;box-shadow:0 16px 40px rgba(23,52,99,.16);padding:14px 16px;z-index:3}
.ai-lang{left:-10px;bottom:-22px;width:186px}
.ai-ft{font-size:13px;font-weight:800;color:#16213a}
.ai-ft u{font-size:11px;color:#8a97ad;text-decoration:none;margin-left:6px;font-weight:400}
.ai-lr{display:flex;align-items:center;gap:8px;font-size:12px;color:#5a6a85;margin-top:9px}
.ai-lr i{width:14px;height:14px;border-radius:50%;flex:0 0 14px}
.ai-tdk{right:-6px;bottom:-38px;width:252px}
.ai-tr{margin-top:9px;font-size:11.5px;color:#8a97ad;line-height:1.5}
.ai-tr b{display:block;color:#1f5eff;font-weight:700;font-size:11.5px}

@media (max-width:1100px){
    .ai-inner{flex-direction:column;gap:36px;align-items:flex-start}
    .ai-title{font-size:38px}
    .ai-visual{flex:auto;width:100%;min-height:0;padding-bottom:56px}
    .ai-browser{margin-left:0}
    .ai-float.ai-lang{left:0;bottom:0}
    .ai-float.ai-tdk{right:0;bottom:-30px}
}
@media (max-width:640px){
    .ai-float{display:none}
}
@media (max-width:480px){
    .ai-title{font-size:30px}
    .ai-sub{font-size:14px}
    .ai-cta{padding:13px 26px;font-size:14.5px}
    .ai-sline{display:none}
    .ai-steps{gap:14px}
    .ai-tplrow{grid-template-columns:1fr 1fr}
    .ai-colors{display:none}
    .ai-feats{gap:10px}
    .ai-feat{padding:9px 13px;font-size:13px}
}

/* ===== 域名注册页（照西部数码域名频道版式） ===== */
.dw-panel{background:#fff;border:1px solid #e2ecf3;border-radius:14px;box-shadow:0 6px 24px rgba(23,43,66,.06);overflow:hidden}
.dw-tabs{display:flex;border-bottom:1px solid #e2ecf3;overflow-x:auto;overflow-y:hidden;
    -webkit-overflow-scrolling:touch;scrollbar-width:none}
.dw-tabs::-webkit-scrollbar{display:none;height:0}
.dw-tab{appearance:none;border:none;background:#f7fafc;color:var(--ink2,#3a4a5a);font-size:15.5px;font-weight:600;
    padding:15px 30px;cursor:pointer;white-space:nowrap;border-right:1px solid #e2ecf3;position:relative;transition:background .15s,color .15s}
.dw-tab:hover{background:#eef6fb}
.dw-tab.on{background:#fff;color:var(--brand,#0383BC)}
.dw-tab.on::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--brand,#0383BC)}
.dw-body{padding:26px 30px 30px}
.dw-slogan{font-size:17px;font-weight:800;color:var(--accent,#F79A01);margin-bottom:16px}
.dw-search{display:flex;gap:14px;border:2px solid var(--brand,#0383BC);border-radius:10px;padding:8px;background:#fbfdff}
.dw-search textarea{flex:1;border:none;outline:none;resize:none;background:transparent;font-size:15px;color:var(--ink,#16212b);
    line-height:1.5;padding:8px 12px;max-height:120px;font-family:inherit}
.dw-search textarea::placeholder{color:#9fb0c0}
.dw-go{flex:0 0 150px;appearance:none;border:none;border-radius:8px;cursor:pointer;color:#fff;font-size:18px;font-weight:800;
    background:linear-gradient(120deg,#2FA3DB,var(--brand,#0383BC));display:flex;align-items:center;justify-content:center;gap:8px;
    transition:filter .15s,opacity .15s}
.dw-go:hover{filter:brightness(1.06)}
.dw-go.loading{opacity:.6;pointer-events:none}
.dw-go svg{width:20px;height:20px}
.dw-tools{display:flex;justify-content:space-between;align-items:center;margin-top:14px;flex-wrap:wrap;gap:10px}
.dw-quick{display:inline-flex;gap:8px;align-items:center}
.dw-q{appearance:none;border:1px solid #d7e2ec;background:#fff;border-radius:999px;padding:5px 16px;font-size:13.5px;
    color:var(--ink2,#3a4a5a);cursor:pointer;transition:all .15s}
.dw-q.on{background:var(--brand,#0383BC);border-color:var(--brand,#0383BC);color:#fff}
.dw-tip{font-size:13px;color:var(--ink4,#9fb0c0)}
.dw-grid-wrap{margin-top:16px}
.dw-grid{display:none;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px 14px}
.dw-grid.on{display:grid}
.dw-tld{display:flex;align-items:center;gap:6px;background:#f7fafc;border:1px solid #e6eef5;border-radius:8px;
    padding:9px 12px;cursor:pointer;transition:border-color .15s,background .15s;user-select:none}
.dw-tld:hover{border-color:#9fc6e2;background:#f0f8fd}
.dw-tld input{accent-color:var(--brand,#0383BC);width:15px;height:15px;flex:0 0 15px;margin:0}
.dw-name{font-size:15px;font-weight:700;color:var(--ink,#16212b)}
.dw-badge{font-style:normal;font-size:10.5px;font-weight:700;color:#fff;border-radius:4px;padding:1.5px 5px;line-height:1.3}
.dw-badge-hot{background:#e8483f}
.dw-badge-promo{background:var(--accent,#F79A01)}
.dw-tld em{font-style:normal;font-size:12px;color:var(--ink4,#9fb0c0);margin-left:auto}

/* 查询结果 */
.dw-result{margin-top:28px;background:#fff;border:1px solid #e2ecf3;border-radius:14px;box-shadow:0 6px 24px rgba(23,43,66,.06);overflow:hidden}
.dw-rhead{display:flex;justify-content:space-between;align-items:center;padding:18px 26px 14px}
.dw-rhead h3{font-size:19px;font-weight:800;color:var(--ink,#16212b);margin:0}
.dw-src{font-size:13px;color:var(--ink3,#6b7a89)}
.dw-src.mock{color:var(--accent,#F79A01)}
.dw-table-wrap{overflow-x:auto}
.dw-table{width:100%;border-collapse:collapse;font-size:14.5px;min-width:640px}
.dw-table th{background:#f2f8fc;color:var(--ink2,#3a4a5a);font-weight:700;text-align:left;padding:11px 26px;border-top:1px solid #e2ecf3}
.dw-table td{padding:12px 26px;border-top:1px solid #eef4f9;color:var(--ink2,#3a4a5a)}
.dw-table tr:hover td{background:#f8fcff}
.dw-dom{font-weight:600;color:var(--ink,#16212b)}
.dw-st{display:inline-block;border-radius:999px;padding:3px 13px;font-size:12.5px;font-weight:700}
.dw-st.ok{background:#e8f7ee;color:#1a9e57}
.dw-st.no{background:#fdeeee;color:#c9504a}
.dw-reg{display:inline-block;background:linear-gradient(120deg,#2FA3DB,var(--brand,#0383BC));color:#fff;border-radius:6px;
    padding:6px 16px;font-size:13px;font-weight:700;text-decoration:none;transition:filter .15s}
.dw-reg:hover{filter:brightness(1.08)}
.dw-reg-dis{color:var(--ink4,#9fb0c0);font-size:13px}
/* 已注册 → 查看Whois（可点，跳独立 Whois 结果页）；无法确认 → 联系客服 */
.dw-whois{display:inline-block;color:var(--brand,#0383BC);font-size:13px;font-weight:600;cursor:pointer;
    border-bottom:1px dashed rgba(3,131,188,.5);padding-bottom:1px;transition:color .15s,border-color .15s}
.dw-whois:hover{color:var(--brand-deep,#026A9B);border-bottom:1px solid var(--brand-deep,#026A9B)}
.dw-help{display:inline-block;color:var(--accent-deep,#D17E00);font-size:13px;font-weight:600}
.dw-help:hover{text-decoration:underline}
.dw-st.warn{background:#fff3e0;color:#c46a00}
.dw-note{display:block;margin-top:4px;font-size:12px;line-height:1.6;color:var(--ink4,#9fb0c0)}

/* 优势 / 流程 */
.dw-adv{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.dw-adv-i{background:#fff;border:1px solid #e2ecf3;border-radius:12px;padding:24px 22px}
.dw-adv-i b{display:block;font-size:17px;font-weight:800;color:var(--ink,#16212b);margin-bottom:10px}
.dw-adv-i span{font-size:14px;line-height:1.8;color:var(--ink3,#6b7a89)}
.dw-flow{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap}
.dw-flow span{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid #e2ecf3;border-radius:999px;
    padding:10px 22px;font-size:15px;font-weight:600;color:var(--ink2,#3a4a5a)}
.dw-flow b{width:24px;height:24px;border-radius:50%;background:var(--brand,#0383BC);color:#fff;font-size:13px;
    display:flex;align-items:center;justify-content:center}
.dw-flow i{font-style:normal;color:#b7c7d6;font-size:16px}
.dw-cta{text-align:center;margin-top:34px}

@media (max-width:900px){
    .dw-body{padding:20px 16px 24px}
    .dw-search{flex-direction:column}
    .dw-go{flex:auto;padding:12px 0}
    .dw-adv{grid-template-columns:repeat(2,1fr)}
    .dw-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}
}
@media (max-width:560px){
    .dw-adv{grid-template-columns:1fr}
    .dw-tab{padding:13px 18px;font-size:14.5px}
    .dw-flow{flex-direction:column}
    .dw-flow i{display:none}
}

/* ---------- 会员中心 · 服务续费 ---------- */
.renew-skus{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.renew-sku{display:flex;align-items:center;gap:10px;border:1px solid var(--line,#e2e6ee);border-radius:10px;
    padding:14px 16px;cursor:pointer;transition:border-color .15s,box-shadow .15s;background:#fff}
.renew-sku:hover{border-color:var(--brand,#0383BC)}
.renew-sku:has(input:checked){border-color:var(--brand,#0383BC);box-shadow:0 0 0 2px rgba(3,131,188,.12)}
.renew-sku input{accent-color:var(--brand,#0383BC)}
.rs-dur{font-size:15px;font-weight:600;color:var(--ink,#22384a)}
.rs-price{margin-left:auto;text-align:right}
.rs-price strong{color:var(--brand,#0383BC);font-size:16px}
.rs-price del{display:block;font-size:12px;color:var(--ink4,#a9b6c4)}
@media (max-width:560px){.renew-skus{grid-template-columns:1fr}}

/* ---------- 会员中心 · 续费年限选择 ---------- */
.renew-years{display:flex;align-items:center;gap:10px;font-size:15px;color:var(--ink,#22384a)}
.renew-years .ry-btn{width:34px;height:34px;border-radius:8px;border:1px solid var(--line,#e2e6ee);background:#fff;
    font-size:17px;color:var(--brand,#0383BC);cursor:pointer;line-height:1}
.renew-years .ry-btn:hover{border-color:var(--brand,#0383BC);background:var(--brand-soft,#f0f8fc)}
.renew-years input{text-align:center;font-weight:700;font-size:16px;color:var(--brand,#0383BC)}
.renew-years #renew-years-show{width:64px;height:34px;border:1px solid var(--line,#e2e6ee);border-radius:8px;background:var(--brand-soft,#f0f8fc)}
.ry-unit{font-size:12.5px;color:var(--ink3,#6b7a8c);margin-left:8px}
.renew-summary{margin-top:14px;border:1px solid var(--line,#e2e6ee);border-radius:10px;padding:12px 16px;background:var(--navy-soft,#f7fafc)}
.rs-row{display:flex;justify-content:space-between;align-items:center;font-size:13.5px;color:var(--ink3,#6b7a8c)}
.rs-row strong{font-size:19px;color:var(--brand,#0383BC)}
.rs-gift{margin-top:6px;color:var(--accent,#F79A01);font-weight:600}

/* ---------- 会员中心 · 续费档位选项 ---------- */
.renew-tiers{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.renew-tier{display:flex;flex-direction:column;gap:4px;border:1px solid var(--line,#e2e6ee);border-radius:10px;
    padding:14px 16px;cursor:pointer;transition:border-color .15s,box-shadow .15s;background:#fff;position:relative}
.renew-tier:hover{border-color:var(--brand,#0383BC)}
.renew-tier.on{border-color:var(--brand,#0383BC);box-shadow:0 0 0 2px rgba(3,131,188,.12)}
.renew-tier input[type=radio]{position:absolute;opacity:0;pointer-events:none}
.rt-years{font-size:15px;font-weight:700;color:var(--ink,#22384a)}
.rt-price{font-size:16px;font-weight:700;color:var(--brand,#0383BC)}
.rt-gift{font-size:12px;color:var(--accent,#F79A01);font-weight:600}
.rt-custom{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink2,#3a4a5a)}
.rt-custom .ry-btn{width:30px;height:30px;border-radius:8px;border:1px solid var(--line,#e2e6ee);background:#fff;
    font-size:16px;color:var(--brand,#0383BC);cursor:pointer;line-height:1}
.rt-custom input{width:56px;height:30px;text-align:center;font-weight:700;font-size:15px;color:var(--brand,#0383BC);
    border:1px solid var(--line,#e2e6ee);border-radius:8px;background:var(--brand-soft,#f0f8fc)}

/* ==== domain register flow ==== */
/* 登录弹窗（域名查询页点「立即注册」未登录时） */
.dw-modal{position:fixed;inset:0;background:rgba(15,35,60,.55);z-index:200;display:flex;align-items:flex-start;justify-content:center;padding:110px 16px 30px}
.dw-modal[hidden]{display:none}
.dw-modal-box{width:400px;max-width:100%;background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 18px 50px rgba(10,30,60,.28)}
.dw-modal-head{display:flex;align-items:center;justify-content:space-between;background:var(--brand,#0383BC);color:#fff;padding:12px 16px;font-size:16px;font-weight:600}
.dw-modal-x{background:none;border:0;color:#fff;font-size:22px;line-height:1;cursor:pointer;padding:0 2px}
.dw-modal-body{padding:18px 22px 20px}
.dw-modal-tip{background:#fff8e6;border:1px solid #ffe3a3;color:#a05e00;font-size:13.5px;text-align:center;border-radius:4px;padding:7px 10px;margin-bottom:14px}
.dw-modal-err{background:#fdecec;border:1px solid #f5b5b5;color:#c0392b;font-size:13px;border-radius:4px;padding:6px 10px;margin-bottom:12px}
.dw-form-row{display:flex;align-items:center;margin-bottom:12px;font-size:14px;color:#333}
.dw-form-row em{font-style:normal;width:64px;flex:none;text-align:right;margin-right:10px}
.dw-form-row input{flex:1;border:1px solid #d5dee9;border-radius:4px;padding:8px 10px;font-size:14px}
.dw-form-row input:focus{border-color:var(--brand,#0383BC);outline:none}
.dw-remember{display:flex;align-items:center;gap:6px;font-size:13px;color:#666;margin:4px 0 14px;cursor:pointer}
.dw-modal-btns{display:flex;gap:12px;justify-content:center;margin-bottom:12px}
.dw-btn{min-width:96px;border:0;border-radius:4px;padding:9px 18px;font-size:15px;cursor:pointer}
.dw-btn-ok{background:#e64c3d;color:#fff}
.dw-btn-ok:hover{background:#d4423a}
.dw-btn-no{background:var(--brand,#0383BC);color:#fff}
.dw-btn-no:hover{opacity:.92}
.dw-modal-links{display:flex;justify-content:center;gap:18px;font-size:13.5px}
.dw-modal-links a{color:var(--brand,#0383BC);text-decoration:none}
.dw-modal-links a:hover{text-decoration:underline}

/* 域名注册下单页 */
.dr-wrap{max-width:1200px}
.dr-panel{background:#fff;border:1px solid #e4eaf2;border-radius:8px;padding:22px 26px;margin-bottom:22px}
.dr-panel-title{font-size:16px;font-weight:700;color:var(--ink,#1c2b45);padding-left:10px;border-left:3px solid var(--brand,#0383BC);margin-bottom:18px}
.dr-domain-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:14px;padding:6px 4px 4px}
.dr-domain{font-size:20px;font-weight:700;color:var(--ink,#1c2b45);word-break:break-all}
.dr-price-note{font-size:13px;color:#8a97ad}
.dr-years{margin-left:auto;font-size:13.5px;color:#556;display:flex;align-items:center;gap:8px}
.dr-years select{border:1px solid #d5dee9;border-radius:4px;padding:6px 10px;font-size:14px}
.dr-sumline{margin-top:14px;font-size:14.5px;color:#556;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.dr-sumline b{font-size:20px;color:#e64c3d}
.dr-original{color:#9aa7ba;font-size:13px}
.dr-tag{background:#fdeeee;color:#e64c3d;font-size:12px;border-radius:3px;padding:2px 8px}
.dr-warn{margin-top:10px;font-size:13px;color:#a05e00;background:#fff8e6;border-radius:4px;padding:8px 12px}
.dr-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 26px}
.dr-grid .form-group label{font-size:13px;color:#556;margin-bottom:5px;display:block}
.dr-channel{display:flex;gap:26px;flex-wrap:wrap;margin-bottom:14px}
.dr-ch{display:flex;align-items:center;gap:7px;font-size:14.5px;color:#333;cursor:pointer}
.dr-ch.dis{color:#9aa7ba;cursor:not-allowed}
.dr-ch-note{font-size:12.5px;color:#9aa7ba}
.dr-agree{display:flex;align-items:flex-start;gap:8px;font-size:13.5px;color:#556;margin:6px 0 20px}
.dr-agree a{color:var(--brand,#0383BC)}
.dr-actions{display:flex;gap:14px;flex-wrap:wrap}
@media (max-width:720px){.dr-grid{grid-template-columns:1fr}.dr-years{margin-left:0}}

.dr-errs{background:#fdecec;border:1px solid #f5b5b5;color:#c0392b;font-size:13.5px;border-radius:4px;padding:10px 14px;margin-bottom:16px;line-height:1.7}

/* ---- 图形验证码 ---- */
.cap-row{display:flex;gap:10px;align-items:center}
.cap-row .form-control{flex:1}
.cap-img{height:44px;border-radius:6px;border:1px solid #dfe7f0;cursor:pointer;flex-shrink:0;display:block}
.dw-cap{display:flex;align-items:center;gap:10px;margin:14px 0 2px}
.dw-cap label{font-size:13.5px;color:#5a6b83;white-space:nowrap}
.dw-cap input{width:130px;height:38px;border:1px solid #dfe7f0;border-radius:6px;padding:0 10px;font-size:14px;outline:none}
.dw-cap input:focus{border-color:var(--brand)}
.dw-cap-row input{flex:1}
.dw-cap-row .cap-img{width:96px;height:38px}

/* ---- 登录/注册：前台布局居中卡片 ---- */
.auth-shell{min-height:calc(100vh - 300px);display:flex;align-items:flex-start;justify-content:center;padding:56px 16px 72px;background:linear-gradient(180deg,#F4F8FB 0%,#EDF3F8 100%)}
.auth-card{width:420px;max-width:100%;background:#fff;border:1px solid #DCE6EF;border-radius:12px;padding:36px 34px 30px;box-shadow:0 6px 24px rgba(16,58,92,.06)}
.auth-title{margin:0 0 6px;font-size:22px;color:#123A5C;text-align:center}
.auth-sub{margin:0 0 24px;font-size:13px;color:#8AA0B5;text-align:center}
.auth-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
.auth-remember{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--ink2);cursor:pointer}
.auth-link{font-size:13px;color:var(--brand)}
.auth-notice{margin-top:20px;font-size:12.5px;color:#8AA0B5;background:#F6FAFD;border:1px solid #E3EDF4;border-radius:6px;padding:10px 12px;line-height:1.7}
.auth-notice strong{display:block;color:#4A617A;margin-bottom:2px}
.auth-alt{margin-top:18px;text-align:center;font-size:14px;color:#6C8299}
.auth-alt a{color:var(--accent);font-weight:600}
@media (max-width:640px){
  .auth-shell{padding:28px 12px 48px}
  .auth-card{padding:28px 20px 24px;border-radius:10px}
}
/* ===== 新网虚拟主机专题页 xh-* ===== */
.xh-tabs{position:relative;margin-top:26px}
.xh-tab-cb{position:absolute;opacity:0;pointer-events:none}
.xh-tab-btn{display:inline-block;padding:11px 34px;margin:0 8px 22px 0;border:1.5px solid var(--line,#e5ecf2);border-radius:999px;background:#fff;color:var(--ink2,#3a4a5a);font-size:15.5px;font-weight:600;cursor:pointer;transition:all .18s}
.xh-tab-btn:hover{border-color:var(--brand,#0383BC);color:var(--brand,#0383BC)}
#xhTab-domestic:checked ~ label[for="xhTab-domestic"],
#xhTab-overseas:checked ~ label[for="xhTab-overseas"]{background:var(--brand,#0383BC);border-color:var(--brand,#0383BC);color:#fff;box-shadow:0 6px 16px rgba(3,131,188,.25)}
.xh-panel{display:none}
#xhTab-domestic:checked ~ .xh-panel-domestic,
#xhTab-overseas:checked ~ .xh-panel-overseas{display:block;animation:xhFade .25s ease}
@keyframes xhFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.xh-panel-desc{text-align:center;color:var(--ink3,#6b7c8d);font-size:14px;margin:0 0 22px}
.xh-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(258px,1fr));gap:20px}
.xh-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1.5px solid var(--line,#e5ecf2);border-radius:14px;padding:26px 24px 24px;transition:transform .18s,box-shadow .18s,border-color .18s}
.xh-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(20,60,90,.12);border-color:var(--brand,#0383BC)}
.xh-card-badges{position:absolute;top:-11px;left:18px;display:flex;gap:6px}
.xh-badge{padding:3px 10px;border-radius:999px;background:var(--accent,#F79A01);color:#fff;font-size:12px;font-weight:600;box-shadow:0 3px 8px rgba(247,154,1,.35)}
.xh-badge:first-child{background:var(--brand,#0383BC);box-shadow:0 3px 8px rgba(3,131,188,.35)}
.xh-card-name{margin:4px 0 4px;font-size:17.5px;color:var(--navy,#12395c)}
.xh-card-sub{margin:0 0 14px;font-size:13px;color:var(--ink3,#6b7c8d);min-height:20px}
.xh-card-price{display:flex;align-items:baseline;gap:8px;padding-bottom:14px;margin-bottom:14px;border-bottom:1px dashed var(--line,#e5ecf2)}
.xh-price{color:var(--accent,#F79A01);font-weight:700;font-size:28px;line-height:1}
.xh-price i{font-style:normal;font-size:15px;margin-right:2px}
.xh-price em{font-style:normal;font-size:13px;font-weight:500;color:var(--ink3,#6b7c8d);margin-left:2px}
.xh-market{color:var(--ink3,#6b7c8d);font-size:14px}
.xh-card-specs{flex:1;margin:0 0 18px;padding:0;list-style:none;font-size:13px;color:var(--ink2,#3a4a5a)}
.xh-card-specs li{position:relative;padding:4px 0 4px 18px;line-height:1.55}
.xh-card-specs li::before{content:"";position:absolute;left:2px;top:11px;width:6px;height:6px;border-radius:50%;background:var(--brand,#0383BC);opacity:.75}
.xh-feats{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:34px}
.xh-feat{background:#fff;border-radius:16px;padding:34px 26px 30px;border:1.5px solid var(--line,#e5ecf2);text-align:center;transition:transform .18s,box-shadow .18s,border-color .18s}
.xh-feat:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(20,60,90,.12);border-color:transparent}
.xh-feat-ico{display:inline-flex;align-items:center;justify-content:center;width:68px;height:68px;border-radius:22px;margin-bottom:18px}
.xh-feat-ico svg{width:32px;height:32px}
.xh-c-blue .xh-feat-ico{background:linear-gradient(135deg,#4aaee0,#0383BC);color:#fff;box-shadow:0 10px 22px rgba(3,131,188,.32)}
.xh-c-green .xh-feat-ico{background:linear-gradient(135deg,#43c98a,#1e9e5a);color:#fff;box-shadow:0 10px 22px rgba(30,158,90,.3)}
.xh-c-violet .xh-feat-ico{background:linear-gradient(135deg,#a48ae8,#7c5cd6);color:#fff;box-shadow:0 10px 22px rgba(124,92,214,.3)}
.xh-c-sky .xh-feat-ico{background:linear-gradient(135deg,#5cb1ea,#2a8fd8);color:#fff;box-shadow:0 10px 22px rgba(42,143,216,.3)}
.xh-c-orange .xh-feat-ico{background:linear-gradient(135deg,#ffb84d,#F79A01);color:#fff;box-shadow:0 10px 22px rgba(247,154,1,.32)}
.xh-c-pink .xh-feat-ico{background:linear-gradient(135deg,#ef7fa8,#d6507f);color:#fff;box-shadow:0 10px 22px rgba(214,80,127,.3)}
.xh-feat h3{margin:0 0 8px;font-size:17.5px;color:var(--navy,#12395c);font-weight:700}
.xh-feat p{margin:0;font-size:13.5px;color:var(--ink3,#6b7c8d);line-height:1.75}
.xh-funcs{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:34px}
.xh-func{display:flex;align-items:center;gap:16px;background:#fff;border:1.5px solid var(--line,#e5ecf2);border-radius:14px;padding:18px 20px;font-size:15px;font-weight:600;color:var(--ink2,#3a4a5a);transition:transform .18s,box-shadow .18s}
.xh-func:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(20,60,90,.09)}
.xh-func-ico{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;background:#fff;border:2px solid rgba(3,131,188,.38);color:var(--brand,#0383BC);flex:none;box-shadow:0 0 0 5px rgba(3,131,188,.07);transition:border-color .18s,box-shadow .18s}
.xh-func:hover .xh-func-ico{border-color:var(--brand,#0383BC);box-shadow:0 0 0 5px rgba(3,131,188,.14)}
.xh-func-ico svg{width:24px;height:24px}
.xh-scenes{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:34px}
.xh-scene{display:flex;gap:16px;background:#fff;border:1.5px solid var(--line,#e5ecf2);border-radius:14px;padding:22px;transition:transform .18s,box-shadow .18s}
.xh-scene:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(20,60,90,.09)}
.xh-scene-ico{display:inline-flex;align-items:center;justify-content:center;width:54px;height:54px;border-radius:50%;background:linear-gradient(135deg,#dbeefb,#b9dcf2);color:#066d9e;flex:none;box-shadow:inset 0 0 0 2.5px #fff,0 8px 18px rgba(3,131,188,.22)}
.xh-scene-ico svg{width:26px;height:26px}
.xh-scene h3{margin:2px 0 5px;font-size:16px;color:var(--navy,#12395c);font-weight:700}
.xh-scene p{margin:0;font-size:13px;color:var(--ink3,#6b7c8d);line-height:1.7}
.xh-faqs{margin-top:24px}
.xh-faq{background:#fff;border:1.5px solid var(--line,#e5ecf2);border-radius:12px;margin-bottom:10px;overflow:hidden}
.xh-faq summary{list-style:none;cursor:pointer;padding:16px 20px;font-size:14.5px;font-weight:600;color:var(--navy,#12395c);display:flex;align-items:center;justify-content:space-between;gap:10px}
.xh-faq summary::-webkit-details-marker{display:none}
.xh-faq-caret{flex:none;width:9px;height:9px;border-right:2px solid var(--ink3,#6b7c8d);border-bottom:2px solid var(--ink3,#6b7c8d);transform:rotate(45deg);transition:transform .18s;margin-right:4px}
.xh-faq[open] .xh-faq-caret{transform:rotate(-135deg)}
.xh-faq p{margin:0;padding:0 20px 16px;font-size:13.5px;color:var(--ink3,#6b7c8d);line-height:1.8}
.xh-cta{margin-top:34px;text-align:center;background:linear-gradient(135deg,var(--brand,#0383BC),#0a6ea0);border-radius:16px;padding:38px 24px;color:#fff}
.xh-cta h3{margin:0 0 8px;font-size:22px;color:#fff}
.xh-cta p{margin:0 0 20px;font-size:14px;opacity:.92}
.xh-cta .btn{background:#fff;color:var(--brand,#0383BC);border:none;font-weight:600}
@media (max-width:640px){
  .xh-tab-btn{padding:9px 22px;font-size:14px;margin-right:6px}
  .xh-card-price .xh-price{font-size:24px}
}
@media (max-width:960px){
  .xh-feats{grid-template-columns:repeat(2,1fr);gap:14px}
  .xh-feat{padding:26px 18px 24px}
  .xh-feat-ico{width:58px;height:58px;border-radius:18px;margin-bottom:14px}
  .xh-feat-ico svg{width:27px;height:27px}
  .xh-feat h3{font-size:16px}
  .xh-funcs{grid-template-columns:repeat(2,1fr);gap:12px}
  .xh-func{padding:14px 16px;font-size:14px;gap:12px}
  .xh-func-ico{width:44px;height:44px}
  .xh-func-ico svg{width:20px;height:20px}
  .xh-scenes{grid-template-columns:repeat(2,1fr);gap:12px}
  .xh-scene{padding:16px}
  .xh-scene-ico{width:46px;height:46px}
  .xh-scene-ico svg{width:22px;height:22px}
}

/* 手机窄屏（≤560px）：场景卡转单列，防横向溢出（巡检 A2） */
@media (max-width:560px){
  .xh-scenes{grid-template-columns:1fr;gap:10px}
  .xh-scenes.xh-grid-3,.xh-funcs.xh-grid-3{grid-template-columns:1fr}
  .xh-scene{padding:14px 12px}
  .xh-scene-ico{width:42px;height:42px}
  .xh-scene-ico svg{width:20px;height:20px}
  .xh-scene h3{font-size:15px}
  .xh-scene p{font-size:12.5px}
}

/* ===== 详情页电话咨询按钮（突出色） ===== */
.btn-tel-hot{background:var(--accent,#F79A01);color:#fff;border:none;font-weight:700;font-size:15.5px;letter-spacing:.5px;box-shadow:0 6px 16px rgba(247,154,1,.32);display:flex;align-items:center;justify-content:center;gap:7px}
.btn-tel-hot:hover{background:#e08c00;color:#fff;transform:translateY(-1px);box-shadow:0 8px 20px rgba(247,154,1,.4)}
.btn-tel-hot .ic{width:17px;height:17px}

/* ===== 西部数码专题页 5 组 tab ===== */
#wTab-economy:checked ~ label[for="wTab-economy"],
#wTab-omni:checked ~ label[for="wTab-omni"],
#wTab-dedicated:checked ~ label[for="wTab-dedicated"],
#wTab-function:checked ~ label[for="wTab-function"],
#wTab-overseas:checked ~ label[for="wTab-overseas"]{background:var(--brand,#0383BC);border-color:var(--brand,#0383BC);color:#fff;box-shadow:0 6px 16px rgba(3,131,188,.25)}
#wTab-economy:checked ~ .w-panel-economy,
#wTab-omni:checked ~ .w-panel-omni,
#wTab-dedicated:checked ~ .w-panel-dedicated,
#wTab-function:checked ~ .w-panel-function,
#wTab-overseas:checked ~ .w-panel-overseas{display:block;animation:xhFade .25s ease}
.xh-func-ico{font-size:18px;font-weight:700;font-family:inherit}
/* 6 项网格修饰类：仅桌面端 3 列（≤960px 由断点规则接管，≤560px 单列，防手机溢出） */
@media (min-width:961px){
  .xh-funcs.xh-grid-3,.xh-scenes.xh-grid-3{grid-template-columns:repeat(3,1fr)}
}
/* 导航标题上的角标（与下拉项 .dd-hot 同款） */
.nav-dd-btn .dd-hot{display:inline-block;font-style:normal;font-size:11px;font-weight:700;color:#fff;background:var(--accent,#F79A01);border-radius:9px;padding:1px 6px;margin-left:6px;vertical-align:2px;line-height:1.4;box-shadow:0 1px 3px rgba(0,0,0,.18)}

/* ===== 阿里云专题页 4 组 tab + 2 列均分网格 ===== */
.xh-grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:34px}
#aTab-ngl:checked ~ label[for="aTab-ngl"],
#aTab-ngn:checked ~ label[for="aTab-ngn"],
#aTab-apl:checked ~ label[for="aTab-apl"],
#aTab-apn:checked ~ label[for="aTab-apn"]{background:var(--brand,#0383BC);border-color:var(--brand,#0383BC);color:#fff;box-shadow:0 6px 16px rgba(3,131,188,.25)}
#aTab-ngl:checked ~ .a-panel-ngl,
#aTab-ngn:checked ~ .a-panel-ngn,
#aTab-apl:checked ~ .a-panel-apl,
#aTab-apn:checked ~ .a-panel-apn{display:block;animation:xhFade .25s ease}
@media (max-width:960px){
  .xh-grid-2{grid-template-columns:1fr}
}

/* ===== 域名 Whois 结果页（/domain/whois/{domain}） ===== */
.wh-wrap{max-width:1080px}
.wh-card{background:#fff;border:1px solid #e2ecf3;border-radius:14px;box-shadow:0 6px 24px rgba(23,43,66,.06);overflow:hidden}
.wh-head{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:22px 28px;border-bottom:1px solid #eef4f9}
.wh-head-l{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.wh-domain{margin:0;font-size:24px;font-weight:800;color:var(--ink,#16212b);word-break:break-all}
.wh-badge{border-radius:999px;padding:3px 13px;font-size:12.5px;font-weight:700}
.wh-badge-reg{background:#e8f7ee;color:#1a9e57}
.wh-badge-warn{background:#fff3e0;color:#c46a00}
.wh-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#eef4f9}
/* 只有两项时用两列，避免出现空白第三格 */
.wh-facts-2{grid-template-columns:repeat(2,1fr)}
.wh-fact{background:#fff;padding:18px 28px}
.wh-fact em{display:block;font-style:normal;font-size:12.5px;color:var(--ink4,#9fb0c0);margin-bottom:6px}
.wh-fact b{display:block;font-size:15px;font-weight:700;color:var(--ink,#16212b);word-break:break-all}
.wh-sub{display:block;font-weight:400;font-size:12.5px;color:var(--accent,#F79A01);margin-top:3px}
.wh-block{padding:20px 28px;border-top:1px solid #eef4f9}
.wh-block-t{margin:0 0 12px;font-size:15px;font-weight:800;color:var(--ink,#16212b);padding-left:10px;border-left:3px solid var(--brand,#0383BC)}
.wh-tags{display:flex;flex-wrap:wrap;gap:8px}
.wh-tag{border-radius:6px;padding:5px 12px;font-size:13px;font-weight:600}
.wh-tag-ok{background:#e8f7ee;color:#1a9e57}
.wh-tag-lock{background:#eef4fb;color:#3b6ea5}
.wh-tag-warn{background:#fdeeee;color:#c9504a}
.wh-tag-muted{background:#f2f6f9;color:var(--ink3,#6b7a89)}
.wh-ns{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.wh-ns li{background:#f7fafc;border:1px solid #e6eef5;border-radius:8px;padding:7px 14px;font-size:13.5px;color:var(--ink2,#3a4a5a);
    font-family:ui-monospace,Consolas,"Courier New",monospace;word-break:break-all}
.wh-note{margin:12px 0 0;font-size:13px;line-height:1.8;color:var(--ink3,#6b7a89)}
.wh-note-warn{color:#c46a00}
.wh-raw{border-top:1px solid #eef4f9;padding:16px 28px 22px}
.wh-raw summary{cursor:pointer;font-size:13.5px;font-weight:600;color:var(--brand,#0383BC)}
.wh-raw pre{margin:12px 0 0;max-height:320px;overflow:auto;background:#f7fafc;border:1px solid #e6eef5;border-radius:8px;
    padding:14px;font-size:12.5px;line-height:1.7;color:var(--ink2,#3a4a5a);white-space:pre-wrap;word-break:break-all}
.wh-foot{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;padding:18px 28px;
    border-top:1px solid #eef4f9;background:#fbfdff}
.wh-src{font-size:12.5px;color:var(--ink4,#9fb0c0)}
.wh-foot-btns{display:flex;gap:10px;flex-wrap:wrap}
/* 未注册 / 查询失败 状态卡 */
.wh-state{padding:52px 28px 56px;text-align:center}
.wh-state-ic{width:56px;height:56px;border-radius:50%;margin:0 auto 18px;display:flex;align-items:center;justify-content:center;
    font-size:26px;font-weight:800;color:#fff}
.wh-state-free .wh-state-ic{background:#1a9e57}
.wh-state-fail .wh-state-ic{background:#c9504a}
.wh-state h2{margin:0 0 10px;font-size:24px;font-weight:800;color:var(--ink,#16212b);word-break:break-all}
.wh-state p{margin:0 auto;max-width:620px;font-size:14px;line-height:1.9;color:var(--ink3,#6b7a89)}
.wh-state-btns{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:26px}
@media (max-width:900px){
  .wh-facts{grid-template-columns:repeat(2,1fr)}
  .wh-head,.wh-block,.wh-raw,.wh-foot{padding-left:18px;padding-right:18px}
  .wh-fact{padding:16px 18px}
  .wh-state{padding:40px 18px 44px}
}
@media (max-width:560px){
  .wh-facts{grid-template-columns:1fr}
  .wh-domain{font-size:20px}
  .wh-state h2{font-size:20px}
}

/* ---------- AI建站 · 总览页（/c/ai-site） ---------- */
.ais-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.ais-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);
    border-radius:var(--radius-lg);padding:22px 22px 20px;box-shadow:var(--shadow-xs);
    transition:transform .18s,box-shadow .18s,border-color .18s}
.ais-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm);border-color:var(--brand)}
.ais-ico{width:46px;height:46px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;
    background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;margin-bottom:14px;flex:none}
.ais-ico svg{width:23px;height:23px}
.ais-card h3{margin:0 0 8px;font-size:17px;font-weight:700;color:var(--ink);line-height:1.4}
.ais-card p{margin:0 0 16px;font-size:14px;line-height:1.75;color:var(--ink3)}
.ais-go{margin-top:auto;display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--brand)}
.ais-go svg{width:15px;height:15px;transition:transform .18s}
.ais-card:hover .ais-go{color:var(--accent)}
.ais-card:hover .ais-go svg{transform:translateX(4px)}
.ais-caps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.ais-cap{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px 22px;text-align:center}
.ais-cap h3{margin:0 0 8px;font-size:16px;font-weight:700;color:var(--ink)}
.ais-cap p{margin:0;font-size:13.5px;line-height:1.7;color:var(--ink3)}
.ais-cap .ais-ico{border-radius:50%}
.ais-cta{text-align:center}
@media (max-width:960px){
  .ais-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ais-caps{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:560px){
  .ais-cards,.ais-caps{grid-template-columns:1fr}
}

/* 专题页骨架占位块（partials/topic-placeholder，仅本地环境渲染） */
.tph{max-width:960px;margin:0 auto;border:1px dashed #c3d7e6;border-radius:12px;background:#f7fbfd;padding:26px 28px}
.tph-head{text-align:center;margin-bottom:18px}
.tph-badge{display:inline-block;font-size:12px;line-height:1;padding:5px 10px;border-radius:999px;background:#e8f4fb;color:var(--brand,#0383BC);margin-bottom:10px}
.tph-head h3{font-size:19px;color:var(--ink,#123);margin:0 0 6px}
.tph-tip{margin:0;font-size:13.5px;color:var(--ink3,#5b6b7c)}
.tph-list{margin:0;padding-left:22px}
.tph-list li{margin-bottom:10px;font-size:14px;line-height:1.7;color:var(--ink2,#2b3a4a)}
.tph-list li:last-child{margin-bottom:0}
.tph-name{display:inline-block;min-width:150px;font-weight:600;color:var(--ink,#123)}
.tph-desc{color:var(--ink3,#5b6b7c)}
@media (max-width:560px){
  .tph{padding:20px 18px}
  .tph-name{display:block;min-width:0;margin-bottom:2px}
}

/* ==========================================================================
   建站宝盒落地页（/c/jianzhan-baobox-h5）
   bbx-buy  购买配置器（购买方式 / 版本 / 平台 / 合计）
   bbx-split 左右分栏图文（多端平台 / AI推广 / 海量模板）
   bbx-whys  为什么选择建站宝盒（12 张能力卡）
   bbx-tbl   版本参数对比表
   ========================================================================== */

/* ---------- S1 购买配置器 ---------- */
.bbx-buy{position:relative;overflow:hidden;background:linear-gradient(180deg,#F5FAFE 0%,#E8F3FC 100%);padding-bottom:58px}
.bbx-buy-in{display:grid;grid-template-columns:1fr 1.06fr;gap:52px;align-items:center;padding-top:46px}
.bbx-buy-l{text-align:center}
.bbx-buy-t{font-size:36px;font-weight:800;color:var(--navy);letter-spacing:.5px}
.bbx-buy-t b{color:var(--brand);font-weight:800}
.bbx-buy-s{margin-top:10px;font-size:15.5px;color:var(--ink3);letter-spacing:.16em}
/* 插画容器：用 flex 居中，不要用 margin:auto —— grid 子项一旦有 margin:auto
   会退出 stretch，宽度塌成内容宽度（SVG 默认 300px），插画会缩成一小块。 */
.bbx-art{display:flex;justify-content:center;align-items:center;margin-top:22px;min-width:0}
.bbx-art svg{width:100%;max-width:600px;height:auto;display:block}

.bbx-panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius-xl);padding:30px 32px 26px;box-shadow:0 18px 46px rgba(14,58,88,.09)}
.bbx-grp{margin-bottom:22px}
.bbx-grp-t{font-size:14px;font-weight:600;color:var(--ink2);margin-bottom:12px}
.bbx-opts{display:flex;flex-wrap:wrap;gap:10px}
.bbx-opt{
    appearance:none;font-family:inherit;font-size:13.5px;line-height:1;
    color:var(--ink2);background:#fff;border:1px solid var(--line-2);
    border-radius:var(--radius);padding:12px 18px;cursor:pointer;
    white-space:nowrap;transition:all .16s ease;
}
.bbx-opt:hover{border-color:var(--brand-line);color:var(--brand)}
.bbx-opt.on{
    border-color:var(--brand);color:var(--brand);background:var(--brand-soft);
    font-weight:600;box-shadow:inset 0 0 0 1px var(--brand);
}
.bbx-opt.is-fixed,.bbx-opt.is-static{cursor:default}
.bbx-grp-hint{margin:10px 0 0;font-size:12.5px;line-height:1.7;color:var(--ink4)}

.bbx-sum{
    display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;
    margin-top:26px;padding-top:22px;border-top:1px dashed var(--line-2);
}
.bbx-sum-l{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.bbx-sum-k{font-size:14px;color:var(--ink2)}
.bbx-price{display:inline-flex;align-items:baseline;gap:1px;color:var(--accent-deep);font-size:21px;font-weight:700}
.bbx-price b{font-size:44px;font-weight:800;line-height:1;letter-spacing:-1px;font-family:"Segoe UI",Arial,Helvetica,sans-serif}
.bbx-price i{font-style:normal;font-size:14px;font-weight:500;color:var(--ink3)}
.bbx-gift{
    font-size:12px;line-height:1;padding:5px 9px;border-radius:999px;font-weight:600;
    background:var(--accent-soft);color:var(--accent-deep);border:1px solid var(--accent-line);
}
/* 版本按钮内直接显示价格：随「购买方式（含/不含主机）」切换 */
.bbx-opt-plan{display:inline-flex;align-items:center;gap:9px}
.bbx-opt-plan b{font-weight:600}
.bbx-opt-plan em{font-style:normal;font-size:13.5px;font-weight:700;color:var(--accent-deep)}
/* 可叠加项（微站 / 微信小程序）标记：不体现价格，只标注可叠加 */
.bbx-tag{
    font-style:normal;font-weight:600;font-size:11px;line-height:1;
    margin-left:7px;padding:3px 6px;border-radius:999px;
    background:var(--accent-soft);color:var(--accent-deep);border:1px solid var(--accent-line);
}
.bbx-sum-note{margin:12px 0 0;font-size:12.5px;line-height:1.7;color:var(--ink4)}

/* ---------- S2–S4 左右分栏图文 ---------- */
.bbx-split{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.bbx-h2{font-size:30px;font-weight:700;color:var(--navy);line-height:1.45;letter-spacing:.3px}
.bbx-p{margin-top:16px;font-size:15px;line-height:1.95;color:var(--ink2)}
.bbx-acts{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:30px}
.bbx-more{
    display:inline-flex;align-items:center;gap:6px;font-size:14.5px;font-weight:700;
    color:var(--ink);border-bottom:2px solid var(--ink);padding-bottom:3px;
}
.bbx-more:hover{color:var(--brand);border-color:var(--brand)}
.bbx-more svg{width:15px;height:15px;transition:transform .18s}
.bbx-more:hover svg{transform:translateX(4px)}

/* AI 推广双 tab：不用 overflow，避免带出 1px 纵向滚动条 */
.bbx-tabs{display:flex;gap:30px;flex-wrap:wrap;margin-top:24px;border-bottom:1px solid var(--line)}
.bbx-tab{
    appearance:none;background:none;border:none;font-family:inherit;
    font-size:16.5px;font-weight:600;color:var(--ink4);
    padding:0 0 12px;cursor:pointer;position:relative;transition:color .16s;
}
.bbx-tab:hover{color:var(--ink2)}
.bbx-tab.on{color:var(--ink)}
.bbx-tab.on::after{
    content:'';position:absolute;left:0;right:0;bottom:-1px;height:3px;
    border-radius:2px;background:var(--accent);
}
.bbx-panes{margin-top:20px}
.bbx-pane{display:none}
.bbx-pane.on{display:block}
.bbx-pane p{margin:0 0 12px;font-size:15px;line-height:1.95;color:var(--ink2)}
.bbx-pane p:last-child{margin-bottom:0}

/* ---------- S5 为什么选择建站宝盒 ---------- */
.bbx-whys{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.bbx-why{
    display:flex;gap:15px;background:#fff;border:1px solid var(--line);
    border-radius:var(--radius-lg);padding:22px;transition:all .18s ease;
}
.bbx-why:hover{border-color:var(--brand-line);box-shadow:var(--shadow-sm);transform:translateY(-2px)}
.bbx-why-ico{
    flex:none;width:42px;height:42px;border-radius:11px;
    display:inline-flex;align-items:center;justify-content:center;
    background:var(--cp-c-soft,var(--brand-soft));color:var(--cp-c,var(--brand));
}
.bbx-why-ico svg{width:21px;height:21px}
.bbx-why h3{margin:0 0 6px;font-size:15.5px;font-weight:700;color:var(--ink)}
.bbx-why p{margin:0;font-size:13px;line-height:1.72;color:var(--ink3)}

/* ---------- S6 版本参数对比表 ---------- */
/* 表格限高 + 表头吸顶：74 项功能一屏放不下，滚动时列名始终可见 */
.bbx-tbl-wrap{
    background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);
    max-height:76vh;overflow:auto;
}
.bbx-tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:13.5px}
.bbx-tbl th,.bbx-tbl td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--line)}
.bbx-tbl thead th{
    position:sticky;top:0;z-index:2;
    background:var(--brand-soft);color:var(--navy);font-weight:700;
    font-size:13.5px;white-space:nowrap;border-bottom-color:var(--brand-line);
}
.bbx-tbl thead th.bbx-col{width:198px;text-align:center}
.bbx-tbl thead th .bbx-col-name{display:block;font-size:14.5px;color:var(--navy)}
.bbx-tbl thead th .bbx-th-sub{display:block;margin-top:3px;font-size:12px;font-weight:600;color:var(--accent-deep)}
.bbx-tbl thead th .bbx-th-note{display:block;margin-top:2px;font-size:11.5px;font-weight:500;color:var(--ink4)}
.bbx-tbl thead th .bbx-th-buy{
    display:inline-block;margin-top:9px;padding:6px 16px;font-size:12.5px;font-weight:600;
    color:var(--accent-deep);background:#fff;border:1px solid var(--accent);
    border-radius:var(--radius);transition:all .16s ease;
}
.bbx-tbl thead th .bbx-th-buy:hover{background:var(--accent);color:#fff}
.bbx-tbl .bbx-grp-td{
    width:104px;background:#F6FAFD;font-weight:700;color:var(--navy);
    white-space:nowrap;vertical-align:top;
}
.bbx-tbl tr.bbx-row:hover td:not(.bbx-grp-td){background:#FBFDFF}
.bbx-fn{color:var(--ink)}
.bbx-fn small{display:block;margin-top:3px;font-size:12px;line-height:1.6;color:var(--ink4)}
.bbx-val{text-align:center;white-space:nowrap;color:var(--ink2)}
.bbx-val.bbx-strong{color:var(--accent-deep);font-weight:700}
.bbx-check{
    display:inline-flex;align-items:center;justify-content:center;
    width:20px;height:20px;border-radius:50%;
    background:var(--brand-soft);color:var(--brand);
}
.bbx-check svg{width:12px;height:12px;stroke-width:3}
.bbx-tbl-foot{
    margin-top:14px;font-size:12.5px;color:var(--ink4);line-height:1.8;text-align:center;
}

/* ---------- 响应式 ---------- */
@media (max-width:1180px){
    .bbx-buy-in,.bbx-split{grid-template-columns:1fr;gap:36px}
    .bbx-buy-l{text-align:left}
    .bbx-whys{grid-template-columns:repeat(2,minmax(0,1fr))}
    .bbx-tbl{min-width:720px}
}
@media (max-width:640px){
    .bbx-buy-t{font-size:27px}
    .bbx-h2{font-size:23px}
    .bbx-p{font-size:14px}
    .bbx-price b{font-size:34px}
    .bbx-panel{padding:22px 18px}
    .bbx-why{padding:18px}
    .bbx-whys{grid-template-columns:1fr}
    .bbx-sum{gap:14px}
    .bbx-sum .btn{width:100%}
}

/* ============================================================
   外贸独立站 /c/baobox-trade
   trd-plans  三档版本规格卡
   trd-advs   独立站优势（左右分栏，图文交替）
   ============================================================ */
.trd-plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch}
.trd-plan{
    position:relative;display:flex;flex-direction:column;background:#fff;
    border:1px solid var(--line);border-radius:var(--radius-xl);
    overflow:hidden;transition:transform .2s,box-shadow .2s,border-color .2s;
}
.trd-plan:hover{transform:translateY(-3px);box-shadow:0 20px 44px rgba(14,58,88,.11);border-color:var(--brand-line)}
.trd-plan.is-hot{border-color:var(--accent-line);box-shadow:0 16px 38px rgba(247,154,1,.14)}
.trd-badge{
    position:absolute;top:0;right:18px;z-index:2;
    background:var(--accent);color:#fff;font-size:12px;font-weight:700;line-height:1;
    padding:7px 12px;border-radius:0 0 8px 8px;
}
.trd-head{padding:26px 24px 20px;border-bottom:1px solid var(--line)}
.trd-ico{
    width:46px;height:46px;border-radius:13px;display:inline-flex;align-items:center;justify-content:center;
    background:var(--cp-c-soft,var(--brand-soft));color:var(--cp-c,var(--brand));
}
.trd-ico svg{width:23px;height:23px}
.trd-head h3{margin:14px 0 0;font-size:21px;font-weight:800;color:var(--navy);line-height:1.3}
.trd-head h3 em{font-style:normal;font-size:13.5px;font-weight:600;color:var(--cp-c,var(--brand));margin-left:8px}
.trd-head p{margin:8px 0 0;font-size:13.5px;line-height:1.75;color:var(--ink3)}
.trd-cycle{
    display:inline-block;margin-top:10px;font-size:12px;line-height:1;padding:5px 9px;border-radius:999px;
    background:var(--cp-c-soft,var(--brand-soft));color:var(--cp-c,var(--brand));font-weight:600;
}
.trd-price{padding:20px 24px 18px;background:linear-gradient(180deg,#FBFCFE,#F6F9FC);border-bottom:1px solid var(--line)}
.trd-price-now{display:flex;align-items:baseline;gap:2px;color:var(--accent-deep);font-size:19px;font-weight:700}
.trd-price-now b{font-size:40px;font-weight:800;line-height:1;letter-spacing:-1px;font-family:"Segoe UI",Arial,Helvetica,sans-serif}
.trd-price-now i{font-style:normal;font-size:14px;font-weight:500}
.trd-price-or{margin-top:8px;font-size:12.5px;color:var(--ink4)}
.trd-price-or s{color:var(--ink4);margin-right:2px}
.trd-specs{padding:8px 24px 4px;flex:0 1 auto;max-height:600px;overflow-y:auto;scrollbar-width:thin}
.trd-specs::-webkit-scrollbar{width:6px}
.trd-specs::-webkit-scrollbar-thumb{background:#D5E6F2;border-radius:99px}
.trd-specs::-webkit-scrollbar-track{background:transparent}
.trd-grp{padding:14px 0;border-bottom:1px dashed var(--line)}
.trd-grp:last-child{border-bottom:0}
.trd-grp-t{font-size:13px;font-weight:700;color:var(--navy);margin-bottom:9px;letter-spacing:.3px}
.trd-grp ul{margin:0;padding:0;list-style:none}
.trd-grp li{display:flex;align-items:flex-start;gap:10px;font-size:12.8px;line-height:1.65;padding:4px 0;color:var(--ink2)}
.trd-k{flex:0 0 96px;color:var(--ink4)}
.trd-v{flex:1 1 auto;min-width:0;word-break:break-word}
.trd-yes{display:inline-flex;align-items:center;color:var(--brand)}
.trd-yes svg{width:14px;height:14px;stroke-width:3}
.trd-foot{padding:16px 24px 24px;border-top:1px solid var(--line);background:#fff}
.trd-btn{width:100%;justify-content:center}
.trd-foot-t{margin:9px 0 0;font-size:12px;color:var(--ink4);text-align:center}

.trd-advs{display:flex;flex-direction:column;gap:56px}
.trd-adv.is-rev .trd-adv-txt{order:2}
.trd-adv.is-rev .bbx-art{order:1}
.trd-adv-txt{position:relative;padding-top:6px}
.trd-num{
    display:inline-block;font-size:13px;font-weight:800;letter-spacing:1px;
    color:var(--brand);background:var(--brand-soft);border-radius:999px;padding:5px 12px;margin-bottom:12px;
}
.trd-adv .bbx-h2{font-size:27px}
.trd-more-wrap{margin-top:28px;text-align:center}

/* 案例卡整体可点：.ais-cap 默认是块级容器，作为 a 需要显式块化 */
a.ais-cap{display:block;transition:transform .2s,box-shadow .2s,border-color .2s}
a.ais-cap:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm);border-color:var(--brand-line)}
a.ais-cap .ais-ico{border-radius:50%}

@media (max-width:1180px){
    .trd-plans{grid-template-columns:1fr;gap:22px;max-width:560px;margin:0 auto}
    /* 单列时统一「文字在前、插画在后」，不再左右交替 */
    .trd-adv.is-rev .trd-adv-txt{order:0}
    .trd-adv.is-rev .bbx-art{order:1}
}
@media (max-width:640px){
    .trd-head,.trd-price,.trd-foot{padding-left:18px;padding-right:18px}
    .trd-specs{padding-left:18px;padding-right:18px;max-height:none;overflow:visible}
    .trd-price-now b{font-size:34px}
    /* 窄屏下参数名不再固定宽度，长名称（如 DDOS 攻击防护）可占更宽、不折行 */
    .trd-k{flex:0 1 auto;min-width:84px;max-width:52%}
    .trd-advs{gap:40px}
    .trd-adv .bbx-h2{font-size:22px}
}

/* ==========================================================================
   后台通用居中弹窗（data-modal 触发，全后台共用）
   结构：<div class="wb-modal" id="..."><div class="wb-modal-mask"></div>
         <div class="wb-modal-card"><div class="wb-modal-head">…X</div><div class="wb-modal-body">…</div></div></div>
   ========================================================================== */
.wb-modal{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:24px}
.wb-modal.open{display:flex}
.wb-modal-mask{position:absolute;inset:0;background:rgba(15,23,42,.45)}
.wb-modal-card{position:relative;background:#fff;border-radius:14px;box-shadow:0 20px 60px rgba(2,20,40,.28);width:100%;max-width:520px;max-height:86vh;display:flex;flex-direction:column;animation:wbModalIn .18s ease}
@keyframes wbModalIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
.wb-modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line,#e8edf2);flex:0 0 auto}
.wb-modal-title{font-size:15px;font-weight:600;color:var(--navy,#0f2540)}
.wb-modal-title .small{font-weight:400}
.wb-modal-x{width:28px;height:28px;flex:0 0 auto;border:none;border-radius:50%;background:#f1f5f9;color:#64748b;font-size:15px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}
.wb-modal-x:hover{background:#fee2e2;color:#dc2626}
.wb-modal-body{padding:16px 18px;overflow-y:auto}

/* ==========================================================================
   产品编辑页 · SKU 档位「操作」列（保存/等级价/删除 横排不折行）
   ========================================================================== */
.sku-ops{text-align:center;white-space:nowrap}
.sku-ops .btn{margin:0 2px;vertical-align:middle}
.sku-ops .sku-del-form{display:inline-block;margin:0 2px;vertical-align:middle}

/* ==========================================================================
   小程序产品线（轻应用小程序 / 门店系统） · ma-*
   ========================================================================== */

/* 首屏深蓝区（左文右图） */
.ma-hero{background:linear-gradient(160deg,#05567E 0%,#0383BC 62%,#0E96CF 100%);padding:64px 0 56px;color:#fff}
/* 矮首屏（居中版式）专用：加大底部留白，避免优势卡负 margin 压住文案/按钮 */
.ma-hero-flush{padding-bottom:132px}
.ma-hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
.ma-hero-copy{text-align:left}
.ma-hero-title{margin:14px 0 10px;font-size:clamp(28px,3.6vw,40px);line-height:1.25;color:#fff;font-weight:800;letter-spacing:.02em}
.ma-hero-tags{color:rgba(255,255,255,.78);font-size:15px}
.ma-hero-cta{margin-top:26px;display:flex;gap:12px;flex-wrap:wrap}
.ma-points{margin:20px 0 0;max-width:430px;text-align:left;list-style:none;padding:0}
.ma-points li{position:relative;padding:7px 0 7px 26px;color:rgba(255,255,255,.92);font-size:15px}
.ma-points li::before{content:"";position:absolute;left:4px;top:14px;width:7px;height:7px;border-radius:50%;background:var(--accent,#F79A01)}

/* 手机示意（CSS 手绘） */
.ma-visual{position:relative;display:flex;justify-content:center}
.ma-phone{width:250px;background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 24px 60px rgba(2,30,46,.35)}
.ma-phone-bar{display:flex;align-items:center;gap:5px;background:#0B2B3F;padding:9px 12px}
.ma-phone-bar i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.35)}
.ma-phone-bar i:first-child{background:#FF6B57}
.ma-phone-bar span{margin-left:auto;font-size:9.5px;color:rgba(255,255,255,.65)}
.ma-phone-body{padding:12px 12px 16px;background:#F4F8FB}
.ma-blk{background:#fff;border-radius:8px}
.ma-blk-banner{height:64px;background:linear-gradient(120deg,var(--brand),var(--brand-2,#0E96CF));margin-bottom:10px}
.ma-blk-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;background:transparent;margin-bottom:10px}
.ma-blk-grid i{height:34px;background:#fff;border-radius:8px;border:1px solid #E1EBF2}
.ma-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}
.ma-blk-card{height:52px;border:1px solid #E1EBF2}
.ma-blk-card.is-pick{background:var(--brand-soft,#E8F5FC);border-color:var(--brand)}
.ma-blk-btn{height:32px;background:var(--accent,#F79A01);opacity:.92}
.ma-blk-store{display:flex;align-items:center;gap:8px;padding:10px;margin-bottom:10px;border:1px solid #E1EBF2}
.ma-blk-store b{width:34px;height:34px;border-radius:8px;background:var(--brand);opacity:.85}
.ma-blk-store span{flex:1}
.ma-blk-store em{font-style:normal;color:var(--accent,#F79A01);font-weight:700;font-size:11px}
.ma-booking{display:flex;align-items:center;gap:8px;background:#fff;border-radius:8px;padding:8px 10px;margin-bottom:6px;border:1px solid #E1EBF2}
.ma-booking i{font-style:normal;font-size:11px;font-weight:700;color:var(--brand);background:var(--brand-soft,#E8F5FC);border-radius:5px;padding:2px 6px}
.ma-booking b{font-size:11.5px;color:#3C4C5C;font-weight:600}
.ma-booking.wait i{color:var(--accent,#F79A01);background:var(--accent-soft,#FEF4E4)}
.ma-float{position:absolute;background:#fff;border-radius:999px;padding:8px 14px;font-size:12px;color:#233242;font-weight:600;box-shadow:0 12px 28px rgba(2,30,46,.28);display:flex;align-items:center;gap:7px;white-space:nowrap}
.ma-float-1{left:0;bottom:34px}
.ma-float-2{right:0;top:38px}
.ma-float .cs-dot{width:8px;height:8px;border-radius:50%;background:var(--brand)}
.ma-float .cs-dot-o{background:var(--accent,#F79A01)}

/* 六大优势（压住深色首屏下缘） */
.ma-feats{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-top:-96px;position:relative;z-index:2}
.ma-feat{background:#fff;border-radius:14px;padding:22px 12px;text-align:center;box-shadow:0 10px 30px rgba(3,60,90,.10)}
.ma-feat-ico{display:inline-flex;width:52px;height:52px;border-radius:50%;align-items:center;justify-content:center;color:#fff;background:var(--cs-c,var(--brand));margin-bottom:10px}
.ma-feat-ico svg{width:24px;height:24px}
.ma-feat b{font-size:14px;color:var(--ink,#233242);font-weight:600;display:block}

/* 产品介绍段 */
.ma-intro{max-width:860px;margin:0 auto;text-align:center;font-size:16px;line-height:2;color:var(--ink2,#3C4C5C)}
.ma-intro b{color:var(--brand)}

/* 三大优势卡 */
.ma-adv{background:#fff;border-radius:14px;padding:30px 26px;text-align:center;border:1px solid var(--line,#E6ECF2);transition:.25s}
.ma-adv:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(3,60,90,.10)}
.ma-adv-ico{display:inline-flex;width:60px;height:60px;border-radius:50%;align-items:center;justify-content:center;color:#fff;background:var(--cs-c,var(--brand));margin-bottom:14px}
.ma-adv-ico svg{width:28px;height:28px}
.ma-adv h3{font-size:18px;margin:0 0 8px;color:var(--ink,#233242)}
.ma-adv p{font-size:14px;color:var(--ink3,#5A6B7A);line-height:1.7;margin:0}

/* 核心功能 8 宫格 */
.ma-funcs{display:grid;grid-template-columns:repeat(8,1fr);gap:18px 12px;text-align:center}
.ma-func-ico{display:inline-flex;width:58px;height:58px;border-radius:16px;align-items:center;justify-content:center;background:var(--brand-soft,#E8F5FC);color:var(--brand);margin-bottom:10px}
.ma-func-ico svg{width:26px;height:26px}
.ma-func b{font-size:13.5px;color:var(--ink2,#3C4C5C);font-weight:600;display:block}

/* 在售方案 4 列网格（门店系统 4 个产品一行，手机 2 个） */
.ma-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
@media (max-width:1100px){.ma-grid-4{grid-template-columns:repeat(2,1fr)}}

/* 版本对比表 */
.ma-table-wrap{overflow-x:auto;border:1px solid var(--line,#E6ECF2);border-radius:12px;background:#fff}
.ma-table{width:100%;min-width:860px;border-collapse:collapse;font-size:13.5px}
.ma-table thead th{position:sticky;top:0;background:#F4F8FB;color:var(--ink,#233242);font-weight:700;padding:16px 12px;border-bottom:2px solid var(--brand);text-align:center;white-space:nowrap;z-index:1}
.ma-table thead th.ma-th-cat{width:190px;text-align:left;padding-left:18px}
.ma-table thead th.ma-th-cat i{display:block;font-style:normal;font-weight:400;font-size:12px;color:var(--ink3,#5A6B7A);margin-top:4px}
.ma-table td{padding:11px 12px;border-bottom:1px solid var(--line-2,#EDF2F7);text-align:center;color:var(--ink2,#3C4C5C)}
.ma-table tbody tr:last-child td{border-bottom:none}
.ma-table td.ma-cat{background:#FAFCFE;font-weight:700;color:var(--brand);text-align:center;width:110px;border-right:1px solid var(--line-2,#EDF2F7);vertical-align:middle}
.ma-table td.ma-name{text-align:left;color:var(--ink2,#3C4C5C)}
.ma-table td.ma-val{white-space:normal}
.ma-table td.ma-yes{color:#1FA967;font-weight:700}
.ma-table td.ma-no{color:#B9C4CE}
.ma-table tbody tr:hover td{background:#F7FBFE}

/* 响应式 */
@media (max-width:1100px){
    .ma-hero-grid{grid-template-columns:1fr;gap:36px}
    .ma-hero-copy{text-align:center}
    .ma-points{margin-left:auto;margin-right:auto}
    .ma-hero-cta{justify-content:center}
    .ma-feats{grid-template-columns:repeat(3,1fr);margin-top:-64px}
    .ma-funcs{grid-template-columns:repeat(4,1fr)}
}
@media (max-width:700px){
    .ma-hero{padding:44px 0 64px}
    .ma-hero-flush{padding-bottom:118px}
    .ma-feats{grid-template-columns:repeat(2,1fr)}
    .ma-funcs{grid-template-columns:repeat(2,1fr)}
    .ma-intro{font-size:14.5px;text-align:left}
    .ma-points{max-width:none}
}

/* ============================================================
   教育系统（edu-system）产品线
   ============================================================ */
.edu-pay{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.edu-pay-item{background:#fff;border:1px solid var(--line,#E6ECF2);border-radius:14px;padding:22px 16px 18px;text-align:center;transition:transform .25s,box-shadow .25s}
.edu-pay-item:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(3,131,188,.12)}
.edu-pay-item img{width:84px;height:84px;object-fit:contain;margin:0 auto 12px;display:block}
.edu-pay-item div{font-size:15.5px;font-weight:600;color:var(--ink,#1C2B36)}
.edu-expand{background:#fff;border:1px solid var(--line,#E6ECF2);border-radius:14px;padding:26px 20px;text-align:center;transition:transform .25s,box-shadow .25s}
.edu-expand:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(3,131,188,.12)}
.edu-expand img{width:64px;height:64px;object-fit:contain;margin:0 auto 12px;display:block}
.edu-expand h3{font-size:16px;font-weight:700;margin:0 0 8px;color:var(--ink,#1C2B36)}
.edu-expand p{font-size:13px;color:var(--ink3,#64748B);margin:3px 0;line-height:1.6}
.edu-course{background:#F5F9FC;border:1px solid rgba(255,255,255,.55);border-radius:10px;padding:12px 14px;margin-bottom:9px}
.edu-course b{display:block;font-size:12.5px;color:#123A52;margin-bottom:2px}
.edu-course span{font-size:10.5px;color:#5E7A8C}
.edu-course-live{background:linear-gradient(120deg,#0383BC,#0369A8)}
.edu-course-live b,.edu-course-live span{color:#fff}
.edu-course-live span{opacity:.85}
@media (max-width:1100px){
    .edu-pay{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:700px){
    .edu-pay{grid-template-columns:repeat(2,1fr);gap:12px}
    .edu-pay-item{padding:14px 10px 12px}
    .edu-pay-item img{width:60px;height:60px}
}

/* ============================================================
   定制开发（custom-build）产品线
   ============================================================ */
.cb-plan-grid{align-items:stretch}
.cb-plan{background:#fff;border:1px solid var(--line,#E6ECF2);border-radius:16px;padding:30px 26px;position:relative;display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s}
.cb-plan:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(3,131,188,.14)}
.cb-plan-hot{border-color:var(--brand,#0383BC);box-shadow:0 10px 30px rgba(3,131,188,.12)}
.cb-plan-tag{position:absolute;top:-12px;right:22px;background:var(--accent,#F79A01);color:#fff;font-size:12.5px;font-weight:700;padding:4px 14px;border-radius:999px}
.cb-plan h3{font-size:19px;font-weight:800;color:var(--ink,#1C2B36);margin:0 0 4px}
.cb-plan-kicker{font-size:13px;color:var(--ink3,#64748B);margin:0 0 14px}
.cb-plan-price b{font-size:32px;font-weight:800;color:var(--brand,#0383BC)}
.cb-plan-price span{font-size:13px;color:var(--ink3,#64748B)}
.cb-plan-gift{font-size:12.5px;color:var(--accent,#F79A01);margin:6px 0 14px}
.cb-plan .btn{margin-bottom:16px}
.cb-plan-feats{list-style:none;margin:0;padding:16px 0 0;border-top:1px dashed var(--line,#E6ECF2);flex:1}
.cb-plan-feats li{font-size:13.5px;color:var(--ink2,#3D4D5C);padding:5px 0 5px 22px;position:relative;line-height:1.5}
.cb-plan-feats li::before{content:"";position:absolute;left:2px;top:11px;width:12px;height:12px;border-radius:50%;background:var(--brand,#0383BC);opacity:.15}
.cb-plan-feats li::after{content:"";position:absolute;left:5px;top:13.5px;width:6px;height:3.5px;border-left:1.8px solid var(--brand,#0383BC);border-bottom:1.8px solid var(--brand,#0383BC);transform:rotate(-45deg)}
.cb-compare{max-width:980px;margin:0 auto;border:1px solid var(--line,#E6ECF2);border-radius:16px;overflow:hidden;background:#fff}
.cb-compare-head,.cb-compare-row{display:grid;grid-template-columns:130px 1fr 1fr}
.cb-compare-head > div{padding:15px 20px;font-size:14.5px;font-weight:700;background:#F5F9FC;border-bottom:1px solid var(--line,#E6ECF2)}
.cb-col-us{color:var(--brand,#0383BC)}
.cb-col-them{color:var(--ink3,#64748B)}
.cb-compare-row{border-bottom:1px solid var(--line,#E6ECF2)}
.cb-compare-row:last-child{border-bottom:none}
.cb-compare-cat{padding:18px 20px;font-size:14px;font-weight:700;color:var(--ink,#1C2B36);background:#FAFCFE;border-right:1px solid var(--line,#E6ECF2);display:flex;align-items:center}
.cb-compare-row .cb-col-us,.cb-compare-row .cb-col-them{padding:16px 20px}
.cb-compare-row .cb-col-us b,.cb-compare-row .cb-col-them b{display:block;font-size:14.5px;margin-bottom:4px}
.cb-compare-row .cb-col-us b{color:var(--brand,#0383BC)}
.cb-compare-row .cb-col-them b{color:#8A97A3}
.cb-compare-row p{font-size:12.5px;color:var(--ink3,#64748B);margin:0;line-height:1.6}
@media (max-width:820px){
    .cb-compare-head{display:none}
    .cb-compare-row{grid-template-columns:1fr;gap:0}
    .cb-compare-cat{border-right:none}
}

/* ============================================================
   SSL 证书 / 增值服务通用
   ============================================================ */
.ssl-sub-title{font-size:18px;font-weight:800;color:var(--ink,#1C2B36);margin:0 0 16px;padding-left:12px;border-left:4px solid var(--brand,#0383BC)}
.ssl-svc{background:#fff;border:1px solid var(--line,#E6ECF2);border-radius:14px;padding:24px 22px;display:flex;flex-direction:column}
.ssl-svc-tag{display:inline-block;font-size:11.5px;font-weight:700;color:var(--accent,#F79A01);border:1px solid var(--accent,#F79A01);border-radius:999px;padding:2px 10px;margin-bottom:10px;align-self:flex-start}
.ssl-svc h3{font-size:16.5px;font-weight:700;margin:0 0 10px}
.ssl-svc ul{list-style:none;margin:0 0 14px;padding:0;flex:1}
.ssl-svc li{font-size:13px;color:var(--ink3,#64748B);padding:4px 0 4px 18px;position:relative;line-height:1.6}
.ssl-svc li::before{content:"";position:absolute;left:2px;top:11px;width:8px;height:8px;border-radius:50%;background:var(--brand,#0383BC);opacity:.2}
.ssl-svc-price{font-size:20px;font-weight:800;color:var(--brand,#0383BC)}
.ssl-svc-note{font-size:12px;color:#B06A00;background:#FFF7E8;border-radius:8px;padding:8px 10px;margin:10px 0 0}
.ssl-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.ssl-step{background:#fff;border:1px solid var(--line,#E6ECF2);border-radius:14px;padding:22px 18px;text-align:center}
.ssl-step-no{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--brand,#0383BC);color:#fff;font-weight:800;font-size:15px;margin-bottom:10px}
.ssl-step b{display:block;font-size:15px;margin-bottom:6px}
.ssl-step p{font-size:12.5px;color:var(--ink3,#64748B);margin:0;line-height:1.7}
.ssl-feat,.ssl-why{background:#fff;border:1px solid var(--line,#E6ECF2);border-radius:14px;padding:22px 20px}
.ssl-feat h3,.ssl-why h3{font-size:15.5px;font-weight:700;margin:0 0 8px;color:var(--brand,#0383BC)}
.ssl-feat p,.ssl-why p{font-size:13px;color:var(--ink3,#64748B);margin:0;line-height:1.75}
.ssl-faq{background:#fff;border:1px solid var(--line,#E6ECF2);border-radius:12px;padding:18px 22px;margin-bottom:12px}
.ssl-faq h3{font-size:15px;font-weight:700;margin:0 0 6px}
.ssl-faq p{font-size:13.5px;color:var(--ink3,#64748B);margin:0;line-height:1.8}
@media (max-width:1100px){
    .ssl-steps{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:700px){
    .ssl-steps{grid-template-columns:1fr}
}

/* 企业邮箱优点卡 */
.mail-adv{background:#fff;border:1px solid var(--line,#E6ECF2);border-radius:16px;padding:28px 26px;position:relative;overflow:hidden}
.mail-adv::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--cs-c,var(--brand,#0383BC))}
.mail-adv-ico{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:var(--cs-c,var(--brand,#0383BC));color:#fff;margin-bottom:12px}
.mail-adv-ico svg{width:22px;height:22px}
.mail-adv h3{font-size:17px;font-weight:800;margin:0 0 10px;color:var(--ink,#1C2B36)}
.mail-adv ul{list-style:none;margin:0;padding:0}
.mail-adv li{font-size:13.5px;color:var(--ink3,#64748B);padding:4px 0 4px 18px;position:relative;line-height:1.7}
.mail-adv li::before{content:"";position:absolute;left:2px;top:11px;width:8px;height:8px;border-radius:50%;background:var(--cs-c,var(--brand,#0383BC));opacity:.25}

/* 定制开发首屏浏览器示意 */
.cb-browser{background:#fff;border-radius:14px;box-shadow:0 24px 60px rgba(0,30,60,.28);overflow:hidden;border:1px solid rgba(255,255,255,.4)}
.cb-browser-bar{display:flex;align-items:center;gap:5px;background:#0B2B3F;padding:10px 12px}
.cb-browser-bar i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.35)}
.cb-browser-bar i:first-child{background:#FF6B57}
.cb-browser-bar span{margin-left:8px;font-size:9.5px;color:rgba(255,255,255,.65);background:rgba(255,255,255,.12);border-radius:999px;padding:2px 10px}
.cb-browser-body{padding:14px}
.cb-site-nav{display:flex;align-items:center;gap:6px;margin-bottom:12px}
.cb-site-nav b{width:34px;height:8px;border-radius:4px;background:var(--brand,#0383BC)}
.cb-site-nav span{width:26px;height:6px;border-radius:3px;background:#DCE6EE}
.cb-site-nav em{margin-left:auto;width:44px;height:14px;border-radius:7px;background:var(--accent,#F79A01)}
.cb-site-hero{display:grid;grid-template-columns:1.1fr .9fr;gap:10px;margin-bottom:10px}
.cb-site-hero-copy{background:#F0F7FC;border-radius:10px;padding:14px 12px;display:flex;flex-direction:column;gap:7px;justify-content:center}
.cb-site-hero-copy i{display:block;height:9px;border-radius:4px;background:var(--brand,#0383BC);opacity:.75;width:85%}
.cb-site-hero-copy i + i{background:#B9D4E6;width:70%}
.cb-site-hero-copy i.short{width:45%;background:#D3E4F0}
.cb-site-hero-pic{background:linear-gradient(135deg,var(--brand,#0383BC),#0369A8);border-radius:10px;position:relative;min-height:64px}
.cb-site-hero-pic::after{content:"";position:absolute;right:8px;bottom:8px;width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.35)}
.cb-site-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}
.cb-site-cards div{height:34px;border-radius:8px;background:#F0F7FC;border:1px solid #DCE9F2}
.cb-site-btn{height:22px;border-radius:6px;background:var(--accent,#F79A01);opacity:.9;width:52%}

/* ============================================================
   GEO推广 首屏（原样复刻源站 geo_banner）
   ============================================================ */
.geo-banner{position:relative;height:640px;background:url(../images/geo/geo_banner.png) top center no-repeat;overflow:hidden}
.geo-banner .container{position:relative;height:100%}
.geo-banner-left{position:absolute;left:50%;top:0;margin-left:-692px;width:600px;z-index:2}
.geo-banner-title{width:564px;max-width:100%;height:54px;background:url(../images/geo/banner-title.png) top center no-repeat;background-size:contain;margin-top:140px}
.geo-banner-desc{font-size:22px;font-weight:300;color:#1C273E;line-height:28px;margin:18px 0 0;text-align:left}
.geo-banner-tool{width:576px;max-width:100%;height:92px;border-radius:16px;background:#DAEAFE;margin-top:16px;overflow:hidden;padding:0 38px;position:relative}
.geo-banner-marquee{width:100%;height:100%;overflow:hidden}
.geo-banner-track{display:flex;width:fit-content;animation:geo-marquee 16s linear infinite}
.geo-banner-slide{display:flex;align-items:center;flex-shrink:0;width:830px;height:60px;margin-top:16px}
.geo-banner-ico{display:block;flex-shrink:0;height:60px;background:center no-repeat;background-size:contain}
.geo-banner-ico + .geo-banner-ico{margin-left:10px}
.geo-banner-ico.ico1{background-image:url(../images/geo/ai_tool_icon1.png);width:180px}
.geo-banner-ico.ico2{background-image:url(../images/geo/ai_tool_icon2.png);width:132px}
.geo-banner-ico.ico3{background-image:url(../images/geo/ai_tool_icon3.png);width:176px}
.geo-banner-ico.ico4{background-image:url(../images/geo/ai_tool_icon4.png);width:148px}
.geo-banner-ico.ico5{background-image:url(../images/geo/ai_tool_icon5.png);width:144px}
@keyframes geo-marquee{0%{transform:translateX(0)}100%{transform:translateX(-830px)}}
.geo-banner-tool::before{content:"";width:90px;height:92px;border-radius:16px 0 0 16px;background:linear-gradient(90.13deg,#DAEAFE 0,rgba(218,234,254,0) 100%);position:absolute;z-index:2;left:38px;top:0}
.geo-banner-tool::after{content:"";width:90px;height:92px;border-radius:0 16px 16px 0;background:linear-gradient(269.87deg,#DAEAFE 0,rgba(218,234,254,0) 100%);position:absolute;z-index:2;right:38px;top:0}
.geo-banner-right{position:absolute;left:50%;top:60px;margin-left:-36px;width:712px;height:518px;background:url(../images/geo/banner-right.png) top center no-repeat;z-index:1}
@media (max-width:1250px){
    /* 注：banner 内没有 .container（内容用 .geo-banner-left/.geo-banner-right 绝对定位），
       窄屏这里直接给 banner 自身留左右内边距，避免标题/描述贴屏幕边缘。 */
    .geo-banner{height:auto;padding:60px 16px 30px}
    .geo-banner .container{height:auto;display:flex;flex-direction:column;align-items:center}
    .geo-banner-left{position:static;margin:0;width:min(600px,100%)}
    .geo-banner-title{margin-top:0}
    .geo-banner-right{position:static;margin:28px 0 0;width:min(712px,100%);height:auto;aspect-ratio:712/518;background-size:contain}
}

/* ============================================================
   GEO推广 内容区（1:1 复刻源站 geoIntroduce.min.css，gb- 前缀）
   ============================================================ */
[v-cloak]{display:none}.gb-container .gb-geo_content{text-align:center}.gb-container .gb-geo_content_title{font-family:"Microsoft YaHei Bold";font-weight:700;font-size:32px;letter-spacing:.01px;text-align:center;color:#1c273e;display:inline-block;line-height:42px;margin-top:60px;position:relative}.gb-container .gb-geo_content_title .gb-content_title_left{width:16px;height:16px;border-radius:2px;background:linear-gradient(125.29deg,#674aff 0,#2288fc 100%);opacity:.6;display:inline-block;transform:rotate(-45deg);position:absolute;left:-34px;top:15px}.gb-container .gb-geo_content_title .gb-content_title_left::before{content:"";width:12px;height:12px;border-radius:2px;background:linear-gradient(125.29deg,#674aff 0,#2288fc 100%);opacity:.3;position:absolute;left:-18px;top:-18px}.gb-container .gb-geo_content_title .gb-content_title_left::after{content:"";width:8px;height:8px;border-radius:2px;background:linear-gradient(125.29deg,#674aff 0,#2288fc 100%);opacity:.1;position:absolute;left:-32px;top:-32px}.gb-container .gb-geo_content_title .gb-content_title_right{width:16px;height:16px;border-radius:2px;background:linear-gradient(125.29deg,#674aff 0,#2288fc 100%);opacity:.6;display:inline-block;transform:rotate(135deg);position:absolute;right:-34px;top:15px}.gb-container .gb-geo_content_title .gb-content_title_right::before{content:"";width:12px;height:12px;border-radius:2px;background:linear-gradient(125.29deg,#674aff 0,#2288fc 100%);opacity:.3;position:absolute;right:20px;top:-18px}.gb-container .gb-geo_content_title .gb-content_title_right::after{content:"";width:8px;height:8px;border-radius:2px;background:linear-gradient(125.29deg,#674aff 0,#2288fc 100%);opacity:.1;position:absolute;right:38px;top:-32px}.gb-container .gb-geo_content_subtitle{color:#1c273e;font-size:16px;font-family:"Microsoft YaHei Bold";font-weight:400;letter-spacing:.08px;line-height:22px;margin-top:16px}.gb-container .gb-geo_content_subtitle span{color:#5f79fb}.gb-container .gb-geo_content.gb-pic1{width:100%;height:550px;background:#fff}.gb-container .gb-pic1 .gb-geo_point_list{width:1420px;margin:0 auto;margin-top:46px;height:300px}.gb-container .gb-pic1 .gb-geo_point_item{width:264px;height:300px;border-radius:16px;float:left;margin:0 10px;position:relative;top:0;transition:all .3s ease}.gb-container .gb-pic1 .gb-geo_point_item:hover{box-shadow:rgba(0,0,0,.15) 0 8px 16px;top:-8px}.gb-container .gb-pic1 .gb-geo_point_item.gb-item1,.gb-container .gb-pic1 .gb-geo_point_item.gb-item5{background:linear-gradient(180deg,#d2f3ff 0,#eaf8ff 100%)}.gb-container .gb-pic1 .gb-geo_point_item.gb-item2,.gb-container .gb-pic1 .gb-geo_point_item.gb-item4{background:linear-gradient(180deg,#bdd1ff 0,#e0eafe 100%)}.gb-container .gb-pic1 .gb-geo_point_item.gb-item3{background:linear-gradient(180deg,#d9c3fe 0,#f3efff 100%)}.gb-container .gb-pic1 .gb-geo_point_title{font-family:"Microsoft YaHei Bold";font-weight:700;font-size:20px;letter-spacing:.01px;text-align:left;color:#333;line-height:26px;margin:24px 0 0 24px}.gb-container .gb-pic1 .gb-geo_point_desc{font-family:"Microsoft YaHei";font-weight:400;font-size:13px;letter-spacing:.01px;line-height:22px;text-align:left;color:#7f939a;margin:16px 24px 0 24px}.gb-container .gb-pic1 .gb-geo_point_icon{width:240px;height:150px;position:absolute;bottom:0;left:12px}.gb-container .gb-pic1 .gb-geo_point_icon.gb-icon1{background:url(../images/geo/mbz35.png) top center no-repeat}.gb-container .gb-pic1 .gb-geo_point_icon.gb-icon2{background:url(../images/geo/mbz36.png) top center no-repeat}.gb-container .gb-pic1 .gb-geo_point_icon.gb-icon3{background:url(../images/geo/mbz37.png) top center no-repeat}.gb-container .gb-pic1 .gb-geo_point_icon.gb-icon4{background:url(../images/geo/mbz38.png) top center no-repeat}.gb-container .gb-pic1 .gb-geo_point_icon.gb-icon5{background:url(../images/geo/mbz39.png) top center no-repeat}.gb-container .gb-pic2 .gb-mainbg1{width:100%;height:857px;background:url(../images/geo/mainbg1.png) top center no-repeat;position:relative;display:inline-block}.gb-container .gb-pic2 .gb-mainbg2{width:100%;height:750px;background:#fff;position:relative;display:inline-block;padding-top:20px}.gb-container .gb-pic2 .gb-mainbg3{width:100%;height:850px;background:url(../images/geo/mainbg3.png) top center no-repeat;position:relative;display:inline-block}.gb-container .gb-pic2 .gb-step_title{font-family:"Microsoft YaHei Bold";font-weight:700;font-size:24px;letter-spacing:.01px;color:#333;line-height:32px;margin-top:98px;position:relative;height:32px}.gb-container .gb-pic2 .gb-step_desc{font-family:"Microsoft YaHei";font-weight:400;font-size:14px;letter-spacing:.01px;color:#333;opacity:.7;line-height:20px;margin-top:14px}.gb-container .gb-pic2 .gb-step_title .gb-step_title_num{position:absolute;font-family:"FKW_Number regular";font-weight:400;font-size:80px;letter-spacing:.01px;color:#dae2fe;z-index:10;left:50%;transform:translateX(-50%);top:-26px}.gb-container .gb-pic2 .gb-step_title .gb-step_title_text{position:absolute;z-index:11;left:50%;transform:translateX(-50%)}.gb-container .gb-pic2 .gb-mainbg1_right{width:720px;height:510px;position:absolute;top:342px;left:50%;margin-left:-50px;flex:1 1 0%;border-radius:16px;transition:all .3s ease}.gb-container .gb-pic2 .gb-mainbg1_right.gb-mainbg1_1{background:url(../images/geo/main3-1.png) top center no-repeat}.gb-container .gb-pic2 .gb-mainbg1_right.gb-mainbg1_2{background:url(../images/geo/main3-2.png) top center no-repeat}.gb-container .gb-pic2 .gb-mainbg1_right.gb-mainbg1_3{background:url(../images/geo/main3-3.png) top center no-repeat}.gb-container .gb-pic2 .gb-mainbg1_right.gb-mainbg1_4{background:url(../images/geo/main3-4.png) top center no-repeat}.gb-container .gb-pic2 .gb-mainbg1_right.gb-mainbg1_5{background:url(../images/geo/main3-5.png) top center no-repeat}.gb-container .gb-pic2 .gb-mainbg1_left{width:570px;height:460px;position:absolute;top:376px;left:50%;margin-left:-670px}.gb-container .gb-pic2 .gb-diagnosis{position:relative;width:456px;height:30px;margin-bottom:36px;transition:all .3s ease;cursor:pointer}.gb-container .gb-pic2 .gb-diagnosis.gb-active{width:456px;height:174px;border-radius:16px;background:linear-gradient(125.29deg,#674aff 0,#2288fc 100%);padding-top:32px}.gb-container .gb-pic2 .gb-diagnosis_icon{width:26px;height:26px;position:absolute;left:24px;top:2px;background-color:#3a6bfe;-webkit-mask-size:contain;mask-size:contain;transition:all .3s ease}.gb-container .gb-pic2 .gb-diagnosis_icon.gb-icon1{-webkit-mask:url(../images/geo/twcwj.svg) center no-repeat;mask:url(../images/geo/twcwj.svg) center no-repeat}.gb-container .gb-pic2 .gb-diagnosis_icon.gb-icon2{-webkit-mask:url(../images/geo/sljzdc.svg) center no-repeat;mask:url(../images/geo/sljzdc.svg) center no-repeat}.gb-container .gb-pic2 .gb-diagnosis_icon.gb-icon3{-webkit-mask:url(../images/geo/xysdjg.svg) center no-repeat;mask:url(../images/geo/xysdjg.svg) center no-repeat}.gb-container .gb-pic2 .gb-diagnosis_icon.gb-icon4{-webkit-mask:url(../images/geo/jphxdb.svg) center no-repeat;mask:url(../images/geo/jphxdb.svg) center no-repeat}.gb-container .gb-pic2 .gb-diagnosis_icon.gb-icon5{-webkit-mask:url(../images/geo/aidmxfx.svg) center no-repeat;mask:url(../images/geo/aidmxfx.svg) center no-repeat}.gb-container .gb-pic2 .gb-diagnosis.gb-active .gb-diagnosis_icon{top:34px;filter:brightness(0) invert(1)}.gb-container .gb-pic2 .gb-diagnosis_title{font-family:"Microsoft YaHei Light";font-weight:300;font-size:24px;letter-spacing:.01px;text-align:left;color:#1c273e;line-height:30px;margin-left:58px}.gb-container .gb-pic2 .gb-diagnosis.gb-active .gb-diagnosis_title{color:#fff}.gb-container .gb-pic2 .gb-diagnosis_desc{font-family:"Microsoft YaHei";font-weight:400;font-size:14px;letter-spacing:.01px;line-height:24px;text-align:left;color:#fff;opacity:.8;margin-top:12px;margin-left:58px;margin-right:74px}.gb-container .gb-pic2 .gb-diagnosis_arrow_icon{width:26px;height:26px;border-radius:50%;position:absolute;right:0;top:10px;transition:all .3s ease}.gb-container .gb-pic2 .gb-diagnosis_arrow_icon .gb-arrow_icon{width:26px;height:26px;background-color:#7e8082;-webkit-mask:url(../images/geo/arrow_icon.svg) center no-repeat;mask:url(../images/geo/arrow_icon.svg) center no-repeat;-webkit-mask-size:contain;mask-size:contain;transition:all .3s ease}.gb-container .gb-pic2 .gb-diagnosis.gb-active .gb-diagnosis_arrow_icon{top:62px;right:24px;background-color:#fff}.gb-container .gb-pic2 .gb-diagnosis.gb-active .gb-arrow_icon{background-color:#3a6bfe}.gb-container .gb-pic2 .gb-monitor_content{width:1400px;height:450px;margin:0 auto;margin-top:85px;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;position:relative}.gb-container .gb-pic2 .gb-monitor_list{flex:1 1 280px;max-width:280px;min-width:0;height:450px;border:1px solid #cfe0fc;border-radius:16px;transition:all .3s ease;position:relative;margin-left:-24px}.gb-container .gb-monitor_border1 .gb-monitor_list,.gb-container .gb-monitor_border2 .gb-monitor_list.gb-list3{border-left:none;border-radius:0 16px 16px 0}.gb-container .gb-monitor_border3 .gb-monitor_list.gb-list1{border-right:none;border-radius:16px 0 0 16px}.gb-container .gb-pic2 .gb-monitor_list.gb-active{flex:1 1 840px;max-width:840px;background:url(../images/geo/monitor_center_bg.png) top center no-repeat;border-radius:14px}.gb-container .gb-pic2 .gb-monitor_list .gb-monitor_trend{width:530px;height:470px;position:absolute;left:40px;top:-50px;opacity:0;transition:opacity .3s ease;pointer-events:none}.gb-container .gb-pic2 .gb-monitor_list.gb-active .gb-monitor_trend{opacity:1}.gb-container .gb-pic2 .gb-monitor_trend.gb-monitor_trend_1{background:url(../images/geo/monitor_trend_1.png) top center no-repeat}.gb-container .gb-pic2 .gb-monitor_trend.gb-monitor_trend_2{background:url(../images/geo/monitor_trend_2.png) top center no-repeat}.gb-container .gb-pic2 .gb-monitor_trend.gb-monitor_trend_3{background:url(../images/geo/monitor_trend_3.png) top center no-repeat}.gb-container .gb-pic2 .gb-monitor_item{width:280px;height:450px;position:absolute;right:0;top:0}.gb-container .gb-pic2 .gb-monitor_icon{width:40px;height:40px;background-color:#d0e0fc;-webkit-mask-size:contain;mask-size:contain;transition:all .3s ease;margin:64px 0 0 40px}.gb-container .gb-pic2 .gb-monitor_icon.gb-zdjkzd{-webkit-mask:url(../images/geo/zdjkzd.svg) center no-repeat;mask:url(../images/geo/zdjkzd.svg) center no-repeat}.gb-container .gb-pic2 .gb-monitor_icon.gb-jpsszz{-webkit-mask:url(../images/geo/jpsszz.svg) center no-repeat;mask:url(../images/geo/jpsszz.svg) center no-repeat}.gb-container .gb-pic2 .gb-monitor_icon.gb-twcdz{-webkit-mask:url(../images/geo/twcdz.svg) center no-repeat;mask:url(../images/geo/twcdz.svg) center no-repeat}.gb-container .gb-monitor_list.gb-active .gb-monitor_icon{background-color:#fff}.gb-container .gb-pic2 .gb-monitor_title{font-family:"Microsoft YaHei Light";font-weight:300;font-size:24px;letter-spacing:.01px;text-align:left;color:#2b2c43;line-height:30px;margin:20px 0 0 40px}.gb-container .gb-monitor_list.gb-active .gb-monitor_title{color:#fff}.gb-container .gb-pic2 .gb-monitor_desc{font-family:"Microsoft YaHei";font-weight:400;font-size:14px;letter-spacing:.01px;line-height:24px;text-align:left;color:#999;opacity:.8;margin:40px 40px 0 40px}.gb-container .gb-monitor_list.gb-active .gb-monitor_desc{color:#fff}.gb-container .gb-pic2 .gb-monitor_bottom_line{width:70px;height:4px;background:#356ffd;margin:54px 0 0 40px}.gb-container .gb-pic2 .gb-monitor_list.gb-active .gb-monitor_bottom_line{background:#fec666}.gb-container .gb-pic2 .gb-creation_content{width:1400px;height:560px;margin:0 auto;border-radius:16px 16px 16px 16px;margin-top:40px;display:inline-block;position:relative}.gb-container .gb-pic2 .gb-creation_left{width:422px;height:560px}.gb-container .gb-pic2 .gb-creation_right{width:978px;height:560px;position:absolute;right:0;top:0;transition:all .3s ease}.gb-container .gb-pic2 .gb-creation_right.gb-main5p1{background:url(../images/geo/main5p1.png) top center no-repeat}.gb-container .gb-pic2 .gb-creation_right.gb-main5p2{width:978px;height:560px;background:url(../images/geo/main5p2.png) top center no-repeat;position:absolute;right:0;top:0}.gb-container .gb-pic2 .gb-creation_item{width:422px;height:280px;background:#fff;border-radius:0;display:inline-block;cursor:pointer;position:relative;overflow:hidden}.gb-container .gb-pic2 .gb-creation_item::before{content:"";position:absolute;left:0;top:0;right:0;bottom:0;background:url(../images/geo/creation_left_bg.png) top center no-repeat;opacity:0;transition:opacity .3s ease;pointer-events:none}.gb-container .gb-pic2 .gb-creation_item.gb-item1{border-radius:16px 0 0 0}.gb-container .gb-pic2 .gb-creation_item.gb-item2{border-radius:0 0 0 16px;margin-top:-3px}.gb-container .gb-pic2 .gb-creation_item.gb-active::before{opacity:1}.gb-container .gb-pic2 .gb-creation_item_desc,.gb-container .gb-pic2 .gb-creation_item_icon,.gb-container .gb-pic2 .gb-creation_item_title{position:relative;z-index:1}.gb-container .gb-pic2 .gb-creation_item_icon{width:40px;height:40px;margin:68px 0 0 40px;background-color:#3a6bfe;-webkit-mask-size:contain;mask-size:contain;transition:all .3s ease}.gb-container .gb-pic2 .gb-creation_item.gb-item1 .gb-creation_item_icon{-webkit-mask:url(../images/geo/aizncz.svg) center no-repeat;mask:url(../images/geo/aizncz.svg) center no-repeat}.gb-container .gb-pic2 .gb-creation_item.gb-item2 .gb-creation_item_icon{-webkit-mask:url(../images/geo/zsppzk.svg) center no-repeat;mask:url(../images/geo/zsppzk.svg) center no-repeat}.gb-container .gb-pic2 .gb-creation_item.gb-active .gb-creation_item_icon{background-color:#fff}.gb-container .gb-pic2 .gb-creation_item_title{font-family:"Microsoft YaHei Light";font-weight:300;font-size:24px;letter-spacing:.01px;text-align:left;color:#2b2c43;line-height:30px;margin:16px 0 0 40px}.gb-container .gb-pic2 .gb-creation_item.gb-active .gb-creation_item_title{color:#fff}.gb-container .gb-pic2 .gb-creation_item_desc{font-family:"Microsoft YaHei";font-weight:400;font-size:14px;letter-spacing:.01px;line-height:24px;text-align:left;color:#999;margin:16px 40px 0 40px}.gb-container .gb-pic2 .gb-creation_item.gb-active .gb-creation_item_desc{color:#fff}.gb-container .gb-pic3{width:100%;height:750px;background:url(../images/geo/pic3.png) top center no-repeat;position:relative;display:inline-block}.gb-container .gb-pic3 .gb-ring{width:1451px;height:574px;background:url(../images/geo/ring.png) top center no-repeat;position:absolute;top:176px;left:50%;transform:translateX(-50%)}.gb-container .gb-pic3 .gb-ring_item{position:absolute;width:252px;text-align:center}.gb-container .gb-pic3 .gb-ring_item.gb-item1{left:150px;top:35px}.gb-container .gb-pic3 .gb-ring_item.gb-item2{left:50%;transform:translateX(-50%);top:35px}.gb-container .gb-pic3 .gb-ring_item.gb-item3{right:150px;top:35px}.gb-container .gb-pic3 .gb-ring_item.gb-item4{right:150px;top:336px}.gb-container .gb-pic3 .gb-ring_item.gb-item5{left:50%;transform:translateX(-50%);top:336px}.gb-container .gb-pic3 .gb-ring_item.gb-item6{left:150px;top:336px}.gb-container .gb-pic3 .gb-ring_item_title{font-family:"Microsoft YaHei Bold";font-weight:700;font-size:24px;color:#2b2c43;line-height:32px}.gb-container .gb-pic3 .gb-ring_item_desc{font-family:"Microsoft YaHei";font-weight:400;font-size:13px;letter-spacing:.01px;line-height:22px;text-align:center;color:#333;margin-top:82px}
/* —— 状态补丁：源站 Vue v-if 的显隐行为用 CSS 等价实现 —— */
.gb-container .gb-pic2 .gb-diagnosis .gb-diagnosis_desc{display:none}
.gb-container .gb-pic2 .gb-diagnosis.gb-active .gb-diagnosis_desc{display:block}
/* 布局收口：源站区块间天然分隔，无需额外间距 */
.gb-container{overflow:hidden}
.gb-container .gb-geo_content{overflow:hidden}

/* GEO banner 首页入口按钮（红色标注位：AI工具条下方） */
.geo-banner-btn{display:inline-block;margin-top:26px;padding:12px 38px;border-radius:999px;
    background:var(--brand,#0383BC);color:#fff;font-size:15.5px;font-weight:700;letter-spacing:1px;
    text-decoration:none;box-shadow:0 10px 26px rgba(3,131,188,.35);transition:transform .25s,box-shadow .25s}
.geo-banner-btn:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(3,131,188,.45);color:#fff}
@media (max-width:1250px){
    .geo-banner-btn{margin:24px auto 0}
}

/* 400电话页 · 常见功能左菜单右详情（移动端单列） */
@media (max-width:900px){
    .tel400-two{grid-template-columns:1fr !important}
}

/* ---------- 源站原版页面内嵌（企业邮箱 / 400电话） ---------- */
.replica-frame { display: block; width: 100%; border: 0; background: #fff; }
#xwMail [id] { scroll-margin-top: 96px; }

/* 防御：tel400 复刻页 footer-cols 曾被异常压缩至 3px（渲染引擎怪异行为），强制恢复全宽 */
.site-footer .footer-cols { width: 100%; }
.site-footer .container { width: 100%; }

/* ==========================================================================
   修复：手机端头部「错行」—— 汉堡按钮被挤到第二行
   原因：≤760px 下 logo 实宽约 226px，「登录」按钮 58px、汉堡 38px，再加两处 gap 与
        容器左右内边距，合计约 400px，超过多数手机的可用宽度（375 屏扣掉内边距只剩
        343px），flex-wrap 于是把汉堡换到第二行，与下方内容错位。
   做法：手机上把品牌区收窄（图形 30px、主品牌 14px、副标题 9px、间距 10px），并给品牌
        文字加「可收缩 + 省略号」兜底 —— 任何窄屏都保持 logo / 登录 / 汉堡 同一行。
        本节必须位于文件末尾，才能覆盖前面 760px 与 1279px 段落的同类规则。
   ========================================================================== */
@media (max-width: 760px) {
    .site-header .container { gap: 8px; }

    /* logo 可收缩：图形与竖线不压缩，仅文字允许省略，确保绝不换行 */
    .site-header .logo { flex: 0 1 auto; min-width: 0; gap: 10px; }
    .logo .logo-img { height: 30px; }
    .logo .logo-split { height: 22px; }
    .logo .logo-brand { font-size: 14px; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
    .logo .logo-brand i { font-size: 9px; letter-spacing: 0; }

    /* 「登录」按钮收窄，把空间让给品牌区 */
    .header-actions .btn { height: 32px; padding: 0 12px; font-size: 13px; }
    .header-actions .btn-primary { padding: 0 13px; }
}

/* 超窄屏（≤360px）：隐藏副标题「企业上网一站式服务」，优先保证一行放下 */
@media (max-width: 360px) {
    .logo .logo-brand i { display: none; }
    .logo .logo-img { height: 27px; }
}

/* 极窄屏（≤340px，老机型）：再收一档间距与图形 */
@media (max-width: 340px) {
    .site-header .container { gap: 6px; }
    .logo .logo-img { height: 25px; }
    .header-actions .btn { padding: 0 10px; }
}

/* ==========================================================================
   复刻页窄屏适配：桌面版 1200px 固定宽 → 等比缩放，整页完整可见
   ── 适用：企业邮箱（/c/biz-mail）、400电话（/c/tel-400）。源站整页写死 1200px
      （含 min-width:1200px），手机上原样渲染会把页面撑宽、只能左右拖动。
   ── 缩放系数由 public/js/replica-fit.js 按「可用宽度 / 设计宽度」写入 style.zoom，
      桌面端为 1（原尺寸）；这里只给初始值与兜底宽度，避免脚本未执行时先撑宽页面。
   ========================================================================== */
.replica-fit { width: 1200px; margin: 0 auto; zoom: 1; }

/* 流式区块（GEO 推广页 pic1/pic2/pic3）：放得下时保持通栏，只有窄屏才固定设计宽后缩放 */
.replica-fit.is-fluid { width: 100%; }

/* 缩放提示：仅窄屏出现，告诉访客可以双指放大看细节 */
.replica-tip {
    display: none; margin: 0 16px 10px; padding: 8px 12px;
    font-size: 12px; line-height: 1.6; color: var(--ink3); text-align: center;
    background: var(--brand-soft); border: 1px solid var(--brand-line);
    border-radius: var(--radius);
}
@media (max-width: 900px) {
    .replica-tip { display: block; }
}

/* 冰蓝魔方 / GEO 推广：功能对比表在窄屏放不下（min-width 1080px / 860px），
   让表格区域局部横滑，不影响整页（不缩放、不撑宽页面）。 */
@media (max-width: 1279px) {
    #xwMail .table-main { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .ma-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
