/* 由 product-fixture.html 内联 <style> 抽取（P2 改造） */
/* 强制footer和float-bar和全局一致 */
body footer.site-footer{background:var(--blue-deep) ;color:var(--c-line-50-a80) ;text-align:left ;padding:60px 0 0 ;}
body footer.site-footer .footer-grid{gap:30px ;}
body footer.site-footer .f-about p,body footer.site-footer .f-contact li{color:var(--c-line-50-a70) ;}
body footer.site-footer .f-contact{gap:8px ;}
body footer.site-footer *{line-height:normal ;}
body footer.site-footer p{line-height:1.6 !important;}
body footer.site-footer .f-acc ul,body footer.site-footer .f-col ul{gap:9px !important;padding:0 !important;margin:0 ;}
body footer.site-footer .f-contact svg{stroke:var(--ac2) ;}
body footer.site-footer .f-acc summary,body footer.site-footer .f-col h4{color:var(--ac2) ;border-left:3px solid var(--ac2) ;}
body footer.site-footer .f-acc summary::before,body footer.site-footer .f-acc summary::after{display:none ;}
body footer.site-footer a{color:var(--c-line-50-a70) !important;}
body .float-bar{color:var(--ac2) ;}
body .float-bar svg{stroke:var(--ac2) ;fill:var(--ac2) ;}
body .float-bar .fb-label{color:var(--ac2) ;}
/* 所有表格加边框+居中 */
main table{text-align:center ;border-collapse:collapse ;width:100% ;}
main table th{border:1px solid var(--table-line) ;padding:12px 10px ;background:var(--table-head) ;text-align:center ;}
main table td{border:1px solid var(--table-line) ;padding:12px 10px !important;text-align:center ;vertical-align:middle ;}


        :root {
            --primary: #051937;
            --fx-accent: #0066CC;
            --success: #52AB40;
            --warning: #C62828;
            --bg-light: #F5F7FA;
            --card-bg: #FFFFFF;
            --text-main: #212529;
            --text-secondary: #495057;
            --border-color: #E9ECEF;
            --fx-shadow: 0 8px 24px rgba(0,0,0,0.1);
            --transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
        }

        /* 字体、背景与全局容器宽度统一遵循 css/style.css 设计系统 */

        /* .container 已由 css/style.css 统一提供，此处不再重复定义
           （重复定义会覆盖 .ph-breadcrumb 的顶部间距，导致面包屑紧贴 banner） */

        /* 面包屑与 banner 的间距：提高优先级兜底，任何 .container 的 padding 简写都不会清零它 */
        .ph-breadcrumb.container{padding-top:18px}

        /* 头部样式 */
        .tool-hero {
            background: linear-gradient(135deg, var(--primary) 0%, var(--c-blue-800-6) 100%);
            color: white;
            padding: 70px 0 90px;
            position: relative;
            overflow: hidden;
        }

        .tool-hero::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
            z-index: 1;
        }

        .hero-content {
            position: relative;
            z-index: 2;
            text-align: center;
        }

        .hero-content h1 {
            font-size: 3.2rem;
            font-weight: 800;
            margin-bottom: 16px;
            letter-spacing: 2px;
            text-shadow: 0 2px 10px var(--c-ink-900-a20);
        }

        .hero-content p {
            font-size: 1.3rem;
            opacity: 0.9;
            max-width: 850px;
            margin: 0 auto 36px;
            font-weight: 300;
        }

        .action-buttons {
            display: flex;
            justify-content: center;
            gap: 20px;
            flex-wrap: wrap;
            margin-top: 24px;
        }

        .btn {
            padding: 14px 32px;
            border-radius: 8px;
            text-decoration: none;
            font-weight: 600;
            transition: var(--transition);
            display: inline-flex;
            align-items: center;
            gap: 10px;
            font-size: 1rem;
        }

        .btn-primary {
            background: var(--fx-accent);
            color: white;
            box-shadow: 0 6px 20px var(--c-blue-600-a30);
        }

        .btn-primary:hover {
            transform: translateY(-4px);
            background: var(--c-blue-700);
            box-shadow: 0 8px 24px var(--c-blue-600-a40);
        }

        .btn-secondary {
            background: var(--c-line-50-a15);
            color: white;
            border: 1px solid var(--c-line-50-a40);
            backdrop-filter: blur(4px);
        }

        .btn-secondary:hover {
            background: var(--c-line-50-a25);
            transform: translateY(-4px);
        }

        /* 主内容区域 */
        main {
            margin-top: 0;
            position: relative;
            z-index: 10;
            padding-bottom: 70px;
        }

        .card {
            background: var(--card-bg);
            border-radius: 16px;
            padding: 40px;
            margin-bottom: 30px;
            box-shadow: var(--fx-shadow);
            opacity: 0;
            transform: translateY(40px);
            transition: var(--transition);
            border: 1px solid var(--c-ink-900-a03);
        }

        .card.visible {
            opacity: 1;
            transform: translateY(0);
        }

        .card h2 {
            color: var(--primary);
            font-size: 1.8rem;
            margin-bottom: 28px;
            padding-bottom: 14px;
            border-bottom: 3px solid var(--table-head);
            display: flex;
            align-items: center;
            gap: 12px;
            font-weight: 700;
        }

        .card h2 .icon {
            color: var(--fx-accent);
            width: 1.6rem;
            height: 1.6rem;
            flex: none;
        }

        .card h3 {
            color: var(--fx-accent);
            font-size: 1.3rem;
            margin-top: 24px;
            margin-bottom: 14px;
            font-weight: 600;
        }

        .card h4 {
            color: var(--primary);
            font-size: 1.1rem;
            margin-top: 18px;
            margin-bottom: 10px;
            font-weight: 600;
        }

        ul, ol {
            padding-left: 26px;
        }

        li {
            margin-bottom: 14px;
            line-height: 1.8;
        }

        strong {
            color: var(--primary);
            font-weight: 700;
        }

        .highlight {
            color: var(--warning);
            font-weight: 700;
            font-size: 1.05rem;
        }

        .text-success {
            color: var(--success);
            font-weight: 600;
        }

        .grid-layout {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
            gap: 28px;
            margin-top: 20px;
        }

        /* 表格样式 */
        table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 24px;
            border-radius: 8px;
            overflow: hidden;
        }

        th, td {
            padding: 16px 18px;
            text-align: left;
            border-bottom: 1px solid var(--border-color);
            vertical-align: top;
        }

        th {
            background-color: var(--bg-sky);
            font-weight: 700;
            color: var(--primary);
            font-size: 0.9rem;
            text-transform: uppercase;
            letter-spacing: 0.5px;
        }

        tbody tr {
            transition: background 0.2s ease;
        }

        tbody tr:hover {
            background-color: var(--bg-sky);
        }

        td ul {
            padding-left: 18px;
            margin: 0;
        }

        td li {
            margin-bottom: 6px;
        }

        /* 示意图样式 */
        .diagram-container {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
            gap: 24px;
            margin-top: 24px;
        }

        .diagram-box {
            background: var(--bg-sky);
            border: 1px solid var(--border-color);
            border-radius: 12px;
            padding: 20px;
            text-align: center;
            transition: var(--transition);
        }

        .diagram-box:hover {
            transform: translateY(-5px);
            box-shadow: 0 6px 16px var(--c-ink-900-a08);
        }

        .diagram-img {
            width: 100%;
            aspect-ratio: 5 / 3;
            min-height: 180px;
            background-color: var(--bg-sky);
            border-radius: 8px;
            margin-bottom: 14px;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
        }

        .diagram-img svg {
            width: 100%;
            height: 100%;
            display: block;
        }

        .diagram-title {
            font-weight: 700;
            color: var(--primary);
            font-size: 1rem;
        }

        .diagram-desc {
            color: var(--text-secondary);
            font-size: 0.9rem;
            line-height: 1.7;
            margin-top: 10px;
            text-align: left;
        }

        .diagram-desc ul {
            padding-left: 18px;
            margin: 0;
        }

        .diagram-desc li {
            margin-bottom: 5px;
            font-size: 0.88rem;
        }

        .diagram-legend {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 10px 22px;
            margin-top: 16px;
            padding: 18px 22px;
            background: var(--bg-sky);
            border: 1px solid var(--border-color);
            border-radius: 10px;
        }

        .legend-item {
            display: flex;
            align-items: center;
            gap: 10px;
            font-size: 0.92rem;
            color: var(--text-secondary);
        }

        .legend-swatch {
            width: 28px;
            height: 12px;
            border-radius: 3px;
            flex: none;
            border: 1px solid var(--c-ink-900-a15);
        }

        .legend-swatch.legend-line {
            background: repeating-linear-gradient(45deg, var(--red) 0 3px, var(--bg) 3px 6px);
        }

        /* 架构图 */
        .arch-diagram {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 14px;
            margin-top: 28px;
            padding: 28px;
            background: var(--bg-sky);
            border-radius: 12px;
            border: 1px solid var(--border-color);
        }

        .arch-row {
            display: flex;
            gap: 28px;
            justify-content: center;
            flex-wrap: wrap;
        }

        .arch-box {
            border: 2px solid var(--fx-accent);
            background: white;
            padding: 14px 24px;
            border-radius: 8px;
            font-weight: 600;
            color: var(--primary);
            min-width: 200px;
            text-align: center;
        }

        .arch-arrow {
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--fx-accent);
        }

        .arch-arrow .icon {
            width: 2rem;
            height: 2rem;
        }

        /* 施工流程 */
        .process-flow {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 14px;
            margin-top: 24px;
            padding: 20px;
            background: var(--bg-sky);
            border-radius: 12px;
        }

        .process-step {
            background: white;
            border: 1px solid var(--fx-accent);
            padding: 12px 20px;
            border-radius: 8px;
            font-size: 0.95rem;
            font-weight: 600;
            color: var(--primary);
            position: relative;
            box-shadow: 0 2px 8px var(--c-ink-900-a05);
        }

        .process-step:not(:last-child)::after {
            content: '→';
            position: absolute;
            right: -14px;
            top: 50%;
            transform: translateY(-50%);
            color: var(--fx-accent);
            font-weight: bold;
            font-size: 1.2rem;
        }

        .process-step .icon {
            margin-right: 6px;
            color: var(--fx-accent);
        }

        /* 手风琴面板 */
        .faq-item {
            margin-bottom: 16px;
            border: 1px solid var(--border-color);
            border-radius: 10px;
            overflow: hidden;
            transition: var(--transition);
        }

        .faq-item:hover {
            box-shadow: 0 4px 12px var(--c-ink-900-a05);
        }

        .faq-question {
            padding: 20px 28px;
            background: var(--bg-sky);
            cursor: pointer;
            font-weight: 600;
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 1.05rem;
        }

        .faq-question .icon {
            transition: transform 0.3s ease;
            flex: none;
        }

        .faq-answer {
            padding: 24px 28px;
            display: none;
            color: var(--text-secondary);
            border-top: 1px solid var(--border-color);
            line-height: 1.9;
        }

        .faq-item.active .faq-question {
            background: var(--bg-sky);
            color: var(--fx-accent);
        }

        .faq-item.active .faq-question .icon {
            transform: rotate(180deg);
        }

        .faq-item.active .faq-answer {
            display: block;
        }

        /* 验厂加分卡片 */
        .audit-card {
            background: var(--bg-sky);
            padding: 24px;
            border-radius: 12px;
            border-left: 5px solid var(--fx-accent);
            transition: var(--transition);
        }

        .audit-card:hover {
            transform: translateY(-4px);
            box-shadow: 0 6px 16px var(--c-ink-900-a08);
        }

        /* 页脚 */
        /* ==========【重点优化打印样式，消除空白】========== */
        @media print {
            @page {
                size: A4; /* 如需A3改成A3 landscape */
                margin: 12mm 10mm; /* 固定页边距，减少多余空白 */
            }
            * {
                -webkit-print-color-adjust: exact !important;
                print-color-adjust: exact !important;
            }
            body {
                background: var(--bg) !important;
                font-size:13pt;
            }
            .container {
                padding:0 !important;
                max-width:100% !important;
            }
            .tool-hero {
                background:var(--bg) !important;
                color:var(--c-ink-900) !important;
                padding:12px 0 !important;
            }
            .tool-hero::before {
                display:none !important; /* 删除背景图案，消除空白 */
            }
            .hero-content h1 {
                color:var(--c-ink-900) !important;
                font-size:20pt !important;
                text-shadow:none !important;
                margin-bottom:8px !important;
            }
            .hero-content p {
                font-size:12pt !important;
                color:var(--c-ink-800) !important;
                margin-bottom:10px !important;
            }
            .action-buttons,.btn {
                display:none !important; /* 彻底隐藏按钮 */
            }
            main {
                margin-top:0 !important; /* 【核心修复】取消-50负边距，消除顶部大片空白 */
                padding-bottom:0 !important;
            }
            .card {
                box-shadow:none !important;
                border:1px solid var(--c-ink-300) !important;
                padding:18px !important;
                margin-bottom:16px !important;
                page-break-inside:avoid !important; /* 卡片禁止中间分页撕裂留白 */
                opacity:1 !important;
                transform:none !important;
            }
            .card h2 {
                font-size:15pt !important;
                padding-bottom:6px !important;
                border-bottom:2px solid var(--c-line-200) !important;
                margin-bottom:12px !important;
            }
            .card h3 {
                font-size:13pt !important;
                margin-top:14px !important;
                margin-bottom:6px !important;
            }
            table th,table td {
                padding:8px 6px !important;
                font-size:11pt !important;
            }
            .arch-diagram,.process-flow,.diagram-box,.audit-card {
                background:var(--bg) !important;
                border:1px solid var(--c-line-200) !important;
            }
            .diagram-legend {
                background:var(--bg) !important;
            }
            .diagram-desc li,.legend-item {
                font-size:9pt !important;
            }
            .diagram-box {
                page-break-inside:avoid !important;
            }
            footer {
                display:none !important;
            }
            /* 禁止孤立标题留在上一页、内容在下一页 */
            h2,h3,h4 {
                page-break-after:avoid !important;
            }
            li,p {
                orphans:3;
                widows:3;
            }
        }

        /* 响应式适配 */
        @media (max-width: 768px) {
            .hero-content h1 {
                font-size: 2.2rem;
            }

            .card {
                padding: 28px 20px;
            }

            .process-step:not(:last-child)::after {
                display: none;
            }
        }
    
        /* 提示框 */
        .note-box {
            display: flex;
            align-items: flex-start;
            gap: 12px;
            padding: 16px 20px;
            border-radius: 10px;
            font-size: 0.9rem;
            line-height: 1.75;
        }

        .note-box .icon {
            width: 22px;
            height: 22px;
            flex: none;
            margin-top: 3px;
        }

        .note-box p {
            margin: 0;
        }

        .note-warn {
            background: var(--c-amber-100);
            border-left: 4px solid var(--gold);
            color: #6B5310;
        }

        .note-warn .icon {
            color: var(--gold);
        }

        .note-info {
            background: var(--c-blue-100-2);
            border-left: 4px solid var(--fx-accent);
            color: #0B4A82;
        }

        .note-info .icon {
            color: var(--fx-accent);
        }

        /* 验厂加分卡片内部排版 */
        .audit-card h4 {
            color: var(--primary);
            font-size: 1rem;
            margin-bottom: 8px;
        }

        .audit-card p {
            color: var(--text-secondary);
            font-size: 0.88rem;
            line-height: 1.75;
            margin: 0;
        }

        /* 总览表单元格强调 */
        @media (min-width: 901px) {
            table td:first-child {
                white-space: nowrap;
            }
        }

        /* 表格横向滚动容器，避免窄屏整页横向溢出 */
        .table-wrap {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            margin-top: 18px;
        }

        @media (max-width: 900px) {
            .table-wrap table {
                min-width: 660px;
            }

            .diagram-container {
                grid-template-columns: 1fr;
            }

            .diagram-box {
                min-width: 0;
            }

            .diagram-img {
                min-height: 0;
            }

            .grid-layout {
                grid-template-columns: 1fr;
            }
        }

        /* 内容区紧凑化 */
        .section{padding:32px 0}
        .section.alt{padding:32px 0}
        .section-head{display:none}
        .sv-main > .section:first-of-type{padding-top:0}
        .sd-title h3{font-size:20px}
        .sd-title{margin-bottom:20px}
    

      .page-hero{height:420px !important}
      .ph-lead{padding:0 16px}
      @media (max-width:992px){.page-hero{height:380px !important}.ph-title{font-size:clamp(24px,7.5vw,32px);margin:14px 0 10px;gap:4px}.ph-content .ph-lead{font-size:14px;line-height:1.7;padding:0 10px}}
      @media (max-width:640px){.page-hero{height:340px !important}.ph-title{font-size:22px !important}}
    .detail-modal{display:none;position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.55);align-items:center;justify-content:center;padding:20px}
    .detail-modal.open{display:flex}
    .detail-modal-box{background:var(--bg);border-radius:12px;max-width:820px;width:100%;max-height:85vh;overflow-y:auto;position:relative;box-shadow:0 20px 60px var(--c-ink-900-a30)}
    .detail-modal-close{position:absolute;top:14px;right:16px;width:36px;height:36px;border-radius:50%;background:var(--table-head);border:none;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--c-ink-700-2);z-index:2}
    .detail-modal-close:hover{background:var(--line);color:var(--blue-ink)}
    .detail-modal-body{padding:32px 36px}
    .detail-modal-body h2{font-size:22px;color:var(--blue-ink);margin:0 0 16px;padding-right:40px}
    .detail-modal-body h3{font-size:16px;color:var(--c-ink-800);margin:20px 0 10px}
    .detail-modal-body p{font-size:14px;line-height:1.8;color:var(--c-ink-700);margin:0 0 12px}
    .detail-modal-body table{width:100%;border-collapse:collapse;margin:10px 0;font-size:13px}
    .detail-modal-body th,.detail-modal-body td{border:1px solid var(--table-line);padding:10px 12px;text-align:center;vertical-align:middle}
    .detail-modal-body th{background:var(--table-head);font-weight:600}
    .detail-modal-body ul{padding-left:20px;font-size:14px;line-height:1.8;color:var(--c-ink-700)}
    .detail-modal-body .note-box{margin-top:16px;padding:14px 18px;border-radius:8px;font-size:13px;line-height:1.7}
    .detail-modal-body .note-warn{background:#fff8e6;border-left:4px #f0a020 solid}
    .detail-modal-body .note-info{background:var(--c-blue-100-2);border-left:4px var(--blue-mid) solid}
    @media (max-width:640px){.detail-modal-body{padding:20px 16px}.detail-modal-body h2{font-size:18px}}

    /* ===== 全终端防溢出加固（与 monitor 页统一基线） ===== */
    html,body{max-width:100vw;overflow-x:hidden}
    img,video{max-width:100%;height:auto}
    .ph-breadcrumb .breadcrumb{flex-wrap:wrap;row-gap:6px}
    .prose,.sd-title span,.note-box p{overflow-wrap:break-word;word-wrap:break-word;word-break:break-word}
    .table-wrap{max-width:100%;-webkit-overflow-scrolling:touch}
    .sv-wrap{align-items:stretch}
    .sv-main{width:100%;max-width:100%;min-width:0;overflow:hidden}
    @media (max-width:1024px){.container{padding:0 20px}}
    @media (max-width:900px){.container{padding:0 18px}}
    @media (max-width:600px){.container{padding:0 14px}}
    .modal-box{max-width:calc(100vw - 32px);width:92%;margin:16px}

    /* ===== 移动端大表横向滚动加固（修复 squeezedTableColumns） ===== */
    @media (max-width: 900px) {
        .table-wrap {
            display: block;
            overflow-x: auto;
            overflow-y: hidden;
            -webkit-overflow-scrolling: touch;
            max-width: 100%;
        }
        .table-wrap table.sx-table-132 {
            min-width: 780px !important;
            width: 780px;
        }
        .table-wrap table.sx-table-132 col.sx-col-134 {
            width: 180px !important;
        }
        .table-wrap table.sx-table-132 td,
        .table-wrap table.sx-table-132 th {
            white-space: normal;
            word-break: break-word;
        }
        .table-wrap table.tbl-spec {
            min-width: 520px;
            width: 520px;
        }
    }

/* 手机端：卡片/条目网格每行 2 列（覆盖小屏单列折叠，可 2 列者统一每行 2 列） */
@media (max-width:768px){
  .grid-layout,.diagram-legend{grid-template-columns:repeat(2,1fr) !important;gap:12px}
}