/* ===========================================
   自定义页面样式 - Artificial Leather Buffing Machine
   =========================================== */

/* ===== 全局变量与重置 ===== */
:root {
    --primary-color: #0056b3;
    --secondary-color: #00a8e8;
    --accent-color: #ff6b35;
    --dark-color: #2c3e50;
    --light-bg: #f8f9fa;
    --white: #ffffff;
    --gray-light: #e9ecef;
    --gray-medium: #6c757d;
    --gray-dark: #495057;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.12);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.15);
    --border-radius: 12px;
    --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ===== Hero 区域 ===== */
ui.container-info {
    max-width: 1200px; 
    margin: 0 auto; 
    padding-left: 20px;
    padding-right: 20px;
    width: 100%;
    box-sizing: border-box; 
}

.tag-hero-section {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
    padding: 120px 50px 50px 50px;
    color: var(--white);
    position: relative;
    overflow: hidden;
}

.tag-hero-section .tag-title {
    font-size: 3rem;
    font-weight: 700;
    margin-bottom: 15px;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.inner-page .productList ul li {
        padding: 30px;
        width: 120% !important;
    }

.hero-section-p {
    font-size: 1.25rem;
    font-weight: 300;
    margin-bottom: 30px;
    opacity: 0.95;
}

.tag-hero-section .editor-content-1 {
    font-size: 1.1rem;
    line-height: 1.8;
    max-width: 1600px;
    padding-bottom: 20px;
}

/* ===== 相关产品区域 (置顶) ===== */
.product-top-section {
    background: var(--light-bg);
    padding: 70px 0;
    position: relative;
    margin-top: -40px;
    z-index: 10;
}

.product-top-section .ui.container-info {
    max-width: 1250px;
    margin: 0 auto;
    padding: 40px;
    width: 100%;
    box-sizing: border-box;
}

.seoPublic .Auxil-honor .list ul li a img {
    width: auto;
}

.section-header {
    text-align: center;
    margin-bottom: 50px;
}

.section-header h2 {
    font-size: 2.5rem;
    color: var(--dark-color);
    font-weight: 700;
    margin-bottom: 15px;
    position: relative;
    display: inline-block;
}

.section-header h2::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 4px;
    background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));
    border-radius: 2px;
}

.section-header .divider {
    width: 80px;
    height: 4px;
    background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));
    margin: 0 auto;
    border-radius: 2px;
}

/* 产品卡片网格 - 优化后的样式 */
.productList ul.grid-box.four {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    list-style: none;
    padding:40px;
    margin: 0;
}

.productList ul li.column {
    display: block;
    margin: 0;
}

.product-card {
    background: var(--white);
    border-radius: var(--border-radius);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
    height: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
}

.product-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-lg);
}

.product-card .img-wrapper {
    position: relative;
    overflow: hidden;
    height: 220px;
    background: #f0f0f0;
}

.product-card .img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.product-card:hover .img-wrapper img {
    transform: scale(1.08);
}

.product-card h3 {
    padding: 20px;
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--dark-color);
    text-align: center;
    border-top: 1px solid var(--gray-light);
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-card h3 a {
    color: var(--dark-color);
    text-decoration: none;
    transition: var(--transition);
}

.product-card:hover h3 a {
    color: var(--primary-color);
}

/* 查看详情按钮 - 优化后的样式 */
.btn-view {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    background: var(--white);
    color: var(--primary-color);
    border: 2px solid var(--primary-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition);
    box-shadow: 0 2px 8px rgba(0, 86, 179, 0.2);
    z-index: 2;
}

.btn-view:hover {
    background: var(--primary-color);
    color: var(--white);
    transform: translateY(-50%) scale(1.1);
    box-shadow: 0 6px 20px rgba(0, 86, 179, 0.4);
}

.btn-view i {
    font-size: 0.9rem;
}

/* ===== 内容矩阵区域 ===== */
.content-matrix {
   max-width: 1200px;
    margin: 0 auto;
    padding: 40px 20px;
    width: 100%;
    box-sizing: border-box;
}

/* 编辑器模块通用样式 */
.info-column1,
.editor-module,
.editor-module1,
.editor-module-service,
.editor-module-faq {
    background: var(--white);
    border-radius: var(--border-radius);
    padding: 40px;
    margin-bottom: 30px;
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
}

.info-column1:hover,
.editor-module:hover,
.editor-module1:hover,
.editor-module-service:hover,
.editor-module-faq:hover {
    box-shadow: var(--shadow-md);
}

/* 首个内容模块添加渐变边框 */
.info-column1 {
    position: relative;
    background: linear-gradient(135deg, var(--white) 0%, #f8fbff 100%);
    border: 2px solid transparent;
    background-clip: padding-box;
}

.info-column1::before {
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    border-radius: var(--border-radius);
    z-index: -1;
}

/* 服务模块特殊样式 */
.editor-module-service {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-left: 5px solid var(--primary-color);
}

/* ===== 技术规范区域样式优化 ===== */
/* Technical Specifications 标题样式 */
.editor-module h2:contains("Technical Specifications"),
.editor-module h2 span:contains("Technical Specifications"),
.editor-module h3:contains("Technical Specifications") {
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 25px;
    padding-bottom: 15px;
    border-bottom: 3px solid var(--primary-color);
    position: relative;
    display: block;
}

/* 技术规范表格样式 */
.editor-module table,
.editor-module1 table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
    font-size: 0.95rem;
    background: var(--white);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
}

.editor-module table th,
.editor-module1 table th {
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    color: var(--white);
    font-weight: 600;
    padding: 15px 20px;
    text-align: left;
    font-size: 1rem;
    letter-spacing: 0.5px;
}

.editor-module table td,
.editor-module1 table td {
    padding: 12px 20px;
    border-bottom: 1px solid var(--gray-light);
    color: var(--gray-dark);
    font-size: 0.95rem;
    line-height: 1.6;
}

.editor-module table tr:hover,
.editor-module1 table tr:hover {
    background-color: rgba(0, 86, 179, 0.03);
}

.editor-module table tr:last-child td,
.editor-module1 table tr:last-child td {
    border-bottom: none;
}

/* 技术参数文本样式 */
.editor-module strong,
.editor-module1 strong {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1rem;
}

/* ===== 关键特性区域样式优化 ===== */
/* Key Features 标题样式 */
.editor-module h2:contains("Key Features"),
.editor-module h2 span:contains("Key Features"),
.editor-module h3:contains("Key Features"),
.editor-module h2:contains("Advantage"),
.editor-module h2 span:contains("Advantage"),
.editor-module h3:contains("Advantage") {
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--accent-color);
    margin-bottom: 25px;
    padding-bottom: 15px;
    border-bottom: 3px solid var(--accent-color);
    position: relative;
    display: block;
}

/* 特性列表样式 */
.editor-module ul,
.editor-module1 ul {
    list-style: none;
    padding: 0;
    margin: 20px 0;
}


.editor-module ul li,
.editor-module1 ul li {
    padding: 15px 20px;
    margin-bottom: 12px;
    border-left: 4px solid var(--accent-color);
    background: linear-gradient(135deg, #fff8f5 0%, #fff 100%);
    border-radius: 0 8px 8px 0;
    font-size: 1rem;
    line-height: 1.7;
    color: var(--gray-dark);
    transition: all 0.3s ease;
    
}

/* 修改 3: 移除特殊符号，完全依靠左侧边框和背景色来强调，或者保留一个简单的 CSS 图标 */
.editor-module ul li::before,
.editor-module1 ul li::before {
    content: ''; /* 移除了 content: '✓'; */
    position: absolute;
    left: 12px; /* 调整位置 */
    top: 18px; /* 调整位置 */
    width: 8px; /* 缩小尺寸 */
    height: 8px;
    background-color: var(--accent-color);
    border-radius: 2px; /* 小圆角矩形 */
}

.editor-module ul li:hover,
.editor-module1 ul li:hover {
    transform: translateX(5px);
    box-shadow: var(--shadow-sm);
    background: linear-gradient(135deg, #fff0ed 0%, #fff 100%);
}

.editor-module ul li strong,
.editor-module1 ul li strong {
    color: var(--accent-color);
    font-weight: 700;
    font-size: 1.1rem;
    display: block;
    margin-bottom: 5px;
}

/* ===== 应用领域区域样式优化 ===== */
/* Application 标题样式 */
.editor-module h2:contains("Application"),
.editor-module h2 span:contains("Application"),
.editor-module h3:contains("Application") {
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 25px;
    padding-bottom: 15px;
    border-bottom: 3px solid var(--primary-color);
    position: relative;
    display: block;
}

/* 应用列表样式 */
.editor-module .application-list,
.editor-module1 .application-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin: 20px 0;
}

.editor-module .application-item,
.editor-module1 .application-item {
    background: linear-gradient(135deg, #f0f8ff 0%, #fff 100%);
    padding: 25px;
    border-radius: 12px;
    border: 1px solid var(--gray-light);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.editor-module .application-item::before,
.editor-module1 .application-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: linear-gradient(to bottom, var(--primary-color), var(--secondary-color));
}

.editor-module .application-item:hover,
.editor-module1 .application-item:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-md);
    border-color: var(--primary-color);
}

.editor-module .application-item h4,
.editor-module1 .application-item h4 {
    color: var(--primary-color);
    font-size: 1.2rem;
    font-weight: 700;
    margin: 0 0 12px 0;
    display: flex;
    align-items: center;
    position: relative;
}

.editor-module .application-item h4::before,
.editor-module1 .application-item h4::before {
    content: '';
    display: inline-block;
    width: 12px;
    height: 12px;
    background-color: var(--primary-color);
    border-radius: 50%;
    margin-right: 12px;
    margin-top: 2px;
    box-shadow: 0 0 0 3px rgba(0, 86, 179, 0.1);
}

.editor-module .application-item p,
.editor-module1 .application-item p {
    margin: 0;
    color: var(--gray-dark);
    font-size: 0.95rem;
    line-height: 1.6;
    padding-left: 28px;
}

/* ===== 我们的服务区域样式优化 ===== */
/* Our Service 标题样式 */
.editor-module-service h2:contains("Our Service"),
.editor-module-service h2 span:contains("Our Service"),
.editor-module-service h3:contains("Our Service") {
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 25px;
    padding-bottom: 15px;
    border-bottom: 3px solid var(--primary-color);
    position: relative;
    display: block;
}

/* 服务项目样式 */
.editor-module-service .service-item,
.editor-module-service .service-list {
    background: var(--white);
    padding: 20px;
    margin-bottom: 15px;
    border-radius: 8px;
    border-left: 4px solid var(--primary-color);
    box-shadow: var(--shadow-sm);
    transition: all 0.3s ease;
}

.editor-module-service .service-item:hover,
.editor-module-service .service-list:hover {
    transform: translateX(5px);
    box-shadow: var(--shadow-md);
    background: linear-gradient(135deg, #f8fbff 0%, #fff 100%);
}

.editor-module-service .service-item h4,
.editor-module-service .service-list h4 {
    color: var(--primary-color);
    font-size: 1.15rem;
    font-weight: 700;
    margin: 0 0 10px 0;
    display: flex;
    align-items: center;
    position: relative;
}

.editor-module-service .service-item h4::before,
.editor-module-service .service-list h4::before {
    content: '';
    display: inline-block;
    width: 10px;
    height: 10px;
    background-color: var(--secondary-color);
    transform: rotate(45deg);
    margin-right: 12px;
    margin-top: 2px;
}

.editor-module-service .service-item p,
.editor-module-service .service-list p {
    margin: 0;
    color: var(--gray-dark);
    font-size: 0.95rem;
    line-height: 1.6;
}

.editor-module-service strong {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1rem;
}

/* 通用文本优化 */
.editor-module p,
.editor-module1 p,
.editor-module-service p {
    font-size: 1rem;
    line-height: 1.7;
    color: var(--gray-dark);
    margin-bottom: 15px;
}

.editor-module h3,
.editor-module1 h3,
.editor-module-service h3 {
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--dark-color);
    margin: 25px 0 15px 0;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--gray-light);
}

.editor-module h4,
.editor-module1 h4,
.editor-module-service h4 {
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--primary-color);
    margin: 20px 0 12px 0;
}

/* FAQ模块样式 - 带展开/收起功能 */
/* FAQ展开/收起功能样式 */
.editor-module-faq {
    background: linear-gradient(135deg, #fff8f5 0%, #fff 100%);
    border-left: 5px solid var(--accent-color);
    padding: 30px;
    margin-bottom: 30px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

/* FAQ标题样式 */
.editor-module-faq h2 {
    margin-top: 0;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--gray-light);
    margin-bottom: 20px;
    color: var(--accent-color);
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    font-size: 1.5rem;
}

/* FAQ问题样式 */
.editor-module-faq ul {
    padding-left: 0 !important;
    list-style: none !important;
}

.editor-module-faq ul li {
    padding-left: 0 !important;
    list-style-type: none !important;
    margin: 0;
}

/* 问题区域样式 (JS会自动添加 faq-q 类) */
.editor-module-faq .faq-q {
    cursor: pointer;
    padding: 18px 20px;
    padding-right: 50px; /* 给右侧图标留位置 */
    font-weight: 600;
    color: var(--dark-color);
    font-size: 18px;
    border-bottom: 1px solid #e9ecef;
    background-color: var(--white);
    transition: all 0.3s ease;
    position: relative;
    display: flex;
    align-items: center;
}

/* 鼠标悬停效果 */
.editor-module-faq .faq-q:hover {
    background-color: rgba(0, 86, 179, 0.05);
    color: var(--primary-color);
}

/* 激活状态 */
.editor-module-faq .faq-q.active {
    color: var(--primary-color);
    background-color: rgba(0, 86, 179, 0.08);
}

/* 右侧加减号图标 */
.editor-module-faq .faq-q::after {
    content: '+';
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background-color: var(--primary-color);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 18px;
    transition: all 0.3s ease;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

/* 展开时图标变为 X (旋转) */
.editor-module-faq .faq-q.active::after {
    background-color: var(--accent-color);
    transform: translateY(-50%) rotate(45deg);
}

/* 答案区域样式 (JS会自动添加 faq-a 类) */
.editor-module-faq .faq-a {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease-out, padding 0.3s ease;
    background-color: #fafbfc;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.6;
    color: var(--gray-dark);
    border-bottom: 1px solid var(--gray-light);
}

/* 展开状态 */
.editor-module-faq .faq-a.open {
    max-height: 1000px; /* 设置足够大的高度 */
    padding: 20px;
    border-top: 2px solid var(--primary-color);
}

/* 修复span显示问题 */
.editor-module-faq ul li span {
    display: block;
    width: 100%;
}

/* 移动端适配 */
@media (max-width: 768px) {
    .editor-module-faq .faq-q {
        padding: 15px 15px;
        padding-right: 40px;
        font-size: 16px;
    }
    
    .editor-module-faq .faq-q::after {
        right: 15px;
        width: 20px;
        height: 20px;
        font-size: 16px;
    }
    
    .editor-module-faq .faq-a.open {
        padding: 15px;
        font-size: 15px;
    }
}

/* 相关产品部分优化 */
.product-top-section {
    background: var(--light-bg);
    padding: 60px 0;
    position: relative;
    margin-top: -40px;
    z-index: 10;
}

.productList ul.grid-box.four {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.product-card {
    background: var(--white);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.product-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.product-card .img-wrapper {
    position: relative;
    overflow: hidden;
    height: 220px;
    background: #f0f0f0;
}

.product-card .img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.product-card:hover .img-wrapper img {
    transform: scale(1.05);
}

.product-card h3 {
    padding: 20px;
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--dark-color);
    text-align: center;
    border-top: 1px solid var(--gray-light);
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-card h3 a {
    color: var(--dark-color);
    text-decoration: none;
    transition: color 0.3s ease;
}

.product-card:hover h3 a {
    color: var(--primary-color);
}

/* 查看详情按钮 - 简化样式，不显示 */
.btn-view {
    display: none;
}

/* ===== 更多信息区域 ===== */
.more-info {
    background: linear-gradient(135deg, #2544a0 0%, #3e5366 100%);
    padding: 60px 0;
    color: var(--white);
}

.more-info h3 {
    text-align: center;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 40px;
}

.more-info .links-wrapper {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    padding: 0 200px;
}

.more-info .links-wrapper a {
    display: block;
    padding: 20px;
    background: rgba(255, 255, 255, 0.1);
    color: var(--white);
    text-decoration: none;
    border-radius: var(--border-radius);
    text-align: center;
    font-weight: 500;
    transition: var(--transition);
    backdrop-filter: blur(10px);
    font-size: 16px;
}

.more-info .links-wrapper a:hover {
    background: rgba(255, 255, 255, 0.2);
    transform: translateY(-5px);
}

/* ===== SEO公共区域 ===== */
.seoPublic {
    padding: 60px 20px;
    width: 100%;
    box-sizing: border-box;
}

.Auxil-about {
    padding: 50px 0;
}

.Auxil-about .title {
    text-align: center;
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--dark-color);
    margin-bottom: 50px;
    position: relative;
}

.Auxil-about .title::after {
    content: '';
    display: block;
    width: 80px;
    height: 4px;
    background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));
    margin: 20px auto 0;
    border-radius: 2px;
}



.Auxil-about .box.grid-box.two {
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
    box-sizing: border-box;
}

.seoPublic .Auxil-about .box .left{
    width: 50%;
}

.seoPublic .Auxil-about .box .right{
    width: 50%;
    padding-left: 5%;
    padding-top: 20px;
    padding-bottom: 20px;
}

.seoPublic .Auxil-honor .list ul li a{
    display: block;
    width: auto;
    height: 400px;
}

.Auxil-about .left.column .img {
    height: 400px;
    border-radius: var(--border-radius);
    box-shadow: var(--shadow-lg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    overflow: hidden;
}

.Auxil-about .left.column .img::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to bottom, transparent 50%, rgba(0, 86, 179, 0.3) 100%);
}

.Auxil-about .right.column .h3 {
    font-size: 2rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 25px;
}

.Auxil-about .right.column .text {
    font-size: 1.05rem;
    line-height: 1.9;
    color: var(--gray-dark);
}

.Auxil-honor {
    padding: 50px 0 70px;
    background: var(--light-bg);
}

.Auxil-honor .title {
    text-align: center;
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--dark-color);
    margin-bottom: 50px;
    position: relative;
}

.Auxil-honor .title::after {
    content: '';
    display: block;
    width: 80px;
    height: 4px;
    background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));
    margin: 20px auto 0;
    border-radius: 2px;
}

.Auxil-honor ul.grid-box.four {
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
    box-sizing: border-box;
}

.Auxil-honor li.column {
    display: block;
    margin: 0;
}

.Auxil-honor .img-box {
    display: block;
    border-radius: var(--border-radius);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
    aspect-ratio: 4/3;
}

.Auxil-honor .img-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.Auxil-honor .img-box:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-lg);
}

.Auxil-honor .img-box:hover img {
    transform: scale(1.1);
}

/* ===== 底部表单区域 ===== */
.Auxil-form {
    padding: 70px 0;
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
    color: var(--white);
}

.Auxil-form .title {
    text-align: center;
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 50px;
    color: var(--white);
}

.Auxil-form .form {
    background: var(--white);
    border-radius: var(--border-radius);
    padding: 40px;
    box-shadow: var(--shadow-lg);
    max-width: 900px;
    margin: 0 auto;
}

.Auxil-form .form ul.grid-box.two {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.Auxil-form .form li.column {
    display: block;
    margin: 0;
}

.Auxil-form .form li.column.wid-100 {
    grid-column: span 2;
}

.Auxil-form .form input[type="text"],
.Auxil-form .form textarea {
    width: 100%;
    padding: 15px 20px;
    border: 2px solid var(--gray-light);
    border-radius: 8px;
    font-size: 1rem;
    transition: var(--transition);
    font-family: inherit;
    box-sizing: border-box;
}

.Auxil-form .form input[type="text"]:focus,
.Auxil-form .form textarea:focus {
    outline: none;
    border-color: var(--primary-color);
    box-shadow: 0 0 0 4px rgba(0, 86, 179, 0.1);
}

.Auxil-form .form textarea {
    min-height: 150px;
    resize: vertical;
}

.Auxil-form .form input[type="submit"] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
    color: var(--white);
    border: none;
    padding: 18px 40px;
    font-size: 1.1rem;
    font-weight: 600;
    border-radius: 8px;
    cursor: pointer;
    transition: var(--transition);
    width: auto;
    min-width: 200px;
    text-align: center;
}

.Auxil-form .form input[type="submit"]:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(0, 86, 179, 0.3);
}

/* ===== 响应式设计 ===== */

/* 平板设备 */
@media (max-width: 1024px) {
    .productList ul.grid-box.four {
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
    }

    .more-info .links-wrapper {
        grid-template-columns: repeat(2, 1fr);
    }

    .Auxil-about .box.grid-box.two {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .Auxil-about .left.column .img {
        height: 300px;
    }

    .Auxil-honor ul.grid-box.four {
        grid-template-columns: repeat(3, 1fr);
    }

    .tag-hero-section .tag-title {
        font-size: 2.5rem;
    }

    .section-header h2 {
        font-size: 2rem;
    }
}

/* 手机设备 */
@media (max-width: 768px) {
    :root {
        --border-radius: 10px;
    }

    .tag-hero-section {
        padding: 40px 0;
    }

    .tag-hero-section .tag-title {
        font-size: 2rem;
    }

    .hero-section-p {
        font-size: 1.1rem;
    }

    .tag-hero-section .editor-content-1 {
        font-size: 1rem;
    }

    .product-top-section {
        padding: 40px 0;
        margin-top: 0;
    }

    .productList ul.grid-box.four {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }

    .product-card h3 {
        font-size: 0.95rem;
        padding: 15px;
    }

    .btn-view {
        padding: 10px 20px;
        font-size: 0.85rem;
    }

    .content-matrix {
        padding: 40px 0;
    }

    .info-column1,
    .editor-module,
    .editor-module1,
    .editor-module-service,
    .editor-module-faq {
         margin-left: auto;
         margin-right: auto;
    }

    .section-header {
        margin-bottom: 30px;
    }

    .section-header h2 {
        font-size: 1.75rem;
    }

    .more-info {
        padding: 40px 0;
    }

    .more-info h3 {
        font-size: 1.5rem;
        margin-bottom: 30px;
    }

    .more-info .links-wrapper {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .seoPublic {
        padding: 40px 0;
    }

    .Auxil-about {
        padding: 30px 0;
    }

    .Auxil-about .title {
        font-size: 1.75rem;
        margin-bottom: 30px;
    }

    .Auxil-about .right.column .h3 {
        font-size: 1.5rem;
    }

    .Auxil-about .right.column .text {
        font-size: 0.95rem;
    }

    .Auxil-honor {
        padding: 30px 0 40px;
    }

    .Auxil-honor .title {
        font-size: 1.75rem;
        margin-bottom: 30px;
    }

    .Auxil-honor ul.grid-box.four {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }

    .Auxil-form {
        padding: 40px 0;
    }

    .Auxil-form .title {
        font-size: 1.75rem;
        margin-bottom: 30px;
    }

    .Auxil-form .form {
        margin-left: auto;
        margin-right: auto;
    }

    .Auxil-form .form ul.grid-box.two {
        grid-template-columns: 1fr;
    }

    .Auxil-form .form li.column.wid-100 {
        grid-column: span 1;
    }

    .Auxil-form .form input[type="submit"] {
        width: 100%;
    }
}

/* 小屏手机 */
@media (max-width: 480px) {
    .productList ul.grid-box.four {
        grid-template-columns: 1fr;
    }

    .Auxil-honor ul.grid-box.four {
        grid-template-columns: 1fr;
    }

    .tag-hero-section .tag-title {
        font-size: 1.75rem;
    }
}

/* 联系表单板块 - 美观设计版 */
.info-contant {
  max-width: 1200px;
  margin: 80px auto;
  padding: 0 40px;
  position: relative;
}

.info-contant .tit {
  font-size: 1.8rem;
  font-weight: 600;
  color: #0a52e2;
  text-align: center;
  margin-bottom: 40px;
  line-height: 1.5;
  position: relative;
}

.info-contant .tit::after {
  content: '';
  position: absolute;
  bottom: -15px;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  height: 3px;
  background: linear-gradient(90deg, #0a52e2, #60a5fa);
  border-radius: 2px;
}

.info-contant .form.Auxil-form {
  background: #ffffff;
  border-radius: 16px;
  padding: 40px;
  box-shadow: 0 15px 35px rgba(10, 82, 226, 0.08);
  border: 1px solid rgba(10, 82, 226, 0.1);
}

/* 表单布局优化 - 两列布局 */
.info-contant .form.Auxil-form .form-row {
  display: flex;
  gap: 30px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}

.info-contant .form.Auxil-form .form-group {
  flex: 1;
  min-width: 250px;
}

/* 表单元素样式 */
.info-contant .form.Auxil-form input,
.info-contant .form.Auxil-form textarea,
.info-contant .form.Auxil-form select {
  width: 100%;
  padding: 14px 18px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  font-size: 1rem;
  color: #374151;
  background: #f8fafc;
  transition: all 0.3s ease;
  margin-bottom: 0;
}

.info-contant .form.Auxil-form input:focus,
.info-contant .form.Auxil-form textarea:focus,
.info-contant .form.Auxil-form select:focus {
  outline: none;
  border-color: #0a52e2;
  background: #ffffff;
  box-shadow: 0 0 0 3px rgba(10, 82, 226, 0.1);
}

.info-contant .form.Auxil-form textarea {
  min-height: 120px;
  resize: vertical;
}

/* 提交按钮样式 */
.info-contant .form.Auxil-form .submit-btn {
  background: linear-gradient(135deg, #0a52e2, #1e40af);
  color: white;
  border: none;
  padding: 14px 32px;
  border-radius: 8px;
  font-size: 1.1rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
  margin-top: 10px;
  display: inline-block;
}

.info-contant .form.Auxil-form .submit-btn:hover {
  background: linear-gradient(135deg, #1e40af, #0a52e2);
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(10, 82, 226, 0.3);
}

/* 表单标签样式 */
.info-contant .form.Auxil-form label {
  display: block;
  margin-bottom: 8px;
  font-weight: 500;
  color: #374151;
  font-size: 0.95rem;
}

/* 响应式设计 */
@media (max-width: 992px) {
  .info-contant .form.Auxil-form .form-row {
    flex-direction: column;
    gap: 20px;
  }
  
  .info-contant .form.Auxil-form .form-group {
    flex: 1 1 100%;
  }
}

@media (max-width: 768px) {
  .info-contant {
    padding: 0 20px;
  }
  
  .info-contant .tit {
    font-size: 1.5rem;
  }
  
  .info-contant .form.Auxil-form {
    padding: 30px;
  }
  
  .info-contant .form.Auxil-form input,
  .info-contant .form.Auxil-form textarea,
  .info-contant .form.Auxil-form select {
    padding: 12px 16px;
    font-size: 0.95rem;
  }
}

@media (max-width: 480px) {
  .info-contant .tit {
    font-size: 1.3rem;
  }
  
  .info-contant .form.Auxil-form {
    padding: 20px;
  }
  
  .info-contant .form.Auxil-form .submit-btn {
    width: 100%;
    padding: 12px 24px;
    font-size: 1rem;
  }
}

.tag-hero-section .ui.container-info {
  padding: 0 240px;
}
.list-info ul {
  display: flex;
  justify-content: space-between;
}
.list-info {
  padding-left: 330px;
  padding-top: 50px;
}
/* === 样式作用域：仅在这个 Wrapper 内生效 === */
.machinery-scenario-wrapper {
    /* 定义主题色变量 */
    --m-theme-blue: #0056b3;
    --m-light-blue: #eef6ff;
    --m-hover-blue: #e1effe;
    --m-text-dark: #1e293b;
    --m-text-gray: #64748b;
    
    font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    line-height: 1.5;
    margin: 20px 0;
    overflow: hidden; /* 防止圆角溢出 */
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    background-color: #fff;
    border: 1px solid #e2e8f0;
    
    /* 【调整点1】强制整体最小字号为 14px */
    font-size: 14px; 
}

/* 标题样式 */
.machinery-scenario-wrapper h4 {
    background: linear-gradient(to right, var(--m-theme-blue), #004494);
    color: white;
    margin: 0;
    padding: 18px 24px;
    /* 【调整点】标题设为 18px，保持层级 */
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.5px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

/* 表格整体重置 */
.machinery-scenario-wrapper table {
    width: 100% !important; /* 覆盖你原代码的内联样式 */
    border-collapse: collapse;
    border: none !important; /* 去掉原代码的 border="1" */
    border-spacing: 0;
}

/* 表头样式 */
.machinery-scenario-wrapper thead th {
    background-color: #f8fafc;
    color: var(--m-text-dark);
    font-weight: 700;
    text-transform: uppercase;
    /* 【调整点2】表头设为 17px (14px基础上稍大，且小于20px) */
    font-size: 17px;
    padding: 16px;
    text-align: left;
    border-bottom: 2px solid #e2e8f0;
}

/* 普通单元格样式 */
.machinery-scenario-wrapper td {
    padding: 16px;
    border-bottom: 1px solid #f1f5f9;
    color: var(--m-text-dark);
    vertical-align: middle;
    transition: background-color 0.2s ease;
    /* 继承 wrapper 的 14px 字号 */
}

/* 去掉最后一行底边框 */
.machinery-scenario-wrapper tbody tr:last-child td {
    border-bottom: none;
}

/* 鼠标悬停行效果 */
.machinery-scenario-wrapper tbody tr:hover {
    background-color: var(--m-hover-blue);
}

.machinery-scenario-wrapper tbody tr:hover td {
    color: var(--m-theme-blue);
}

/* === 核心：利用 CSS 伪元素添加图标 (不修改 HTML) === */
.machinery-scenario-wrapper tbody td:first-child {
    position: relative;
    padding-left: 50px !important; /* 为图标留出空间 */
    font-weight: 600;
}

/* 图标通用样式 (使用 mask 技术) */
.machinery-scenario-wrapper tbody td:first-child::before {
    content: '';
    position: absolute;
    left: 18px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background-color: var(--m-theme-blue); /* 图标颜色 */
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    transition: background-color 0.2s;
}

/* 悬停时图标变亮 */
.machinery-scenario-wrapper tbody tr:hover td:first-child::before {
    background-color: #0ea5e9;
}

/* --- 不同行的不同图标 --- */

/* 第1行：服装图标 */
.machinery-scenario-wrapper tbody tr:nth-child(1) td:first-child::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z' /%3E%3Cpath d='M20.38 3.4a2 2 0 0 0-2-2h-12.76a2 2 0 0 0-2 2L2 10v1.5a1.5 1.5 0 0 0 3 0V10h1v11a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V10h1v1.5a1.5 1.5 0 0 0 3 0V10l-1.62-6.6z' stroke='white' fill='none' stroke-width='2' /%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath d='M20.38 3.4a2 2 0 0 0-2-2h-12.76a2 2 0 0 0-2 2L2 10v1.5a1.5 1.5 0 0 0 3 0V10h1v11a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V10h1v1.5a1.5 1.5 0 0 0 3 0V10l-1.62-6.6z' stroke='white' fill='none' stroke-width='2' /%3E%3C/svg%3E");
}

/* 第2行：家纺图标 */
.machinery-scenario-wrapper tbody tr:nth-child(2) td:first-child::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='white'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6' /%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='white'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6' /%3E%3C/svg%3E");
}

/* 第3行：沙发/家具图标 */
.machinery-scenario-wrapper tbody tr:nth-child(3) td:first-child::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='white'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 12h14M5 12a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v4a2 2 0 01-2 2M5 12v7a2 2 0 002 2h10a2 2 0 002-2v-7' /%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='white'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 12h14M5 12a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v4a2 2 0 01-2 2M5 12v7a2 2 0 002 2h10a2 2 0 002-2v-7' /%3E%3C/svg%3E");
}

/* 第4行：星形/精细图标 */
.machinery-scenario-wrapper tbody tr:nth-child(4) td:first-child::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='white'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M11.049 2.927c.3-.921 1.603-.921 1.902 0l1.519 4.674a1 1 0 00.95.69h4.915c.969 0 1.371 1.24.588 1.81l-3.976 2.888a1 1 0 00-.363 1.118l1.518 4.674c.3.922-.755 1.688-1.538 1.118l-3.976-2.888a1 1 0 00-1.176 0l-3.976 2.888c-.783.57-1.838-.197-1.538-1.118l1.518-4.674a1 1 0 00-.363-1.118l-3.976-2.888c-.784-.57-.38-1.81.588-1.81h4.914a1 1 0 00.951-.69l1.519-4.674z' /%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='white'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M11.049 2.927c.3-.921 1.603-.921 1.902 0l1.519 4.674a1 1 0 00.95.69h4.915c.969 0 1.371 1.24.588 1.81l-3.976 2.888a1 1 0 00-.363 1.118l1.518 4.674c.3.922-.755 1.688-1.538 1.118l-3.976-2.888a1 1 0 00-1.176 0l-3.976 2.888c-.783.57-1.838-.197-1.538-1.118l1.518-4.674a1 1 0 00-.363-1.118l-3.976-2.888c-.784-.57-.38-1.81.588-1.81h4.914a1 1 0 00.951-.69l1.519-4.674z' /%3E%3C/svg%3E");
}

/* 第5行：层叠/针织图标 */
.machinery-scenario-wrapper tbody tr:nth-child(5) td:first-child::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='white'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10' /%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='white'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10' /%3E%3C/svg%3E");
}