.elementor-5026 .elementor-element.elementor-element-b956961{--display:flex;--margin-top:100px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-5026 .elementor-element.elementor-element-5000b41{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 40px) 0px;text-align:center;}.elementor-5026 .elementor-element.elementor-element-b4b1cd3{--display:flex;}#elementor-popup-modal-5026 .dialog-widget-content{animation-duration:0.6s;box-shadow:2px 8px 23px 3px rgba(0,0,0,0.2);}#elementor-popup-modal-5026{background-color:rgba(0,0,0,.8);justify-content:center;align-items:flex-start;pointer-events:all;}#elementor-popup-modal-5026 .dialog-message{width:100vw;height:100vh;align-items:flex-start;padding:20px 20px 20px 20px;}#elementor-popup-modal-5026 .dialog-close-button{display:flex;}@media(max-width:1200px){.elementor-5026 .elementor-element.elementor-element-b956961{--margin-top:50px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}}@media(max-width:1000px){.elementor-5026 .elementor-element.elementor-element-b956961{--margin-top:50px;--margin-bottom:40px;--margin-left:0px;--margin-right:0px;}.elementor-5026 .elementor-element.elementor-element-5000b41{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}}@media(max-width:767px){.elementor-5026 .elementor-element.elementor-element-b956961{--margin-top:50px;--margin-bottom:40px;--margin-left:0px;--margin-right:0px;}}/* Start custom CSS for shortcode, class: .elementor-element-9039712 *//* ==========================================================================
   1. 动态分类网格专属 CSS (顶级与二级分类导航)
   ========================================================================== */
.elementor-5026 .elementor-element.elementor-element-9039712 .cemb-term-grid { 
    display: grid; 
    grid-template-columns: repeat(3, 1fr); 
    gap: 20px; 
    max-width: 1000px !important;          
    margin: 0 auto !important;             
}
@media (max-width: 767px) {
    .elementor-5026 .elementor-element.elementor-element-9039712 .cemb-term-grid { grid-template-columns: 1fr; }
}
.elementor-5026 .elementor-element.elementor-element-9039712 .cemb-term-button { 
    display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; background-color: #f8f9fa; border: 1px solid #e5e5e5; padding: 10px 20px; border-radius: 4px; transition: all 0.3s ease; text-decoration: none; cursor: pointer; 
}
.elementor-5026 .elementor-element.elementor-element-9039712 .cemb-term-button:hover { background-color: #ffffff; border-color: #e3000f; box-shadow: 0 5px 15px rgba(0,0,0,0.05); }
.elementor-5026 .elementor-element.elementor-element-9039712 .cemb-term-button img { width: 45px; height: 45px; object-fit: contain; margin-right: 0; margin-bottom: 15px; transition: all 0.3s ease; }
.elementor-5026 .elementor-element.elementor-element-9039712 .cemb-term-button span { color: #999999; font-size: 16px; font-weight: 600; line-height: 1.3; transition: color 0.3s ease; }
.elementor-5026 .elementor-element.elementor-element-9039712 .cemb-term-button:hover span { color: #e3000f; }

/* ==========================================================================
   2. 二级套娃弹窗的底层显示逻辑 (沉浸式满屏版)
   ========================================================================== */
.cemb-modal-overlay {
    position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: #ffffff !important; z-index: 99999999 !important; display: flex; justify-content: center; align-items: flex-start; opacity: 0; visibility: hidden; transition: opacity 0.15s ease; 
}
.cemb-modal-overlay.show-modal { opacity: 1; visibility: visible; }
.cemb-modal-content {
    background: #ffffff; padding: 50px 0 !important; border-radius: 0 !important; width: 100vw !important; max-width: 100vw !important; height: 100vh !important; max-height: 100vh !important; border: none !important; box-shadow: none !important; transform: none !important; transition: none !important; overflow-y: auto; overflow-x: hidden;
}

/* 强制 Elementor 主弹窗沉浸式满屏（覆盖 Header） */
body .elementor-popup-modal { top: 0 !important; height: 100vh !important; z-index: 9999999 !important; }

/* 标题高低错位与 Back 按钮修复 */
.cemb-modal-content .cemb-modal-header { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; padding-bottom: 0 !important; border-bottom: none !important; margin-bottom: 40px !important; }
.cemb-modal-content .cemb-modal-header h2 { font-size: 32px !important; color: #111111 !important; font-weight: 700 !important; margin: 0 0 10px 0 !important; text-align: center; }
.cemb-modal-content .cemb-modal-header h3 { font-size: 18px !important; color: #e3000f !important; font-weight: 400 !important; margin: 0 !important; text-align: center; }
.cemb-modal-content .cemb-back-btn-wrapper { margin-top: 60px !important; margin-bottom: 50px !important; text-align: center !important; width: 100%; }



/* ==========================================================================
   3. 终极一列流：产品与附加卡片无缝拼接网格 (Products + Actions Grid)
   ========================================================================== */
.cemb-product-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* 强制 4 列无缝排布 */
    gap: 20px;
    width: 100%;
    max-width: 1440px; 
    margin: 0 auto 40px auto; 
    padding: 0 20px; 
}

/* 📱 响应式自适应布局 */
@media (max-width: 1024px) {
    .cemb-product-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
    .cemb-product-grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   通用卡片外观 (🌟 修复 1：取消阴影，只留红色边框悬停)
   ========================================================================== */
.cemb-product-card {
    background-color: #f4f5f6;
    border-radius: 8px;
    padding: 20px 25px;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    /* 预埋透明边框，防止 Hover 时画面抖动 */
    border: 1px solid transparent; 
    transition: border-color 0.3s ease; 
    min-height: 320px;
    position: relative;
    overflow: hidden;
}

/* 🌟 核心：鼠标悬停只变红框，绝对无阴影 */
.cemb-product-card:hover { 
    border-color: #e3000f; 
}

.cemb-prod-img-wrap { text-align: center; margin-bottom: 20px; height: 200px; display: flex; align-items: center; justify-content: center; mix-blend-mode: multiply; }
.cemb-prod-img-wrap img { max-height: 100%; max-width: 100%; object-fit: contain; }



.cemb-prod-text { display: flex; flex-direction: column; flex-grow: 1; justify-content: space-between; }

.cemb-product-card h4 { color: #111111; font-size: 16px !important; font-weight: 700; margin: 0 0 15px 0; line-height: 1.3; text-align: left; }
.cemb-discover { color: #111111; font-size: 14px; font-weight: 400; text-align: left; margin-top: auto; }





/* ==========================================================================
   底部 3 张功能卡片的微调覆盖
   ========================================================================== */
.cemb-action-card {
    justify-content: flex-end; 
}
.cemb-action-card h4 {
    font-size: 20px !important; 
    margin: 0; 
    line-height: 1.2; 
    z-index: 2; 
}

/* 巨型背景图标通用设置 (自动占满卡片右上角一半空间) */
.cemb-bg-icon {
    position: absolute;
    top: -5%;         /* 👈 控制上下位置：负数表示稍微溢出卡片顶部边缘，更有设计感 */
    right: -5%;       /* 👈 控制左右位置：稍微溢出右侧 */
    
    width: 80%;       /* 🌟 核心控制：宽度永远占据整个卡片的 60%（一大半） */
    height: 80%;      /* 🌟 核心控制：高度永远占据整个卡片的 60% */
    
    object-fit: contain;
    object-position: top right; /* 🌟 强制图片内容死死锚定在右上角 */
    z-index: 1;
}



.cemb-request-card { background-color: #1a1a1b; }
.cemb-request-card h4 { color: #ffffff !important; }
.cemb-request-card .cemb-bg-icon { opacity: 0.15; }


/* ==========================================================================
   4. 🌟 修复 3：全自动溢出滚动条控制 (Scrollbar Fix)
   ========================================================================== */
/* 强制内容盒子 100% 高度，由系统自动判断是否超出 */
.cemb-modal-content {
    box-sizing: border-box !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

/* 工业风定制滚动条 */
.cemb-modal-content::-webkit-scrollbar { width: 8px; }
.cemb-modal-content::-webkit-scrollbar-track { background: #f8f9fa; border-radius: 4px; }
.cemb-modal-content::-webkit-scrollbar-thumb { background: #c1c1c1; border-radius: 4px; }
.cemb-modal-content::-webkit-scrollbar-thumb:hover { background: #e3000f; }







/* ==========================================================================
   终极细节强化：强制响应式列数 + 高级工业风滚动条
   ========================================================================== */

/* 🌟 1. 强制响应式网格列数锁死 */
.cemb-product-grid,
.cemb-bottom-cards-wrapper {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important; /* PC 端：强制 4 列 */
    gap: 20px !important;
    width: 100% !important;
}

/* 平板端 (&lt;= 1024px)：强制 2 列 */
@media (max-width: 1024px) {
    .cemb-product-grid,
    .cemb-bottom-cards-wrapper {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* 手机端 (&lt;= 767px)：强制 1 列，从上往下排 */
@media (max-width: 767px) {
    .cemb-product-grid,
    .cemb-bottom-cards-wrapper {
        grid-template-columns: 1fr !important;
    }
}

/* 🌟 2. 完美工业风滚动条 (当产品过多时自动出现) */
.cemb-modal-content {
    /* 确保内容超出时允许垂直滚动，禁止横向溢出 */
    overflow-y: auto !important;
    overflow-x: hidden !important;
    max-height: 100vh !important; /* 限制最大高度为屏幕高度，触发滚动 */
    scroll-behavior: smooth;
}

/* 针对 Webkit 浏览器 (Chrome, Safari, Edge) 美化滚动条 */
.cemb-modal-content::-webkit-scrollbar {
    width: 8px; /* 滚动条纤细设计 */
}

.cemb-modal-content::-webkit-scrollbar-track {
    background: #f8f9fa; /* 轨道浅灰色，融入背景 */
    border-radius: 4px;
}

.cemb-modal-content::-webkit-scrollbar-thumb {
    background: #c1c1c1; /* 滑块金属灰色 */
    border-radius: 4px;
}

.cemb-modal-content::-webkit-scrollbar-thumb:hover {
    background: #e3000f; /* 鼠标悬停时，滑块变成 CEMB 红色，增强交互反馈 */
}/* End custom CSS */