/* =========================================================
   多途网络 · 高防 SCDN 产品页科技感美化层
   说明：
   - 叠加在 scdn.css / pubmain.css / public.css 之上
   - 主色：#2981ff（蓝） / #22d3ee（青） / #8b5cf6（紫）
   - 兼容原 vue / swiper / tab 切换 / 移动端
   ========================================================= */

:root {
    --scdn-primary: #2981ff;
    --scdn-cyan: #22d3ee;
    --scdn-violet: #8b5cf6;
    --scdn-grad: linear-gradient(135deg, #2981ff 0%, #22d3ee 100%);
    --scdn-grad-text: linear-gradient(90deg, #1c1d1f 0%, #2981ff 60%, #22d3ee 100%);
    --scdn-shadow-soft: 0 10px 30px -12px rgba(41,129,255,.18), 0 4px 14px -6px rgba(15,32,68,.08);
    --scdn-shadow-strong: 0 22px 50px -18px rgba(41,129,255,.45), 0 6px 18px -6px rgba(15,32,68,.18);
    --scdn-radius: 16px;
}

/* ===== 全局：Section 标题统一升级 ===== */
.scdn-index .section-header {
    text-align: center;
    margin-bottom: 50px;
    position: relative;
}
.scdn-index .section-header h1,
.scdn-index .section-header h3 {
    display: inline-block;
    font-size: 34px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    background: var(--scdn-grad-text);
    -webkit-background-clip: text;
            background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: .5px;
    margin: 0 auto !important;
}
.scdn-index .section-header h1::after,
.scdn-index .section-header h3::after {
    content: "";
    display: block;
    width: 56px; height: 4px;
    margin: 16px auto 0;
    border-radius: 2px;
    background: var(--scdn-grad);
    box-shadow: 0 0 12px rgba(41,129,255,.55);
}

/* ===== 锚点导航（强力覆盖 main.css 中 .skip-box ul li 的 inline-block + 15% 宽度） ===== */
.scdn-index .skip-box {
    background: #fff;
    box-shadow: 0 4px 18px -10px rgba(15,32,68,.15);
    height: 60px !important;
}
.scdn-index .skip-item {
    height: 60px !important;
    overflow: visible !important;
    box-shadow: 0 2px 6px 0 rgba(52, 65, 91, 0.08);
}
.scdn-index .menu-tab {
    display: flex !important;
    justify-content: center !important;
    align-items: center;
    gap: 0;
    padding: 0 !important;
    margin: 0 !important;
    height: 60px;
    line-height: 60px;
}
.scdn-index .menu-tab li {
    display: inline-flex !important;
    align-items: center;
    width: auto !important;
    height: 60px !important;
    line-height: 60px !important;
    padding: 0 !important;
    margin: 0 18px !important;
    position: relative;
    box-sizing: border-box !important;
}
.scdn-index .menu-tab li a {
    display: inline-block;
    padding: 0 22px !important;
    height: 60px;
    line-height: 60px;
    font-size: 16px;
    font-weight: 500;
    color: #4a5568 !important;
    transition: color .25s ease;
    position: relative;
}
.scdn-index .menu-tab li a::after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    bottom: 10px !important;
    right: auto !important;
    transform: translateX(-50%);
    width: 0 !important;
    height: 3px !important;
    background: linear-gradient(90deg, #2981ff, #22d3ee) !important;
    border-radius: 2px;
    transition: width .35s ease;
    box-shadow: 0 2px 8px rgba(41,129,255,.45);
}
.scdn-index .menu-tab li:hover a { color: var(--scdn-primary) !important; }
.scdn-index .menu-tab li:hover a::after { width: 32px !important; }
.scdn-index .menu-tab li.on a {
    color: var(--scdn-primary) !important;
    font-weight: 600;
}
.scdn-index .menu-tab li.on a::after { width: 32px !important; }

/* ===== 区段背景 ===== */
.scdn-index .section-a1 {
    background:
        radial-gradient(700px 350px at 90% 10%, rgba(34,211,238,.06), transparent 60%),
        radial-gradient(700px 350px at 10% 90%, rgba(41,129,255,.07), transparent 60%),
        #f7faff;
    padding: 80px 0 !important;
    position: relative;
    overflow: hidden;
}
.scdn-index .section-a1::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(41,129,255,.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(41,129,255,.05) 1px, transparent 1px);
    background-size: 50px 50px;
    -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 75%);
            mask-image: radial-gradient(ellipse at center, black 30%, transparent 75%);
    pointer-events: none;
    z-index: 0;
}
.scdn-index .section-a1 > .m { position: relative; z-index: 1; }

.scdn-index .section-a2 {
    background: linear-gradient(180deg, #f4f6fa 0%, #eaf1fb 100%) !important;
    padding: 80px 0 !important;
}
.scdn-index .section-a4 {
    padding: 80px 0 !important;
    background: linear-gradient(180deg, #ffffff 0%, #f5f8fc 100%);
}

/* ===== 1. 产品优势卡片 ===== */
.scdn-index .product-advantage {
    gap: 24px;
    flex-wrap: wrap;
}
.scdn-index .product-advantage > li {
    width: calc(33.333% - 16px) !important;
    margin: 0 !important;
    padding: 40px 30px !important;
    background: linear-gradient(160deg, rgba(255,255,255,.95) 0%, rgba(232,243,255,.6) 100%);
    border: 1px solid rgba(255,255,255,.85);
    border-radius: var(--scdn-radius);
    box-shadow: var(--scdn-shadow-soft);
    box-sizing: border-box;
    transition: transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s ease, border-color .3s;
    position: relative;
    overflow: hidden;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

/* 顶部流光条（hover 显示） */
.scdn-index .product-advantage > li::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, var(--scdn-primary), var(--scdn-cyan), transparent);
    background-size: 200% 100%;
    opacity: 0;
    transition: opacity .35s ease;
}
.scdn-index .product-advantage > li:hover {
    transform: translateY(-10px);
    box-shadow: var(--scdn-shadow-strong);
    border-color: rgba(41,129,255,.4);
}
.scdn-index .product-advantage > li:hover::before {
    opacity: 1;
    animation: scdn-shine 2s linear infinite;
}
@keyframes scdn-shine {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* 图标容器：覆盖原精灵图，改用内嵌 SVG（每个 li 不同图标，见下方 nth-child 块） */
.scdn-index .product-advantage .hover-icon-80 {
    position: relative;
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 96px !important;
    height: 96px !important;
    margin: 0 auto !important;
    border-radius: 50%;
    background-color: rgba(41,129,255,.06) !important;
    background-size: 52px 52px !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-image: none !important;
    /* 关键：阻止原精灵图的 hover 帧动画 */
    animation: none !important;
    transition: transform .4s ease, background-color .3s ease, box-shadow .3s ease;
}

/* 阻止原 pubmain.css 里 .product-advantage li:hover .hover-icon-80 的精灵动画 */
.scdn-index .product-advantage li:hover .hover-icon-80 { animation: none !important; }

.scdn-index .product-advantage .hover-icon-80::before {
    content: "";
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    border: 1px dashed rgba(41,129,255,.3);
    transition: transform 1.5s linear, opacity .3s ease;
    opacity: 0;
}
.scdn-index .product-advantage > li:hover .hover-icon-80 {
    background-color: rgba(41,129,255,.12) !important;
    box-shadow: 0 14px 28px -10px rgba(41,129,255,.45);
    transform: translateY(-4px) scale(1.06);
}
.scdn-index .product-advantage > li:hover .hover-icon-80::before {
    opacity: 1;
    animation: scdn-spin 8s linear infinite !important;
}
@keyframes scdn-spin {
    to { transform: rotate(360deg); }
}

/* 6 个产品优势对应的内嵌 SVG 图标（蓝色主题，主题相符） */
/* 1. 分布式 DDoS 清洗 → 盾牌+对勾 */
.scdn-index .product-advantage > li:nth-child(1) .hover-icon-80 {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232981ff' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'><path d='M12 2L4 5v6c0 5 3.5 9 8 11 4.5-2 8-6 8-11V5l-8-3z'/><path d='M9 12l2 2 4-4'/></svg>") !important;
}
/* 2. CC 自适应防御 → 雷达扫描 */
.scdn-index .product-advantage > li:nth-child(2) .hover-icon-80 {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232981ff' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='9'/><circle cx='12' cy='12' r='6'/><circle cx='12' cy='12' r='3'/><line x1='12' y1='12' x2='20' y2='4'/></svg>") !important;
}
/* 3. 智能 WAF 防护 → 锁+电路盾 */
.scdn-index .product-advantage > li:nth-child(3) .hover-icon-80 {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232981ff' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'><rect x='4' y='10' width='16' height='10' rx='2'/><path d='M8 10V7a4 4 0 018 0v3'/><circle cx='12' cy='15' r='1.5' fill='%232981ff' stroke='none'/><path d='M12 16.5V18'/></svg>") !important;
}
/* 4. 自定义防护规则 → 设置/规则 */
.scdn-index .product-advantage > li:nth-child(4) .hover-icon-80 {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232981ff' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'><line x1='4' y1='6' x2='14' y2='6'/><line x1='4' y1='12' x2='10' y2='12'/><line x1='4' y1='18' x2='16' y2='18'/><circle cx='17' cy='6' r='2.5'/><circle cx='13' cy='12' r='2.5'/><circle cx='19' cy='18' r='2.5'/></svg>") !important;
}
/* 5. 灵活使用 → 流量计费/曲线 */
.scdn-index .product-advantage > li:nth-child(5) .hover-icon-80 {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232981ff' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'><polyline points='3 17 9 11 13 14 21 6'/><polyline points='15 6 21 6 21 12'/><line x1='3' y1='21' x2='21' y2='21'/></svg>") !important;
}
/* 6. 一站式全面防护 → 球体网络 */
.scdn-index .product-advantage > li:nth-child(6) .hover-icon-80 {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232981ff' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='9'/><line x1='3' y1='12' x2='21' y2='12'/><path d='M12 3a13 13 0 010 18'/><path d='M12 3a13 13 0 000 18'/></svg>") !important;
}

/* 标题 + 描述文字升级 */
.scdn-index .product-advantage .advantage-title {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #1c1d1f !important;
    text-align: center;
    margin: 22px 0 14px !important;
    transition: color .3s ease;
}
.scdn-index .product-advantage > li:hover .advantage-title {
    background: var(--scdn-grad);
    -webkit-background-clip: text;
            background-clip: text;
    -webkit-text-fill-color: transparent;
}
.scdn-index .product-advantage > li p {
    font-size: 14px !important;
    line-height: 26px !important;
    color: #5b6577 !important;
    text-align: center;
    max-width: none !important;
}

/* ===== 2. 套餐价格卡片 ===== */
.scdn-index .section-a2 .product-list {
    gap: 0;
}
.scdn-index .section-a2 .product-list > li {
    background: #ffffff !important;
    border: 1px solid #e9eef7 !important;
    transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease, z-index 0s;
    position: relative;
}
.scdn-index .section-a2 .product-list > li:hover {
    transform: translateY(-8px);
    box-shadow: var(--scdn-shadow-strong);
    border-color: rgba(41,129,255,.35) !important;
    z-index: 5;
}

/* 推荐角标精致化 */
.scdn-index .section-a2 .product-list > li .tag span {
    background: linear-gradient(135deg, #f43f5e 0%, #fb923c 100%) !important;
    box-shadow: 0 6px 14px -4px rgba(244,63,94,.55);
    font-weight: 600;
    letter-spacing: .5px;
}

/* 套餐标题 */
.scdn-index .section-a2 .product-title h2 {
    font-size: 24px !important;
    font-weight: 700;
    background: linear-gradient(135deg, #1c1d1f 0%, #2981ff 80%);
    -webkit-background-clip: text;
            background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* 价格 - 蓝色渐变（替代原红色） */
.scdn-index .section-a2 .product-price .price {
    background: var(--scdn-grad);
    -webkit-background-clip: text;
            background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 34px !important;
}

/* 立即开通按钮 - 渐变胶囊 */
.scdn-index .section-a2 .ask-btn a {
    border-radius: 24px !important;
    font-weight: 600;
    height: 42px !important;
    line-height: 42px !important;
    border: 1px solid rgba(41,129,255,.55) !important;
    color: var(--scdn-primary) !important;
    background: rgba(41,129,255,.04) !important;
    transition: all .3s ease;
}
.scdn-index .section-a2 .product-list > li:hover .ask-btn a {
    background: var(--scdn-grad) !important;
    color: #fff !important;
    border-color: transparent !important;
    box-shadow: 0 10px 22px -8px rgba(41,129,255,.55);
}

/* 价格列表项 - 微动画 */
.scdn-index .section-a2 .price-box .price-item {
    border-bottom: 1px dashed rgba(207,217,234,.5);
    padding: 4px 0;
}
.scdn-index .section-a2 .price-box .price-item:last-child { border-bottom: none; }

/* 对勾/叉颜色升级 */
.scdn-index .product-advantage-li p.having-advantages { color: #1c1d1f !important; font-weight: 500; }
.scdn-index .product-advantage-li p.no-advantage { color: #b8c0cf !important; }

/* ===== 3. 应用场景 ===== */
.scdn-index .section-a4 .section-body {
    padding: 36px !important;
    border-radius: var(--scdn-radius);
    border: 1px solid rgba(255,255,255,.85) !important;
    background: linear-gradient(160deg, rgba(255,255,255,.95) 0%, rgba(232,243,255,.5) 100%) !important;
    box-shadow: 0 25px 60px -25px rgba(41,71,128,.25) !important;
    backdrop-filter: blur(6px);
}
.scdn-index .section-a4 .arrange-img {
    border-radius: var(--scdn-radius);
    overflow: hidden;
    background: rgba(41,129,255,.03);
}
.scdn-index .section-a4 .arrange-img img {
    transition: transform .8s ease;
}
.scdn-index .section-a4 .arrange-img:hover img { transform: scale(1.04); }

.scdn-index .section-a4 .arrange-scene {
    background: linear-gradient(160deg, rgba(255,255,255,.7) 0%, rgba(232,243,255,.5) 100%) !important;
    border: 1px solid rgba(255,255,255,.85);
    border-radius: var(--scdn-radius);
}
.scdn-index .section-a4 .content_tip {
    position: relative;
    padding-left: 18px;
    font-size: 18px !important;
    color: #1c1d1f !important;
}
.scdn-index .section-a4 .content_tip::before {
    content: "";
    position: absolute;
    left: 0; top: 50%;
    transform: translateY(-50%);
    width: 4px; height: 18px;
    background: var(--scdn-grad);
    border-radius: 2px;
}
.scdn-index .section-a4 .content_bd {
    color: #4a5468 !important;
    font-size: 14px;
    line-height: 26px !important;
}
.scdn-index .section-a4 .introduce > li {
    color: #2a3447;
    transition: transform .25s ease, color .25s ease;
}
.scdn-index .section-a4 .introduce > li:hover {
    transform: translateX(4px);
    color: var(--scdn-primary);
}

/* ===== Banner 文字 V4 · "白圈描边大蓝字" 设计方案 =====
   思路：
   - 视频是浅色调，所以采用 实蓝 + 4方向白色阴影"剪纸描边" + 深蓝立体投影
   - 不再用 background-clip:text 渐变（极易被白光晕漂白）
   - 信息层级：装饰小标签 → 主标题（强焦点）→ 副标题 → 关键技术胶囊条 → 描述 → CTA
*/

/* 给 banner-ani 加上下安全内边距，避免被透明 header 遮挡 */
.scdn-index .banner-single .banner-ani,
.scdn-index #banner .banner-ani {
    padding-top: 70px !important;
    padding-bottom: 24px !important;
    box-sizing: border-box;
    align-items: center !important;
}

/* ① 顶部胶囊小标签（精简版） */
.scdn-index .scdn-banner-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 14px;
    margin-bottom: 12px;
    background: rgba(255, 255, 255, .65);
    border: 1px solid rgba(41, 129, 255, .35);
    border-radius: 22px;
    font-size: 11px;
    font-weight: 700;
    color: #1d4ed8;
    letter-spacing: 2px;
    text-transform: uppercase;
    backdrop-filter: blur(10px) saturate(160%);
    -webkit-backdrop-filter: blur(10px) saturate(160%);
    box-shadow: 0 6px 18px -8px rgba(41, 129, 255, .4);
    animation: scdn-fadeInDown .8s ease both;
    line-height: 1.4;
}
.scdn-index .scdn-banner-tag::before {
    content: "";
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #2981ff;
    box-shadow: 0 0 10px #2981ff, 0 0 20px rgba(41, 129, 255, .5);
    animation: scdn-blink 1.6s ease-in-out infinite;
}
@keyframes scdn-blink {
    0%, 100% { opacity: 1; transform: scale(1); }
    50%      { opacity: .55; transform: scale(.75); }
}
@keyframes scdn-fadeInDown {
    from { opacity: 0; transform: translateY(-12px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* 清理 H2 默认间距，让自定义 span 自由排布 */
.scdn-index .banner-info h2 {
    margin: 0 0 14px 0 !important;
    line-height: 1 !important;
    background: none !important;
    color: inherit !important;
    text-shadow: none !important;
    -webkit-text-fill-color: initial !important;
    font-weight: normal !important;
    font-size: inherit !important;
}

/* ② 主标题（精简版）：实蓝色 + 白色描边 */
.scdn-index .scdn-h2-main {
    display: block;
    font-size: 48px;
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: 1.2px;
    background: none !important;
    -webkit-background-clip: initial !important;
            background-clip: initial !important;
    -webkit-text-fill-color: #2563eb !important;
    color: #2563eb;
    text-shadow:
        -1px -1px 0 rgba(255, 255, 255, .95),
         1px -1px 0 rgba(255, 255, 255, .95),
        -1px  1px 0 rgba(255, 255, 255, .95),
         1px  1px 0 rgba(255, 255, 255, .95),
         0  4px 14px rgba(30, 64, 175, .38),
         0  8px 24px rgba(30, 64, 175, .2);
    margin-bottom: 10px;
    animation: scdn-fadeUpBig 1s .15s ease both;
}

/* ③ 副标题（精简版） */
.scdn-index .scdn-h2-sub {
    position: relative;
    display: inline-block;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
    color: #0f2350;
    padding: 0 3px 3px;
    letter-spacing: .8px;
    text-shadow:
        -1px -1px 0 rgba(255, 255, 255, .85),
         1px -1px 0 rgba(255, 255, 255, .85),
        -1px  1px 0 rgba(255, 255, 255, .85),
         1px  1px 0 rgba(255, 255, 255, .85),
         0  2px 8px rgba(15, 32, 68, .22);
    animation: scdn-fadeUpBig 1s .3s ease both;
    z-index: 1;
}
.scdn-index .scdn-h2-sub::before {
    content: "";
    position: absolute;
    left: 0; right: 0;
    bottom: 1px;
    height: 7px;
    background: linear-gradient(90deg, rgba(41, 129, 255, .42) 0%, rgba(34, 211, 238, .28) 60%, transparent 100%);
    border-radius: 2px;
    z-index: -1;
    transform-origin: left;
    animation: scdn-highlight 1s .6s cubic-bezier(.3, .8, .3, 1) both;
}
@keyframes scdn-fadeUpBig {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes scdn-highlight {
    from { transform: scaleX(0); }
    to   { transform: scaleX(1); }
}

/* ④ 关键技术胶囊条（精简版）：4 个白底胶囊 */
.scdn-index .scdn-feature-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 14px 0 0 !important;
    padding: 0 !important;
    list-style: none !important;
    animation: scdn-fadeUpBig 1s .42s ease both;
}
.scdn-index .scdn-feature-tags li {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    background: rgba(255, 255, 255, .85);
    border: 1px solid rgba(41, 129, 255, .25);
    border-radius: 18px;
    font-size: 12px;
    font-weight: 600;
    color: #1d4ed8;
    letter-spacing: .3px;
    line-height: 1.4;
    box-shadow: 0 4px 12px -6px rgba(41, 129, 255, .25);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: all .25s ease;
    cursor: default;
}
.scdn-index .scdn-feature-tags li::before {
    content: "";
    width: 5px; height: 5px;
    border-radius: 50%;
    background: linear-gradient(135deg, #2981ff, #22d3ee);
    box-shadow: 0 0 6px rgba(41, 129, 255, .6);
}
.scdn-index .scdn-feature-tags li:hover {
    transform: translateY(-2px);
    background: rgba(255, 255, 255, 1);
    border-color: rgba(41, 129, 255, .55);
    box-shadow: 0 10px 22px -8px rgba(41, 129, 255, .45);
    color: #1e3a8a;
}

/* 描述段落（精简版） */
.scdn-index .banner-info p {
    color: #1f2c44 !important;
    font-weight: 500;
    font-size: 13px !important;
    line-height: 22px !important;
    margin: 14px 0 16px !important;
    text-shadow: 0 1px 6px rgba(255, 255, 255, .9), 0 0 14px rgba(255, 255, 255, .55);
    animation: scdn-fadeUpBig 1s .55s ease both;
    /* 限制描述段最多 2 行，避免超出 banner */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* CTA 按钮（精简版） */
.scdn-index .banner-info .n-btn-default.active {
    background: var(--scdn-grad) !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, .3) !important;
    border-radius: 24px !important;
    padding: 0 26px !important;
    height: 42px !important;
    line-height: 42px !important;
    font-weight: 600;
    font-size: 14px !important;
    letter-spacing: 1px;
    box-shadow: 0 12px 26px -8px rgba(41, 129, 255, .55);
    transition: all .35s cubic-bezier(.2, .7, .2, 1);
    animation: scdn-fadeUpBig 1s .7s ease both;
    position: relative;
    overflow: hidden;
}
.scdn-index .banner-info .n-btn-default.active::after {
    content: "→";
    margin-left: 10px;
    display: inline-block;
    transition: transform .35s ease;
}
.scdn-index .banner-info .n-btn-default.active:hover {
    transform: translateY(-3px);
    box-shadow: 0 22px 44px -10px rgba(41, 129, 255, .7), 0 0 32px rgba(34, 211, 238, .4);
    background: linear-gradient(135deg, #3a8eff 0%, #2dddee 100%) !important;
}
.scdn-index .banner-info .n-btn-default.active:hover::after { transform: translateX(6px); }

/* ===== 滚动揭示动画 ===== */
.scdn-index .product-advantage > li,
.scdn-index .section-a2 .product-list > li,
.scdn-index .section-a4 .section-body {
    opacity: 0;
    transform: translateY(24px);
    animation: scdn-fadeUp .8s ease forwards;
}
.scdn-index .product-advantage > li:nth-child(1) { animation-delay: .05s; }
.scdn-index .product-advantage > li:nth-child(2) { animation-delay: .12s; }
.scdn-index .product-advantage > li:nth-child(3) { animation-delay: .19s; }
.scdn-index .product-advantage > li:nth-child(4) { animation-delay: .26s; }
.scdn-index .product-advantage > li:nth-child(5) { animation-delay: .33s; }
.scdn-index .product-advantage > li:nth-child(6) { animation-delay: .4s; }
.scdn-index .section-a2 .product-list > li:nth-child(1) { animation-delay: .05s; }
.scdn-index .section-a2 .product-list > li:nth-child(2) { animation-delay: .12s; }
.scdn-index .section-a2 .product-list > li:nth-child(3) { animation-delay: .19s; }
.scdn-index .section-a2 .product-list > li:nth-child(4) { animation-delay: .26s; }
.scdn-index .section-a2 .product-list > li:nth-child(5) { animation-delay: .33s; }
@keyframes scdn-fadeUp {
    to { opacity: 1; transform: translateY(0); }
}

/* ===== 响应式调优 ===== */
@media screen and (max-width: 1440px) {
    .scdn-index .section-header h1,
    .scdn-index .section-header h3 { font-size: 30px !important; }
    .scdn-index .scdn-h2-main { font-size: 42px; }
    .scdn-index .scdn-h2-sub  { font-size: 18px; }
}

@media screen and (max-width: 1023px) {
    .scdn-index .section-header h1,
    .scdn-index .section-header h3 { font-size: 22px !important; }
    .scdn-index .section-header h1::after,
    .scdn-index .section-header h3::after { width: 40px; height: 3px; margin-top: 12px; }
    .scdn-index .section-a1,
    .scdn-index .section-a2,
    .scdn-index .section-a4 { padding: 40px 0 !important; }
    .scdn-index .product-advantage > li { width: 100% !important; padding: 24px 18px !important; }
    .scdn-index .menu-tab li a { padding: 14px 16px; font-size: 14px; }
    .scdn-index .section-a4 .section-body { padding: 18px !important; }
    /* Banner 文字移动端缩放 */
    .scdn-index .scdn-banner-tag { font-size: 11px; padding: 4px 12px; margin-bottom: 12px; }
    .scdn-index .scdn-h2-main { font-size: 26px; letter-spacing: 0.5px; }
    .scdn-index .scdn-h2-sub  { font-size: 16px; }
    .scdn-index .scdn-h2-sub::before { height: 8px; bottom: 2px; }
    .scdn-index .scdn-feature-tags { gap: 6px; margin-top: 14px !important; }
    .scdn-index .scdn-feature-tags li { font-size: 11px; padding: 4px 10px; }
    .scdn-index .banner-info p { font-size: 13px !important; line-height: 22px !important; }
    .scdn-index .banner-info .n-btn-default.active {
        height: 36px !important; line-height: 36px !important;
        padding: 0 22px !important; font-size: 13px !important;
    }
}

@supports not (backdrop-filter: blur(6px)) {
    .scdn-index .product-advantage > li,
    .scdn-index .section-a4 .section-body { background: #ffffff !important; }
}
