
     :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;
        }
        
        .tag-page-container a {
            text-decoration: none;
            color: var(--secondary-color);
            transition: color 0.3s;
        }
        .tag-page-container a:hover {
            color: var(--primary-color);
        }

        .tag-page-container {
            max-width: 1430px; 
            margin: 0 auto;
            padding: 20px 30px 60px 30px;
        }
        
        header {
            background-color: var(--primary-color); 
            color: white; 
            padding: 20px 30px; 
            text-align: left; 
            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        }
        .breadcrumb {
            background-color: var(--card-bg);
            padding: 15px 30px;
            font-size: 0.9em;
            border-bottom: 1px solid var(--soft-border);
        }

        .tag-hero-section {
            padding: 40px 0;
            margin-bottom: 30px;
            margin-top: 60px;
        }

        /* 全局重置，确保各浏览器表现一致 */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    background-color: #f0f2f5; /* 浅灰底色，衬托内容 */
    color: #333;
    line-height: 1.6;
}

.tag-hero-section {
    background-color: #ffffff;
    padding: 80px 20px;
    text-align: center;
    position: relative;
    background-image: linear-gradient(to bottom, #ffffff 0%, #f8f9fa 100%);
}

/* 顶部装饰条，增加工业设计感 */
.tag-hero-section::before {
    content: '';
    display: block;
    width: 100%;
    height: 5px;
    background-color: #061c49; /* 你的主题色 */
    position: absolute;
    top: 0;
    left: 0;
}

.tag-title {
    color: #061c49;
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 10px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.hero-section-p {
    color: #555;
    font-size: 1.1rem;
    font-style: italic;
    margin-bottom: 50px;
    position: relative;
    display: inline-block;
}

/* 副标题下方的装饰短线 */
.hero-section-p::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background-color: #061c49;
    margin: 15px auto 0;
    opacity: 0.7;
}

/* 内容区域卡片样式 */
.editor-content-1 {
        margin: 0 auto;   /* 居中 */
    text-align: left; /* 文字左对齐 */
    background: #fff;
    padding: 50px;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(6, 28, 73, 0.08); /* 带有主题色的淡淡阴影 */
    border: 1px solid #e1e4e8;
}

/* 内容区域内的标题样式 */
.editor-content-1 h4 {
    color: #061c49;
    font-size: 1.6rem;
    margin-bottom: 25px;
    padding-bottom: 15px;
    border-bottom: 2px solid #eaeaea; /* 标题下方的分割线 */
    font-weight: 600;
}

/* 内容区域内的段落样式 */
.editor-content-1 p {
    color: #444;
    font-size: 1.05rem;
    line-height: 1.8; /* 增加行高，长文阅读更舒适 */
    margin-bottom: 20px;
    text-align: justify; /* 两端对齐，让段落更整齐 */
}

.editor-content-1 p:last-of-type {
    margin-bottom: 0;
}

/* 响应式设计：适配手机和平板 */
@media (max-width: 768px) {
    .tag-hero-section {
        padding: 40px 15px;
    }

    .tag-title {
        font-size: 1.8rem;
    }

    .editor-content-1 {
        padding: 30px 20px;
        box-shadow: none; /* 移动端去掉阴影，更扁平 */
        border: none;
    }

    .editor-content-1 h4 {
        font-size: 1.3rem;
    }
}
.inner-page .sidebar-box .sidebar-right {
    width:100%!important;
}
.fsfsfsfg{
    color: #061c49;
    font-size: 1.6rem;
    font-weight: 600;
    margin-bottom: 40px;
}







:root{
  --ink:        #061c49;
  --ink-2:      #0e2c66;
  --ink-3:      #16386f;
  --steel:      #8b95a6;
  --steel-line: #c7cedb;
  --steel-pale: #eef1f5;
  --paper:      #f8f7f3;
  --oxide:      #b6551d;
  --text:       #1b2436;
  --text-soft:  #56607a;
 
  --f-display: 'Barlow Condensed', sans-serif;
  --f-body: 'IBM Plex Sans', sans-serif;
}
 
*{ box-sizing:border-box; }
body{
  margin:0;
  background:var(--steel-pale);
  font-family:var(--f-body);
  color:var(--text);
  line-height:1.65;
}
.content-matrix{
  
  margin:0 auto;
  padding:48px 24px 96px;
  display:grid;
  grid-template-columns:minmax(0,1.9fr) minmax(0,1fr);
  gap:32px;
  align-items:start;
}
.main-content-column, .sidebar-content-column{
  display:flex;
  flex-direction:column;
  gap:28px;
  min-width:0;
}
@media (max-width:860px){
  .content-matrix{ grid-template-columns:1fr; }
}
 
/* shared resets so nested h4/p/table don't fight the module skins */
.content-matrix h4{ margin:0 0 14px; }
.content-matrix p{ margin:0 0 14px; }
.content-matrix p:last-child{ margin-bottom:0; }
.content-matrix table{ width:100%; border-collapse:collapse; }

/* ============================================================
   DET1 — .info-column1.editor-module
   规格参数 → "技术数据卡"：像钢板出厂随附的规格铭牌，
   顶部做出波纹钢板质感的压纹条，标签列用等宽风格数字。
   ============================================================ */
.info-column1.editor-module{
  position:relative;
  background:#fff;
  border:1px solid var(--steel-line);
  border-radius:4px;
  padding:0 30px 30px;
  box-shadow:0 1px 0 rgba(6,28,73,0.04);
}
.info-column1.editor-module::before{
  content:"";
  display:block;
  height:14px;
  margin:0 -1px 26px;
  border-radius:4px 4px 0 0;
  background:repeating-linear-gradient(
    100deg,
    var(--ink) 0px, var(--ink) 3px,
    var(--ink-2) 3px, var(--ink-2) 6px
  );
}
.info-column1.editor-module h4{
  font-family:var(--f-display);
  font-weight:600;
  font-size:26px;
  letter-spacing:.2px;
  color:var(--ink);
  padding-bottom:14px;
  border-bottom:2px solid var(--ink);
  display:inline-block;
}
.info-column1.editor-module > p{
  color:var(--text-soft);
  font-size:16px;
  
}
.info-column1.editor-module table{
  margin-top:6px;
  font-size:14.5px;
}
.info-column1.editor-module table tr:first-child td{
  background:var(--ink);
  color:#fff;
  font-family:var(--f-display);
  font-size:16px;
  letter-spacing:.3px;
  padding:10px 14px;
  border:none;
}
.info-column1.editor-module table tr:not(:first-child){
  border-bottom:1px solid var(--steel-line);
}
.info-column1.editor-module table tr:not(:first-child):hover{
  background:var(--steel-pale);
}
.info-column1.editor-module table td{
  border:none;
  padding:11px 14px;
  vertical-align:top;
}
.info-column1.editor-module table tr:not(:first-child) td:first-child{
  width:34%;
  color:var(--ink);
  font-weight:600;
  position:relative;
}
.info-column1.editor-module table tr:not(:first-child) td:first-child::before{
  content:"";
  position:absolute;
  left:0; top:14px;
  width:6px; height:6px;
  background:var(--oxide);
  border-radius:1px;
}
.info-column1.editor-module table tr:not(:first-child) td:first-child{
  padding-left:22px;
}
.info-column1.editor-module table td strong{ font-weight:700; }
 
 
/* ============================================================
   DET2 — .editor-module1
   价格结构 → "成本账本"：深色账目条 + 三段式台阶，
   呼应"阶梯定价 / 批量折扣"的内容本身。
   ============================================================ */
.editor-module1{
  background:linear-gradient(180deg,var(--ink) 0%, var(--ink-2) 100%);
  color:#eef1f7;
  border-radius:4px;
  padding:34px 32px;
  position:relative;
  overflow:hidden;
}
.editor-module1::after{
  content:"";
  position:absolute;
  right:-40px; bottom:-60px;
  width:220px; height:220px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.05), rgba(255,255,255,0) 60%);
  border-radius:50%;
}
.editor-module1 h4{
  font-family:var(--f-display);
  font-weight:600;
  font-size:26px;
  color:#fff;
  position:relative;
}
.editor-module1 h4::before{
  content:"";
  display:inline-block;
  width:26px; height:3px;
  background:var(--oxide);
  margin-right:12px;
  vertical-align:middle;
  transform:translateY(-3px);
}
.editor-module1 > p{
  color:#c7d1e6;
  font-size:16px;
  position:relative;
}
.editor-module1 > p:not(:last-child){
  padding-bottom:20px;
  margin-bottom:20px;
  border-bottom:1px solid rgba(255,255,255,.14);
}
/* stepped-tier accent bars beneath the whole card, echoing tiered pricing */
.editor-module1{ padding-bottom:44px; }
.editor-module1::before{
  content:"";
  position:absolute;
  left:32px; right:32px; bottom:16px;
  height:10px;
  background:
    linear-gradient(90deg,
      rgba(182,85,29,.9) 0 20%,
      rgba(182,85,29,.6) 20% 55%,
      rgba(182,85,29,.35) 55% 100%);
  border-radius:2px;
}
 
 
/* ============================================================
   DET3 — .editor-module (base, overridden for det1 / det4 above)
   产能与交期 → "车间产线"版式：左侧竖排代表 12 条产线的
   刻度条，标题区做成深色铭牌。
   ============================================================ */
.editor-module{
  background:var(--paper);
  border:1px solid var(--steel-line);
  border-left:6px solid var(--ink);
  border-radius:2px;
  padding:28px 32px 28px 26px;
  position:relative;
}
.editor-module h4{
  font-family:var(--f-display);
  font-weight:600;
  font-size:25px;
  color:var(--ink);
}
.editor-module > p{ font-size:15px; color:var(--text); }
.editor-module > p:first-of-type::first-letter{
  font-family:var(--f-display);
  font-size:44px;
  font-weight:600;
  color:var(--ink);
  float:left;
  line-height:.8;
  padding:4px 8px 0 0;
}
.editor-module{
  background-image:
    repeating-linear-gradient(
      90deg,
      rgba(6,28,73,0.05) 0 2px,
      transparent 2px 26px
    );
  background-position:right 32px top 0;
  background-size:312px 100%;
  background-repeat:no-repeat;
}
.editor-module p + p::before{ content:none; }
 
 
/* ============================================================
   DET4 — .editor-module-service.editor-module  (sidebar)
   质检与售后 → "质检证书"：双线证书边框 + 印章式圆标，
   呼应第三方检验、出厂证明书等内容。
   ============================================================ */
.editor-module-service.editor-module{
  background:#fff;
  border:2px solid var(--ink);
  border-left:2px solid var(--ink);
  outline:1px solid var(--ink);
  outline-offset:4px;
  border-radius:0;
  padding:26px 24px;
  margin:4px 4px 4px;
  background-image:none;
}
.editor-module-service.editor-module h4{
  font-family:var(--f-display);
  font-size:21px;
  color:var(--ink);
  padding-right:70px;
  min-height:44px;
}
.editor-module-service.editor-module{ position:relative; }
.editor-module-service.editor-module::before{
  content:"QC";
  position:absolute;
  top:22px; right:20px;
  width:46px; height:46px;
  border:2px solid var(--oxide);
  border-radius:50%;
  color:var(--oxide);
  font-family:var(--f-display);
  font-weight:700;
  font-size:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  transform:rotate(-12deg);
  letter-spacing:.5px;
}
.editor-module-service.editor-module > p{
  font-size:16px;
  color:var(--text-soft);
}
.editor-module-service.editor-module > p:not(:last-child){
  padding-bottom:16px;
  margin-bottom:16px;
  border-bottom:1px dashed var(--steel-line);
}
.editor-module-service.editor-module > p:first-of-type::first-letter{ all:unset; }
 
 
/* ============================================================
   DET5 — .editor-module-edsxc  (sidebar)
   项目案例 → "数据卡片"：真正是一组可量化的项目面积，
   适合用大号数字做视觉主体。
   ============================================================ */
.editor-module-edsxc{
  background:var(--ink);
  color:#eef1f7;
  border-radius:4px;
  padding:28px 24px 8px;
}
.editor-module-edsxc h4{
  font-family:var(--f-display);
  font-weight:600;
  font-size:21px;
  color:#fff;
}
.editor-module-edsxc > p{
  font-size:16px;
  color:#b7c2da;
}
.editor-module-edsxc > p:first-of-type{
  display:grid;
  
  gap:10px;
  color:#b7c2da;
}
/* pull the three project figures out as stat blocks purely via CSS counters is not reliable from prose,
   so we present the same paragraph with a stat rail beneath the headline for scannability */
.editor-module-edsxc::after{
  
  display:block;
  margin:14px -24px 0;
  padding:14px 24px;
  font-family:var(--f-display);
  font-size:16px;
  letter-spacing:.2px;
  color:#fff;
  background:rgba(255,255,255,.08);
  border-top:1px solid rgba(255,255,255,.16);
}
.editor-module-edsxc > p:last-of-type{
  padding-top:16px;
  border-top:1px solid rgba(255,255,255,.14);
  margin-top:16px;
}
 
 
/* ============================================================
   DET6 — .edscfgk  (sidebar)
   销售与技术团队 → "联系通道卡"：比其余模块更柔和、更接近
   人际沟通的语气，圆角更大，用色带代表不同联系方式。
   ============================================================ */
.edscfgk{
  background:#fff;
  border:1px solid var(--steel-line);
  border-radius:14px;
  padding:26px 24px;
  box-shadow:0 8px 20px -14px rgba(6,28,73,.35);
}
.edscfgk h4{
  font-family:var(--f-display);
  font-weight:600;
  font-size:21px;
  color:var(--ink);
}
.edscfgk > p{
  font-size:16px;
  color:var(--text-soft);
  padding-left:16px;
  border-left:3px solid var(--steel-line);
}
.edscfgk > p:nth-of-type(1){ border-left-color:var(--ink); }
.edscfgk > p:nth-of-type(2){ border-left-color:var(--oxide); }
.edscfgk > p:nth-of-type(3){ border-left-color:var(--steel); }
.edscfgk > p:not(:last-child){ margin-bottom:16px; }
 
 
/* ============================================================
   DET7 — .fsffwefwg
   贸易条款与合规 → "报关单据"版式：虚线边框、纸张底色、
   角落做出单据编号感的小标签。
   ============================================================ */
.fsffwefwg{
  background:var(--paper);
  border:1.5px dashed var(--steel);
  border-radius:2px;
  padding:30px 32px;
  position:relative;
}
.fsffwefwg::before{
  content:"TRADE / DOC";
  position:absolute;
  top:-11px; left:28px;
  background:var(--paper);
  padding:0 10px;
  font-family:var(--f-display);
  font-size:16px;
  letter-spacing:1.5px;
  color:var(--steel);
}
.fsffwefwg h4{
  font-family:var(--f-display);
  font-weight:600;
  font-size:25px;
  color:var(--ink);
}
.fsffwefwg > p{
  font-size:16px;
  color:var(--text);
  padding-bottom:16px;
  margin-bottom:16px;
  border-bottom:1px solid var(--steel-line);
  position:relative;
  padding-left:20px;
}
.fsffwefwg > p:last-child{ border-bottom:none; margin-bottom:0; padding-bottom:0; }
.fsffwefwg > p::before{
  content:"§";
  position:absolute;
  left:0; top:0;
  color:var(--oxide);
  font-family:var(--f-display);
  font-weight:700;
}
 
 
/* ============================================================
   DET8 — .faqfdfdf
   常见问题 → 手风琴式问答卡，问题用条纹标签，
   答案区左侧留出钢灰色引导线。
   ============================================================ */
.faqfdfdf{
  background:#fff;
  border:1px solid var(--steel-line);
  border-radius:4px;
  padding:30px 32px;
}
.faqfdfdf h4{
  font-family:var(--f-display);
  font-weight:600;
  font-size:25px;
  color:var(--ink);
  padding-bottom:16px;
  margin-bottom:6px;
}
.faqfdfdf p{
  font-size:16px;
  color:var(--text);
  padding:14px 0 14px 22px;
  border-top:1px solid var(--steel-line);
  position:relative;
}
.faqfdfdf p:last-child{ padding-bottom:0; }
.faqfdfdf p::before{
  content:"?";
  position:absolute;
  left:0; top:14px;
  width:14px; height:14px;
  color:#fff;
  background:var(--ink);
  font-family:var(--f-display);
  font-size:14px;
  font-weight:700;
  line-height:14px;
  text-align:center;
  border-radius:50%;
}
.faqfdfdf p strong{
  color:var(--ink);
  font-weight:600;
}



/* ============================================================
   Related Tags — .more-info
   仓储挂牌标签风格：每个标签左侧留出"打孔圆点"，
   悬浮时标签像被轻轻拎起，与前面证书/单据类模块的
   工业气质呼应，但整体更轻量，适合放在页面末尾收尾。
   沿用同一套 tokens：--ink #061c49 / --oxide 锈橙 / --steel 钢灰
   ============================================================ */
.more-info{
  margin-top:8px;
  padding-top:26px;
  border-top:2px solid var(--ink, #061c49);
  position:relative;
}
.more-info::before{
  content:"";
  position:absolute;
  top:-2px; left:0;
  width:64px; height:2px;
  background:var(--oxide, #b6551d);
}

.more-info .vfdvdgdfg{
  font-family:var(--f-display, 'Barlow Condensed', sans-serif);
  font-weight:600;
  font-size:20px;
  letter-spacing:.3px;
  color:var(--ink, #061c49);
  margin:0 0 16px;
}

.more-info{
  display:block;
}
.more-info a{
  --tag-h: 34px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  height:var(--tag-h);
  margin:0 10px 10px 0;
  padding:0 16px 0 22px;
  background:#fff;
  border:1px solid var(--steel-line, #c7cedb);
  border-radius:2px 6px 6px 2px;
  color:var(--text, #1b2436);
  font-family:var(--f-body, 'IBM Plex Sans', sans-serif);
  font-size:16px;
  text-decoration:none;
  position:relative;
  transition:border-color .15s ease, color .15s ease, transform .15s ease, box-shadow .15s ease;
}
/* 打孔圆点 */
.more-info a::before{
  content:"";
  position:absolute;
  left:9px; top:50%;
  width:5px; height:5px;
  border-radius:50%;
  background:var(--steel, #8b95a6);
  box-shadow:0 0 0 1px #fff;
  transition:background .15s ease;
}
/* 标签左侧的小三角缺口，做出"挂牌"的裁切感 */
.more-info a::after{
  content:"";
  position:absolute;
  left:-6px; top:50%;
  width:12px; height:12px;
  background:inherit;
  border-left:1px solid var(--steel-line, #c7cedb);
  border-bottom:1px solid var(--steel-line, #c7cedb);
  transform:translateY(-50%) rotate(45deg);
  transition:border-color .15s ease;
}
.more-info a:hover{
  border-color:var(--ink, #061c49);
  color:var(--ink, #061c49);
  transform:translateY(-2px);
  box-shadow:0 6px 14px -8px rgba(6,28,73,.35);
}
.more-info a:hover::before{ background:var(--oxide, #b6551d); }
.more-info a:hover::after{ border-color:var(--ink, #061c49); }










/* ============================================================
   DET8 — .faqfdfdf  可伸缩版
   用原生 <details>/<summary> 实现无 JS 手风琴：
   问题始终可见，答案展开时带高度过渡动画，
   圆形问号图标在展开时旋转为叉号，提示"点击收起"。
   ============================================================ */
.faqfdfdf{
  background:#fff;
  border:1px solid var(--steel-line, #c7cedb);
  border-radius:4px;
  padding:30px 32px;
}
.faqfdfdf h4{
  font-family:var(--f-display, 'Barlow Condensed', sans-serif);
  font-weight:600;
  font-size:25px;
  color:var(--ink, #061c49);
  padding-bottom:16px;
  margin-bottom:6px;
}

.faqfdfdf .faq-item{
  border-top:1px solid var(--steel-line, #c7cedb);
}
.faqfdfdf .faq-item:last-child{
  border-bottom:1px solid var(--steel-line, #c7cedb);
}

.faqfdfdf .faq-item summary{
  list-style:none;
  cursor:pointer;
  position:relative;
  padding:16px 36px 16px 26px;
  font-family:var(--f-body, 'IBM Plex Sans', sans-serif);
  font-weight:600;
  font-size:14.5px;
  color:var(--text, #1b2436);
  transition:color .15s ease;
}
.faqfdfdf .faq-item summary::-webkit-details-marker{ display:none; }

/* 圆形问号标记，复用之前的视觉语言 */
.faqfdfdf .faq-item summary::before{
  content:"?";
  position:absolute;
  left:0; top:16px;
  width:14px; height:14px;
  color:#fff;
  background:var(--ink, #061c49);
  font-family:var(--f-display, 'Barlow Condensed', sans-serif);
  font-size:11px;
  font-weight:700;
  line-height:14px;
  text-align:center;
  border-radius:50%;
}

/* 右侧展开箭头，展开时旋转 180deg */
.faqfdfdf .faq-item summary::after{
  content:"";
  position:absolute;
  right:4px; top:20px;
  width:9px; height:9px;
  border-right:2px solid var(--steel, #8b95a6);
  border-bottom:2px solid var(--steel, #8b95a6);
  transform:rotate(45deg);
  transition:transform .25s ease, border-color .25s ease;
}
.faqfdfdf .faq-item[open] summary::after{
  transform:rotate(-135deg);
  border-color:var(--oxide, #b6551d);
}
.faqfdfdf .faq-item[open] summary{ color:var(--ink, #061c49); }

/* 答案区：用 grid 行高过渡做展开/收起动画（比 max-height 更平滑，且能自适应内容高度） */
.faqfdfdf .faq-item p{
  margin:0;
  padding:0 26px 16px;
  font-size:14.5px;
  color:var(--text-soft, #56607a);
}

/* details 默认没有过渡动画，用 @starting-style 让展开有淡入+下滑效果；
   不支持该特性的浏览器会直接呈现展开/收起，不影响功能 */
.faqfdfdf .faq-item[open] p{
  animation: faq-reveal .22s ease;
}
@keyframes faq-reveal{
  from{ opacity:0; transform:translateY(-4px); }
  to{ opacity:1; transform:translateY(0); }
}