/* =============================================================
   首页样式 - PC 端  ·  EyouCMS 模板
   全部 eyou 标签保持原样，本文件只负责视觉与交互
   ============================================================= */

/* ---------- 1. 变量与基础 ---------- */
:root{
    --home-blue:#2B78F6;
    --home-blue-2:#0A56C9;
    --home-cyan:#22D0FF;
    --home-deep:#061C47;
    --home-deep-2:#0A2A6E;
    --home-text:#0F1A36;
    --home-text-2:#253554;
    --home-muted:#6E7A92;
    --home-bg:#F6F9FF;
    --home-card:rgba(255,255,255,.92);
    --home-radius:20px;
    --home-radius-lg:28px;
    --home-shadow:0 18px 48px rgba(28,68,156,.12);
    --home-shadow-lg:0 30px 80px rgba(20,60,140,.18);
    --home-grad:linear-gradient(135deg,var(--home-blue),var(--home-cyan));
    --home-glow:0 0 22px rgba(34,208,255,.55);
    --home-pad-x:clamp(16px,3vw,40px);
}

/* 防横向滚动 */
body.page-home{
    overflow-x:hidden;
    background:var(--home-bg);
    color:var(--home-text-2);
}

/* 覆盖 common.css 中 body * { flex-shrink:0 } 对首页布局的破坏 */
body.page-home .justify-between,
body.page-home .justify-around,
body.page-home .justify-left,
body.page-home .justify-center,
body.page-home .align-center{
    min-width:0;
}
body.page-home .justify-between > *,
body.page-home .justify-around > *,
body.page-home .justify-left > *,
body.page-home .justify-center > *{
    min-width:0;
    flex-shrink:1;
}
body.page-home .logo,
body.page-home .logo img,
body.page-home .head_lang{
    flex-shrink:0;
}

/* 主容器 */
.m12{
    width:100%;
    max-width:1400px;
    margin-left:auto;
    margin-right:auto;
    padding-left:var(--home-pad-x);
    padding-right:var(--home-pad-x);
    box-sizing:border-box;
}

/* 通用标题 */
.mod1_tt{
    position:relative;
    display:block;
    margin:0 auto;
    padding-top:84px;
    color:var(--home-text);
    text-align:center;
    font-family:Microsoft YaHei UI,Microsoft YaHei,PingFang SC,sans-serif;
    font-size:clamp(28px,2.4vw,40px);
    font-weight:700;
    line-height:1.25;
    letter-spacing:.5px;
}
.mod1_tt::after{
    content:"";
    display:block;
    width:64px;
    height:4px;
    margin:18px auto 0;
    border-radius:999px;
    background:var(--home-grad);
    box-shadow:var(--home-glow);
}
.mod1_ftt{
    max-width:880px;
    margin:18px auto 0;
    padding:0 16px;
    color:var(--home-muted);
    text-align:center;
    font-family:PingFang SC,Microsoft YaHei,sans-serif;
    font-size:15px;
    line-height:1.8;
}

/* =============================================================
   2. Banner 首屏
   ============================================================= */
.banner{
    position:relative;
    width:100%;
    padding-bottom:38px;
    overflow:hidden;
    background:
        radial-gradient(circle at 78% 22%,rgba(120,200,255,.38),transparent 42%),
        radial-gradient(circle at 8% 80%,rgba(80,150,255,.32),transparent 46%),
        linear-gradient(135deg,#1a3a7a 0%,#2563d8 45%,#1b5fc7 100%);
}
.banner::before{
    content:"";
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);
    background-size:56px 56px;
    -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,.04));
    mask-image:linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,.04));
    pointer-events:none;
    z-index:1;
}
.banner::after{
    content:"";
    position:absolute;
    right:max(8px,3vw);
    top:90px;
    width:min(540px,42vw);
    height:min(540px,42vw);
    border-radius:50%;
    background:radial-gradient(circle,rgba(140,220,255,.55),rgba(80,150,255,.18) 42%,transparent 70%);
    filter:blur(2px);
    animation:homePulse 6s ease-in-out infinite;
    pointer-events:none;
    z-index:1;
}

/* swiper */
.banner .swiper-wrapper{
    position:relative;
    z-index:2;
    height:clamp(520px,42vw,720px);
}
.banner .swiper-slide{
    position:relative;
    height:100%;
    background-size:cover !important;
    background-position:center !important;
    overflow:hidden;
}
.banner .swiper-slide::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,rgba(16,44,102,.5) 0%,rgba(30,80,170,.18) 50%,rgba(60,120,200,.05) 100%);
    pointer-events:none;
    z-index:0;
}

/* slide 内容 */
.ban_cont1,
.ban_cont3{
    position:relative;
    z-index:1;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:32px;
    padding-top:clamp(80px,7vw,128px);
    padding-bottom:120px;
    color:#fff;
    flex-wrap:wrap;
}
.ban_cont1_left{
    flex:1 1 420px;
    min-width:0;
    max-width:720px;
}
.ban_cont1 > img,
.ban_cont3 > img{
    flex:0 1 auto;
    max-width:min(48vw,560px);
    height:auto;
    object-fit:contain;
    filter:drop-shadow(0 26px 60px rgba(8,28,82,.32));
    animation:homeFloat 6s ease-in-out infinite;
}

/* 顶部小标签 */
.ban_cont1_left::before{
    content:"SECURITY · CLOUD";
    display:block;
    width:max-content;
    margin-bottom:20px;
    padding:7px 16px;
    border:1px solid rgba(34,208,255,.4);
    border-radius:999px;
    background:rgba(34,208,255,.10);
    box-shadow:inset 0 0 18px rgba(34,208,255,.08),0 0 26px rgba(34,208,255,.12);
    color:rgba(214,246,255,.92);
    font-family:Arial,sans-serif;
    font-size:12px;
    line-height:1;
    letter-spacing:2px;
}

.ban_title{
    display:block;
    color:#fff;
    font-family:Microsoft YaHei UI,Microsoft YaHei,sans-serif;
    font-size:clamp(40px,3.6vw,68px);
    font-weight:700;
    line-height:1.18;
    letter-spacing:-.5px;
    text-shadow:0 12px 36px rgba(0,42,120,.4),0 0 28px rgba(34,208,255,.32);
}
.ban_title::after{
    content:"";
    display:block;
    width:88px;
    height:4px;
    margin-top:22px;
    border-radius:999px;
    background:linear-gradient(90deg,var(--home-cyan),rgba(255,255,255,.12));
    box-shadow:0 0 22px rgba(34,208,255,.72);
}
.ban_left_p{
    margin-top:22px;
    max-width:600px;
    color:rgba(255,255,255,.82);
    font-family:PingFang SC,Microsoft YaHei,sans-serif;
    font-size:clamp(15px,1vw,18px);
    line-height:1.78;
}
.ban_btnbox{
    margin-top:32px;
    display:flex;
    flex-wrap:wrap;
    gap:14px;
}
.btn_public{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:11px 32px;
    border-radius:999px;
    font-family:PingFang SC,Microsoft YaHei,sans-serif;
    font-size:14px;
    line-height:1.2;
    transition:transform .24s ease,box-shadow .24s ease,background .24s ease,color .24s ease;
    cursor:pointer;
}
.btn_public:hover{ transform:translateY(-3px); }
.btn_public:first-child{ margin-right:0; }
.ban_btn1,
.ban_btn3{
    color:#fff;
    background:var(--home-grad);
    border:1px solid rgba(34,208,255,.5);
    box-shadow:0 14px 32px rgba(34,208,255,.32);
}
.ban_btn1:hover,
.ban_btn3:hover{
    box-shadow:0 18px 40px rgba(34,208,255,.45);
}
.ban_btn2,
.ban_btn4{
    color:#fff;
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.42);
    backdrop-filter:blur(14px);
}
.ban_btn2:hover,
.ban_btn4:hover{
    background:rgba(255,255,255,.22);
    box-shadow:0 14px 32px rgba(255,255,255,.14);
}

/* 分页器 */
.banner .swiper-pagination{
    position:absolute;
    bottom:24px !important;
    z-index:5;
}
.my-bullet{
    display:inline-block;
    width:36px;
    height:5px;
    margin:0 6px;
    border-radius:99px;
    background:rgba(255,255,255,.45);
    cursor:pointer;
    transition:width .25s ease,opacity .25s ease,background .25s ease;
}
.my-bullet-active{
    width:62px;
    background:linear-gradient(90deg,var(--home-cyan),#fff);
    box-shadow:0 0 18px rgba(34,208,255,.7);
}

/* 首屏底部能力栏 - 文档流占位，确保不会被裁切 */
.ban_f_box{
    position:relative;
    z-index:3;
    width:100%;
    max-width:1400px;
    margin:-72px auto 0;
    padding:18px 24px;
    border:1px solid rgba(255,255,255,.26);
    border-radius:22px;
    background:rgba(8,28,72,.42);
    box-shadow:0 24px 60px rgba(0,24,70,.28);
    backdrop-filter:blur(22px);
    box-sizing:border-box;
}
.ban_foot{
    display:flex;
    flex-wrap:wrap;
    gap:20px;
    width:100%;
}
.ban_f_list{
    flex:1 1 220px;
    min-width:0;
    padding:18px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:16px;
    background:rgba(255,255,255,.06);
    transition:transform .25s ease,background .25s ease,border-color .25s ease;
}
.ban_f_list:hover{
    transform:translateY(-4px);
    border-color:rgba(34,208,255,.5);
    background:rgba(255,255,255,.12);
}
.ban_f_title{
    display:flex;
    align-items:center;
    gap:10px;
    color:#fff;
    font-family:Microsoft YaHei UI,Microsoft YaHei,sans-serif;
    font-size:16px;
    font-weight:700;
    line-height:1.4;
}
.ban_f_title svg{
    width:24px;
    height:24px;
    flex-shrink:0;
    filter:drop-shadow(0 0 8px rgba(34,208,255,.55));
}
.ban_f_cont{
    margin-top:8px;
    color:rgba(255,255,255,.72);
    font-family:PingFang SC,Microsoft YaHei,sans-serif;
    font-size:13px;
    line-height:1.65;
}
.ban_f_list_white .ban_f_title,
.ban_f_list_white .ban_f_cont{ color:#fff; }

/* =============================================================
   3. Module 1 - 产品 Tab 卡片
   ============================================================= */
.mod1_box{
    position:relative;
    padding:0 0 100px;
    background:
        radial-gradient(circle at 12% 12%,rgba(34,208,255,.12),transparent 32%),
        radial-gradient(circle at 88% 92%,rgba(43,120,246,.10),transparent 36%),
        linear-gradient(180deg,#F8FBFF 0%,#FFFFFF 60%,#F4F9FF 100%);
    overflow:hidden;
}
.mod1{ position:relative; text-align:center; }

/* Tab 切换器 */
.mod1_tabtt{
    display:inline-flex;
    margin-top:42px;
    padding:8px;
    height:auto;
    border:1px solid rgba(43,120,246,.16);
    border-radius:999px;
    background:rgba(255,255,255,.85);
    box-shadow:0 18px 40px rgba(43,120,246,.12);
    backdrop-filter:blur(16px);
    gap:6px;
}
.mod1_tab_a{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    height:42px;
    padding:0 28px;
    border-radius:999px;
    color:var(--home-text-2);
    font-family:Microsoft YaHei,PingFang SC,sans-serif;
    font-size:15px;
    font-weight:600;
    line-height:1;
    box-shadow:none;
    transition:color .24s ease;
    z-index:1;
}
.mod1_tabtt .mdui-tab-active{
    color:#fff;
    z-index:2;
}
.mod1_tabtt .mdui-tab-indicator{
    height:42px;
    bottom:8px;
    border-radius:999px;
    background:var(--home-grad);
    box-shadow:0 10px 24px rgba(43,120,246,.32);
    z-index:1;
}

/* 卡片容器 */
.mod1_tabcont{ margin-top:56px; }
.mod1_contbox{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-items:stretch;
    gap:20px;
}

/* 单个产品卡 */
.mod1_contlist,
#mod1_cont3 .mod1_contlist{
    position:relative;
    width:calc((100% - 80px) / 5);
    min-width:0;
    max-width:280px;
    padding:0;
    border:1px solid rgba(43,120,246,.12);
    border-radius:var(--home-radius);
    background:#fff;
    box-shadow:0 18px 40px rgba(28,68,156,.10);
    overflow:hidden;
    transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
    display:flex;
    flex-direction:column;
}
.mod1_contlist::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:4px;
    background:var(--home-grad);
    opacity:.85;
    z-index:2;
}
.mod1_contlist::after{
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(circle at 100% 0%,rgba(34,208,255,.16),transparent 38%);
    opacity:0;
    transition:opacity .3s ease;
    pointer-events:none;
}
.mod1_contlist:hover{
    transform:translateY(-10px);
    border-color:rgba(34,208,255,.55);
    box-shadow:0 28px 60px rgba(43,120,246,.22);
}
.mod1_contlist:hover::after{ opacity:1; }

/* 卡片标题 */
.mod1_contlist .mod1_cont_tt{
    position:relative;
    padding:26px 24px 20px;
    background:linear-gradient(180deg,#EDF5FF 0%,rgba(255,255,255,0) 100%);
}
.mod1_contlist .mod1_cont_tt div:first-child{
    position:relative;
    padding-left:14px;
    color:var(--home-text);
    font-family:Microsoft YaHei UI,Microsoft YaHei,sans-serif;
    font-size:18px;
    font-weight:700;
    line-height:1.4;
    text-align:left;
}
.mod1_contlist .mod1_cont_tt div:first-child::before{
    content:"";
    position:absolute;
    left:0;
    top:50%;
    width:4px;
    height:18px;
    border-radius:999px;
    background:var(--home-grad);
    box-shadow:0 0 12px rgba(34,208,255,.5);
    transform:translateY(-50%);
}

/* 规格列表 */
.mod1_contlist .mod1_cont_ft{
    flex:1;
    display:flex;
    flex-direction:column;
    padding:6px 0 22px;
}
.mod1_contlist .mod1_cont_ft ul{
    flex:1;
    padding:0 22px;
    text-align:left;
    margin:0;
}
.mod1_contlist .mod1_cont_ft ul li{
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-bottom:10px;
    padding-bottom:10px;
    border-bottom:1px dashed rgba(43,120,246,.10);
}
.mod1_contlist .mod1_cont_ft ul li:last-child{
    margin-bottom:0;
    padding-bottom:0;
    border-bottom:none;
}
.mod1_contlist .mod1_cont_ft ul li span:first-child{
    flex:0 0 auto;
    min-width:72px;
    color:var(--home-muted);
    font-family:PingFang SC,Microsoft YaHei,sans-serif;
    font-size:13px;
    line-height:1.6;
}
.mod1_contlist .mod1_cont_ft ul li span:last-child{
    flex:1 1 0;
    min-width:0;
    color:var(--home-text);
    font-family:PingFang SC,Microsoft YaHei,sans-serif;
    font-size:13px;
    font-weight:500;
    line-height:1.6;
    word-break:break-word;
    text-align:right;
}

#mod1_cont3 .mod1_contlist .mod1_cont_ft ul li span:first-child{
    min-width:84px;
}

/* 底部价格与按钮 */
.mod1_cont_btnbox{
    margin-top:20px;
    padding:0 22px;
    text-align:center;
}
.mod1_cont_money{
    display:flex;
    align-items:baseline;
    justify-content:flex-start;
    gap:2px;
    color:var(--home-muted);
    font-family:PingFang SC,Microsoft YaHei,sans-serif;
    font-size:12px;
    font-weight:500;
}
.mod1_cont_money span:nth-child(2){
    background:var(--home-grad);
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
    font-family:Microsoft YaHei,sans-serif;
    font-size:30px;
    font-weight:700;
    line-height:1;
    margin:0 2px;
}
.mod1_btn_buy{
    display:block;
    margin-top:14px;
    padding:10px 16px;
    border-radius:999px;
    border:1px solid var(--home-blue);
    background:transparent;
    color:var(--home-blue);
    text-align:center;
    font-family:PingFang SC,Microsoft YaHei,sans-serif;
    font-size:14px;
    font-weight:500;
    transition:transform .24s ease,box-shadow .24s ease,background .24s ease,color .24s ease;
}
.mod1_btn_buy:hover,
.mod1_contlist_active .mod1_btn_buy{
    background:var(--home-grad);
    border-color:transparent;
    color:#fff;
    box-shadow:0 14px 28px rgba(43,120,246,.28);
}
.mod1_contlist_active{ border-color:rgba(34,208,255,.55); }
.mod1_contlist_active .mod1_cont_tt div:first-child{ color:var(--home-blue); }

/* =============================================================
   4. Module 2 - 能力中枢（深色仪表盘风格）
   ============================================================= */
.mod2_box{
    position:relative;
    padding:0 0 110px;
    background:
        radial-gradient(circle at 15% 18%,rgba(34,208,255,.16),transparent 32%),
        radial-gradient(circle at 86% 12%,rgba(43,120,246,.18),transparent 34%),
        linear-gradient(180deg,#F5FAFF 0%,#ECF5FF 50%,#F8FBFF 100%);
    overflow:hidden;
}
.mod2_svg{ display:none; }

.mod2_index3{ position:relative; z-index:2; }

/* Tab 卡片 */
.mod2_tabbox{
    position:relative;
    z-index:3;
    width:min(960px,calc(100vw - 32px));
    margin:42px auto 0 !important;
    padding:0;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:18px;
    height:auto;
    max-height:none;
}
.mod2_box .mdui-tab,
.mod2_box .mdui-tab a{
    height:auto;
    max-height:none;
}
.mod2_box .mdui-tab a{
    position:relative;
    flex:1 1 200px;
    min-width:160px;
    max-width:280px;
    width:auto;
    padding:24px 18px 22px;
    border:1px solid rgba(43,120,246,.14);
    border-radius:20px;
    background:rgba(255,255,255,.75);
    box-shadow:0 14px 36px rgba(43,120,246,.10);
    backdrop-filter:blur(14px);
    text-align:center;
    transition:transform .24s ease,background .24s ease,box-shadow .24s ease,border-color .24s ease;
    overflow:hidden;
}
.mod2_box .mdui-tab a::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,rgba(34,208,255,.16),transparent 50%);
    opacity:0;
    transition:opacity .24s ease;
    pointer-events:none;
}
.mod2_box .mdui-tab a::after{
    content:"";
    position:absolute;
    left:50%;
    bottom:14px;
    width:28px;
    height:3px;
    border-radius:999px;
    background:rgba(43,120,246,.18);
    transform:translateX(-50%);
    transition:width .24s ease,background .24s ease,box-shadow .24s ease;
}
.mod2_box .mdui-tab a:hover,
.mod2_box .mdui-tab .mdui-tab-active{
    transform:translateY(-6px);
    border-color:rgba(34,208,255,.5);
    background:#fff;
    box-shadow:0 22px 50px rgba(43,120,246,.18);
}
.mod2_box .mdui-tab a:hover::before,
.mod2_box .mdui-tab .mdui-tab-active::before{ opacity:1; }
.mod2_box .mdui-tab a:hover::after,
.mod2_box .mdui-tab .mdui-tab-active::after{
    width:50px;
    background:var(--home-grad);
    box-shadow:0 0 14px rgba(34,208,255,.6);
}
.mod2_box .mdui-tab a img{
    position:relative;
    z-index:1;
    width:56px;
    height:56px;
    object-fit:contain;
    filter:drop-shadow(0 10px 20px rgba(43,120,246,.22));
}
.mod2_box .mdui-tab a label{
    position:relative;
    z-index:1;
    display:block;
    margin-top:12px;
    color:var(--home-text-2);
    font-family:PingFang SC,Microsoft YaHei,sans-serif;
    font-size:15px;
    font-weight:700;
    line-height:1.4;
}
.mod2_box .mdui-tab .mdui-tab-active label{ color:var(--home-blue); }
.mod2_box .mdui-tab .mdui-tab-indicator{ display:none; }

/* 内容深色面板 */
.mod2_tab_cont{
    position:relative;
    z-index:2;
    width:min(1120px,calc(100vw - 32px));
    max-width:100%;
    margin:42px auto 0;
    padding:48px clamp(24px,3vw,56px);
    border:1px solid rgba(255,255,255,.16);
    border-radius:var(--home-radius-lg);
    color:#fff;
    background:
        radial-gradient(circle at 90% 12%,rgba(34,208,255,.32),transparent 30%),
        radial-gradient(circle at 6% 90%,rgba(43,120,246,.32),transparent 38%),
        linear-gradient(135deg,rgba(5,19,54,.97),rgba(7,54,132,.94) 60%,rgba(3,25,72,.96));
    box-shadow:0 30px 70px rgba(4,35,95,.22);
    box-sizing:border-box;
    overflow:hidden;
}
.mod2_tab_cont::before{
    content:"";
    position:absolute;
    right:-120px;
    top:-130px;
    width:340px;
    height:340px;
    border-radius:50%;
    border:1px solid rgba(34,208,255,.24);
    background:radial-gradient(circle,rgba(34,208,255,.18),transparent 62%);
    pointer-events:none;
}
.mod2_tab_cont::after{
    content:"DEFENSE CENTER";
    position:absolute;
    right:36px;
    top:30px;
    color:rgba(255,255,255,.12);
    font-family:Arial,sans-serif;
    font-size:24px;
    font-weight:800;
    letter-spacing:4px;
    pointer-events:none;
}

/* 隐藏旧大图 */
.mod2_tab_cont .mod2_tabimg{ display:none; }

/* 内容区 - 网格 */
.mod2_textbox{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:1fr 280px;
    gap:36px;
    width:100%;
    text-align:left;
}
.mod2_textbox::before{
    content:"AI 云安全中枢\A 实时识别 · 智能调度 · 全链路联动";
    grid-column:1 / -1;
    grid-row:1;
    white-space:pre-line;
    display:block;
    padding:18px 22px;
    margin-bottom:6px;
    border-left:3px solid var(--home-cyan);
    color:rgba(228,250,255,.96);
    background:rgba(255,255,255,.05);
    border-radius:14px;
    font-family:Microsoft YaHei UI,Microsoft YaHei,sans-serif;
    font-size:16px;
    font-weight:500;
    line-height:1.65;
}

/* 能力清单 */
.mod2_textbox ul{
    grid-column:1;
    width:auto;
    max-width:100%;
    margin:0;
    padding:0;
}
.mod2_textbox ul li{
    position:relative;
    display:flex;
    align-items:center;
    margin-bottom:14px;
    padding:16px 20px 16px 54px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:14px;
    color:rgba(255,255,255,.92);
    background:linear-gradient(90deg,rgba(34,208,255,.08),rgba(255,255,255,.04));
    font-family:Microsoft YaHei,PingFang SC,sans-serif;
    font-size:15px;
    font-weight:400;
    line-height:1.55;
    transition:transform .25s ease,border-color .25s ease,background .25s ease;
}
.mod2_textbox ul li:hover{
    transform:translateX(6px);
    border-color:rgba(34,208,255,.42);
    background:linear-gradient(90deg,rgba(34,208,255,.18),rgba(255,255,255,.08));
}
.mod2_textbox ul li img{
    position:absolute;
    left:20px;
    top:50%;
    width:18px;
    height:18px;
    margin:0;
    transform:translateY(-50%);
    filter:drop-shadow(0 0 8px rgba(34,208,255,.6));
}

/* 右侧指标卡 */
.mod2_textbox::after{
    content:"99.95%\A 攻击识别率\A \A < 5ms\A 策略响应\A \A 24/7\A 全时监测";
    grid-column:2;
    grid-row:2;
    white-space:pre-line;
    align-self:start;
    padding:24px 22px;
    border:1px solid rgba(34,208,255,.28);
    border-radius:18px;
    background:
        radial-gradient(circle at 50% 14%,rgba(34,208,255,.22),transparent 40%),
        rgba(255,255,255,.06);
    color:rgba(255,255,255,.86);
    font-family:Microsoft YaHei UI,Microsoft YaHei,sans-serif;
    font-size:14px;
    line-height:1.5;
    text-align:center;
    box-shadow:inset 0 0 26px rgba(34,208,255,.10);
}

/* 按钮区 */
.mod2_btnbox{
    grid-column:1;
    margin-top:8px;
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    width:100%;
}
.mod2_btnbox .mod2_btn1,
.mod2_btnbox .mod2_btn2{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:11px 30px;
    border-radius:999px;
    font-family:PingFang SC,Microsoft YaHei,sans-serif;
    font-size:14px;
    font-weight:500;
    transition:transform .22s ease,box-shadow .22s ease,background .22s ease;
    cursor:pointer;
}
.mod2_btnbox .mod2_btn1{
    color:#fff;
    background:var(--home-grad);
    box-shadow:0 14px 30px rgba(34,208,255,.32);
}
.mod2_btnbox .mod2_btn2{
    color:#fff;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.34);
}
.mod2_btnbox .mod2_btn1:hover,
.mod2_btnbox .mod2_btn2:hover{ transform:translateY(-3px); }

/* =============================================================
   5. Module 3 - 数据洞察
   ============================================================= */
.mod3_box{
    position:relative;
    width:100%;
    background:
        radial-gradient(circle at 50% 40%,rgba(34,208,255,.22),transparent 28%),
        linear-gradient(180deg,#EAF6FF 0%,#DDEFFF 100%);
    overflow:hidden;
}
.mod3_top{
    position:relative;
    padding-bottom:78px;
    background:
        radial-gradient(circle at 12% 90%,rgba(34,208,255,.18),transparent 40%),
        radial-gradient(circle at 88% 0%,rgba(255,255,255,.10),transparent 38%),
        linear-gradient(135deg,#061B45 0%,#0A4DBF 55%,#0AB9E0 130%);
    overflow:hidden;
}
.mod3_top::before{
    content:"";
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
    background-size:40px 40px;
    -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.04));
    mask-image:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.04));
    opacity:.7;
    pointer-events:none;
}
.mod3_top::after{
    content:"";
    position:absolute;
    left:50%;
    top:42%;
    width:60vw;
    max-width:880px;
    height:60vw;
    max-height:880px;
    transform:translate(-50%,-50%);
    border-radius:50%;
    background:
        radial-gradient(circle,transparent 40%,rgba(34,208,255,.08) 41%,transparent 42%),
        radial-gradient(circle,transparent 56%,rgba(34,208,255,.12) 57%,transparent 58%),
        radial-gradient(circle,transparent 72%,rgba(34,208,255,.18) 73%,transparent 74%);
    animation:homeSpin 26s linear infinite;
    pointer-events:none;
    z-index:0;
}

/* 数据洞察：节点点亮 + 连线 + 扫描光带 */
.mod3_nodes{
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;
    overflow:hidden;
}
.mod3_lines{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    opacity:.55;
    filter:drop-shadow(0 0 6px rgba(34,208,255,.45));
}
.mod3_lines line{
    stroke-dasharray:280;
    stroke-dashoffset:280;
    animation:nodeLineDraw 4.5s ease-in-out infinite;
}
.mod3_lines line:nth-child(2){ animation-delay:.4s; }
.mod3_lines line:nth-child(3){ animation-delay:.8s; }
.mod3_lines line:nth-child(4){ animation-delay:1.2s; }
.mod3_lines line:nth-child(5){ animation-delay:1.6s; }
.mod3_lines line:nth-child(6){ animation-delay:2.0s; }
.mod3_lines line:nth-child(7){ animation-delay:2.4s; }
.mod3_lines line:nth-child(8){ animation-delay:.6s; }
.mod3_lines line:nth-child(9){ animation-delay:1.0s; }
.mod3_lines line:nth-child(10){ animation-delay:1.4s; }
.mod3_lines line:nth-child(11){ animation-delay:1.8s; }

.mod3_node{
    position:absolute;
    left:var(--x);
    top:var(--y);
    width:8px;
    height:8px;
    margin:-4px 0 0 -4px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 0 10px rgba(255,255,255,.6),0 0 24px rgba(34,208,255,.8);
    opacity:.35;
    animation:nodeLight 4.5s ease-in-out infinite;
    animation-delay:var(--d,0s);
}
.mod3_node--lg{
    width:12px;
    height:12px;
    margin:-6px 0 0 -6px;
}
.mod3_node::before{
    content:"";
    position:absolute;
    inset:-6px;
    border-radius:50%;
    border:1.5px solid rgba(34,208,255,.55);
    opacity:0;
    animation:nodeHalo 4.5s ease-in-out infinite;
    animation-delay:var(--d,0s);
}
.mod3_node::after{
    content:"";
    position:absolute;
    inset:-14px;
    border-radius:50%;
    border:1px solid rgba(34,208,255,.32);
    opacity:0;
    animation:nodeHalo 4.5s ease-in-out infinite;
    animation-delay:calc(var(--d,0s) + .25s);
}

/* 扫描光带 */
.mod3_scan{
    position:absolute;
    left:-30%;
    top:0;
    width:30%;
    height:100%;
    background:linear-gradient(90deg,
        transparent 0%,
        rgba(34,208,255,.0) 30%,
        rgba(34,208,255,.18) 50%,
        rgba(34,208,255,.0) 70%,
        transparent 100%);
    filter:blur(2px);
    animation:nodeScan 8s ease-in-out infinite;
    pointer-events:none;
}

@keyframes nodeLight{
    0%,100%{ opacity:.3; transform:scale(.6); }
    18%,38%{ opacity:1; transform:scale(1.15); }
    60%{ opacity:.55; transform:scale(.85); }
}
@keyframes nodeHalo{
    0%{ transform:scale(.5); opacity:0; }
    20%{ opacity:.65; }
    100%{ transform:scale(2.6); opacity:0; }
}
@keyframes nodeLineDraw{
    0%{ stroke-dashoffset:280; opacity:0; }
    15%{ opacity:1; }
    50%{ stroke-dashoffset:0; opacity:1; }
    80%{ opacity:.5; }
    100%{ stroke-dashoffset:-280; opacity:0; }
}
@keyframes nodeScan{
    0%{ left:-30%; }
    60%{ left:100%; }
    100%{ left:100%; }
}
.mod3_top .mod1_tt{
    color:#fff;
    text-shadow:0 12px 36px rgba(0,0,0,.24);
}
.mod3_top .mod1_tt::after{
    background:linear-gradient(90deg,var(--home-cyan),#fff);
}

.mod3_text{
    position:relative;
    z-index:2;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-items:stretch;
    gap:28px;
    margin:60px auto 0;
    padding-left:var(--home-pad-x);
    padding-right:var(--home-pad-x);
    max-width:1400px;
}
.mod3_textlist{
    flex:1 1 240px;
    min-width:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:14px;
    padding:28px 22px;
    border:1px solid rgba(255,255,255,.22);
    border-radius:18px;
    background:rgba(255,255,255,.10);
    box-shadow:0 22px 52px rgba(0,32,85,.20),inset 0 1px 0 rgba(255,255,255,.18);
    backdrop-filter:blur(18px);
    transition:transform .26s ease,border-color .26s ease,background .26s ease;
}
.mod3_textlist:hover{
    transform:translateY(-6px);
    border-color:rgba(34,208,255,.5);
    background:rgba(255,255,255,.16);
}
.mod3_textlist > div{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    color:#fff;
    font-family:Microsoft YaHei,sans-serif;
    font-size:clamp(30px,2.6vw,42px);
    font-weight:700;
    line-height:1.1;
}
.mod3_textlist > div svg{
    width:22px;
    height:auto;
    flex-shrink:0;
}
.mod3_textlist > div svg path{ fill:var(--home-cyan); }
.mod3_textlist > div .shuzhi1,
.mod3_textlist > div .shuzhi2,
.mod3_textlist > div .shuzhi3{
    background:linear-gradient(180deg,#fff,var(--home-cyan));
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
    text-shadow:0 0 28px rgba(34,208,255,.45);
    font-variant-numeric:tabular-nums;
}
.mod3_textlist p{
    margin:0;
    color:rgba(255,255,255,.88);
    text-align:center;
    font-family:Microsoft YaHei,PingFang SC,sans-serif;
    font-size:14px;
    line-height:1.6;
}
.mod3_textlist p span{ color:var(--home-cyan); font-weight:700; }

.mod3_ft{
    position:relative;
    width:100%;
    height:0;
    margin:0;
}

/* =============================================================
   6. Module 4 - 合作伙伴
   ============================================================= */
.mod4_box{
    padding-bottom:90px;
    text-align:center;
}
.mod4_list{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:18px;
    margin:48px auto 0;
    width:100%;
}
.mod4_list a{
    display:flex;
    align-items:center;
    justify-content:center;
    height:90px;
    padding:16px 24px;
    border:1px solid rgba(43,120,246,.08);
    border-radius:16px;
    background:#fff;
    box-shadow:0 10px 24px rgba(28,68,156,.05);
    transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease;
    width:auto;
}
.mod4_list a:hover{
    transform:translateY(-6px);
    border-color:rgba(34,208,255,.4);
    box-shadow:0 22px 48px rgba(43,120,246,.16);
}
.mod4_list a img{
    width:100%;
    height:auto;
    max-width:160px;
    max-height:48px;
    object-fit:contain;
    filter:grayscale(.2);
    transition:filter .24s ease;
}
.mod4_list a:hover img{ filter:grayscale(0); }

/* =============================================================
   7. Module 5 - 新闻动态（杂志风）
   ============================================================= */
.mod5_box{
    padding:0 0 120px;
    background:
        radial-gradient(circle at 80% 8%,rgba(34,208,255,.14),transparent 26%),
        linear-gradient(180deg,#F4F8FF 0%,#EAF1FF 100%);
    text-align:center;
}
.mod5_list{
    display:flex;
    flex-wrap:wrap;
    gap:18px;
    margin:48px auto 0;
    width:100%;
    max-width:1400px;
    padding-left:var(--home-pad-x);
    padding-right:var(--home-pad-x);
    box-sizing:border-box;
}
.mod5_left{
    flex:1 1 340px;
    min-width:0;
    height:auto;
    min-height:340px;
    border-radius:var(--home-radius);
    overflow:hidden;
    position:relative;
    box-shadow:0 22px 54px rgba(16,54,128,.16);
    transition:transform .3s ease,box-shadow .3s ease;
    background-size:cover !important;
    background-position:center !important;
    background-repeat:no-repeat !important;
}
.mod5_left:hover{
    transform:translateY(-6px);
    box-shadow:0 30px 68px rgba(16,54,128,.22);
}
.mod5_right{
    flex:1 1 480px;
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:18px;
    align-self:stretch;
}
.mod5_r_top,
.mod5_r_foot{
    display:flex;
    gap:18px;
    flex:1;
    min-height:160px;
}
.mod5_r_cont,
.mod5_r_cont1{
    flex:1 1 0;
    min-width:0;
    height:auto;
    min-height:160px;
    border-radius:18px;
    overflow:hidden;
    position:relative;
    box-shadow:0 18px 40px rgba(16,54,128,.12);
    transition:transform .3s ease,box-shadow .3s ease;
    background-size:cover !important;
    background-position:center !important;
    background-repeat:no-repeat !important;
}
.mod5_r_cont:hover,
.mod5_r_cont1:hover{
    transform:translateY(-5px);
    box-shadow:0 28px 56px rgba(16,54,128,.20);
}

/* 蒙层 */
.mod5_l_text{
    position:absolute;
    inset:0;
    display:flex;
    align-items:flex-end;
    background:linear-gradient(180deg,rgba(4,20,56,0) 0%,rgba(4,20,56,.5) 55%,rgba(5,42,112,.92) 100%);
    transition:background .3s ease;
}
.mod5_left:hover .mod5_l_text,
.mod5_r_cont:hover .mod5_l_text,
.mod5_r_cont1:hover .mod5_l_text{
    background:linear-gradient(180deg,rgba(4,20,56,.16) 0%,rgba(5,42,112,.78) 50%,rgba(2,28,76,.96) 100%);
}
.mod5_l_textcont,
.mod5_r_textcont{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:12px;
    width:100%;
    padding:24px;
    text-align:left;
}
.mod5_text_tt{
    color:#fff;
    font-family:Microsoft YaHei UI,Microsoft YaHei,sans-serif;
    font-size:18px;
    font-weight:700;
    line-height:1.4;
    text-align:left;
}
.mod5_left .mod5_text_tt{ font-size:22px; }
.mod5_text_p{
    color:rgba(255,255,255,.78);
    font-family:PingFang SC,Microsoft YaHei,sans-serif;
    font-size:13px;
    font-weight:400;
    line-height:1.6;
    text-align:left;
}
.mod5_text_btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:7px 18px;
    margin-top:4px;
    border:1px solid rgba(255,255,255,.6);
    border-radius:999px;
    background:rgba(255,255,255,.08);
    color:#fff;
    font-family:PingFang SC,Microsoft YaHei,sans-serif;
    font-size:13px;
    font-weight:500;
    backdrop-filter:blur(12px);
    transition:transform .24s ease,background .24s ease,border-color .24s ease;
}
.mod5_text_btn:hover{
    transform:translateY(-2px);
    background:var(--home-grad);
    border-color:transparent;
}

/* =============================================================
   8. 动画
   ============================================================= */
@keyframes homeFloat{
    0%,100%{ transform:translateY(0); }
    50%{ transform:translateY(-14px); }
}
@keyframes homePulse{
    0%,100%{ transform:scale(1); opacity:.78; }
    50%{ transform:scale(1.08); opacity:1; }
}
@keyframes homeSpin{
    from{ transform:translate(-50%,-50%) rotate(0deg); }
    to  { transform:translate(-50%,-50%) rotate(360deg); }
}

/* =============================================================
   9. 响应式
   ============================================================= */

/* ≤ 1440 - 平衡桌面：保持 5 列不换行 */
@media (max-width:1440px){
    .mod1_contbox{ gap:16px; }
    .mod1_contlist,
    #mod1_cont3 .mod1_contlist{
        width:calc((100% - 64px) / 5);
        max-width:none;
    }
    .mod1_contlist .mod1_cont_tt{ padding:22px 18px 16px; }
    .mod1_contlist .mod1_cont_tt div:first-child{ font-size:17px; padding-left:12px; }
    .mod1_contlist .mod1_cont_ft ul{ padding:0 18px; }
    .mod1_contlist .mod1_cont_ft ul li span:first-child{ min-width:64px; font-size:12.5px; }
    .mod1_contlist .mod1_cont_ft ul li span:last-child{ font-size:12.5px; }
    .mod1_cont_btnbox{ padding:0 18px; }
}

/* ≤ 1366 - 常规小桌面（避免横向滚动条） */
@media (max-width:1366px){
    .mod1_tt{ padding-top:72px; }
    .ban_cont1,
    .ban_cont3{
        gap:24px;
        padding-bottom:110px;
    }
    .ban_cont1 > img,
    .ban_cont3 > img{
        max-width:min(38vw,420px);
    }
    .ban_f_box{
        margin-top:-62px;
        padding:14px 18px;
    }
    .ban_foot{ gap:14px; }
    .ban_f_list{ padding:14px; flex:1 1 200px; }

    .mod2_tab_cont{ padding:40px 28px; }
    .mod2_tab_cont::after{ font-size:20px; right:24px; top:24px; }
    .mod2_textbox{ grid-template-columns:1fr 240px; gap:26px; }

    /* 1366 下 5 列继续保持，进一步收紧 */
    .mod1_contbox{ gap:12px; }
    .mod1_contlist,
    #mod1_cont3 .mod1_contlist{
        width:calc((100% - 48px) / 5);
    }
    .mod1_contlist .mod1_cont_tt{ padding:20px 14px 14px; }
    .mod1_contlist .mod1_cont_tt div:first-child{ font-size:16px; padding-left:10px; }
    .mod1_contlist .mod1_cont_tt div:first-child::before{ height:16px; }
    .mod1_contlist .mod1_cont_ft ul{ padding:0 14px; }
    .mod1_contlist .mod1_cont_ft ul li{ gap:6px; margin-bottom:8px; padding-bottom:8px; }
    .mod1_contlist .mod1_cont_ft ul li span:first-child{ min-width:58px; font-size:12px; }
    .mod1_contlist .mod1_cont_ft ul li span:last-child{ font-size:12px; }
    .mod1_cont_btnbox{ padding:0 14px; }
    .mod1_cont_money span:nth-child(2){ font-size:24px !important; }
    .mod1_btn_buy{ padding:8px 14px !important; font-size:13px !important; }
}

/* ≤ 1180 - 中等屏（如笔记本横屏接近 1024 时） */
@media (max-width:1180px){
    .mod1_contbox{ gap:14px; }
    .mod1_contlist,
    #mod1_cont3 .mod1_contlist{
        width:calc((100% - 42px) / 4);
    }
    .mod1_contlist .mod1_cont_tt{ padding:22px 16px 16px; }
    .mod1_contlist .mod1_cont_tt div:first-child{ font-size:17px; }
    .mod1_contlist .mod1_cont_ft ul{ padding:0 16px; }
    .mod1_contlist .mod1_cont_ft ul li span:first-child{ min-width:64px; font-size:13px; }
    .mod1_contlist .mod1_cont_ft ul li span:last-child{ font-size:13px; }
    .mod1_cont_btnbox{ padding:0 16px; }
    .mod4_list{ grid-template-columns:repeat(4,minmax(0,1fr)); }
    .mod5_right{ flex-basis:380px; }
}

/* ≤ 1024 - 横屏小屏 */
@media (max-width:1024px){
    :root{ --home-pad-x:18px; }
    .mod1_tt{ padding-top:60px; }
    .mod1_box{ padding-bottom:80px; }
    .mod2_box,
    .mod5_box{ padding-bottom:80px; }

    /* banner 折行 */
    .ban_cont1,
    .ban_cont3{
        flex-direction:column;
        align-items:flex-start;
        justify-content:center;
        padding-top:120px;
        padding-bottom:130px;
    }
    .ban_cont1 > img,
    .ban_cont3 > img{
        display:none;
    }
    .ban_cont1_left{ flex:1 1 100%; max-width:100%; }
    .ban_left_p{ max-width:100%; }
    .banner .swiper-wrapper{ height:clamp(440px,55vw,560px); }

    /* mod2 收成单列 */
    .mod2_tab_cont::after{ display:none; }
    .mod2_textbox{
        display:flex;
        flex-direction:column;
        gap:20px;
    }

    /* mod1 卡两列 */
    .mod1_contlist,
    #mod1_cont3 .mod1_contlist{
        width:calc((100% - 20px) / 2);
    }

    /* 数据卡折行 */
    .mod3_text{ gap:18px; }
    .mod3_textlist{ flex:1 1 calc(50% - 9px); min-width:240px; }

    .mod4_list{ grid-template-columns:repeat(3,minmax(0,1fr)); }

    .mod5_left{ flex:1 1 100%; min-height:280px; }
    .mod5_right{ flex:1 1 100%; }
}

/* ≤ 768 - 平板/移动（PC 模板兜底） */
@media (max-width:768px){
    .ban_f_box{ padding:12px; }
    .ban_foot{ flex-direction:column; gap:12px; }
    .ban_f_list{ flex:1 1 100%; }

    .mod1_tabtt{
        flex-wrap:wrap;
        justify-content:center;
        margin-top:28px;
        width:100%;
        max-width:100%;
        padding:6px;
    }
    .mod1_tab_a{ height:38px; padding:0 18px; font-size:14px; }
    .mod1_tabtt .mdui-tab-indicator{ height:38px; }

    .mod1_contlist,
    #mod1_cont3 .mod1_contlist{ width:100%; max-width:480px; }

    .mod2_box .mdui-tab a{ flex:1 1 calc(50% - 9px); min-width:0; }

    .mod3_textlist{ flex:1 1 100%; }

    .mod4_list{ grid-template-columns:repeat(2,minmax(0,1fr)); }
    .mod4_list a{ height:80px; padding:12px 18px; }

    .mod5_r_top,
    .mod5_r_foot{ flex-direction:column; }
    .mod5_r_cont,
    .mod5_r_cont1{ min-height:140px; }
}