:root {
            --primary-color: #004a99;    
            --secondary-color: #007bff;     
            --light-bg: #f9f9fb;            
            --card-bg: white;              
            --text-color: #2c3e50;          
            --soft-border: #e6e6e9;        
            --shadow-elevation: 0 4px 12px rgba(0, 0, 0, 0.08); 
            --radius: 8px;             
        }

        body {
            font-family: 'Roboto', sans-serif;
            line-height: 1.6;
            color: var(--text-color);
            background-color: var(--light-bg);
            margin: 0;
            padding: 0;
        }
        
        
.vdssgfs{
   font-size: 24px!important;
   line-height: 1.6!important;
   color:#004a99!important;
   font-weight: bold!important;
   margin-bottom: 20px;
}


.tag-hero-section {
    background: linear-gradient(135deg, #4facfe 0%, #00c6fb 100%); 
    color: #fff;
    padding: 50px 30px;
    border-radius: 16px;
    margin: 40px auto;
    max-width: 1430px;
    box-shadow: 0 15px 35px rgba(79, 172, 254, 0.25); 
    text-align: center; /* 整体居中 */
}

.tag-title {
    font-size: 2.2rem;
    margin-bottom: 25px;
    text-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

.editor-content-1 {
    font-size: 1.1rem;
    line-height: 1.7;
    opacity: 0.95;
    text-align: left; /* 内容保持左对齐阅读，或者改为 center 全局居中 */
    background: rgba(255, 255, 255, 0.1); /* 半透明背景 */
    padding: 30px;
    border-radius: 8px;
    backdrop-filter: blur(10px); /* 毛玻璃效果 */
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.editor-content-1 p {
    margin-bottom: 1.2em;
}

.editor-content-1 p:last-child {
    margin-bottom: 0;
}

/* 针对深色背景下的链接颜色调整 */
.editor-content-1 a {
    color: #ffeaa7;
    font-weight: bold;
}




/* === 1. 基础容器（保持结构稳定） === */
.content-matrix {
    width: 100%;
    margin: 30px auto;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.main-content-column {
    max-width: 1430px;
    margin: 0 auto;
    padding: 0 20px;
}

/* === 2. 侧边装饰风格主体 === */
.info-column1 {
    background-color: #fff;
    position: relative; /* 为定位装饰元素做准备 */
    padding: 45px 45px 45px 65px; /* 左侧多留一点 padding 给装饰条 */
    border-radius: 4px; /* 小圆角，显得硬朗一点 */
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08); /* 较深的阴影 */
    border-top: 5px solid #4facfe; /* 顶部蓝色装饰线 */
}

/* 左侧强调线 - 核心设计点 */
.info-column1::before {
    content: '';
    position: absolute;
    left: 0;
    top: 20px;
    bottom: 20px;
    width: 4px;
    background: linear-gradient(to bottom, #4facfe, #00c6fb); /* 淡蓝色渐变线条 */
    border-radius: 0 4px 4px 0;
}

/* === 3. 内容排版（现代商务风） === */
.editor-module {
    color: #445566;
    line-height: 1.8;
    font-size: 16px;
}

/* 标题样式：带左侧小方块装饰 */
.editor-module h2 {
    font-size: 22px;
    color: #222;
    margin-top: 30px;
    margin-bottom: 15px;
    padding-left: 12px;
    border-left: 4px solid #333; /* 标题左侧的小黑块 */
    line-height: 1.3;
}

.editor-module h1 {
    font-size: 28px;
    color: #1a2a3a;
    margin-bottom: 25px;
    border-bottom: 1px dashed #ccc; /* 标题下方的虚线分割 */
    padding-bottom: 15px;
}

/* 段落样式 */
.editor-module p {
    margin-bottom: 1.5em;
    text-align: justify;
}

/* 列表样式美化 */
.editor-module ul, .editor-module ol {
    margin-bottom: 1.5em;
    padding-left: 20px;
}
.editor-module li {
    margin-bottom: 0.8em;
    color: #555;
}

/* 重点文字高亮（如果有 strong 标签） */
.editor-module strong {
    color: #0088cc; /* 使用品牌蓝高亮 */
    font-weight: 700;
}

/* 图片样式：带边框 */
.editor-module img {
    max-width: 100%;
    height: auto;
    border: 1px solid #eee;
    padding: 4px;
    border-radius: 4px;
    margin: 25px 0;
    display: block;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

/* 引用块样式（如果有 blockquote） */
.editor-module blockquote {
    background: #f8f9fa;
    border-left: 5px solid #00c6fb;
    margin: 20px 0;
    padding: 15px 20px;
    font-style: italic;
    color: #666;
}

.editor-module1 h4{
    font-size: 24px;
    font-weight: bold;
    color:#007bff;
    margin-bottom: 20px;
}
.editor-module h4{
    font-size: 24px;
    font-weight: bold;
    color:#007bff;
    margin-bottom: 20px;
}




/* Container & Global Structure */
.content-matrix {
    max-width: 1430px;
    margin: 0 auto;
    padding: 20px;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: #333;
    line-height: 1.7;
}

/* Base style for all editor modules */
.editor-module, .editor-module1, .editor-module-faq {
    margin-bottom: 40px;
    padding: 40px;
    border-radius: 12px;
    background: #fff;
    transition: transform 0.3s ease;
}

/* DET 1: Info Column (Short Description / Hero Summary) */
.info-column1 {
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%); /* Soft Sky Blue Gradient */
    border-left: 6px solid #0ea5e9; /* Deep Sky Blue */
    box-shadow: 0 4px 15px rgba(14, 165, 233, 0.1);
}

/* DET 2: Main Intro (Professional Article Style) */
.editor-module1 {
    border: 1px solid #e2e8f0;
    position: relative;
    overflow: hidden;
}
.editor-module1::before {
    content: "";
    position: absolute;
    top: 0; left: 0; width: 100%; height: 4px;
    background: #0ea5e9;
}

/* DET 3: Application (Visual Grid style) */
.editor-module:nth-of-type(3) {
    background-color: #f8fafc;
    border-radius: 20px;
}

/* DET 4: Specifications & Services (Industrial Table focus) */
.editor-module-service {
    background-color: #ffffff;
    border: 2px dashed #bae6fd; /* Light Sky Blue Dash */
}

/* DET 5: FAQ Section (Accordion Style Visuals) */
.editor-module-faq {
    background: #ffffff;
    border-top: 1px solid #e2e8f0;
}
.editor-module-faq ul {
    list-style: none;
    padding: 0;
}
.editor-module-faq ul li {
    margin-bottom: 20px;
    padding: 20px;
    background: #f1f5f9;
    border-radius: 8px;
    font-size: 16px;
    line-height: 2;
    
}
.editor-module-faq ul li strong{
   
    background: #f1f5f9;
    border-radius: 8px;
    font-size: 16px;
    line-height: 2;
    font-weight: bold;
    display: inline;
    
}
.editor-module-faq strong {
    color: #0369a1; /* Stronger Sky Blue */
    display: block;
    margin-bottom: 10px;
    font-size: 1.1em;
}

/* Typography & Elements inside Editors */
.hqd-h4 {
    font-size: 24px;
    color: #0c4a6e;
    margin-bottom: 20px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.hqd-table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
}
.hqd-table th {
    background-color: #0ea5e9;
    color: white;
    padding: 12px 15px;
    text-align: left;
}
.hqd-table td {
    padding: 12px 15px;
    border-bottom: 1px solid #e2e8f0;
}
.hqd-table tr:hover {
    background-color: #f0f9ff;
}

.hqd-ul {
    padding-left: 20px;
}
.hqd-li {
    margin-bottom: 10px;
    position: relative;
    list-style: none;
}
.hqd-li::before {
    content: "✓";
    color: #0ea5e9;
    font-weight: bold;
    position: absolute;
    left: -25px;
}
.editor-module1 p{
    font-size: 16px;
    line-height: 2;
}





/* Container for the More Info section */
.more-info {
    max-width: 1430px;
    margin: 40px auto;
    display: flex;
    flex-wrap: nowrap; /* Forces one row */
    gap: 20px; /* Space between items */
    padding: 10px;
}

/* Individual Link Cards */
.more-info a {
    flex: 1; /* Ensures all 4 items have equal width */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 80px;
    padding: 15px 20px;
    background: #ffffff;
    color: #0369a1; /* Deep Sky Blue */
    text-decoration: none;
    font-weight: 600;
    font-size: 15px;
    border: 1px solid #e0f2fe;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.02);
    transition: all 0.3s ease;
    line-height: 1.4;
}

/* Hover Effect */
.more-info a:hover {
    background: #0ea5e9; /* Sky Blue */
    color: #ffffff;
    border-color: #0ea5e9;
    transform: translateY(-3px); /* Lifts the card slightly */
    box-shadow: 0 10px 15px rgba(14, 165, 233, 0.15);
}

/* Responsive: Stack into 2x2 on tablets or 1x4 on mobile */
@media (max-width: 1024px) {
    .more-info {
        flex-wrap: wrap;
    }
    .more-info a {
        flex: calc(50% - 20px); /* 2 per row on smaller screens */
    }
}

@media (max-width: 600px) {
    .more-info a {
        flex: 100%; /* 1 per row on mobile */
    }
}