body {
            background-color: #fbfbfb;
        }

        /* 主题色定义与复用 */
        :root {
            --primary-color: #0c765c;
            --primary-light: #f5f8f7;
            --primary-dark: #085742;
            --text-dark: #222;
            --text-gray: #555;
            --border-gray: #e0e0e0;
        }

        /* 头部标题 */
        .page-header {
            text-align: center;
            margin-bottom: 5rem;
            padding-bottom: 2.5rem;
            border-bottom: 1px solid rgba(12, 118, 92, 0.2);
        }

        .page-title {
            font-size: 2.8rem;
            color: var(--primary-color);
            margin-bottom: 0.8rem;
        }

        .page-subtitle {
            font-size: 1.3rem;
            color: var(--text-gray);
            font-weight: 400;
        }

        /* 通用区块样式 */
        .content-block {
            margin-bottom: 6rem;
        }

        .block-title {
            font-size: clamp(24px, 1.7vw, 32px);
            color: var(--primary-color);
            text-align: center;
            margin-bottom: 3rem;
            position: relative;
        }

        .block-title::after {
            content: "";
            display: block;
            width: 90px;
            height: 5px;
            background-color: var(--primary-color);
            margin: 0.4rem auto 0;
            border-radius: 3px;
        }
        
        .content-block:first-child {
            margin-top: 60px
        }
        /* 图标样式（基于指定mask-image，扩展通用图标类） */
        .icon {
            width: 48px;
            height: 48px;
            background-color: var(--primary-color);
            mask-size: contain;
            mask-repeat: no-repeat;
            mask-position: center;
            -webkit-mask-size: contain;
            -webkit-mask-repeat: no-repeat;
            -webkit-mask-position: center;
            margin: 0 auto 1.5rem;
            transition: background-color 0.3s ease;
        }

    /* 定制服务图标（5个图标全不重复，对应各自分类，webkit前缀在前） */
        .icon.icon-rnd {
            /* 研发设计 - 烧杯图标 */
            -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-5 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z' fill='%23000'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-5 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z' fill='%23000'/%3E%3C/svg%3E");
        }

        .icon.icon-packaging {
            /* 包装设计 - 包装盒图标 */
            -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-4 8h-4v2h2a2 2 0 0 0 2-2v-2zm0-4h-4v2h4v-2z' fill='%23000'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-4 8h-4v2h2a2 2 0 0 0 2-2v-2zm0-4h-4v2h4v-2z' fill='%23000'/%3E%3C/svg%3E");
        }

        .icon.icon-procurement {
            /* 采购设计 - 购物篮/物料图标 */
            -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18 4h2v16h-2zM4 4h14v2H4zM4 8h14v2H4zM4 12h14v2H4zM4 16h14v2H4zM4 20h14v2H4z' fill='%23000'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18 4h2v16h-2zM4 4h14v2H4zM4 8h14v2H4zM4 12h14v2H4zM4 16h14v2H4zM4 20h14v2H4z' fill='%23000'/%3E%3C/svg%3E");
        }

        .icon.icon-compliance {
            /* 合规认证 - 勾选/证书图标（替换原重复图标） */
            -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-1 16H6c-.55 0-1-.45-1-1V6c0-.55.45-1 1-1h12c.55 0 1 .45 1 1v12c0 .55-.45 1-1 1zm-4.44-6.19l-2.35 3.02-1.56-1.88c-.2-.25-.58-.25-.78 0s-.2.56 0 .78l1.91 2.38c.2.25.58.25.78 0l2.75-3.5c.2-.25.2-.56 0-.78s-.58-.25-.78 0z' fill='%23000'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-1 16H6c-.55 0-1-.45-1-1V6c0-.55.45-1 1-1h12c.55 0 1 .45 1 1v12c0 .55-.45 1-1 1zm-4.44-6.19l-2.35 3.02-1.56-1.88c-.2-.25-.58-.25-.78 0s-.2.56 0 .78l1.91 2.38c.2.25.58.25.78 0l2.75-3.5c.2-.25.2-.56 0-.78s-.58-.25-.78 0z' fill='%23000'/%3E%3C/svg%3E");
        }

        .icon.icon-production {
            /* 生产规模 - 工厂/流水线图标（全新，无重复） */
            -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 13V9h-2v4H9v2h4v4h2v-4h4v-2h-4zm-3-7c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 14c-2.67 0-8-1.34-8-4v-1c0-.55.45-1 1-1s1 .45 1 1v1c0 2.31 5.33 4 8 4s8-1.69 8-4v-1c0-.55.45-1 1-1s1 .45 1 1v1c0 2.66-5.33 4-8 4z' fill='%23000'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 13V9h-2v4H9v2h4v4h2v-4h4v-2h-4zm-3-7c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 14c-2.67 0-8-1.34-8-4v-1c0-.55.45-1 1-1s1 .45 1 1v1c0 2.31 5.33 4 8 4s8-1.69 8-4v-1c0-.55.45-1 1-1s1 .45 1 1v1c0 2.66-5.33 4-8 4z' fill='%23000'/%3E%3C/svg%3E");
        }


        /* What We Customize 布局 */
        .custom-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
            gap: 1rem;
        }

        .custom-card {
            background-color: white;
            padding: 2.5rem 2rem;
            border-radius: 8px;
            box-shadow: 0 0 12px rgba(0, 0, 0, 0.05);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            text-align: center;
        }

        .custom-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 8px 20px rgba(12, 118, 92, 0.1);
        }

        .custom-card:hover .icon {
            background-color: var(--primary-dark);
        }

        .custom-card-title {
            font-size: clamp(18px, 1.15vw, 22px);
            color: var(--primary-color);
            margin-bottom: 1.5rem;
            font-weight: 600;
        }

        .custom-card-list {
            list-style: none;
            text-align: left;
            color: var(--text-dark);
        }

        .custom-card-list li {
            margin-bottom: 0.8rem;
            position: relative;
            padding-left: 1.5rem;
            font-size: clamp(14px, 0.85vw, 16px);
        }

        .custom-card-list li::before {
            content: "*";
            color: var(--primary-color);
            position: absolute;
            left: 0;
            top: 0.2rem;
            font-weight: bold;
        }

        /* How It Works （线条串联步骤） */
        .works-container {
            position: relative;
            /* max-width: 1000px; */
            margin: 0 auto;
        }

        /* 串联线条 */
        .works-line {
            position: absolute;
            top: 50px;
            left: 0;
            width: 100%;
            height: 2px;
            background-color: var(--primary-color);
            z-index: 1;
        }

        .works-steps {
            display: flex;
            justify-content: space-between;
            position: relative;
            z-index: 2;
        }

        .work-step {
            width: 18%;
            text-align: center;
            background-color: white;
            padding: 1rem;
            border-radius: 8px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.04);
        }

        .step-number {
            width: 40px;
            height: 40px;
            line-height: 40px;
            background-color: var(--primary-color);
            color: white;
            border-radius: 50%;
            margin: 0 auto 1rem;
            font-weight: 600;
            font-size: 1.2rem;
        }

        .step-title {
            font-size: clamp(18px, 1.15vw, 22px);
            color: var(--text-dark);
            font-weight: 500;
            margin-bottom: 0.8rem;
        }

        .step-desc {
            font-size: clamp(14px, 0.85vw, 16px);
            color: var(--text-gray);
            line-height: 1.6;
        }

        /* Our Capabilities & Standards  */
        .capabilities-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 2rem;
            /* max-width: 900px; */
            margin: 0 auto;
        }

        .capability-card {
            background-color: white;
            padding: 2.5rem 2rem;
            border-radius: 8px;
            box-shadow: 0 0 12px rgba(0, 0, 0, 0.05);
            text-align: center;
            transition: transform 0.3s ease;
        }

        .capability-card:hover {
            transform: translateY(-3px);
        }

        .capability-title {
            font-size: clamp(18px, 1.15vw, 22px);
            color: var(--primary-color);
            margin-bottom: 1rem;
            font-weight: 600;
        }
        
        .capability-card p{font-size: clamp(14px, 0.85vw, 16px);}

        .capability-link {
            text-decoration: none;
            font-weight: 500;
            display: inline-block;
            margin-top: 1rem;
            transition: border-color 0.3s ease;
            background: var(--color-primary);
            color: #fff;
            padding: 10px 20px;
        }
        .capability-link:hover {
            color: #fff;
            background: var(--color-primary);
        }
        .capability-link:hover {
            border-color: var(--btn-hover);
        }

        /* CTA 按钮 */
        .cta-section {
            text-align: center;
            margin: 8rem 0 4rem;
        }

        .cta-btn {
            display: inline-block;
            padding: 1.2rem 3rem;
            background-color: var(--primary-color);
            color: white;
            text-decoration: none;
            font-size: 1.2rem;
            font-weight: 500;
            border-radius: 8px;
            transition: all 0.3s ease;
            box-shadow: 0 4px 12px rgba(12, 118, 92, 0.2);
        }

        .cta-btn:hover {
            background-color: var(--primary-dark);
            transform: translateY(-2px);
            box-shadow: 0 6px 16px rgba(12, 118, 92, 0.3);
            color: #fff;
        }

        /* 响应式适配 */
        @media (max-width: 992px) {
            .works-steps {
                flex-wrap: wrap;
                gap: 10px 0;
            }

            .work-step {
                width: 48%;
                margin-bottom: 2rem;
            }

            .works-line {
                display: none;
            }

            .capability-card { padding: 20px;}

            .content-block { margin-bottom: 30px;}

        }

        @media (max-width: 768px) {
           /* body {
                padding: 1rem;
            }*/

            .page-title {
                font-size: 2.2rem;
            }

  

            .work-step {
                width: 100%;
                margin-bottom: 15px;
            }

            .custom-grid, .capabilities-grid {
                grid-template-columns: 1fr;
            }

            .cta-btn {
                padding: 1rem 2rem;
                font-size: 1.1rem;
            }
        }