﻿/* 基础重置 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: Arial, sans-serif;
}

/* 容器样式（1200px宽度） */
.container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* 可替换元素标签 */

.replaceable-img-container {
    background: #f5f5f5; /* 图片占位背景 */
}

/* ====================== 全局标题样式 不改颜色 保留原有 ====================== */
/* ====================== 全局导航样式 ====================== */
.navbar {
    background: #fff;
    padding: 15px 0;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    position: relative;
    z-index: 999;
}
.navbar .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
}
.navbar .nav-links a.active {
    color: #006DAB;
    font-weight: 600;
}
.logo img {
    height: 30px;
}
.nav-links {
    display: flex;
    list-style: none;
    gap: 30px;
    margin: 0;
    padding: 0;
}
.nav-links a {
    text-decoration: none;
    color: #333;
    font-size: 16px;
    white-space: nowrap;
}
.mobile-menu-btn {
    display: none;
    font-size: 26px;
    color: #333;
    background: none;
    border: none;
    cursor: pointer;
}
.has-submenu {
    position: relative; /* 子菜单和按钮的定位容器 */
	display: block;
}


.has-submenu > a {
    /* 使用悬停效果与"+"按钮一致 */
    pointer-events: auto !important;
    display: block;
    width: calc(100% - 44px); /* 为右侧按钮预留空间 */
  }


.sub-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* ====================== 修复1：PC端隐藏+按钮，优先级最高 ====================== */
.submenu-toggle {
    display: none !important; /* 默认全部隐藏 */
}

/* ====================== 桌面端 (>1024px) ====================== */
@media screen and (min-width: 1025px) {
    .mobile-menu-btn {
        display: none !important;
    }
    .nav-links {
        position: static !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        flex-direction: row !important;
        width: auto !important;
        background: transparent !important;
        padding: 0 !important;
        transition: none !important;
    }
    .Daohangxiala-toggle {
        display: none !important;
    }
    /* 子菜单悬停时显示 */
    .sub-menu {
        position: absolute;
        top: 100%;
        left: 0;
        background: #fff;
        min-width: 180px;
        box-shadow: 0 4px 8px rgba(0,0,0,0.1);
        padding: 8px 0;
        display: none;
    }
    .sub-menu a {
        display: block;
        padding: 8px 20px;
        font-size: 15px;
    }
    .sub-menu a:hover {
        background: #f5f5f5;
        color: #006DAB;
    }
    .has-submenu:hover .sub-menu {
        display: block;
    }
}

/* ====================== 手机+平板 (<=1024px) 响应式修改 ====================== */
/* ====================== 手机+平板 (<=1024px) 响应式修改 ====================== */
@media screen and (max-width: 1024px) {
    .mobile-menu-btn {
        display: block;
    }
    .nav-links {
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: #fff;
        flex-direction: column;
        padding: 0;
        gap: 0;
        box-shadow: 0 4px 5px rgba(0,0,0,0.1);
        opacity: 0;
        visibility: hidden;
        transform: translateY(-10px);
        transition: opacity 0.3s ease, transform 0.3s ease;
    }
    .nav-links.active {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }
    .nav-links a {
        font-size: 18px;
        color: #333;
        padding: 15px 20px !important;
        display: block;
        width: calc(100% - 64px);
        text-align: left !important;
        pointer-events: auto !important;
		line-height: 1.2 !important; /* 固定行高，确保菜单高度稳定 */
    }

    /* 导航链接样式 */
    .nav-links li {
        border-bottom: 1px solid #eee;
        width: 100%;
        position: relative;
    }
    .nav-links li:last-child {
        border-bottom: none;
    }

    /* ====================== 修复按钮固定位置，不随滚动 ====================== */
    .submenu-toggle {
        display: flex !important;
        width: 44px;
        height: 44px;
        position: absolute;
        /* 新版固定top值，位于导航高度(48px)基准之上 */
        top: 4px; 
        right: 0;
        align-items: center;
        justify-content: center;
        font-size: 22px;
        font-weight: 300;
        color: #333;
        cursor: pointer;
        /* 只保留旋转，删除多余位置样式 */
        transition: transform 0.3s ease, color 0.3s ease;
        z-index: 10;
        background: transparent;
    }
    /* 展开状态旋转45度，位置完全固定 */
    .submenu-toggle.active {
        transform: rotate(45deg); /* 删除translateY，只旋转 */
        color: #006DAB;
    }

    /* 子菜单样式 */
    .sub-menu {
        display: none;
        padding-left: 20px !important;
        background: #fafafa;
        width: 100%;
    }
    .sub-menu.active {
        display: block;
    }
    .sub-menu li {
        border-bottom: 1px solid #eee;
        width: 100%;
    }
    .sub-menu li:last-child {
        border-bottom: none;
    }
    .sub-menu a {
        color: #666 !important;
        font-size: 16px !important;
        padding: 12px 20px !important;
        text-align: left !important;
        width: 100% !important;
    }
    .sub-menu a:hover {
        color: #006DAB !important;
    }

    /* 删除多余的伪元素箭头 */
    .has-submenu::after {
        display: none !important;
    }
}




























/* 通屏Banner */
.banner {
    width: 100%;
    height: 720px;
    position: relative;
    overflow: hidden;
}

/* 🔥 整张 Banner 背景图 + 灰色半透明蒙版 */
.banner-main {
    width: 100%;
    height: 100%;
    background: #e9e9e9;
    background-image:
        /* 灰色半透明蒙版 */
        linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
        /* 你的 Banner 图 */
        url(../img/Banner.jpg);
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 20px;
}

.banner-content {
    text-align: center;
    max-width: 900px;
    z-index: 2; /* 保证文字在蒙版上面 */
}
.banner h1 {
    font-size: 50px;
    margin-bottom: 20px;
    color: #fff; /* 文字改成白色更清晰 */
}
.banner h2 {
    font-size: 25px;
    margin-bottom: 15px;
    color: #fff; /* 文字改成白色更清晰 */
}
.banner p {
    font-size: 25px;
    color: #fff; /* 文字改成白色更清晰 */
}

/* 修改后：黄色半透明条，内容自适应高度，全设备通用 */
.banner-yellow-bar {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    /* 删除固定高度，仅保留内边距，永不溢出 */
    padding: 24px 0;
    background: rgba(234,255,85,0.90);
    display: flex;
    align-items: center;    /* 垂直居中 */
    justify-content: center; /* 水平居中 */
    z-index: 3;
}

/* 新版内容宽度自适应，不超出屏幕 */
.banner-yellow-bar .container {
    width: 100%;
    max-width: 1200px;
    padding: 0 20px; /* 文字居中，手机端适配 */
    text-align: center; /* 文字居中 */
}

/* 标题样式 */
.banner-yellow-bar .section-title {
    margin: 0 0 2px !important;
    font-size: 16px;
    color: #d32f2f;
    font-weight: 600;
	text-align: center !important;
}

/* 黄色条文字样式 */
.banner-yellow-bar p {
    margin: 0 !important;;
    font-size: 14px;
    line-height: 1.5;
    color: #000000;
	text-align: center !important;
}

/* ============================================== */
/* 手机区间（屏幕宽度 小于 480px） */
/* ============================================== */
@media (max-width: 480px) {
    .banner-yellow-bar {
        padding: 20px 0; /* 手机端文字缩小一点 */
    }
    .banner-yellow-bar .section-title {
        font-size: 15px; /* 文字缩小一点 */
		margin: 0 0 2px !important;
    }
    .banner-yellow-bar p {
        font-size: 13px; /* 文字缩小一点 */
    }
}

/* ============================================== */
/* 平板区间（屏幕宽度 481px ~ 768px） */
/* ============================================== */
@media (min-width: 481px) and (max-width: 768px) {
    .banner-yellow-bar {
        padding: 22px 0; /* 平板端文字缩小一点 */
    }
}

/* 厂房展示区 */
.factories {
    padding: 40px 0;
}

.factories-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

/* 卡片阴影略深，增强悬浮效果 */
.factory-card {
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0,0,0,0.15); /* 默认阴影略深一点 */
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 卡片悬停上浮+阴影加强，触屏变蓝 */
.factory-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.20); /* 悬停阴影浓度加深 */
}

/* 图片加遮罩（利用第二层原理） */
.factory-img {
    position: relative;
    overflow: hidden;
}

.factory-img::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 1;
}

.factory-img img {
    width: 100%;
    height: 280px;
    object-fit: cover;
    vertical-align: top;
    display: block;
}

/* 导航链接样式 */
.factory-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    z-index: 2;
    white-space: nowrap;
    text-align: center;
}

.factory-text h4 {
    font-size: 30px;
    margin-bottom: 5px;
    font-weight: 600;
}

.factory-text p {
    font-size: 20px;
    color: #fff;
    opacity: 0.9;
}

/* 按钮悬停时文字变蓝（触屏变蓝） */
.factory-btn {
    display: inline-block;
    padding: 10px 28px;
    margin-top: 20px;
    background: #006DAB;
    color: #fff;
    border-radius: 30px;
    font-weight: 600;
    font-size: 14px;
    transition: all 0.3s ease;
    cursor: pointer;
}

/* 按钮悬停时文字变蓝上浮 */
.factory-btn:hover {
    background: #005a8d;
    transform: translateY(-2px);
}

/* 平板适配 */
@media screen and (max-width: 1024px) {
    .factory-img img {
        height: 220px;
    }
    .factory-text h4 {
        font-size: 24px;
    }
    .factory-text p {
        font-size: 16px;
    }
    .factory-btn {
        padding: 8px 22px;
        font-size: 13px;
        margin-top: 15px;
    }
}

/* 手机适配 */
@media screen and (max-width: 768px) {
    .factories-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .factory-img img {
        height: 250px;
    }
    .factory-text h4 {
        font-size: 20px;
    }
    .factory-text p {
        font-size: 16px;
    }
    .factory-btn {
        padding: 8px 24px;
        font-size: 13px;
        margin-top: 15px;
    }
}

/* 品牌区 新版式（替代原container样式） */
.brands {
  padding: 40px 0; /* 上下间距，勿删 */
}
/* 新版分隔线，独立控制下方留白（防止分隔线丢失问题） */
.brands-divider {
  height: 1px; /* 分隔线高度 */
  background-color: #ccc; /* 分隔线颜色浅灰（可修改） */
  width: 100%; /* 分隔线占满宽度 */
  margin: 20px 0; /* 分隔线与图片/文字的间距 */
}
/* 图片容器无左右内边距，让图片全宽 */
.brand-container {
  width: 100%;
  padding: 0; /* 内容内边距 */
  margin: 0; /* 导航链接样式 */
  text-align: center;
}
/* 新版Logo图片宽度自适应，无间距、不裁切 */
.brand-long-img {
  width: 100%; /* 新版图片100%宽度，自动缩放（解决图片小被居中问题） */
  max-width: 100%; /* 图片最大宽度，不放大 */
  height: auto; /* 图片显示为块级元素 */
  display: block; /* 去除图片底部默认空白 */
}

/* 响应式适配（手机/平板自动换列） */
@media (max-width: 768px) {
  .brands {
    padding: 30px 15px;
  }
  .brands-divider {
    margin: 15px 0;
  }
}


/* ======================
   产品区 新样式（桌面端）
====================== */
.products {
  padding: 50px 0;
}
.products-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 25px;
  margin-top: 30px;
}
.product-card {
  text-align: center;
  transition: all 0.3s ease;
}
/* 修正图片全站通用 */
.product-card img {
  width: 100%;
  /* 关键代码：1:1 正方形裁剪，取代固定高度 */
  aspect-ratio: 1 / 1;
  /* 图片按正方形裁剪，不拉伸 */
  object-fit: cover;
  border-radius: 4px;
  vertical-align: top; /* 去除图片底部空白 */
  display: block; /* 去除图片底部空白 */
}
.product-card h4 {
  margin: 12px 0 5px;
  font-size: 16px;
  font-weight: 600;
}
.product-card p {
  font-size: 14px;
  color: #666;
  margin: 0;
}

/* ======================
   平板区间（768px~1024px）
====================== */
@media screen and (max-width: 1024px) {
  .products {
    padding: 40px 15px;
  }
  .products-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
  /* 正方形比例保持不变，不改高度 */
}

/* ======================
   手机区间（≤768px）
====================== */
@media screen and (max-width: 768px) {
  .products {
    padding: 35px 15px;
  }
  .products-grid {
    grid-template-columns: 1fr;
    gap: 25px;
  }
  .product-card h4 {
    font-size: 17px;
  }
}


/* 技术板块 */
.technology {
    padding: 40px 0;
}
.tech-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}
.tech-card img {
    width: 100%;
    height: 280px;
    object-fit: cover;
	vertical-align: top; /* 去除图片底部空白 */
    display: block; /* 去除图片底部空白 */
}

/* ======================
   证书区 - 新版样式：logo放大+间距缩小+固定宽度
====================== */
.certificates {
  padding: 40px 0;
}

/* 桌面端：一行显示 + 无需换行 + 控制大小 */
.cert-grid {
  display: flex;
  flex-wrap: nowrap;
  /* 关键修改1：用 center + padding 代替 space-between 实现可控间距 */
  justify-content: center; /* 分为两行排列 */
  align-items: center;
  /* 关键修改2：通过调整padding控制左右间距（可微调数值） */
  padding: 0 10px; /* 左右各30px，控制间距在10-50px范围 */
  gap: 35px; /* 直接控制图片间距（原8px放大12px，间距更大） */
  margin-top: 20px;
  width: 100%;
}

/* 桌面端LOGO放大尺寸 */
.cert-grid img {
  height: 50px;           /* logo放大，醒目效果 */
  width: auto;
  object-fit: contain;
  display: block;
}

/* ======================
   平板端（≤1024px）自动换行
====================== */
@media screen and (max-width: 1024px) {
  .cert-grid {
    flex-wrap: wrap;      /* 平板自动换行 */
    justify-content: center;
    gap: 12px 15px;
  }
  .cert-grid img {
    height: 45px;
  }
}

/* ======================
   手机端（≤768px）底部回收
====================== */
@media screen and (max-width: 768px) {
  .certificates {
    padding: 30px 0;
  }
  .cert-grid {
    flex-wrap: wrap;      /* 手机自动换行 */
    justify-content: center;
    gap: 10px 12px;
  }
  .cert-grid img {
    height: 40px;
  }
}


/* ===================== 页脚区 ===================== */
/* 页脚基础样式 */
.footer {
  background-color: #E7F5FF;
}
.footer-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 50px 20px;
}
.footer-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 65px;
  align-items: stretch;
}
.footer-col.left-col {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* Logo 样式 */
.footer-logo {
  margin-bottom: 20px;
}
.footer-logo img {
  height: 46px;
}
.logo-site {
  display: block;
  color: #666;
  font-size: 15px;
  margin-left: 72px;
}

/* ===================== 核心间距规则（仅缩小模块间间距） ===================== */
.footer-module {
  margin-bottom: 30px;
}
/* 核心：仅左侧模块 缩小间距（单独控制，右侧不受任何影响） */
.footer-left-content .footer-module {
  margin-bottom: 18px; /* 只改这里！单独缩小左侧模块间距 */
}
/* 最后一个模块取消底部间距（全局通用） */
.footer-module:last-child {
  margin-bottom: 0;
}

/* 模块内样式：完全不动，保持你调好的紧凑间距 */
.footer-title {
  font-weight: bold;
  font-size: 17px;
  margin: 0 0 5px 0;
  line-height: 1.4;
}
.footer-left-content p,
.footer-right-content p {
  font-size: 16px;
  line-height: 1.4;
  margin: 1px 0;
  color: #222;
}

/* 链接样式 */
a {
  color: #006DAB;
  text-decoration: none;
}

/* ===================== 版权区 ===================== */
.footer-copyright {
  background-color: #006DAB;
  padding: 17px 0; /* 仅上下内边距，无左右，防止超宽 */
}
/* 核心：和页脚使用同款容器，完美对齐不超出 */
.copy-wrap {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px; /* 和页脚一致的左右内边距 */
  display: flex;
  justify-content: space-between; /* 左右分开 */
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
/* 版权文字：左对齐 */
.copy-left {
  color: #ffffff;
  font-size: 16px;
  text-align: left;
}
/* 链接按钮：右对齐 */
.copy-right {
  text-align: right;
	color: #ffffff;
}
.copy-right a {
  color: #ffffff;
  padding: 0 7px;
  text-decoration: none;
}

/* 移动端适配 */
@media screen and (max-width:768px) {
  .footer-grid {
    grid-template-columns: 1fr;
    gap: 35px;
  }
  .copy-wrap {
    flex-direction: column;
    gap:10px;
    text-align: center;
  }
}

/* 修正导航英文错位（垂直居中，防换行） */
.nav-links {
  /* 强制所有按钮垂直居中，防止英文错位 */
  align-items: center !important;
}
.nav-links a {
  /* 统一文字垂直对齐 + 固定行高，防错位 */
  vertical-align: middle;
  line-height: 1.2 !important;
}
/* 修正Logo与导航按钮间距，杜绝任何重叠 */
.logo {
  /* Logo右侧添加固定间距（可改为任意值，20px/30px/40px） */
  margin-right: 30px !important;
  display: flex;
  align-items: center;
}

/* ======================
   全局统一标题（可调整任何页面标题）
====================== */
.section-title {
  /* 标题样式 */
  text-align: left !important;       /* 文字左对齐（固定值） */
  margin-bottom: 20px !important;    /* 模块间距（可调） */
  margin-top: 0 !important;
  padding: 0 !important;

  /* 标题样式：全站通用（可修改） */
  font-weight: 700 !important;       /* 加粗（固定值） */
  font-size: 24px !important;        /* 桌面端标题大小（可调） */
  line-height: 1.2 !important;       /* 固定行高（固定值） */
}

/* 手机区间（小屏自动缩小文字+间距） */
@media screen and (max-width: 768px) {
  .section-title {
    font-size: 20px !important;      /* 手机端模块间距（可调） */
    margin-bottom: 15px !important;  /* 手机端模块间距（可调） */
  }
}


/* ======================
   内页Banner标题定位，确保覆盖导航
====================== */
.inner-page-banner {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
}

.inner-page-banner .banner-bg {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    object-fit: cover !important;
    min-height: 200px !important; /* 桌面端默认高度 */
    margin: 0 !important;
    padding: 0 !important;
}

/* 内容高度=内容高度，自动确定 */
.inner-banner-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    /* 删除height:100%，高度由内容自动撑开 */
    height: auto !important;
    z-index: 2;
    /* 只作用于当前区块内，不影响全局 */
    background: linear-gradient(to bottom, 
        rgba(0, 0, 0, 0.30) 12%, 
        rgba(0, 0, 0, 0.20) 70%, 
        rgba(0, 0, 0, 0.2) 100%);
    display: flex;
    align-items: flex-start;
    /* 内容内边距（平板适配，上下范围内调整） */
    padding-top: 18px !important;
    padding-bottom: 15px !important;
    box-sizing: border-box;
}

.inner-banner-content .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
}

/* 左上角logo */
.inner-logo {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}
.inner-logo img {
    height: 50px;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.3));
}
.inner-logo span {
    font-size: 14px;
    color: #ffffff;
    font-weight: 600;
    text-shadow: 0 1px 3px rgba(0,0,0,0.6);
}

/* 右侧导航 */
.inner-nav {
    display: flex;
    list-style: none;
    gap: 35px;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.inner-nav a {
    text-decoration: none;
    color: #ffffff !important;
    font-size: 14px;
    font-weight: 600 !important;
    text-shadow: 0 1px 3px rgba(0,0,0,0.6);
    white-space: nowrap;
}
.inner-nav a:hover,
.inner-nav a.active {
    color: #F08519 !important;
}

/* 小屏自动换行 */
.inner-banner-bar {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    padding: 8px 0 !important;
    margin: 0 !important;
    box-sizing: border-box;
}

/* ==============================================
   平板响应式适配（自动调整导航高度）
============================================== */
@media screen and (max-width: 1024px) {
    .inner-banner-content {
        padding-top: 15px !important;
        padding-bottom: 12px !important;
    }
    .inner-logo img {
        height: 45px;
    }
    .inner-nav {
        gap: 25px;
    }
    .inner-nav a {
        font-size: 13px;
    }
    .inner-banner-bar {
        padding: 7px 0 !important;
    }
    
    /* 平板端微调Banner高度 */
    .inner-page-banner .banner-bg {
        min-height: 240px !important;
    }
}

/* ==============================================
   手机端适配（放大Banner高度）
============================================== */
@media screen and (max-width: 768px) {
    .inner-banner-content {
        padding-top: 12px !important;
        padding-bottom: 15px !important;
    }
    .inner-banner-content .container {
        flex-direction: column;
        gap: 12px;
        justify-content: flex-start;
    }
    .inner-logo img {
        height: 40px;
    }
    .inner-logo span {
        font-size: 13px;
    }
    .inner-nav {
        gap: 18px;
        justify-content: center;
    }
    .inner-nav a {
        font-size: 12px;
    }
    .inner-banner-bar {
        padding: 6px 0 !important;
    }
    .inner-banner-bar p {
        font-size: 12px !important;
        margin: 0 !important;
    }
    
    /* 手机端Banner高度从180px放大到280px */
    /* 内容加高留白，防止内容垂直溢出 */
    .inner-page-banner .banner-bg {
        min-height: 280px !important;
    }
}

/* ==============================================
   小屏手机区间（≤480px）
============================================== */
@media screen and (max-width: 480px) {
    /* 小屏手机微调大一点，防止小标题被切 */
    .inner-page-banner .banner-bg {
        min-height: 300px !important;
    }
}

/* ======================
   内页内容容器样式
====================== */
.inner-content {
    padding: 60px 0;
    background-color: #ffffff;
}

/* 通栏板块 */
.factory-overview,
.production-workshop,
.core-advantages {
    margin-bottom: 60px;
}

/* 总览布局 左右分栏 */
.overview-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: center;
}

.overview-text p {
    font-size: 15px;
    line-height: 1.8;
    color: #333333;
    margin-bottom: 15px;
}

.overview-img img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* 车间布局 每行多列 */
.workshop-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.workshop-item {
    text-align: center;
}

.workshop-item img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 8px;
    margin-bottom: 15px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.workshop-item h4 {
    font-size: 16px;
    font-weight: 600;
    color: #222222;
    margin-bottom: 8px;
}

.workshop-item p {
    font-size: 14px;
    line-height: 1.6;
    color: #666666;
}

/* 车间布局 每行多列 */
.advantages-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

.advantage-item {
    text-align: center;
    padding: 30px 20px;
    background-color: #f8f9fa;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.advantage-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

.advantage-icon {
    font-size: 40px;
    margin-bottom: 15px;
}

.advantage-item h4 {
    font-size: 16px;
    font-weight: 600;
    color: #222222;
    margin-bottom: 10px;
}

.advantage-item p {
    font-size: 14px;
    line-height: 1.6;
    color: #666666;
}

/* ==============================================
   平板响应式适配（≤1024px）
============================================== */
@media screen and (max-width: 1024px) {
    .overview-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .overview-img {
        order: -1; /* 图片居于上方 */
    }
    
    .workshop-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .advantages-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ==============================================
   手机端适配（≤768px）
============================================== */
@media screen and (max-width: 768px) {
    .inner-content {
        padding: 40px 0;
    }
    
    .factory-overview,
    .production-workshop,
    .core-advantages {
        margin-bottom: 40px;
    }
    
    .workshop-grid {
        grid-template-columns: 1fr;
    }
    
    .advantages-grid {
        grid-template-columns: 1fr;
    }
    
    .overview-img img {
        height: 220px;
    }
    
    .workshop-item img {
        height: 180px;
    }
}


/* ======================
   产品系列页样式（带二级导航+彩色文字）
====================== */
.product-series-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 20px;
}

.product-series-item {
    position: relative;
    background-color: #f5f5f5;
    border-radius: 8px;
    height: 220px;
    text-align: center;
    overflow: hidden;
    transition: all 0.3s ease;
    cursor: pointer;
}

.product-series-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

/* 默认logo */
.product-series-logo {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -60%);
    max-width: 80%;
    max-height: 120px;
    object-fit: contain;
    transition: opacity 0.4s ease;
    z-index: 2;
}

/* hover产品图 */
.product-series-hover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity 0.4s ease;
    opacity: 0;
    z-index: 1;
}

/* 底部文字区域，默认隐藏 */
.product-series-item::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50px; /* 渐变高度 */
    background: linear-gradient(to top, rgba(0,0,0,0.7), rgba(0,0,0,0));
    opacity: 0;
    transition: opacity 0.4s ease;
    z-index: 2;
    pointer-events: none;
}

/* 产品标题 */
.product-series-item h4 {
    position: absolute;
    bottom: 15px;
    left: 0;
    width: 100%;
    margin: 0;
    padding: 0 15px;
    font-size: 14px;
    font-weight: 600;
    color: #333333;
    box-sizing: border-box;
    transition: all 0.4s ease;
    z-index: 3;
}

/* hover状态切换 */
.product-series-item:hover .product-series-logo {
    opacity: 0;
}
.product-series-item:hover .product-series-hover {
    opacity: 1;
}
.product-series-item:hover::after {
    opacity: 1; /* 悬停显示底部标题 */
}
.product-series-item:hover h4 {
    color: #ffffff !important; /* 文字改为白色 */
    font-weight: 700 !important; /* 加粗 */
    text-shadow: 0 1px 2px rgba(0,0,0,0.5); /* 添加微阴影 */
}

/* 平板适配 */
@media screen and (max-width: 1024px) {
    .product-series-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 18px;
    }
    .product-series-item {
        height: 200px;
    }
}

/* 手机适配 */
@media screen and (max-width: 768px) {
    .product-series-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }
    .product-series-item {
        height: 180px;
    }
    .product-series-item h4 {
        font-size: 13px;
        bottom: 12px;
    }
}


/* ==================================================
   产品详情页Banner：固定600px高度，适配1920*600px图片
================================================== */
/* 1. 固定600px高度，适配1920*600px图片 */
.series-detail-banner {
    height: 600px !important;
}

.series-detail-banner .banner-bg {
    height: 100% !important;
    object-fit: cover !important;
    display: block !important; /* 强制显示图片，防止被遮挡 */
}

/* 2. 半透明遮罩层覆盖Banner，修改定位继承全局absolute */
.series-detail-banner .inner-banner-content {
    height: 100% !important; /* 新版内页Banner */
    background: rgba(0, 0, 0, 0.2) !important; /* 半透明，可调整深浅 */
    padding: 0 !important; /* 去掉原内容内边距 */
    /* 删除此处的position: relative，继承全局的position: absolute */
    /* 全局定位top:0; left:0; width:100%; z-index:2; 避免重复 */
}

/* 3. 调整logo和标题位置，可修改20px调整上下间距 */
.series-detail-banner .inner-banner-content .container {
    position: relative !important;
    z-index: 5 !important; /* 保证内容在Banner上方 */
    margin-top: 20px !important; /* 新版标题与内容上方间距 */
}

/* 4. 标题绝对定位，置于Banner中间 */
.series-detail-banner .banner-main-title {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    color: #ffffff !important;
    font-size: 42px !important;
    font-weight: 700 !important;
    text-align: center !important;
    margin: 0 !important;
    text-shadow: 0 2px 6px rgba(0, 0, 0, 0.7) !important;
    line-height: 1.2 !important;
    z-index: 10 !important; /* 文字内容上浮 */
    width: 90% !important;
}

/* ==============================================
   平板区间（≤1024px）
============================================== */
@media screen and (max-width: 1024px) {
    .series-detail-banner {
        height: 500px !important;
    }
    .series-detail-banner .banner-main-title {
        font-size: 36px !important;
    }
    .series-detail-banner .inner-banner-content .container {
        margin-top: 18px !important;
    }
}

/* ==============================================
   手机区间（≤768px）
============================================== */
@media screen and (max-width: 768px) {
    .series-detail-banner {
        height: 400px !important;
    }
    .series-detail-banner .banner-main-title {
        font-size: 28px !important;
    }
    .series-detail-banner .inner-banner-content .container {
        margin-top: 15px !important;
    }
}



/* ==================================================
   产品详情页样式（最新修改版）
================================================== */
/* 面包屑全站通用 */
.product-detail-breadcrumb {
    font-size: 14px;
    color: #666;
    margin-bottom: 50px;
    line-height: 1.5;
}
.product-detail-breadcrumb a {
    color: #006DAB;
    text-decoration: none;
}
.product-detail-breadcrumb a:hover {
    text-decoration: underline;
}
.product-detail-breadcrumb span {
    margin: 0 8px;
    color: #999;
}
.product-detail-breadcrumb .current {
    color: #333;
    font-weight: 500;
}

/* 筛选条全站通用 */
.product-detail-filter {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 40px;
}
.filter-btn {
    padding: 8px 20px;
    border: 1px solid #ddd;
    background: #fff;
    color: #333;
    font-size: 14px;
    border-radius: 20px;
    cursor: pointer;
    transition: all 0.3s ease;
}
.filter-btn:hover {
    border-color: #006DAB;
    color: #006DAB;
}
.filter-btn.active {
    background: #006DAB;
    border-color: #006DAB;
    color: #fff;
}

/* 产品详情Flex布局，gap控制间距 */
.product-detail-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
    position: relative; /* 为内页元素提供定位上下文 */
}

/* 产品卡片默认状态（全站通用） */
.product-detail-card {
    width: calc(25% - 18.75px); /* 4列布局 */
    flex-shrink: 0;
    overflow: hidden;
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    will-change: opacity, transform;
}
.product-detail-card a {
    text-decoration: none;
    color: inherit;
    display: block;
}

/* 图片样式优化（全站通用，不影响其他效果） */
.product-img-wrap {
    width: 100%;
    aspect-ratio: 3 / 2;
    overflow: hidden;
    background: #f8f8f8;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    margin-bottom: 12px;
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
.product-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}
.product-detail-card:hover .product-img-wrap {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.1);
}
.product-detail-card:hover .product-img-wrap img {
    transform: scale(1.05);
}

/* 新版文字区域全站通用样式 */
.product-text-wrap {
    text-align: center;
    border: none;
    background: transparent;
    padding: 0;
}
.product-text-wrap h4 {
    margin: 0 0 4px 0;
    font-size: 15px;
    font-weight: 600;
    color: #333;
    line-height: 1.4;
}
.product-model {
    margin: 0;
    font-size: 13px;
    color: #666;
    border: none;
    padding: 0;
    margin-inline: 0;
}

/* 修改隐藏元素，全站通用，不影响其他模块 */
.product-detail-card.hidden {
    opacity: 0;
    transform: scale(0.8) translateY(20px);
    pointer-events: none;
    /* 关键视觉重排：提前占位，防止文字内容跳闪 */
    visibility: hidden;
}

/* 响应式（标准适配） */
@media screen and (max-width: 1024px) {
    .product-detail-grid {
        gap: 20px;
    }
    .product-detail-card {
        width: calc(33.333% - 13.333px); /* 3列布局 */
    }
}
@media screen and (max-width: 768px) {
    .product-detail-breadcrumb {
        font-size: 13px;
        margin-bottom: 30px;
    }
    .product-detail-filter {
        gap: 8px;
        margin-bottom: 30px;
    }
    .filter-btn {
        padding: 6px 14px;
        font-size: 12px;
    }
    .product-detail-grid {
        gap: 15px;
    }
    .product-detail-card {
        width: calc(50% - 7.5px); /* 2列布局 */
    }
    .product-text-wrap h4 {
        font-size: 14px;
    }
    .product-model {
        font-size: 12px;
    }
}




/* ==================================================
   单品详情页样式（1:1还原+手动布局版）
================================================== */
.single-product-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px 80px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    color: #333;
    line-height: 1.6;
}

/* 上半部分：主图区域 */
.product-top-section {
    display: grid;
    grid-template-columns: 1.3fr 0.7fr; /* 图片宽度加大，和参考图一致 */
    gap: 60px;
    margin-bottom: 80px;
    align-items: start;
}

/* ====================== 新版产品滑块区样式 ====================== */
.product-slider-container {
    background-color: #f8f8f8; /* 系列图浅色边框 */
    position: relative;
    overflow: hidden;
    cursor: grab; /* 拖拽提示 */
}
.product-slider-container:active {
    cursor: grabbing; /* 按住时显示拖拽光标 */
}
.product-slider-track {
    display: flex;
    transition: transform 0.3s ease; /* 平板切换布局 */
}
.product-slide {
    flex-shrink: 0;
    width: 100%;
    padding: 0px 0px; /* 系列图与图片内边距 */
    display: flex;
    align-items: center;
    justify-content: center;
}
.product-slide img {
    max-width: 100%;
    height: auto;
    display: block;
    pointer-events: none; /* 防止图片上下拖拽 */
}

/* 滑块切换按钮（简约透明，无箭头） */
.slider-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    background: rgba(255,255,255,0.8);
    border: none;
    border-radius: 50%;
    font-size: 20px;
    color: #333;
    cursor: pointer;
    transition: all 0.2s ease;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
}
.slider-btn:hover {
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
.slider-prev {
    left: 20px;
}
.slider-next {
    right: 20px;
}
/* 只有1张图时隐藏按钮 */
.product-slider-container:has(.product-slide:first-child:last-child) .slider-btn {
    display: none;
}

/* 右侧信息宽度（全站系列图统一） */
.product-right-info {
    padding-top: 20px;
}
.section-subtitle {
    font-size: 16px;
    font-weight: 400;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 0 20px;
}
.product-desc {
    font-size: 14px;
    color: #666;
    line-height: 1.8;
    margin: 0 0 30px;
}

/* 产品参数列表 */
.product-spec-list {
    border-top: 1px solid #eee;
    padding-top: 20px;
    margin-bottom: 20px;
}
.fanocare-spec-item {
    display: flex;
    margin-bottom: 10px;
    font-size: 14px;
	gap: 20px;
}
.spec-label {
    width: 90px;
    color: #666;
    flex-shrink: 0;
}
.spec-value {
    color: #333;
}

.share-text {
    border-top: 1px solid #eee;
    padding-top: 20px;
    font-size: 14px;
    color: #666;
    margin: 0;
}

/* 下半部分：功能特性 */
.product-features-section {
    text-align: center;
}
.features-title {
    font-size: 24px;
    font-weight: 300;
    color: #333;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin: 0 0 15px;
}
.title-divider {
    width: 40px;
    height: 2px;
    background-color: #e67e22; /* 系列图颜色 */
    margin: 0 auto 50px;
}

.product-features-section + .product-features-section {
  margin-top: 50px; /* 调整列表项之间的间距 */
}
/* ===== 单行文字样式 ===== */
.single-line-text {
  text-align: left;
  max-width: 1000px;
  margin: 0 auto;
  line-height: 1.6;
  font-size: 16px;
  color: #555;
}





/* ===== 图文组合布局 ===== */
.image-text-grid {
  display: flex;
  align-items: center;
  gap: 60px;
  margin-top: 20px; /* 图片和内容的垂直间距 */
}

.image-col {
  flex: 0 0 60%;
  max-width: 60%;
}

.image-col img {
  width: 100%;
  height: auto;
  border-radius: 8px; /* 选中图片圆角 */
  box-shadow: 0 4px 12px rgba(0,0,0,0.08); /* 选中阴影 */
}

.text-col {
  flex: 0 0 30%;
  max-width: 30%;
  text-align: left;
  line-height: 1.7;
  color: #555;
}

.text-col p {
  margin-bottom: 0.3em; /* 间距微调（可修改） */
  line-height: 1.7;     /* 保留原始行高 */
}

.text-col p:last-child {
  margin-bottom: 0;     /* 移除最后一个下边距（关键样式） */
}


/* 响应式折叠 */
@media (max-width: 768px) {
  .image-text-grid {
    flex-direction: column;
    gap: 30px;
    text-align: center; /* 小屏的图文排版 */
  }
  .text-col p {
    text-align: left;
  }
  .image-col, .text-col {
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }
}








/* 功能特性列表 */
.features-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    max-width: 1000px;
    margin: 0 auto;
    text-align: left;
}
.feature-item {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #666;
    margin-bottom: 15px;
}
.check-icon {
    color: #e67e22; /* 颜色切换 */
    font-weight: 600;
}

/* 响应式适配 */
@media screen and (max-width: 768px) {
    .product-top-section {
        grid-template-columns: 1fr;
        gap: 40px;
        margin-bottom: 60px;
    }
    .product-slide {
        padding: 40px 20px;
    }
    .slider-btn {
        width: 36px;
        height: 36px;
        font-size: 18px;
    }
    .slider-prev {
        left: 10px;
    }
    .slider-next {
        right: 10px;
    }
    .features-grid {
        grid-template-columns: 1fr;
        text-align: left;
    }
    .features-title {
        font-size: 20px;
    }
}




/* ==================================================
   相似产品推荐区样式（新版式）
================================================== */
.similar-products-section {
    margin-top: 100px;
    text-align: center;
}
/* 标题样式：全站页面统一样式（粗体+字距） */
.similar-products-section .section-title {
    font-size: 24px;
    font-weight: 300 !important; /* 让SPECIFICATIONS加粗显示 */
    color: #333;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin: 0 0 15px !important;
    text-align: center !important; /* 强制居中 */
}
.similar-products-section .title-divider {
    width: 40px;
    height: 2px;
    background-color: #e67e22;
    margin: 0 auto 50px;
}

/* 相似产品滑块布局 */
.similar-slider-container {
    position: relative;
    overflow: hidden;
    max-width: 1100px;
    margin: 0 auto;
}
.similar-slider-track {
    display: flex;
    gap: 30px;
    transition: transform 0.5s ease;
}
.similar-product-card {
    flex-shrink: 0;
    width: calc((100% - 60px) / 3); /* 一行展示3个，间距30px */
    text-decoration: none;
    transition: transform 0.3s ease;
}
.similar-product-card:hover {
    transform: translateY(-5px);
}
.similar-product-img {
    background-color: #f8f8f8;
    padding: 40px 20px;
    margin-bottom: 15px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.similar-product-img img {
    max-width: 100%;
    height: 120px;
    object-fit: contain;
}
.similar-product-name {
    font-size: 14px;
    color: #333;
    margin: 0;
    text-align: center;
}

/* 局部切换按钮 */
.similar-slider-btn {
    position: absolute;
    top: 100px; /* 小箭头图片尺寸200px高，垂直居中 */
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    background: rgba(255,255,255,0.9);
    border: 1px solid #eee;
    border-radius: 50%;
    font-size: 18px;
    color: #333;
    cursor: pointer;
    transition: all 0.2s ease;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
}
.similar-slider-btn:hover {
    background: #006DAB;
    color: #fff;
    border-color: #006DAB;
}
.similar-prev {
    left: 0;
}
.similar-next {
    right: 0;
}

/* 响应式适配 */
@media screen and (max-width: 1024px) {
    .similar-product-card {
        width: calc((100% - 30px) / 2);
    }
}
@media screen and (max-width: 768px) {
    .similar-products-section {
        margin-top: 60px;
    }
    .similar-product-card {
        width: 100%;
    }
    .similar-slider-btn {
        width: 32px;
        height: 32px;
        font-size: 16px;
    }
}



/* ==============================================
   全新内页设计：二级导航 + Banner 布局优化
   全站通用，不影响原页面
   ============================================= */

/* ---------- 1. 二级导航栏覆盖层 ---------- */
.factory-sub-nav {
    /* 完全透明背景 */
    background: transparent;
    /* backdrop-filter: blur(4px); */  /* 删除被注释的样式 */
    padding: 18px 0;
    width: 100%;
    position: relative;
    z-index: 100;
}

.factory-sub-nav .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
}

/* 顶部Logo */
.factory-sub-nav-logo {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.factory-sub-nav-logo img {
    height: 50px;
}

.factory-sub-nav-logo span {
    font-size: 14px;
    color: #333333;      /* 颜色变量定义 */
    font-weight: 600;
    /* text-shadow: 0 1px 3px rgba(0,0,0,0.6); */  /* 删除悬停阴影 */
}

/* 右侧导航 */
.factory-sub-nav-links {
    display: flex;
    list-style: none;
    gap: 35px;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.factory-sub-nav-links a {
    color: #000000 !important;  /* 颜色变量定义 */
	transition: color 0.3s ease;
}

.factory-sub-nav-links a:hover {
    color: #008C82 !important;
}

.factory-sub-nav-links a.active:hover {
    color: #008C82 !important;
}




/* ===== 页内高亮 ===== */
/* 当前页高亮样式 */
.factory-sub-nav-links a.active {
    /* 悬停颜色 - 绿色高亮（与网站主题一致） */
    color: #008C82 !important;
    font-weight: 700 !important;
    }


@media screen and (max-width: 480px) {
    .factory-sub-nav .container {
        flex-direction: column;
        gap: 12px;
    }
    
    .factory-sub-nav-links {
        justify-content: center;
        gap: 15px;
    }
}




/* ========== 视频区样式 ========== */
.factory-video-section {
    padding: 50px 0;
    background: #fff;
}

.factory-video-wrapper {
    position: relative;
    width: 100%;
    /* 16:9 视频比例 */
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.1);
}

.factory-video-wrapper iframe,
.factory-video-wrapper video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}

/* 响应式适配 */
@media screen and (max-width: 768px) {
    .factory-video-section {
        padding: 30px 20px;
    }
}



/* ========== 视频播放按钮（纯样式，不影响原视频） ========== */
.factory-video-wrapper {
    position: relative;
    cursor: pointer;
}

/* 视频覆盖层 - 半透明遮罩 */
.factory-video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    transition: opacity 0.3s ease;
    pointer-events: none;  /* 获得半透明视频 */
}

/* 播放按钮 */
.factory-play-btn {
    width: 80px;
    height: 80px;
    background: rgba(255, 255, 255, 0.95);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    transition: all 0.3s ease;
    pointer-events: auto;
}

/* 播放按钮图标 */
.factory-play-btn svg {
    width: 30px;
    height: 30px;
    color: #006DAB;
    margin-left: 5px;
}

/* 动态移动动画 */
.factory-play-btn::before,
.factory-play-btn::after {
    content: '';
    position: absolute;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.4);
    animation: ripple 2s infinite;
}

.factory-play-btn::after {
    animation-delay: 0.5s;
}

@keyframes ripple {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    100% {
        transform: scale(1.8);
        opacity: 0;
    }
}

/* 悬停放大 */
.factory-video-wrapper:hover .factory-play-btn {
    transform: scale(1.1);
}

/* 隐藏视频覆盖按钮 */
.factory-video-overlay.hidden {
    opacity: 0;
}

/* 移动端适配 */
@media screen and (max-width: 768px) {
    .factory-play-btn {
        width: 60px;
        height: 60px;
    }
    .factory-play-btn svg {
        width: 24px;
        height: 24px;
    }
}



/* ========== Banner半透明遮罩 + 白色文字 ========== */
.factory-banner-wrapper {
    position: relative;
}

/* 1. 半透明遮罩层（第二层） */
.factory-banner-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;  /* 可改第二行 */
}

/* 2. 文字内容（第二层） */
.factory-banner-text {
    text-align: center;
    color: #ffffff;
    padding: 0 20px;
    z-index: 3;  /* 标题在图片上方 */
}

/* 3. 小黄色条（图片上方） */
.factory-yellow-bar {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 10 !important;  /* 小图在图片上层 */
}

.factory-banner-text h1 {
    font-size: 42px;
    font-weight: 700;
    margin-bottom: 15px;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
}

.factory-banner-text p {
    font-size: 20px;
    font-weight: 400;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
    margin: 0;
}




/* ========== 产品系列卡片（图片+文字+排版） ========== */
.products-series-section {
    padding: 50px 0;
    background: #fff;
}

/* 网格布局 */
.products-series-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);  /* 3列 */
    gap: 30px;
}

/* 产品系列卡片 */
.products-series-card {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
    transition: transform 0.3s ease;
}

.products-series-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.12);
}

/* 上半部分：多图展示 */
.products-series-img {
    width: 100%;
    aspect-ratio: 1 / 1;  /* 图片显示为块级元素 */
    position: relative;
}

.products-series-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 图片白色底色 */
.products-series-img::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 60px;
    /* 白色渐变：从底部到透明 */
    background: linear-gradient(to top, #ffffff 0%, rgba(255,255,255,0.8) 40%, transparent 100%);
    z-index: 2;
}

/* 下半部分：文字排版 */
.products-series-content {
    padding: 0 25px 25px;
    position: relative;
    z-index: 3;
    background: #fff;
}

/* 1. 小标题 */
.products-series-content h3 {
    margin: 0 0 20px 0;  /* 小标题加20px空白 */
    font-size: 18px;
    font-weight: 700;
    color: #222;
    line-height: 1.3;
}

/* 2. 详细文字 */
.products-series-content p {
    margin: 0 0 20px 0;  /* 详细排版加20px空白 */
    font-size: 14px;
    color: #666;
    line-height: 1.6;
}

/* 3. Learn More按钮 */
.products-series-content .learn-more {
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    color: #006DAB;
    text-decoration: none;
    transition: all 0.3s ease;
}

.products-series-content .learn-more:hover {
    color: #005688;
}

.products-series-content .learn-more::after {
    content: ' >';
    margin-left: 3px;
    transition: margin-left 0.3s ease;
}

.products-series-content .learn-more:hover::after {
    margin-left: 10px;  /* 悬停时箭头移动 */
}




/* ========== 二级导航底部边框 ========== */
.factory-sub-nav {
    padding-bottom: 18px;
    /* 底部边框 */
    border-bottom: 1px solid #e0e0e0;
}

/* ========== 面包屑导航 ========== */
.series-breadcrumb {
    /* 可控间距：通过变量控制第二行与第一行之间的间距 */
    --nav-breadcrumb-gap: 20px;   /* 第二行与 第一行 间距（可改大小） */
    --breadcrumb-banner-gap: 25px; /* 面包屑与 Banner 间距 */
    
    padding-top: var(--nav-breadcrumb-gap);
    padding-bottom: var(--breadcrumb-banner-gap);
    background: #fafafa;
    border-bottom: 1px solid #d0d0d0;
}

.series-breadcrumb .container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.series-breadcrumb a {
    color: #666;
    text-decoration: none;
    font-size: 14px;
    transition: color 0.3s ease;
}

.series-breadcrumb a:hover {
    color: #008C82;
}

.series-breadcrumb .separator {
    color: #999;
    margin: 0 6px;
}

.series-breadcrumb .current {
    color: #008C82;
    font-size: 14px;
    font-weight: 600;
}


/* ==============================================
   产品详情页：全新样式，100%宽度突破
   ============================================= */

/* ==============================================
   产品详情页：内容统一970px宽度
   ============================================= */

/* 内容统一970px宽度 */
.detail-section {
    padding: 40px 0 60px;
    background: #fff;
}

.detail-section .container {
    max-width: 970px;  /* 限宽970px */
    margin: 0 auto;    /* 导航链接样式 */
}

/* 1. 页面标题 */
.detail-title {
    text-align: center;
    margin-bottom: 35px;
}

.detail-title h1 {
    font-size: 32px;
    font-weight: 700;
    color: #222;
    line-height: 1.3;
}

/* 2. 主图 */
.detail-main-image {
    width: 100%;
    margin-bottom: 30px;
    border-radius: 8px;
    overflow: hidden;
}

.detail-main-image img {
    width: 100%;
    height: auto;
    display: block;
}

/* 3. 描述文字 */
.detail-description {
    margin-bottom: 45px;
}

.detail-description p {
    font-size: 16px;
    line-height: 1.8;
    color: #444;
    margin-bottom: 15px;
}

/* 4. 产品特点（列表展示） */
.detail-features {
    margin-bottom: 45px;
}

.detail-features-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 40px;
}

.detail-features-list li {
    font-size: 16px;
    line-height: 1.6;
    color: #444;
    padding: 10px 0 10px 28px;
    position: relative;
    border-bottom: 1px solid #f0f0f0;
}

.detail-features-list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 18px;
    width: 10px;
    height: 10px;
    background: #006DAB;
    border-radius: 50%;
}

/* 5. 产品参数（一行，自动适应970px宽度） */
.detail-specs {
    margin-bottom: 55px;
}

.detail-specs-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    /* 参数自动适应970px宽度（无需手动调整） */
}

.spec-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 20px;
    border-radius: 6px;
}

.spec-item:nth-child(odd) {
    background: #E7F5FF;
}

.spec-item:nth-child(even) {
    background: #f5f5f5;
}

.spec-label {
    font-size: 15px;
    font-weight: 600;
    color: #333;
	white-space: nowrap;  /* 防止收缩 */
    flex-shrink: 0;
}

.spec-value {
    font-size: 15px;
    color: #555;
}

/* 6. 相关产品推荐 */
.detail-related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

.related-product-card {
    text-align: center;
    padding: 15px;
    border-radius: 8px;
    background: #fafafa;
    transition: all 0.3s ease;
}

.related-product-card:hover {
    background: #f0f7fc;
    transform: translateY(-3px);
}

.related-product-card img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 6px;
    margin-bottom: 15px;
}

.related-product-card h4 {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 10px;
}

.related-product-card a {
    font-size: 14px;
    color: #006DAB;
    font-weight: 600;
}

/* ---------- 响应式 ---------- */
@media screen and (max-width: 1024px) {
    .detail-section .container {
        max-width: 100%;
        padding: 0 20px;
    }
    .detail-related-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media screen and (max-width: 768px) {
    .detail-section {
        padding: 25px 0 40px;
    }
    .detail-title h1 {
        font-size: 24px;
    }
    .detail-features-list {
        grid-template-columns: 1fr;
    }
    .detail-related-grid {
        grid-template-columns: 1fr;
    }
}



/* ==============================================
   VITORI Factory页面：全新样式，100%宽度突破
   ============================================= */

/* 内容统一970px宽度 */
.vitori-section {
    padding: 50px 0;
    background: #fff;
}

.vitori-section .container {
    max-width: 970px;  /* 限宽970px */
    margin: 0 auto;    /* 导航链接样式 */
}

/* 1. 内容区 */
.vitori-content {
    margin-bottom: 40px;
}

.vitori-content p {
    font-size: 16px;
    line-height: 1.8;
    color: #444;
    margin-bottom: 18px;
}

.vitori-content p:last-child {
    margin-bottom: 0;
}

/* 2. 多图展示 */
.vitori-images {
    display: grid;
    grid-template-columns: repeat(3, 1fr);  /* 3列 */
    gap: 20px;  /* 图片显示为块级元素 */
}

.vitori-image-item {
    border-radius: 8px;
    overflow: hidden;
}

.vitori-image-item img {
    width: 100%;
    height: 100%;
    aspect-ratio: 4 / 3;  /* 图片显示为块级元素 */
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}

.vitori-image-item:hover img {
    transform: scale(1.05);  /* 悬停放大效果 */
}

/* ---------- 响应式 ---------- */
@media screen and (max-width: 1024px) {
    .vitori-section .container {
        max-width: 100%;
        padding: 0 20px;
    }
}

@media screen and (max-width: 768px) {
    .vitori-section {
        padding: 30px 0;
    }
    .vitori-images {
        grid-template-columns: 1fr;  /* 手机适配 */
        gap: 15px;
    }
}



/* ==============================================
   VITORI二级导航栏：通栏100%宽度突破
   ============================================= */

.vitori-sub-nav {
    background: transparent;
    padding: 18px 0;
    border-bottom: 1px solid #e0e0e0;
    width: 100%;
    position: relative;
    z-index: 100;
}

.vitori-sub-nav .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.vitori-sub-nav-logo img {
    height: 50px;
}

.vitori-sub-nav-links {
    display: flex;
    list-style: none;
    gap: 35px;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.vitori-sub-nav-links a {
    text-decoration: none;
    color: #333333 !important;
    font-size: 14px;
    font-weight: 600 !important;
    transition: opacity 0.3s ease;
}

/* 悬停颜色取色板颜色 */
.vitori-sub-nav-links a.active {
    /* 悬停时文字变色 */
    --highlight-color: #FFD533;  /* 颜色可改为 #FFD700 金色 */
    
    color: var(--highlight-color) !important;
    font-weight: 700 !important;
}

.vitori-sub-nav-links a:hover {
    opacity: 0.8;
}

/* ---------- 响应式 ---------- */
@media screen and (max-width: 768px) {
    .vitori-sub-nav {
        padding: 14px 0;
    }
    .vitori-sub-nav-links {
        gap: 20px;
    }
}


/* ==============================================
   VITORI Products产品卡片：简约风格
   ============================================= */

.vitori-prod-section {
    padding: 50px 0 60px;
    background: #fff;
}

/* 桌面3列，手机2列 */
.vitori-prod-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

/* 产品卡片简约风格 */
.vitori-prod-card {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 悬停效果微微上浮 + 阴影加深 */
.vitori-prod-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
}

/* 图片显示为块级元素 */
.vitori-prod-img {
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: #fafafa;
}

.vitori-prod-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

/* 悬停图片放大 */
.vitori-prod-card:hover .vitori-prod-img img {
    transform: scale(1.08);
}

/* 内容排版 */
.vitori-prod-info {
    padding: 22px 24px 26px;
}

.vitori-prod-info h3 {
    font-size: 17px;
    font-weight: 600;
    color: #222;
    margin: 0 0 8px 0;
    line-height: 1.3;
}

.vitori-prod-info p {
    font-size: 14px;
    color: #888;
    margin: 0 0 18px 0;
    line-height: 1.5;
}

/* 按钮样式简约 */
.vitori-prod-btn {
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    color: #222;
    text-decoration: none;
    padding-bottom: 3px;
    border-bottom: 2px solid #ddd;
    transition: all 0.3s ease;
}

.vitori-prod-btn:hover {
    color: #006DAB;
    border-bottom-color: #006DAB;
}

/* ---------- 响应式 ---------- */
@media screen and (max-width: 1024px) {
    .vitori-prod-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 25px;
    }
}

@media screen and (max-width: 768px) {
    .vitori-prod-section {
        padding: 35px 20px 45px;
    }
    .vitori-prod-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .vitori-prod-info {
        padding: 18px 20px 22px;
    }
}



/* ==============================================
   DC产品详情页：高端简约设计
   ============================================= */

/* 二级导航栏边框 */
.factory-sub-nav {
    border-bottom: 1px solid #e5e5e5;  /* 二级导航栏添加边框 */
}

/* 导航链接样式 */
.dc-detail-section {
    padding: 50px 0 70px;
    background: #fff;
}

.dc-detail-section .container {
    max-width: 940px;  /* 高度窄屏适配 */
    margin: 0 auto;
}

/* 1. 产品标题 */
.dc-detail-title {
    text-align: center;
    margin-bottom: 40px;
}

.dc-detail-model {
    display: block;
    font-size: 14px;
    color: #999;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 12px;
}

.dc-detail-title h1 {
    font-size: 34px;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1.3;
    margin: 0;
}

/* 2. 主图 */
.dc-detail-main-img {
    width: 100%;
    margin-bottom: 50px;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
}

.dc-detail-main-img img {
    width: 100%;
    height: auto;
    display: block;
}

/* 3. 产品文字区域 */
.dc-detail-intro {
    margin-bottom: 55px;
}

.dc-detail-intro p {
    font-size: 16px;
    line-height: 1.9;
    color: #444;
    margin-bottom: 18px;
}

.dc-detail-intro p:last-child {
    margin-bottom: 0;
}

/* 4. 细节图（2行2列） */
.dc-detail-gallery {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 60px;
}

.dc-detail-gallery-item {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06);
    transition: transform 0.3s ease;
}

.dc-detail-gallery-item:hover {
    transform: translateY(-4px);
}

.dc-detail-gallery-item img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    display: block;
}

/* 5. 产品参数（卡片式） */
.dc-detail-specs {
    margin-bottom: 65px;
}

.dc-detail-specs-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1px;
    background: #f0f0f0;
    border-radius: 8px;
    overflow: hidden;
}

.dc-spec-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 24px;
    background: #fff;
}

.dc-spec-label {
    font-size: 15px;
    font-weight: 600;
    color: #333;
}

.dc-spec-value {
    font-size: 15px;
    color: #666;
}

/* 6. 相似产品推荐 */
.dc-detail-related {
    padding-top: 20px;
    border-top: 1px solid #eee;
}

.dc-related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

.dc-related-card {
    text-align: center;
    padding: 15px;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.dc-related-card:hover {
    background: #f8fafc;
}

.dc-related-card img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 6px;
    margin-bottom: 16px;
}

.dc-related-card h4 {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 10px;
}

.dc-related-card a {
    font-size: 14px;
    color: #006DAB;
    font-weight: 600;
}

/* ---------- 响应式 ---------- */
@media screen and (max-width: 1024px) {
    .dc-detail-section .container {
        max-width: 100%;
        padding: 0 20px;
    }
    .dc-related-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media screen and (max-width: 768px) {
    .dc-detail-section {
        padding: 35px 0 50px;
    }
    .dc-detail-title h1 {
        font-size: 26px;
    }
    .dc-detail-gallery {
        grid-template-columns: 1fr;
    }
    .dc-related-grid {
        grid-template-columns: 1fr;
    }
}



/* ==============================================
   About Us页面：高端大图设计
   ============================================= */

/* 1. Hero大图Banner - 详情页通用，不改变原页面任何空白 */
.about-hero {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 7;
    min-height: 280px;
    max-height: 600px;
    height: auto;
    overflow: hidden;
}

/* 中间内容溢出留白问题根源 */
.about-hero-bg {
    width: 100%;
    height: 100%;
    display: block;
}

.about-hero-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* 图片显示为块级元素 */
    display: block; /* 去除图片默认底部空白 */
    vertical-align: middle; /* 双重去除图片空白 */
}

.about-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(0,0,0,0.6) 0%, rgba(0,109,171,0.4) 100%);
    z-index: 1;
}

.about-hero-content {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    transform: translateY(-50%);
    z-index: 2;
    text-align: center;
    padding: 0 20px;
    box-sizing: border-box;
}

.about-hero h1 {
    font-size: 48px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 15px;
    text-shadow: 0 2px 20px rgba(0,0,0,0.3);
}

.about-hero p {
    font-size: 20px;
    color: rgba(0,0,0,0.90);
    margin: 0;
}


/* 2. 公司简介（左右分栏） */
.about-intro {
    padding: 80px 0;
    background: #fff;
}

.about-intro-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0px;
    align-items: center;
}


.about-intro-text {
    max-width: 100%; /* 确保内容不溢出 */
}


.about-intro-text p {
    font-size: 16px;
    line-height: 1.9;
    color: #555;
    margin-bottom: 20px;
}

.about-intro-text p:last-child {
    margin-bottom: 0;
}

.about-intro-img {
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0,0,0,0.12);
}

.about-intro-img img {
    width: 100%;
    height: auto;
    display: block;
}

.intro-float-img {
    float: right;          /* 新版使图片靠右 */
    max-width: 400px;      /* 限制图片最大宽度（防止图片过宽） */
    margin: 0 0 15px 15px; /* 右侧和底部留白，文字围绕图片 */
    border-radius: 8px;    /* 选中圆角效果 */
    box-shadow: 0 10px 20px rgba(0,0,0,0.10); /* 选中阴影 */
}

/* ===== 平板适配 (768px - 1024px) ===== */
@media (max-width: 1024px) {
    /* 1. 缩小图片尺寸 */
    .intro-float-img {
        max-width: 400px; /* 图片缩小30px */
        margin: 0 0 12px 12px; /* 减少间距 */
    }
    
    /* 2. 为标题添加上边距（防止图片紧贴标题） */
    .about-intro-text h2 {
        margin-top: 10px; /* 调整图片的垂直间距 */
    }
}

/* ===== 手机端适配 (最大767px) ===== */
@media (max-width: 767px) {
    /* 1. 全站导航悬停为浅色显示 */
    .intro-float-img {
        float: none !important; /* 强制移除样式 */
        display: block;
        max-width: 390px; /* 手机适配 */
        margin: 0 auto 25px; /* 水平居中 + 底部对齐 */
        width: 100%; /* 宽度不超出容器 */
    }
    
    /* 2. 移除图文限制，恢复自动排版 */
    .about-intro-text p {
        margin-bottom: 24px; /* 文字段落行距调整 */
    }
    
    /* 3. 为标题增加下边距（防止文字紧贴图片） */
    .about-intro-text h2 {
        margin-top: 20px;
    }
}

/* 3. 品牌展示区 */
.about-brands {
    padding: 70px 0 80px;
    background: #fafbfc;
}

.about-brands-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.about-brand-card {
    background: #fff;
    padding: 40px 30px;
    border-radius: 12px;
    text-align: center;
    box-shadow: 0 4px 20px rgba(0,0,0,0.06);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.about-brand-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.12);
}

.about-brand-logo {
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 25px;
}

.about-brand-logo img {
    max-height: 50px;
    width: auto;
}

.about-brand-card h3 {
    font-size: 22px;
    font-weight: 700;
    color: #222;
    margin-bottom: 15px;
}

.about-brand-card p {
    font-size: 15px;
    color: #777;
    line-height: 1.7;
    margin-bottom: 25px;
}

.about-brand-btn {
    display: inline-block;
    padding: 10px 28px;
    background: #006DAB;
    color: #fff;
    text-decoration: none;
    border-radius: 30px;
    font-weight: 600;
    font-size: 14px;
    transition: all 0.3s ease;
}

.about-brand-btn:hover {
    background: #005a8d;
    transform: translateY(-2px);
}

/* 4. 数据展示 */
.about-stats {
    padding: 60px 0;
    background: linear-gradient(135deg, #006DAB 0%, #004a75 100%);
}

.about-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

.about-stat-item {
    text-align: center;
}

.about-stat-number {
    font-size: 48px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 8px;
}

.about-stat-label {
    font-size: 15px;
    color: rgba(255,255,255,0.8);
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* 5. 图片展示区 */
.about-gallery {
    padding: 70px 0 80px;
    background: #fff;
}

.about-gallery-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.about-gallery-item {
    border-radius: 8px;
    overflow: hidden;
    transition: transform 0.3s ease;
}

.about-gallery-item:hover {
    transform: scale(1.05);
}

.about-gallery-item img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    display: block;
}

/* 6. CTA联系区 */
.about-cta {
    padding: 70px 0;
    background: #1a1a1a;
    text-align: center;
}

.about-cta-content h2 {
    font-size: 32px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 15px;
}

.about-cta-content p {
    font-size: 17px;
    color: rgba(255,255,255,0.7);
    margin-bottom: 30px;
}

.about-cta-btn {
    display: inline-block;
    padding: 14px 45px;
    background: #fff;
    color: #006DAB;
    text-decoration: none;
    border-radius: 30px;
    font-weight: 700;
    font-size: 15px;
    transition: all 0.3s ease;
}

.about-cta-btn:hover {
    background: #006DAB;
    color: #fff;
    transform: translateY(-3px);
}

/* ---------- 响应式 ---------- */
@media screen and (max-width: 1024px) {
    .about-hero {
        aspect-ratio: 16 / 7.5;
        min-height: 350px;
    }
    .about-hero h1 {
        font-size: 36px;
    }
    .about-hero p {
        font-size: 18px;
    }
}

@media screen and (max-width: 768px) {
    .about-hero {
        aspect-ratio: 4 / 3;
        min-height: 250px;
    }
    .about-hero h1 {
        font-size: 28px;
    }
    .about-hero p {
        font-size: 16px;
    }
    .about-intro {
        padding: 50px 20px;
    }
    .about-intro-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    .about-brands-grid {
        grid-template-columns: 1fr;
    }
    .about-stats-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
    .about-stat-number {
        font-size: 36px;
    }
    .about-gallery-grid {
        grid-template-columns: 1fr 1fr;
        gap: 15px;
    }
}



/* ==============================================
   内页Banner居中标题（全设备响应式）
============================================== */

.inner-banner-center-title {
    /* 新版标题绝对定位，置于Banner中间 */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /* 确保文字在图片下方或上方 */
    z-index: 5;
    /* 防止溢出屏幕（预留安全距离） */
    width: 90%;
    max-width: 1000px;
    text-align: center;
    /* 手机小屏文字垂直居中 */
    display: flex;
    align-items: center;
    justify-content: center;
}

.inner-banner-center-title h1 {
    /* 标题样式 */
    font-size: 42px;
    font-weight: 700;
    color: #ffffff;
    line-height: 1.2;
    margin: 0;
    padding: 0;
    /* 文字阴影增强可读性，即使用在图片上也可读 */
    text-shadow: 0 2px 6px rgba(0, 0, 0, 0.7);
    /* 强制换行（中英文自动换行，防止溢出） */
    word-wrap: break-word;
    word-break: break-word;
    /* 防止文字被选中，影响体验 */
    user-select: none;
}

/* ==============================================
   响应式小屏区间（自动缩小字号）
============================================== */
/* 平板端（≤1024px） */
@media screen and (max-width: 1024px) {
    .inner-banner-center-title h1 {
        font-size: 36px;
    }
}

/* 手机端（≤768px） */
@media screen and (max-width: 768px) {
    .inner-banner-center-title h1 {
        font-size: 28px;
    }
}

/* 小屏手机（≤480px） */
@media screen and (max-width: 480px) {
    .inner-banner-center-title h1 {
        font-size: 24px;
    }
}

/* 超小屏适配（极窄屏，防止溢出截断） */
@media screen and (max-width: 360px) {
    .inner-banner-center-title h1 {
        font-size: 22px;
        line-height: 1.3;
    }
}


/* 全局重置 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* 全局重置 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* ============================================
   Healinhouse 系列 Banner 区域 - 通栏
   ============================================ */
.Healinhouse-series-banner {
    position: relative;
    width: 100%;           /* 通栏图片自适应 */
    min-width: 100%;       /* 强制通栏 */
    height: 300px;         /* 固定高度 */
    overflow: hidden;
}

/* Banner 背景图片 - 通栏自适应 */
.Healinhouse-series-banner__bg-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;           /* 宽度100%通栏 */
    min-width: 100%;
    height: 100%;
    object-fit: cover;     /* 图片顶部对齐，自适应裁切 */
    object-position: center top;  /* 图片居中，顶部显示 */
    z-index: 1;
}

/* 半透明白色遮罩 - 关键内容用黄色通知条 */
.Healinhouse-series-banner__gray-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% - 40px);
    background-color: rgba(0, 0, 0, 0.35);
    z-index: 2;
}

/* 导航链接样式 */
.Healinhouse-series-banner__title-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% - 40px);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 3;
}

/* Banner 标题优化 */
.Healinhouse-series-banner__title-container h1 {
    font-family: 'Arial', sans-serif;
    font-size: 48px;
    font-weight: 600;
    color: #ffffff;
    text-align: center;
    letter-spacing: 4px;
    text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5);
    margin: 0;
    padding: 0 20px;
    white-space: nowrap;    /* 遮罩不遮挡 */
}

/* 底部黄色通知条 - 通栏 */
.Healinhouse-series-banner__yellow-bar {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 40px;
    background-color: rgba(255, 215, 0, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 4;
}

/* 黄色通知条位置调整 */
.Healinhouse-series-banner__yellow-bar.inner-banner-bar p {
    font-family: 'Arial', sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #333333;
    text-align: center;
    margin: 0;
    padding: 0 20px;
    line-height: 1.4;
    width: 100%;
}

/* ============================================
   响应式适配 - 通栏版
   ============================================ */

/* 超宽屏 (> 1920px) - 宽度通栏 */
@media screen and (min-width: 1921px) {
    .Healinhouse-series-banner {
        height: 350px;  /* 给标题添加实际高度 */
    }
    
    .Healinhouse-series-banner__title-container h1 {
        font-size: 56px;
    }
}

/* 平板设备 (768px - 1024px) */
@media screen and (max-width: 1024px) {
    .Healinhouse-series-banner {
        height: 250px;
    }

    .Healinhouse-series-banner__title-container h1 {
        font-size: 38px;
        letter-spacing: 3px;
    }

    .Healinhouse-series-banner__yellow-bar {
        height: 36px;
    }

    .Healinhouse-series-banner__gray-overlay,
    .Healinhouse-series-banner__title-container {
        height: calc(100% - 36px);
    }

    .Healinhouse-series-banner__yellow-bar.inner-banner-bar p {
        font-size: 13px;
    }
}

/* 手机设备 (480px - 767px) */
@media screen and (max-width: 767px) {
    .Healinhouse-series-banner {
        height: 200px;
    }

    .Healinhouse-series-banner__title-container h1 {
        font-size: 28px;
        letter-spacing: 2px;
    }

    .Healinhouse-series-banner__yellow-bar {
        height: 44px;
    }

    .Healinhouse-series-banner__gray-overlay,
    .Healinhouse-series-banner__title-container {
        height: calc(100% - 44px);
    }

    .Healinhouse-series-banner__yellow-bar.inner-banner-bar p {
        font-size: 11px;
        line-height: 1.3;
    }
}

/* 小屏手机设备 (最大 479px) */
@media screen and (max-width: 479px) {
    .Healinhouse-series-banner {
        height: 180px;
    }

    .Healinhouse-series-banner__title-container h1 {
        font-size: 22px;
        letter-spacing: 1px;
    }

    .Healinhouse-series-banner__yellow-bar {
        height: 50px;
    }

    .Healinhouse-series-banner__gray-overlay,
    .Healinhouse-series-banner__title-container {
        height: calc(100% - 50px);
    }

    .Healinhouse-series-banner__yellow-bar.inner-banner-bar p {
        font-size: 10px;
        line-height: 1.2;
    }
}



/* 全局重置 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* ============================================
   Healinhouse Factory Banner 区域 - 通栏 (高度720px)
   ============================================ */
.Healinhouse-factory-banner {
    position: relative;
    width: 100%;           /* 通栏图片自适应 */
    min-width: 100%;       /* 强制通栏 */
    height: 720px;         /* 图片高度720px */
    overflow: hidden;
}

/* Banner 背景图片 - 通栏自适应 */
.Healinhouse-factory-banner__bg-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;           /* 宽度100%通栏 */
    min-width: 100%;
    height: 100%;
    object-fit: cover;     /* 图片顶部对齐，自适应裁切 */
    object-position: center center;  /* 图片层级显示 */
    z-index: 1;
}

/* 半透明白色遮罩 - 关键内容用黄色通知条 */
.Healinhouse-factory-banner__gray-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100%);  /* 去掉灰色遮罩 */
    background-color: rgba(0, 0, 0, 0.35);
    z-index: 2;
}

/* 导航链接样式 */
.Healinhouse-factory-banner__title-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100%);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 3;
}

/* Banner 标题优化 */
.Healinhouse-factory-banner__title-container h1 {
    font-family: 'Arial', sans-serif;
    font-size: 45px;
    font-weight: 600;
    color: #ffffff;
    text-align: center;
    letter-spacing: 6px;
    text-shadow: 2px 2px 12px rgba(0, 0, 0, 0.6);
    margin: 0;
    padding: 0 20px;
    white-space: nowrap;
}

/* 底部黄色通知条 - 通栏 */
.Healinhouse-factory-banner__yellow-bar {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 40px;
    background-color: rgba(255, 215, 0, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 4;
}

/* 黄色通知条位置调整 */
.Healinhouse-factory-banner__yellow-bar.inner-banner-bar p {
    font-family: 'Arial', sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #333333;
    text-align: center;
    margin: 0;
    padding: 0 20px;
    line-height: 1.4;
    width: 100%;
}

/* ============================================
   响应式适配
   ============================================ */

/* 超宽屏 (> 1920px) - 宽度通栏 */
@media screen and (min-width: 1921px) {
    .Healinhouse-factory-banner {
        height: 800px;
    }
    
    .Healinhouse-factory-banner__title-container h1 {
        font-size: 50px;
    }
}

/* 平板设备 (768px - 1024px) */
@media screen and (max-width: 1024px) {
    .Healinhouse-factory-banner {
        height: 500px;
    }

    .Healinhouse-factory-banner__title-container h1 {
        font-size: 48px;
        letter-spacing: 4px;
    }

    .Healinhouse-factory-banner__yellow-bar {
        height: 36px;
    }

    .Healinhouse-factory-banner__gray-overlay,
    .Healinhouse-factory-banner__title-container {
        height: calc(100% - 36px);
    }

    .Healinhouse-factory-banner__yellow-bar.inner-banner-bar p {
        font-size: 13px;
    }
}

/* 手机设备 (480px - 767px) */
@media screen and (max-width: 767px) {
    .Healinhouse-factory-banner {
        height: 350px;
    }

    .Healinhouse-factory-banner__title-container h1 {
        font-size: 26px;
        letter-spacing: 3px;
    }

    .Healinhouse-factory-banner__yellow-bar {
        height: 44px;
    }

    .Healinhouse-factory-banner__gray-overlay,
    .Healinhouse-factory-banner__title-container {
        height: calc(100% - 44px);
    }

    .Healinhouse-factory-banner__yellow-bar.inner-banner-bar p {
        font-size: 11px;
        line-height: 1.3;
    }
}

/* 小屏手机设备 (最大 479px) */
@media screen and (max-width: 479px) {
    .Healinhouse-factory-banner {
        height: 280px;
    }

    .Healinhouse-factory-banner__title-container h1 {
        font-size: 18px;
        letter-spacing: 2px;
    }

    .Healinhouse-factory-banner__yellow-bar {
        height: 50px;
    }

    .Healinhouse-factory-banner__gray-overlay,
    .Healinhouse-factory-banner__title-container {
        height: calc(100% - 50px);
    }

    .Healinhouse-factory-banner__yellow-bar.inner-banner-bar p {
        font-size: 10px;
        line-height: 1.2;
    }
}





/* 全局重置 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* ============================================
   Healinhouse Product Banner 区域 - 通栏
   ============================================ */
.Healinhouse-product-banner {
    position: relative;
    width: 100%;           /* 通栏图片自适应 */
    min-width: 100%;       /* 强制通栏 */
    height: 500px;         /* 行高适配长文字 */
    overflow: hidden;
}

/* Banner 背景图片 - 通栏自适应 */
.Healinhouse-product-banner__bg-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;           /* 宽度100%通栏 */
    min-width: 100%;
    height: 100%;
    object-fit: cover;     /* 图片顶部对齐，自适应裁切 */
    object-position: center center;
    z-index: 1;
}

/* 半透明白色遮罩 - 关键内容用黄色通知条 */
.Healinhouse-product-banner__gray-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100%);  /* 去掉灰色遮罩 */
    background-color: rgba(0, 0, 0, 0.4);  /* 文字加阴影增强可读性 */
    z-index: 2;
}

/* 产品横幅标题容器 - 标题排版 */
.Healinhouse-product-banner__title-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100%);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 3;
    padding: 0 40px;  /* 内容内边距 */
}

/* Banner 标题优化 - 桌面端专属优化 */
.Healinhouse-product-banner__title-container h1 {
    font-family: 'Arial', sans-serif;
    font-size: 34px;              /* 新版文字缩小字号 */
    font-weight: bold;
    color: #ffffff;
    text-align: center;
    line-height: 1.6;             /* 段落行高（长文字可读性） */
    letter-spacing: 1px;
    text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.7);  /* 增强悬停阴影 */
    margin: 0;
    max-width: 1200px;            /* 限制最大宽度，防止过大 */
}

/* 底部黄色通知条 - 通栏 */
.Healinhouse-product-banner__yellow-bar {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 40px;
    background-color: rgba(255, 215, 0, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 4;
}

/* 黄色通知条位置调整 */
.Healinhouse-product-banner__yellow-bar.inner-banner-bar p {
    font-family: 'Arial', sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #333333;
    text-align: center;
    margin: 0;
    padding: 0 20px;
    line-height: 1.4;
    width: 100%;
}

/* ============================================
   响应式适配 - 桌面端重点优化
   ============================================ */

/* 超宽屏 (> 1920px) */
@media screen and (min-width: 1921px) {
    .Healinhouse-product-banner {
        height: 600px;
    }
    
    .Healinhouse-product-banner__title-container h1 {
        font-size: 32px;
        max-width: 1400px;
    }
}

/* 桌面设备 (1200px - 1920px) */
@media screen and (max-width: 1440px) {
    .Healinhouse-product-banner__title-container h1 {
        font-size: 26px;
        max-width: 1000px;
    }
}

/* 小屏 / 小平板 (1024px - 1199px) */
@media screen and (max-width: 1199px) {
    .Healinhouse-product-banner {
        height: 450px;
    }
    
    .Healinhouse-product-banner__title-container h1 {
        font-size: 24px;
        max-width: 900px;
    }
}

/* 平板设备 (768px - 1024px) */
@media screen and (max-width: 1024px) {
    .Healinhouse-product-banner {
        height: 420px;
    }

    .Healinhouse-product-banner__title-container {
        padding: 0 30px;
    }

    .Healinhouse-product-banner__title-container h1 {
        font-size: 22px;
        line-height: 1.5;
        max-width: 700px;
    }

    .Healinhouse-product-banner__yellow-bar {
        height: 36px;
    }

    .Healinhouse-product-banner__gray-overlay,
    .Healinhouse-product-banner__title-container {
        height: calc(100% - 36px);
    }

    .Healinhouse-product-banner__yellow-bar.inner-banner-bar p {
        font-size: 13px;
    }
}

/* 手机设备 (480px - 767px) - 图文重点优化 */
@media screen and (max-width: 767px) {
    .Healinhouse-product-banner {
        height: 380px;
    }

    .Healinhouse-product-banner__title-container {
        padding: 0 20px;
    }

    .Healinhouse-product-banner__title-container h1 {
        font-size: 18px;              /* 手机端大号小字 */
        line-height: 1.5;
        letter-spacing: 0.5px;
        max-width: 100%;
    }

    .Healinhouse-product-banner__yellow-bar {
        height: 44px;
    }

    .Healinhouse-product-banner__gray-overlay,
    .Healinhouse-product-banner__title-container {
        height: calc(100% - 44px);
    }

    .Healinhouse-product-banner__yellow-bar.inner-banner-bar p {
        font-size: 11px;
        line-height: 1.3;
    }
}

/* 小屏手机设备 (最大 479px) - 图文适配优化 */
@media screen and (max-width: 479px) {
    .Healinhouse-product-banner {
        height: 350px;
    }

    .Healinhouse-product-banner__title-container {
        padding: 0 15px;
    }

    .Healinhouse-product-banner__title-container h1 {
        font-size: 15px;              /* 小屏手机再缩小 */
        line-height: 1.5;
        letter-spacing: 0.3px;
        font-weight: 400;
    }

    .Healinhouse-product-banner__yellow-bar {
        height: 50px;
    }

    .Healinhouse-product-banner__gray-overlay,
    .Healinhouse-product-banner__title-container {
        height: calc(100% - 50px);
    }

    .Healinhouse-product-banner__yellow-bar.inner-banner-bar p {
        font-size: 10px;
        line-height: 1.2;
    }
}



/* 全局重置 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* ============================================
   Vitori Products Banner 区域 - 通栏 (高度500px)
   ============================================ */
.Vitori-products-banner {
    position: relative;
    width: 100%;           /* 通栏图片自适应 */
    min-width: 100%;       /* 强制通栏 */
    height: 500px;         /* 图片高度500px */
    overflow: hidden;
}

/* Banner 背景图片 - 通栏自适应 */
.Vitori-products-banner__bg-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;           /* 宽度100%通栏 */
    min-width: 100%;
    height: 100%;
    object-fit: cover;     /* 图片顶部对齐，自适应裁切 */
    object-position: center center;
    z-index: 1;
}

/* 半透明白色遮罩 - 全站通用（可微调位置） */
.Vitori-products-banner__gray-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;          /* 缩小遮罩覆盖全屏 */
    background-color: rgba(0, 0, 0, 0.35);
    z-index: 2;
}

/* 产品横幅标题容器 - 全局居中，可微调位置 */
.Vitori-products-banner__title-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;          /* 缩小图片通栏 */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 3;
    padding: 0 40px;
}

/* Banner 标题优化 */
.Vitori-products-banner__title-container h1 {
    font-family: 'Arial', sans-serif;
    font-size: 48px;
    font-weight: 600;
    color: #ffffff;
    text-align: center;
    line-height: 1.4;
    letter-spacing: 4px;
    text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5);
    margin: 0;
    white-space: nowrap;
}

/* ============================================
   响应式适配
   ============================================ */

/* 超宽屏 (> 1920px) */
@media screen and (min-width: 1921px) {
    .Vitori-products-banner {
        height: 600px;
    }
    
    .Vitori-products-banner__title-container h1 {
        font-size: 56px;
    }
}

/* 平板设备 (768px - 1024px) */
@media screen and (max-width: 1024px) {
    .Vitori-products-banner {
        height: 400px;
    }

    .Vitori-products-banner__title-container h1 {
        font-size: 38px;
        letter-spacing: 3px;
    }
}

/* 手机设备 (480px - 767px) */
@media screen and (max-width: 767px) {
    .Vitori-products-banner {
        height: 300px;
    }

    .Vitori-products-banner__title-container {
        padding: 0 20px;
    }

    .Vitori-products-banner__title-container h1 {
        font-size: 28px;
        letter-spacing: 2px;
        white-space: normal;  /* 手机适配 */
    }
}

/* 小屏手机设备 (最大 479px) */
@media screen and (max-width: 479px) {
    .Vitori-products-banner {
        height: 250px;
    }

    .Vitori-products-banner__title-container h1 {
        font-size: 22px;
        letter-spacing: 1px;
    }
}
















/* ========== 布局 - 全站100%宽度 ========== */
.Contacts-effect-page-wrap {
    background: #f8fafc;
    padding: 70px 0 !important;
    overflow: visible !important;
}

.Contacts-effect-page-container {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    overflow: visible !important;
}

/* ========== 页头 ========== */
.Contacts-effect-page-head {
    text-align: center;
    margin-bottom: 60px;
}

.Contacts-effect-page-title {
    font-size: 36px;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 12px;
}

.Contacts-effect-page-desc {
    font-size: 14px;
    color: #64748b;
}

.Contacts-effect-page-line {
    width: 50px;
    height: 3px;
    background: linear-gradient(90deg, #2681C4, #4a9fe0);
    margin: 24px auto 0;
    border-radius: 2px;
}

/* ========== 分类导航栏 ========== */
.Contacts-effect-category-bar {
    display: flex;
    align-items: center;
    margin-bottom: 32px;
    padding-bottom: 14px;
    border-bottom: 2px solid #e2e8f0;
}

.Contacts-effect-category-badge {
    padding: 7px 18px;
    background: linear-gradient(135deg, #2681C4, #3b95d8);
    color: #fff;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    margin-right: 16px;
    box-shadow: 0 4px 12px rgba(38, 129, 196, 0.25);
}

.Contacts-effect-category-name {
    font-size: 22px;
    font-weight: 700;
    color: #1e293b;
}

/* ========== 产品系列区 ========== */
.Contacts-effect-series-grid {
    column-count: 2;           /* 每行2列 */
    column-gap: 24px;          /* 中间间距 */
    margin-bottom: 56px;
    overflow: visible !important;
}

/* ========== 系列卡片 ========== */
.Contacts-effect-series-card {
	break-inside: avoid;       /* 防止卡片换行分割 */
    margin-bottom: 24px;       /* 卡片间距 */
    width: 100% !important;    /* 宽度100% */
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
    border: 1px solid #e2e8f0;
    transition: all 0.3s ease;
    overflow: visible !important;
    position: relative;
    z-index: 1;
}

.Contacts-effect-series-card:hover {
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
    z-index: 10;
}

/* ========== 系列头部 ========== */
.Contacts-effect-series-head {
    padding: 20px;
    background: linear-gradient(135deg, rgba(38, 129, 196, 0.03), rgba(38, 129, 196, 0.06));
    border-bottom: 1px solid #e2e8f0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 14px 14px 0 0;
}

.Contacts-effect-series-title {
    font-size: 18px;
    font-weight: 700;
    color: #1e293b;
}

.Contacts-effect-series-count {
    padding: 4px 10px;
    background: #2681C4;
    color: #fff;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
}

/* ========== 型号列表 ========== */
.Contacts-effect-models-wrap {
    padding: 16px;
    overflow: visible !important;
}

.Contacts-effect-model-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    overflow: visible !important;
}

/* ========== 型号卡片区 ========== */
.Contacts-effect-model-item {
    display: flex;
    align-items: center;
    padding: 12px 14px;
    background: #f8fafc;
    border-radius: 10px;
    border: 1px solid #e2e8f0;
    cursor: pointer;
    transition: all 0.25s ease;
    text-decoration: none;
    position: relative;
    overflow: visible !important;
    z-index: 1;
}

.Contacts-effect-model-item:hover {
    background: rgba(38, 129, 196, 0.06);
    border-color: #2681C4;
    z-index: 100;
}

/* ========== 型号缩略图 ========== */
.Contacts-effect-model-thumb {
    width: 48px;
    height: 48px;
    flex-shrink: 0;
    border-radius: 8px;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    margin-right: 14px;
    border: 1px solid rgba(38, 129, 196, 0.2);
    position: relative;
    overflow: visible !important;
    z-index: 1;
}

/* ========== 型号缩略图 ========== */
.Contacts-effect-model-thumb::after {
    content: '' !important;
    position: absolute;
    bottom: 90%;
    left: 50%;
    transform: translateX(-50%) scale(0);
    width: 90px;
    height: 90px;
    /* 直接继承父元素的background-image，图片小图在同一行显示 */
    background-image: inherit !important;  
    background-size: cover !important;
    background-position: center !important;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
    z-index: 9999 !important;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transform-origin: center bottom;
    border: 2px solid #2681C4;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.Contacts-effect-model-item:hover .Contacts-effect-model-thumb::after {
    transform: translateX(-50%) scale(1.5);
    opacity: 1;
    visibility: visible;
}

/* ========== 删除占位元素 ========== */
.Contacts-effect-model-thumb::before,
.Contacts-effect-thumb-icon {
    display: none !important;
}

/* ========== 型号信息 ========== */
.Contacts-effect-model-info {
    flex: 1;
    min-width: 0;
}

.Contacts-effect-model-code {
    font-size: 14px;
    font-weight: 600;
    color: #334155;
    margin-bottom: 2px;
    transition: all 0.3s ease;
}

.Contacts-effect-model-item:hover .Contacts-effect-model-code {
    color: #2681C4;
}

.Contacts-effect-model-type {
    font-size: 11px;
    color: #64748b;
}

/* ========== 箭头指示 ========== */
.Contacts-effect-model-arrow {
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    font-size: 13px;
    opacity: 0;
    transform: translateX(-6px);
    transition: all 0.3s ease;
    flex-shrink: 0;
}

.Contacts-effect-model-item:hover .Contacts-effect-model-arrow {
    opacity: 1;
    transform: translateX(0);
    color: #2681C4;
}

/* ========== 单型号样式 ========== */
.Contacts-effect-single-model {
    padding: 16px;
    overflow: visible !important;
}

.Contacts-effect-single-item {
    display: flex;
    align-items: center;
    padding: 14px 18px;
    background: linear-gradient(135deg, rgba(38, 129, 196, 0.04), #fff);
    border-radius: 10px;
    border: 1px solid rgba(38, 129, 196, 0.12);
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    position: relative;
    overflow: visible !important;
    z-index: 1;
}

.Contacts-effect-single-item:hover {
    background: linear-gradient(135deg, rgba(38, 129, 196, 0.08), #fff);
    border-color: #2681C4;
    z-index: 100;
}

.Contacts-effect-single-thumb {
    width: 52px;
    height: 52px;
    flex-shrink: 0;
    border-radius: 10px;
    background-size: cover !important;
    background-position: center !important;
    margin-right: 14px;
    border: 1px solid rgba(38, 129, 196, 0.2);
    position: relative;
    overflow: visible !important;
}

.Contacts-effect-single-thumb::after {
    content: '' !important;
    position: absolute;
    bottom: 120%;
    left: 50%;
    transform: translateX(-50%) scale(0);
    width: 130px;
    height: 130px;
    background-image: inherit !important;  /* 继承小图 */
    background-size: cover !important;
    background-position: center !important;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
    z-index: 9999 !important;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transform-origin: center bottom;
    opacity: 0;
    border: 2px solid #2681C4;
    pointer-events: none;
}

.Contacts-effect-single-item:hover .Contacts-effect-single-thumb::after {
    transform: translateX(-50%) scale(1.5);
    opacity: 1;
}

.Contacts-effect-single-icon {
    display: none !important;
}

.Contacts-effect-single-info {
    flex: 1;
}

.Contacts-effect-single-name {
    font-size: 16px;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 2px;
}

.Contacts-effect-single-item:hover .Contacts-effect-single-name {
    color: #2681C4;
}

.Contacts-effect-single-desc {
    font-size: 12px;
    color: #64748b;
}

/* ========== 页脚 ========== */
.Contacts-effect-page-footer {
    text-align: center;
    padding-top: 24px;

    border-top: 1px solid #e2e8f0;
    color: #94a3b8;
    font-size: 12px;
}

/* ========== 响应式 ========== */
@media screen and (max-width: 768px) {
    .Contacts-effect-page-wrap {
        padding: 50px 0 !important;
    }
    
    .Contacts-effect-series-grid {
        column-count: 1 !important;
    }
    
    .Contacts-effect-page-title {
        font-size: 28px;
    }
	.Contacts-effect-series-card {
        width: 100% !important;  /* 手机菜单 */
    }
}

@media screen and (max-width: 480px) {
    .Contacts-effect-page-wrap {
        padding: 40px 0 !important;
    }
    
    .Contacts-effect-page-title {
        font-size: 24px;
    }
}














/* ============================================
   联系我们页面区 - 新版式
   前缀: Contact-all
   主色: #2681C4 蓝色系
   ============================================ */


/* ===== Banner 通栏图片 ===== */

.Contact-all-banner {
    position: relative;
    width: 100%;
    height: 720px;
    overflow: hidden;
}

.Contact-all-banner-map {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.Contact-all-banner-map iframe {
    width: 100%;
    height: 100%;
    border: none;
    transform: scale(1.02);
}

.Contact-all-banner-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(20, 40, 60, 0.5);
    z-index: 2;
}

.Contact-all-banner-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
    text-align: center;
    color: #fff;
}

.Contact-all-banner-title {
    font-size: 72px;
    font-weight: 300;
    letter-spacing: 8px;
    margin: 0 0 16px 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
}

.Contact-all-banner-subtitle {
    font-size: 18px;
    font-weight: 300;
    letter-spacing: 4px;
    margin: 0;
    opacity: 0.9;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
}


/* ===== 联系页面主体 ===== */

.Contact-all-section {
    padding: 100px 0;
    background: #f5f8fa;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
    color: #2c2c2c;
}

.Contact-all-container {
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 40px;
}


/* ===== 表单卡片 ===== */

.Contact-all-form-card {
    background: #fff;
    border-radius: 16px;
    padding: 60px 70px;
    box-shadow: 0 4px 30px rgba(38, 129, 196, 0.08);
    border: 1px solid #e8f0f5;
}

.Contact-all-form-header {
    text-align: center;
    margin-bottom: 50px;
}

.Contact-all-form-title {
    font-size: 32px;
    font-weight: 500;
    margin: 0 0 12px 0;
    color: #1a1a1a;
}

.Contact-all-form-desc {
    font-size: 15px;
    color: #888;
    margin: 0;
    line-height: 1.6;
}

.Contact-all-form-divider {
    width: 50px;
    height: 3px;
    background: linear-gradient(90deg, #2681C4 0%, #4DA6D9 100%);
    margin: 20px auto 0;
    border: none;
    border-radius: 2px;
}

.Contact-all-form {
    display: flex;
    flex-direction: column;
    gap: 28px;
}

/* 表单部分（可调整间距） */
.Contact-all-form-row {
    display: flex;
    gap: 24px;
}

.Contact-all-form-row .Contact-all-form-group {
    flex: 1;
}

.Contact-all-form-group {
    position: relative;
}

.Contact-all-form-input,
.Contact-all-form-textarea {
    width: 100%;
    padding: 18px;
    font-size: 15px;
    border: 1px solid #dde5eb;
    border-radius: 10px;
    background: #fafbfc;
    transition: all 0.3s ease;
    box-sizing: border-box;
    font-family: inherit;
    color: #333;
}

.Contact-all-form-textarea {
    min-height: 160px;
    resize: vertical;
    line-height: 1.6;
}

.Contact-all-form-input:focus,
.Contact-all-form-textarea:focus {
    outline: none;
    border-color: #2681C4;
    background: #fff;
    box-shadow: 0 0 0 4px rgba(38, 129, 196, 0.1);
}

/* 功能标签 */
.Contact-all-form-label {
    position: absolute;
    left: 18px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 15px;
    color: #aab5bd;
    pointer-events: none;
    transition: all 0.25s ease;
    background: transparent;
    padding: 0 4px;
}

.Contact-all-form-group--textarea .Contact-all-form-label {
    top: 22px;
    transform: none;
}

/* 标签上浮效果 */
.Contact-all-form-input:focus ~ .Contact-all-form-label,
.Contact-all-form-input:not(:placeholder-shown) ~ .Contact-all-form-label,
.Contact-all-form-textarea:focus ~ .Contact-all-form-label,
.Contact-all-form-textarea:not(:placeholder-shown) ~ .Contact-all-form-label {
    top: 0;
    transform: translateY(-50%) scale(0.85);
    left: 14px;
    color: #2681C4;
    background: #fff;
    font-weight: 500;
}

.Contact-all-form-group--textarea .Contact-all-form-textarea:focus ~ .Contact-all-form-label,
.Contact-all-form-group--textarea .Contact-all-form-textarea:not(:placeholder-shown) ~ .Contact-all-form-label {
    top: 0;
    transform: translateY(-50%) scale(0.85);
}

/* 必填星号 */
.Contact-all-required {
    color: #e74c3c;
    margin-left: 2px;
}

/* 错误提示 */
.Contact-all-error-msg {
    position: absolute;
    top: calc(100% + 4px);
    left: 4px;
    font-size: 12px;
    color: #e74c3c;
    margin: 0;
    padding: 0;
    display: none;
    line-height: 1.4;
    white-space: nowrap;
}

.Contact-all-error-msg.is-visible {
    display: block;
}

.Contact-all-form-group.has-error .Contact-all-form-input,
.Contact-all-form-group.has-error .Contact-all-form-textarea {
    border-color: #e74c3c;
    background: #fef7f7;
}

.Contact-all-form-group.has-error .Contact-all-form-label {
    color: #e74c3c;
}

/* 成功/失败提示 */
.Contact-all-success-msg,
.Contact-all-fail-msg {
    padding: 16px 20px;
    border-radius: 10px;
    font-size: 14px;
    text-align: center;
    display: none;
    line-height: 1.6;
}

.Contact-all-success-msg {
    background: #e8f4f8;
    border: 1px solid #b8dce8;
    color: #1a6b8a;
}

.Contact-all-fail-msg {
    background: #fde8e8;
    border: 1px solid #f5b5b5;
    color: #c0392b;
}

.Contact-all-success-msg.is-visible,
.Contact-all-fail-msg.is-visible {
    display: block;
}

/* 提交按钮 */
.Contact-all-submit-btn {
    width: 100%;
    padding: 18px 32px;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
    background: linear-gradient(135deg, #2681C4 0%, #1B5E8A 100%);
    border: none;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.3s ease;
    letter-spacing: 2px;
    font-family: inherit;
}

.Contact-all-submit-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(38, 129, 196, 0.35);
}

.Contact-all-submit-btn:active {
    transform: translateY(0);
}

.Contact-all-submit-btn:disabled {
    opacity: 0.7;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}


/* ===== 响应式适配 ===== */

@media (max-width: 960px) {
    .Contact-all-banner { height: 500px; }
    .Contact-all-banner-title { font-size: 52px; letter-spacing: 6px; }
    .Contact-all-banner-subtitle { font-size: 16px; letter-spacing: 3px; }
    .Contact-all-section { padding: 70px 0; }
    .Contact-all-container { padding: 0 30px; }
    .Contact-all-form-card { padding: 45px 40px; }
    .Contact-all-form-title { font-size: 28px; }
    .Contact-all-form-header { margin-bottom: 40px; }
}

@media (max-width: 640px) {
    .Contact-all-banner { height: 400px; }
    .Contact-all-banner-title { font-size: 40px; letter-spacing: 4px; }
    .Contact-all-banner-subtitle { font-size: 14px; letter-spacing: 2px; }
    .Contact-all-section { padding: 50px 0; }
    .Contact-all-container { padding: 0 20px; }
    .Contact-all-form-card { padding: 32px 24px; }
    .Contact-all-form-title { font-size: 24px; }
    .Contact-all-form-desc { font-size: 14px; }
    .Contact-all-form-header { margin-bottom: 32px; }
    .Contact-all-form-row { flex-direction: column; gap: 28px; }
}






/* ==============================================
   全局悬停变色系统 (Global Hover Color System)
   前缀: suspension-color-changing
   ============================================== */

/* 1. 全局悬停颜色变量，修改颜色全站生效 */
:root {
    --suspension-global-color: #2681C4; /* 默认颜色变量（可修改为任何需要的颜色） */
}

/* 2. 悬停变色模块 - 动画效果默认行为 */
.suspension-color-changing {
    /* 动画颜色变化（0.3 秒平滑过渡） */
    transition: color 0.3s ease, border-color 0.3s ease, background-color 0.3s ease;
    cursor: pointer; /* 统一分隔为两列 */
    position: relative;
    z-index: 1;
}

/* 3. 悬停状态逻辑 */
.suspension-color-changing:hover {
    /* 优先使用局部变量颜色，未定义时使用全局变量 */
    color: var(--suspension-local-color, var(--suspension-global-color));
    border-color: var(--suspension-local-color, var(--suspension-global-color));
}

/* --- 背景色变体（随悬停变色） --- */
/* 背景色悬停变色，不影响其他元素 */
.suspension-color-changing--bg:hover {
    background-color: var(--suspension-local-color, var(--suspension-global-color));
    color: #fff; /* 文字颜色时自动强制变为白色以保证可读性 */
    border-color: transparent;
}



.Healinhouse-video-description {
  width: 100%;          /* 继承内容宽度 */
  max-width: 1200px;     /* 限制最大宽度（防止视频过宽） */
  margin: 40px auto 0;  /* 上间距+自动水平居中=居中 */
  text-align: left;   /* 文字内容居中 */
  line-height: 1.6;
}

.Healinhouse-video-description h3 {
  font-size: 1.5rem;
  color: #2c3e50;
  margin-bottom: 15px;
}

.Healinhouse-video-description p {
  color: #7f8c8d;
  font-size: 1.1rem;
}

.Healinhouse-video-description p {
  margin-bottom: 24px; /* 内容垂直间距 */
  margin-top: 0;       /* 关键内容阶段防止空白 */
  line-height: 1.6;    /* 保留原始行高 */
}

.Healinhouse-video-description p:last-child {
  margin-bottom: 0;
}



















/* 通栏Banner */
.jingshitiao {
    width: 100%;
    min-height: 145px; /* 最小高度145px，内容自动撑开 */
    position: relative;
    overflow: hidden;
    /* 新版Flex黄色条自然底部对齐，不定位 */
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

/* 黄色半透明通知条 */
.jingshitiao-yellow-bar {
    width: 100%;
    /* 上下等距内边距 = 文字内容垂直居中，永不溢出 */
    padding: 22px 0;
    background: rgba(223,255,0,0.90);
    z-index: 3;
    box-sizing: border-box;
}

/* 黄色条水平居中 + 限制宽度 */
.jingshitiao-yellow-bar .container {
    max-width: 1200px;
    margin: 0 auto; /* 标准水平居中方式 */
    padding: 0 20px;
    box-sizing: border-box;
    text-align: center;
}

/* 标题样式 */
.jingshitiao-yellow-bar .section-title {
    margin: 0 0 8px !important;
    font-size: 16px;
    color: #d32f2f;
    font-weight: 600;
    line-height: 1.4;
    text-align: center !important;
}

/* 黄色条文字样式 */
.jingshitiao-yellow-bar p {
    margin: 0 0 6px !important;
    font-size: 14px;
    line-height: 1.6; /* 固定行高，防止文字换行 */
    color: #000000;
    text-align: center !important;
}

/* 移除第一段的下边距，保证文字视觉对称 */
.jingshitiao-yellow-bar p:last-child {
    margin-bottom: 0 !important;
}

/* ============================================== */
/* 平板区间（481px ~ 768px） */
/* ============================================== */
@media (min-width: 481px) and (max-width: 768px) {
    .jingshitiao-yellow-bar {
        padding: 20px 0;
    }
    .jingshitiao-yellow-bar .section-title {
        font-size: 15px;
        margin-bottom: 6px !important;
    }
    .jingshitiao-yellow-bar p {
        font-size: 13px;
        margin-bottom: 5px !important;
    }
}

/* ============================================== */
/* 手机区间（最大 480px） */
/* ============================================== */
@media (max-width: 480px) {
    .jingshitiao-yellow-bar {
        padding: 18px 0; /* 手机端内容上下内边距，内容足够空间 */
    }
    .jingshitiao-yellow-bar .section-title {
        font-size: 14px;
        margin-bottom: 6px !important;
    }
    .jingshitiao-yellow-bar p {
        font-size: 12px;
        line-height: 1.5;
        margin-bottom: 4px !important;
    }
}







/* 通屏Banner */
.fanuojingshitiao {
    width: 100%;
    min-height: 44px;
    position: relative;
    overflow: hidden;
	display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

/* 修改后：黄色半透明条，内容自适应高度，全设备通用 */
.fanuojingshitiao-yellow-bar {
    
    width: 100%;
    /* 删除固定高度，仅保留内边距，永不溢出 */
    padding: 10px 0;
    background: rgba(223,255,0,0.90);
    z-index: 3;
	box-sizing: border-box;
}

/* 新版内容宽度自适应，不超出屏幕 */
.fanuojingshitiao-yellow-bar .container {
    
    max-width: 1200px;
    padding: 0 20px; /* 文字居中，手机端适配 */
    text-align: center; /* 文字居中 */
	
	margin: 0 auto;
	box-sizing: border-box;
	
}

/* 标题样式 */
.fanuojingshitiao-yellow-bar .section-title {
    margin: 0 0 8px !important;
    font-size: 16px;
    color: #d32f2f;
    font-weight: 600;
	text-align: center !important;
	line-height: 1.4;
}

/* 黄色条文字样式 */
.fanuojingshitiao-yellow-bar p {
    margin: 0 0 6px !important;
    font-size: 14px;
    line-height: 1.6;
    color: #000000;
	text-align: center !important;
}

.jingshitiao-yellow-bar p:last-child {
    margin-bottom: 0 !important;
}


/* ============================================== */
/* 手机区间（屏幕宽度 小于 480px） */
/* ============================================== */
@media (max-width: 480px) {
    .fanuojingshitiao-yellow-bar {
        padding: 20px 0; /* 手机端文字缩小一点 */
    }
    .fanuojingshitiao-yellow-bar .section-title {
        font-size: 15px; /* 文字缩小一点 */
		margin: 0 0 2px !important;
    }
    .fanuojingshitiao-yellow-bar p {
        font-size: 13px; /* 文字缩小一点 */
		line-height: 1.5;
        margin-bottom: 4px !important;
    }
}

/* ============================================== */
/* 平板区间（屏幕宽度 481px ~ 768px） */
/* ============================================== */
@media (min-width: 481px) and (max-width: 768px) {
    .fanuojingshitiao-yellow-bar {
        padding: 20px 0; /* 平板端文字缩小一点 */
    }
	
	
	.jingshitiao-yellow-bar .section-title {
        font-size: 15px;
        margin-bottom: 6px !important;
    }
    /* 与黄色条同步缩小，保持一致字号和间距 */
    .jingshitiao-yellow-bar p {
        font-size: 13px;
        margin-bottom: 5px !important;
    }
	
}
















/* ========== 北京墙品牌Logo区 ========== */
/* 通栏背景区 */
.beijingqiang-section {
  width: 100%;
  background-color: #FAFBFC;
  padding: 80px 0; /* 内容内边距：可调，影响各区块高度 */
  box-sizing: border-box;
}

/* 北京墙容器 - 限宽1160px */
.beijingqiang-container {
  max-width: 1160px; /* 内容最大宽度限制，固定1160px（可修改） */
  margin: 0 auto;
  padding: 0 20px; /* 内容内边距：移动端时左右安全留白 */
  box-sizing: border-box;
}

/* 导航链接样式 */
.beijingqiang-header {
  text-align: center;
  margin-bottom: 60px; /* 调整Logo上下间距：可调 */
}

.beijingqiang-title {
  font-size: 25px;
  font-weight: 600;
  color: #000000;
  margin: 0 0 12px 0;
  letter-spacing: 0px;
}

.beijingqiang-subtitle {
  font-size: 14px;
  color: #86909C;
  margin: 0;
  letter-spacing: 0.5px;
}

/* ========== 北京墙Logo网格布局 ========== */
.beijingqiang-grid {
  display: grid;
  grid-template-columns: repeat(4, auto); /* 关键修改：改为auto，可随Logo尺寸变化自动调整 */
  /* ===== 间距调整：通过调整列间距控制效果，不影响其他 ===== */
  column-gap: 60px; /* 【水平间距】控制Logo之间的水平距离，改多少都行 */
  row-gap: 28px;    /* 【垂直间距】控制Logo之间的间距 */
  /* 排列方式二选一：
     center = 所有Logo居中排列，间距均匀
     space-between = 所有Logo两端对齐均匀分布
  */
  justify-content: center;
  align-items: center;
}

/* 顶部Logo */
.beijingqiang-item {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* ========== 北京墙可调Logo圆形尺寸 ========== */
.beijingqiang-logo-wrap {
  /* ===== 图片大小控制：修改宽高即可调整Logo圆形尺寸 ===== */
  width: 140px;  /* 设置Logo宽度（可直接控制Logo大小，宽高保持一致） */
  height: 140px; /* 设置Logo高度与宽度保持同值，保证圆形 */
  border-radius: 50%;
  background-color: #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  overflow: hidden;
}

/* ========== 北京墙可调Logo图片尺寸 ========== */
.beijingqiang-logo {
  /* ===== 图片在圆形内的占比：通过百分比控制图片显示大小 ===== */
  width: 100%;  /* 图片宽度占比（值越大图片越大，越小图片越小） */
  height: 100%; /* 图片高度占比（与宽度保持同值，保证图片不变形） */
  object-fit: contain;
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  filter: grayscale(20%);
  opacity: 0.85;
}

/* Hover放大效果 */
.beijingqiang-item:hover .beijingqiang-logo-wrap {
  transform: translateY(-6px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.beijingqiang-item:hover .beijingqiang-logo {
  transform: scale(1.08); /* hover放大（可改大小和放大程度） */
  filter: grayscale(0%);
  opacity: 1;
}

/* ========== 响应式适配（桌面端不换行，自动伸缩） ========== */
/* 平板 - 一行3列 */
@media screen and (max-width: 992px) {
  .beijingqiang-section {
    padding: 60px 0; /* 平板适配 */
  }
  
  .beijingqiang-header {
    margin-bottom: 48px;
  }
  
  .beijingqiang-title {
    font-size: 28px;
  }
  
  .beijingqiang-grid {
    grid-template-columns: repeat(3, auto);
    column-gap: 20px; /* 【平板间水平间距】可调，影响直排效果 */
    row-gap: 24px;    /* 【平板间垂直间距】可调 */
    justify-content: center;
  }
  
  .beijingqiang-logo-wrap {
    width: 120px;  /* 【平板间Logo高度】可调 */
    height: 120px;
  }
}

/* 手机端 - 一行2列 */
@media screen and (max-width: 640px) {
  .beijingqiang-section {
    padding: 48px 0; /* 手机适配 */
  }
  
  .beijingqiang-header {
    margin-bottom: 36px;
  }
  
  .beijingqiang-title {
    font-size: 24px;
  }
  
  .beijingqiang-subtitle {
    font-size: 13px;
  }
  
  .beijingqiang-grid {
    grid-template-columns: repeat(2, auto);
    column-gap: 25px; /* 【手机端水平间距】可调，影响直排效果 */
    row-gap: 20px;    /* 【手机端垂直间距】可调 */
    justify-content: center;
  }
  
  .beijingqiang-logo-wrap {
    width: 150px;  /* 【手机端Logo高度】可调 */
    height: 150px;
  }
}

/* 小屏手机 */
@media screen and (max-width: 375px) {
  .beijingqiang-logo-wrap {
    width: 88px;
    height: 88px;
  }
  
  .beijingqiang-grid {
    column-gap: 14px;
    row-gap: 18px;
  }
}




















/* ========== 全局重置样式 ========== */
*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --jishu-bg-white: #ffffff;
    --jishu-bg-gray: #FAFBFC;
    --jishu-bg-card: #ffffff;
    --jishu-border: #e5e7eb;
    --jishu-border-active: #2681C4;
    --jishu-text-primary: #1a1f2e;
    --jishu-text-secondary: #5b6373;
    --jishu-text-tertiary: #94a0b4;
    --jishu-accent-blue: #2681C4;
    --jishu-accent-purple: #8b5cf6;
    --jishu-accent-pink: #ec4899;
    --jishu-accent-orange: #f97316;
    --jishu-accent-green: #10b981;
    --jishu-accent-red: #ef4444;
    --jishu-accent-cyan: #00d4ff;
    --jishu-accent-yellow: #eab308;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
    background: var(--jishu-bg-white);
    color: var(--jishu-text-primary);
    line-height: 1.6;
    overflow-x: hidden;
}

/* ========== 页脚 ========== */
.jishu-page-wrapper {
    width: 100%;
    min-height: 100vh;
    position: relative;
}

.jishu-section-inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 40px;
    position: relative;
    z-index: 1;
}

/* ========== 通用板块标题 ========== */
.jishu-section-header {
    text-align: center;
    margin-bottom: 70px;
}

.jishu-section-number {
    font-size: 14px;
    color: var(--jishu-accent-blue);
    letter-spacing: 4px;
    margin-bottom: 16px;
    font-weight: 500;
}

.jishu-section-title {
    font-size: clamp(28px, 4vw, 44px);
    font-weight: 700;
    margin-bottom: 18px;
    color: var(--jishu-text-primary);
}

.jishu-section-desc {
    font-size: 15px;
    color: var(--jishu-text-secondary);
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.8;
}

/* ========== 技术 Hero 区域 ========== */
.jishu-hero-section {
    padding: 120px 0 100px;
    text-align: center;
    background: var(--jishu-bg-white);
    position: relative;
}

.jishu-hero-tag {
    display: inline-block;
    padding: 8px 20px;
    border: 1px solid var(--jishu-border);
    border-radius: 50px;
    font-size: 13px;
    color: var(--jishu-text-secondary);
    letter-spacing: 2px;
    margin-bottom: 30px;
    background: var(--jishu-bg-gray);
}

.jishu-hero-title {
    font-size: clamp(36px, 6vw, 72px);
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 24px;
    background: linear-gradient(135deg, #1a1f2e 0%, #00d4ff 50%, #8b5cf6 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.jishu-hero-subtitle {
    font-size: clamp(14px, 2vw, 18px);
    color: var(--jishu-text-secondary);
    max-width: 680px;
    margin: 0 auto;
    line-height: 1.8;
}

.jishu-hero-scroll-hint {
    margin-top: 80px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    color: var(--jishu-text-tertiary);
    font-size: 12px;
    letter-spacing: 3px;
    animation: jishuFloat 3s ease-in-out infinite;
}

.jishu-scroll-line {
    width: 1px;
    height: 40px;
    background: linear-gradient(to bottom, var(--jishu-accent-blue), transparent);
}

@keyframes jishuFloat {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(10px); }
}

/* ========== 光疗技术区 ========== */
.jishu-photon-section {
    padding: 100px 0;
    background: var(--jishu-bg-gray);
    position: relative;
}

.jishu-photon-showcase {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
    margin-bottom: 60px;
}

/* 灯光展示区 */
.jishu-light-display {
    position: relative;
    height: 420px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--jishu-bg-white);
    border-radius: 24px;
    border: 1px solid var(--jishu-border);
    overflow: visible;
    padding: 40px 20px 30px;
}

.jishu-light-stage {
    flex: 1;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

/* 第1层：底部LED灯光层（图片下方） */
.jishu-light-led {
    --light-color: #00d4ff;
    --led-darken-level: 40%; /* 透明度可调（值越小颜色越浅，推荐40%-70%范围） */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 18px;
    height: 18px;
    border-radius: 50%;
    /* 新版边框本身 = 选色板加红色加同色边框 */
    background: color-mix(in srgb, var(--light-color) var(--led-darken-level), black);
    z-index: 1;
    box-shadow:
        /* 内部灯光，与边框同色（或同一发光色系） */
        0 0 10px color-mix(in srgb, var(--light-color) var(--led-darken-level), black),
        /* 桌面端灯光，使用原选色板保证和桌面端颜色统一 */
        0 0 24px var(--light-color),
        0 0 55px var(--light-color),
        0 0 90px var(--light-color);
    animation: jishuLedPulse 2.8s ease-in-out infinite;
    transition: box-shadow 0.8s cubic-bezier(0.4, 0, 0.2, 1), background 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}
/* 底部LED灯向外扩散 */
.jishu-light-led::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 140px;
    height: 140px;
    border-radius: 50%;
    background: radial-gradient(
        circle,
        rgba(255, 255, 255, 0.65) 0%,
        var(--light-color) 26%,
        var(--light-color) 42%,
        transparent 68%
    );
    filter: blur(16px) brightness(1.45);
    opacity: 0.55;
    pointer-events: none;
    animation: jishuLedBreath 2.8s ease-in-out infinite;
}

/* 底部LED灯的大范围光晕 */
.jishu-light-led::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: var(--light-color);
    filter: blur(32px);
    opacity: 0.18;
    pointer-events: none;
}

/* 第2层：中间瓶型图片 */
.jishu-light-img {
    position: relative;
    z-index: 2;
    max-width: 70%;
    max-height: 220px;
    object-fit: contain;
    user-select: none;
    transition: opacity 0.3s ease;
}

/* 第3层：顶部光效（图片上方） */
.jishu-light-glow {
    --light-color: #00d4ff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60px;
    height: 60px;
    border-radius: 50%;
    z-index: 3;
    pointer-events: none;
    background: radial-gradient(
        circle,
        rgba(255, 255, 255, 0.95) 0%,
        rgba(255, 255, 255, 0.35) 12%,
        var(--light-color) 30%,
        var(--light-color) 48%,
        transparent 75%
    );
    filter: blur(1px) brightness(1.35);
    opacity: 0.55;
    animation: jishuGlowOverLay 2.8s ease-in-out infinite;
}

/* 灯光光晕效果 */
.jishu-light-glow::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 0 20px #ffffff, 0 0 45px var(--light-color);
    pointer-events: none;
}

/* 灯光光晕效果 */
.jishu-light-glow::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--light-color);
    filter: blur(12px);
    opacity: 0.35;
    pointer-events: none;
}

/* 底部LED灯呼吸 */
@keyframes jishuLedPulse {
    0%, 100% {
        opacity: 1;
        box-shadow:
            0 0 10px color-mix(in srgb, var(--light-color) var(--led-darken-level), black),
            0 0 24px var(--light-color),
            0 0 55px var(--light-color),
            0 0 90px var(--light-color);
    }
    50% {
        opacity: 0.88;
        box-shadow:
            0 0 8px color-mix(in srgb, var(--light-color) var(--led-darken-level), black),
            0 0 18px var(--light-color),
            0 0 42px var(--light-color),
            0 0 72px var(--light-color);
    }
}

/* 底部边框 */
@keyframes jishuLedBreath {
    0%, 100% {
        opacity: 0.55;
        transform: translate(-50%, -50%) scale(1);
    }
    50% {
        opacity: 0.72;
        transform: translate(-50%, -50%) scale(1.06);
    }
}

/* 灯光光晕效果 */
@keyframes jishuGlowOverLay {
    0%, 100% {
        opacity: 0.55;
        transform: translate(-50%, -50%) scale(1);
    }
    50% {
        opacity: 0.75;
        transform: translate(-50%, -50%) scale(1.12);
    }
}

/* 颜色选择器 */
.jishu-color-switcher {
    display: flex;
    gap: 16px;
    z-index: 4;
    margin-top: 20px;
}

.jishu-color-dot {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    cursor: pointer;
    border: 2px solid rgba(0,0,0,0.1);
    transition: all 0.3s ease;
    position: relative;
}

.jishu-color-dot:hover:not(.disabled) {
    transform: scale(1.2);
    border-color: rgba(0,0,0,0.3);
}

.jishu-color-dot.active {
    transform: scale(1.15);
    border-color: var(--jishu-text-primary);
    box-shadow: 0 0 15px currentColor;
}

.jishu-color-dot.disabled {
    opacity: 0.2;
    cursor: not-allowed;
}

.jishu-color-dot.hidden {
    display: none;
}

/* 颜色圆点悬停提示框（同款效果） */
.jishu-color-dot::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    padding: 6px 12px;
    background: #ffffff;
    color: #334155;
    font-size: 12px;
    border-radius: 6px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 10;
    pointer-events: none;
}

.jishu-color-dot:hover::after {
    opacity: 1;
    visibility: visible;
    bottom: calc(100% + 10px);
}

.jishu-color-red { background: var(--jishu-accent-red); color: var(--jishu-accent-red); }
.jishu-color-orange { background: var(--jishu-accent-orange); color: var(--jishu-accent-orange); }
.jishu-color-yellow { background: var(--jishu-accent-yellow); color: var(--jishu-accent-yellow); }
.jishu-color-green { background: var(--jishu-accent-green); color: var(--jishu-accent-green); }
.jishu-color-cyan { background: var(--jishu-accent-cyan); color: var(--jishu-accent-cyan); }
.jishu-color-blue { background: var(--jishu-accent-blue); color: var(--jishu-accent-blue); }
.jishu-color-purple { background: var(--jishu-accent-purple); color: var(--jishu-accent-purple); }

/* 右侧信息区域 */
.jishu-photon-info h3 {
    font-size: 32px;
    margin-bottom: 20px;
    font-weight: 600;
    color: var(--jishu-text-primary);
}

.jishu-photon-info > p {
    color: var(--jishu-text-secondary);
    margin-bottom: 30px;
    line-height: 1.8;
}

.jishu-feature-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.jishu-feature-item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px 20px;
    background: var(--jishu-bg-white);
    border: 1px solid var(--jishu-border);
    border-radius: 12px;
    transition: all 0.3s ease;
}

.jishu-feature-item:hover {
    border-color: rgba(0, 212, 255, 0.3);
    transform: translateX(6px);
    background: rgba(0, 212, 255, 0.03);
}

.jishu-feature-icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    margin-top: 2px;
    color: var(--jishu-accent-blue);
}

.jishu-feature-text h4 {
    font-size: 15px;
    margin-bottom: 4px;
    font-weight: 500;
    color: var(--jishu-text-primary);
}

.jishu-feature-text p {
    font-size: 13px;
    color: var(--jishu-text-tertiary);
}

/* 光子缩略图切换 */
.jishu-photon-thumbs {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.jishu-photon-thumb {
    position: relative;
    border-radius: 12px;
    background: var(--jishu-bg-white);
    border: 2px solid transparent;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
}

.jishu-photon-thumb:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.06);
}

.jishu-photon-thumb.active {
    border-color: var(--jishu-border-active);
    box-shadow: 0 0 0 4px rgba(0, 212, 255, 0.1);
}

.jishu-thumb-img-wrap {
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px;
    background: var(--jishu-bg-gray);
    position: relative;
    flex-shrink: 0;
}

.jishu-thumb-img {
    max-width: 80%;
    max-height: 100%;
    object-fit: contain;
}

.jishu-thumb-info {
    padding: 10px 12px 12px;

    text-align: center;
    background: var(--jishu-bg-white);
    flex-shrink: 0;
}

.jishu-thumb-info h4 {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 2px;
    color: var(--jishu-text-primary);
    line-height: 1.3;
}

.jishu-thumb-info p {
    font-size: 11px;
    color: var(--jishu-text-tertiary);
    line-height: 1.3;
}

/* ========== 分类导航栏 ========== */
.jishu-wave-section {
    padding: 100px 0;
    background: var(--jishu-bg-white);
    position: relative;
}

/* 波浪可视化区 */
.jishu-wave-visual {
    height: 340px;
    position: relative;
    margin-bottom: 60px;
    border-radius: 20px;
    overflow: hidden;
    background: var(--jishu-bg-gray);
    border: 1px solid var(--jishu-border);
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
}

.jishu-wave-image-wrap {
    display: flex;
    flex-direction: column;
    padding: 30px;
    height: 100%;
}

.jishu-wave-main-img {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

.jishu-wave-image {
    max-width: 100%;
    max-height: 200px;
    object-fit: contain;
    border-radius: 8px;
    transition: opacity 0.3s ease;
}

/* 图片缩略图点击切换（优化版：底部+边框+阴影） */
.jishu-wave-thumbs {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
}

.jishu-wave-thumb {
	position: relative;
    width: 72px;
    height: 52px;
    border-radius: 8px;

    cursor: pointer;
    border: 2px solid #e5e7eb;
    background: #ffffff;
    padding: 4px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    transition: all 0.3s ease;
    flex-shrink: 0;
}

.jishu-wave-thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 4px;
}

.jishu-wave-thumb:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    border-color: #cbd5e1;
}

.jishu-wave-thumb.active {
    border-color: var(--jishu-border-active);
    box-shadow: 
        0 0 0 3px rgba(0, 212, 255, 0.15),
        0 4px 12px rgba(0, 212, 255, 0.2);
}






/* 自动显示提示框 */
.jishu-wave-thumb::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    padding: 6px 12px;
    background: #ffffff;
    color: #334155;
    font-size: 12px;
    border-radius: 6px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 10;
    pointer-events: none;
}

.jishu-wave-thumb:hover::after {
    opacity: 1;
    visibility: visible;
    bottom: calc(100% + 10px);
}









.jishu-wave-canvas-wrap {
    position: relative;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.jishu-wave-canvas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.jishu-wave-label {
    position: relative;
    z-index: 2;
    text-align: center;
    pointer-events: none;
}

.jishu-wave-label h3 {
    font-size: 28px;
    font-weight: 600;
    margin-bottom: 8px;
    color: var(--jishu-text-primary);
}

.jishu-wave-label p {
    font-size: 14px;
    color: var(--jishu-text-secondary);
}

/* 波浪功能卡片区 */
.jishu-wave-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

.jishu-wave-card {
    position: relative;
    padding: 36px 30px;
    background: var(--jishu-bg-white);
    border: 1px solid var(--jishu-border);
    border-radius: 16px;
    transition: all 0.2s ease;
    overflow: hidden;
}



.jishu-wave-card:hover {
    transform: translateY(-6px);
    border-color: rgba(139, 92, 246, 0.3);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.jishu-wave-card:hover::before {
    transform: scaleX(1);
}

.jishu-wave-icon {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.1), rgba(0, 212, 255, 0.1));
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
    color: var(--jishu-accent-blue);
}

.jishu-wave-card h4 {
    font-size: 20px;
    margin-bottom: 12px;
    font-weight: 600;
    color: var(--jishu-text-primary);
}

.jishu-wave-card > p {
    font-size: 14px;
    color: var(--jishu-text-secondary);
    line-height: 1.7;
    margin-bottom: 20px;
}

.jishu-wave-specs {
    display: flex;
    gap: 20px;
    padding-top: 20px;
    border-top: 1px solid var(--jishu-border);
}

.jishu-spec-item {

    flex: 1;
}

.jishu-spec-value {
    font-size: 22px;
    font-weight: 600;
    color: var(--jishu-accent-blue);
    margin-bottom: 2px;
}

.jishu-spec-label {
    font-size: 11px;
    color: var(--jishu-text-tertiary);
    letter-spacing: 0.5px;
}







/* ========== 技术发热区域 ========== */
.jishu-heat-section {
    padding: 100px 0;
    background: var(--jishu-bg-gray);
}

.jishu-heat-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}

/* 发热丝模块 */
.jishu-heat-wire-module {
    padding: 40px;
    background: var(--jishu-bg-white);
    border: 1px solid var(--jishu-border);
    border-radius: 20px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.jishu-heat-wire-module::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(249, 115, 22, 0.08) 0%, transparent 70%);
    pointer-events: none;
}

.jishu-module-tag {
    display: inline-block;
    padding: 6px 14px;
    background: rgba(249, 115, 22, 0.1);
    color: var(--jishu-accent-orange);
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    margin-bottom: 20px;
    width: fit-content;
}

.jishu-heat-wire-module h3 {
    font-size: 26px;
    margin-bottom: 16px;
    color: var(--jishu-text-primary);
}

.jishu-heat-wire-module > p {
    color: var(--jishu-text-secondary);
    font-size: 14px;
    line-height: 1.8;
    margin-bottom: 30px;
}

/* 导线可视化区 */
.jishu-wire-visual {
    flex: 1;
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--jishu-bg-gray);
    border-radius: 12px;
    padding: 0;
    min-height: 220px;
    width: 100%;
}

.jishu-wire-svg {
    width: 500px;
    height: 300px;
    border-radius: 12px;
    overflow: hidden;
}

.jishu-wire-svg svg {
    width: 100%;
    height: 100%;
    display: block;
}

/* 第1层：发光线条，长度自适应 */
.jishu-wire-path-svg {
    fill: none;
    stroke-width: 0.09;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke: #ea580c;
    filter: drop-shadow(0 0 0.14 rgba(249, 115, 22, 0.65));
}

/* 第2层：线条发光呼吸，渐变效果 */
.jishu-wire-glow-breath-svg {
    fill: none;
    stroke-width: 0.32;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke: rgba(255, 180, 120, 0.72);
    opacity: 0.55;
    animation: jishuWireBreathGlow 5s ease-in-out infinite;
    filter: blur(0.18) brightness(1.6);
    pointer-events: none;
}

/* 第3层：偶发闪烁呼吸，横向扫描 */
.jishu-wire-glow-pulse-svg {
    fill: none;
    stroke-width: 0.22;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke: rgba(255, 210, 160, 0.85);
    opacity: 0;
    animation: jishuWirePulseSweep 5s ease-in-out infinite;
    filter: blur(0.12) brightness(1.9);
    pointer-events: none;
}

/* 文字与图片间微调移动 */
@keyframes jishuWireBreathGlow {
    0% {
        opacity: 0.45;
        filter: blur(0.18) brightness(1.4);
    }
    50% {
        opacity: 0.75;
        filter: blur(0.22) brightness(1.85);
    }
    100% {
        opacity: 0.45;
        filter: blur(0.18) brightness(1.4);
    }
}

/* 偶发闪烁线条高度不一致，不是错误 */
@keyframes jishuWirePulseSweep {
    /* 初始熄灭状态 */
    0%, 12% {
        opacity: 0;
    }
    /* 第一阶段闪烁：逐渐变亮到峰值 */
    20% {
        opacity: 1;
    }
    28% {
        opacity: 0;
    }
    /* 中间灯光熄灭 */
    72% {
        opacity: 0;
    }
    /* 第二阶段闪烁与第一阶段对称 */
    80% {
        opacity: 1;
    }
    88%, 100% {
        opacity: 0;
    }
}

/* 导线类型切换按钮 */
.jishu-wire-types {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: auto;
}

.jishu-wire-type-btn {
    padding: 10px 20px;
    border: 1px solid var(--jishu-border);
    border-radius: 8px;
    background: transparent;
    color: var(--jishu-text-secondary);
    font-size: 13px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.jishu-wire-type-btn:hover,
.jishu-wire-type-btn.active {
    background: rgba(249, 115, 22, 0.1);
    border-color: var(--jishu-accent-orange);
    color: var(--jishu-accent-orange);
}
/* 加热板 */
.jishu-heat-plate-module {
    padding: 40px;
    background: var(--jishu-bg-white);
    border: 1px solid var(--jishu-border);
    border-radius: 20px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.jishu-heat-plate-module::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(239, 68, 68, 0.08) 0%, transparent 70%);
    pointer-events: none;
}

.jishu-plate-visual {
    margin-bottom: 24px;
}

.jishu-plate-main-img {
    position: relative;
    width: 100%;
    height: 180px;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 16px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
}

.jishu-plate-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: opacity 0.3s ease;
}

/* 加热板叠层，压住实际图 */
.jishu-plate-heat-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(ellipse at center, rgba(249, 115, 22, 0.4) 0%, rgba(239, 68, 68, 0.15) 50%, transparent 75%);
    mix-blend-mode: overlay;
    animation: jishuHeatPulse 4s ease-in-out infinite;
    pointer-events: none;
}

@keyframes jishuHeatPulse {
    0%, 100% { opacity: 0.6; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.05); }
}

/* 加热板缩略图切换 */
.jishu-plate-thumbs {
    display: flex;
    gap: 10px;
    justify-content: center;
}

.jishu-plate-thumb {
    width: 70px;
    height: 50px;
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.jishu-plate-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.jishu-plate-thumb:hover {
    transform: scale(1.05);
}

.jishu-plate-thumb.active {
    border-color: var(--jishu-accent-orange);
}

.jishu-heat-plate-module h3 {
    font-size: 26px;
    margin-bottom: 16px;
    color: var(--jishu-text-primary);
}

.jishu-heat-plate-module > p {
    color: var(--jishu-text-secondary);
    font-size: 14px;
    line-height: 1.8;
    margin-bottom: 24px;
}

.jishu-plate-features {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: auto;
}

.jishu-plate-feat {
    padding: 12px 16px;
    background: rgba(239, 68, 68, 0.05);
    border-radius: 8px;
    font-size: 13px;
    color: var(--jishu-text-secondary);
    border-left: 3px solid var(--jishu-accent-orange);
}




/* ========== 更多技术模块 ========== */
.jishu-more-section {
    padding: 100px 0 120px;
    background: var(--jishu-bg-white);
    position: relative;
}

.jishu-tech-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.jishu-tech-item {
    position: relative;
    padding: 40px 32px;
    background: var(--jishu-bg-white);
    border: 1px solid var(--jishu-border);
    border-radius: 16px;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
}

.jishu-tech-item::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(0, 212, 255, 0.03), transparent);
    opacity: 0;
    transition: opacity 0.4s ease;
    pointer-events: none;
}

.jishu-tech-item:hover {
    transform: translateY(-6px) scale(1.02);
    border-color: rgba(0, 212, 255, 0.3);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}

.jishu-tech-item:hover::after {
    opacity: 1;
}

.jishu-tech-icon {
    width: 48px;
    height: 48px;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(0, 212, 255, 0.1), rgba(139, 92, 246, 0.1));
    color: var(--jishu-accent-blue);
    font-size: 22px;
}

.jishu-tech-item h4 {
    font-size: 18px;
    margin-bottom: 12px;
    font-weight: 600;
    position: relative;
    z-index: 1;
    color: var(--jishu-text-primary);
}

.jishu-tech-item p {
    font-size: 13px;
    color: var(--jishu-text-secondary);
    line-height: 1.7;
    position: relative;
    z-index: 1;
}

.jishu-tech-arrow {
    position: absolute;
    bottom: 30px;
    right: 30px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid var(--jishu-border);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--jishu-text-tertiary);
    transition: all 0.3s ease;
    z-index: 1;
}

.jishu-tech-item:hover .jishu-tech-arrow {
    background: var(--jishu-accent-blue);
    border-color: var(--jishu-accent-blue);
    color: #fff;
    transform: translateX(4px);
}

/* ========== 滚动显现动画 ========== */
.jishu-reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.jishu-reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

.jishu-reveal-delay-1 { transition-delay: 0.1s; }
.jishu-reveal-delay-2 { transition-delay: 0.2s; }
.jishu-reveal-delay-3 { transition-delay: 0.3s; }
.jishu-reveal-delay-4 { transition-delay: 0.4s; }

/* ========== 响应式 ========== */
@media (max-width: 1024px) {
    .jishu-section-inner {
        padding: 0 30px;
    }
    
    .jishu-photon-showcase {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .jishu-light-display {
        height: 380px;
    }
    
    .jishu-photon-thumbs {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .jishu-wave-visual {
        grid-template-columns: 1fr;
        height: auto;
    }
    
    .jishu-wave-image-wrap {
        padding: 30px;
    }
    
    .jishu-wave-canvas-wrap {
        height: 200px;
    }
    
    .jishu-wave-cards {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .jishu-heat-layout {
        grid-template-columns: 1fr;
    }
    
    .jishu-tech-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .jishu-section-inner {
        padding: 0 20px;
    }
    
    .jishu-hero-section {
        padding: 80px 0 60px;
    }
    
    .jishu-photon-section,
    .jishu-wave-section,
    .jishu-heat-section,
    .jishu-more-section {
        padding: 70px 0;
    }
    
    .jishu-section-header {
        margin-bottom: 45px;
    }
    
    .jishu-light-display {
        height: 340px;
        padding: 30px 15px;
    }
    
    .jishu-light-glow {
        width: 80px;
        height: 80px;
    }
    
    .jishu-photon-thumbs {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
    
    .jishu-photon-thumb {
        height: 140px;
    }
    
    .jishu-wave-visual {
        margin-bottom: 50px;
    }
    
    .jishu-heat-wire-module,
    .jishu-heat-plate-module {
        padding: 28px 24px;
    }
    
    .jishu-plate-main-img {
        height: 150px;
    }
    
    .jishu-tech-grid {
        grid-template-columns: 1fr;
    }
    
    .jishu-color-dot {
        width: 24px;
        height: 24px;
    }
    
    .jishu-color-switcher {
        gap: 12px;
    }
}

















/* 新版一页样式 - 统一kongzhiq前缀布局 */
.kongzhiq-wrapper * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.kongzhiq-wrapper {
    width: 100%;
    color: #1f2937;
}

/* 页面标题 */
.kongzhiq-page-title {
    max-width: 1160px;
    margin: 0 auto;
    padding: 90px 20px 20px;
    text-align: center;
    font-size: 36px;
    font-weight: 700;
    letter-spacing: 1px;
    color: #111827;
}

/* 控制器 - 通用分类区域 */
.kongzhiq-category-section {
    width: 100%;
    padding: 60px 0;
    background-color: #ffffff;
}
.kongzhiq-category-section:nth-of-type(even) {
    background-color: #FAFBFC;
}
.kongzhiq-category-section:last-child {
    padding-bottom: 80px;
}

/* 控制器分类头部 - 限宽1160px */
.kongzhiq-category-header {
    max-width: 1160px;
    margin: 0 auto 30px;
    padding: 0 20px 16px;
    display: flex;
    align-items: center;
    gap: 14px;
    border-bottom: 1px solid #e5e7eb;
}
.kongzhiq-category-bar {
    width: 5px;
    height: 28px;
    border-radius: 3px;
    background: #111827;
}
.kongzhiq-category-title {
    font-size: 24px;
    font-weight: 600;
    color: #111827;
    letter-spacing: 0.15px;
}
.kongzhiq-category-subtitle {
    margin-left: auto;
    font-size: 14px;
    color: #9ca3af;
}

/* 导航链接样式 */
.kongzhiq-subcategory-wrap {
    max-width: 1160px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    gap: 50px;
}

/* 导航链接样式 */
.kongzhiq-subcategory-block {
    width: 100%;
}

/* 分类标题 - 大写字母样式 */
.kongzhiq-subcategory-title {
    font-size: 14px;
    font-weight: 500;
    color: #6b7280;
    text-transform: capitalize;
    letter-spacing: 2px;
    margin-bottom: 20px;
    line-height: 1.4;
}

/* 移除分类标题限制 统一宽度 内边距 内容间距 统一管理 */
.kongzhiq-subcategory-block .kongzhiq-model-grid {
    margin: 0;
    padding: 0;
}

/* 产品型号网格 - 限宽1160px */
.kongzhiq-model-grid {
    max-width: 1160px;
    margin: 0 auto;
    padding: 0 20px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 24px;
}

/* 产品型号卡片 */
.kongzhiq-model-card {
    display: block;
    text-decoration: none;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.18s ease-out;
    position: relative;
}
.kongzhiq-model-card:hover {
    transform: translateY(-6px);
    border-color: #d1d5db;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.08);
}

/* 卡片图片区 */
.kongzhiq-card-imgbox {
    width: 100%;
    height: 180px;
    overflow: hidden;
    background-color: #f3f4f6;
}
.kongzhiq-card-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.2s ease-out;
}
.kongzhiq-model-card:hover .kongzhiq-card-image {
    transform: scale(1.05);
}

/* 卡片信息区 */
.kongzhiq-card-info {
    padding: 22px 20px;
}
.kongzhiq-card-name {
    font-size: 18px;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 8px;
    transition: color 0.12s ease-out;
}
.kongzhiq-model-card:hover .kongzhiq-card-name {
    color: #111827;
}
.kongzhiq-card-desc {
    font-size: 14px;
    color: #6b7280;
    line-height: 1.5;
}

/* 进场动画 */
.kongzhiq-fade-up {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.kongzhiq-fade-up.kongzhiq-is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* 平板适配 */
@media (max-width: 768px) {
    .kongzhiq-page-title {
        font-size: 28px;
        padding: 40px 16px 30px;
    }
    .kongzhiq-category-section {
        padding: 40px 0;
    }
    .kongzhiq-category-title {
        font-size: 20px;
    }
    .kongzhiq-category-header {
        padding: 0 16px 16px;
    }

    /* 平板适配 */
    .kongzhiq-subcategory-wrap {
        padding: 0 16px;
        gap: 40px;
    }
    .kongzhiq-subcategory-title {

        font-size: 13px;
        letter-spacing: 1.5px;
        margin-bottom: 16px;
    }

    .kongzhiq-model-grid {
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
        gap: 16px;
        padding: 0 16px;
    }
    .kongzhiq-card-imgbox {
        height: 140px;
    }
    .kongzhiq-card-info {
        padding: 16px;
    }
    .kongzhiq-card-name {
        font-size: 16px;
    }
}

/* 手机适配 */
@media (max-width: 480px) {
    .kongzhiq-page-title {
        font-size: 24px;
    }
    .kongzhiq-category-title {
        font-size: 18px;
    }

    /* 手机适配 */
    .kongzhiq-subcategory-wrap {
        gap: 32px;
    }

    .kongzhiq-model-grid {
        grid-template-columns: 1fr;
    }
}



















/* 新版一页样式 - 统一zikongzhiqi前缀布局 */
.zikongzhiqi-wrapper * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.zikongzhiqi-wrapper {
    width: 100%;
    padding: 60px 20px 80px;
    background: #ffffff;
    color: #1f2937;
}

/* 页面标题 */
.zikongzhiqi-title {
    max-width: 1160px;
    margin: 0 auto 40px;
    font-size: 32px;
    font-weight: 700;
    color: #111827;
    letter-spacing: 0.5px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e5e7eb;
}

/* 瀑布流布局 */
.zikongzhiqi-waterfall {
    max-width: 1160px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 275px);  /* 标题固定4列 */
    justify-content: center;
    gap: 20px;
}

/* 型号卡片 */
.zikongzhiqi-card {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.18s ease-out;
}

/* hover 卡片效果 */
.zikongzhiqi-card:hover {
    transform: translateY(-4px);
    border-color: #d1d5db;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.06);
}

/* 卡片图片区 */
.zikongzhiqi-card-img {
    width: 100%;
    height: 395px;  /* keep card height */
    object-fit: cover;
    object-position: center;
    display: block;
    background: #f3f4f6;
    transition: transform 0.2s ease-out;
}
.zikongzhiqi-card:hover .zikongzhiqi-card-img {
    transform: scale(1.02);
}

/* 卡片信息区 */
.zikongzhiqi-card-body {
    padding: 16px;
}

/* 型号文字样式 */
.zikongzhiqi-card-model {
    font-size: 16px;
    font-weight: 600;
    color: #111827;
    margin-bottom: 10px;
}

/* 功能标签 */
.zikongzhiqi-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* 功能特性标签 */
.zikongzhiqi-tag {
    padding: 4px 10px;
    font-size: 12px;
    color: #4b5563;
    background: #f3f4f6;
    border-radius: 4px;
    line-height: 1.5;
}

/* 平板适配 */
@media (max-width: 992px) {
    .zikongzhiqi-waterfall {
        grid-template-columns: repeat(3, 1fr);
    }
    .zikongzhiqi-title {
        font-size: 28px;
    }
}

/* 小平板适配 */
@media (max-width: 768px) {
    .zikongzhiqi-wrapper {
        padding: 40px 16px 60px;
    }
    .zikongzhiqi-waterfall {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }
    .zikongzhiqi-card-body {
        padding: 12px;
    }
    .zikongzhiqi-title {
        font-size: 24px;
        margin-bottom: 30px;
    }
}

/* 手机适配 */
@media (max-width: 480px) {
    .zikongzhiqi-waterfall {
        grid-template-columns: 1fr;
    }
}














/* 全站字体设计（系统字体，全站通用） */
:root {
  --zhengce-font-primary: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", sans-serif;
  --zhengce-font-size-base: 16px;
  --zhengce-line-height-base: 1.6;
}

/* 内容区固定宽度1160px + 水平居中 */
.zhengce-content-wrapper {
  max-width: 1160px; /* 导航链接样式 */
  width: 100%;       /* 小屏自动换行 */
  margin: 70px auto; /* 减少所有间距 */
  padding: 20px;     /* 手机端移除内边距 */
  /* 保留原始样式，不做改动 */
}

/* 标题：粗体 + 底部边框 */
.zhengce-main-title {
  text-align: center; /* 标题加粗 */
  font-size: 3.2em; /* 防止收缩 */
  font-weight: 700; /* 加粗 */
  margin-bottom: 80px; /* 新段落间距 */
  color: #1a1a1a; /* 黄色半透明通知条 */
  letter-spacing: -0.5px; /* 优化字间距 */
}

/* 内容区块：内容间垂直间距 */
.zhengce-content-block {
  margin-bottom: 55px; /* 内容垂直间距 */
  position: relative; /* 为小标题定位提供上下文 */
}

/* 小标题：左上角定位 + 加粗 */
.zhengce-section-subtitle {
  position: absolute;
  top: -22px; /* 标题加粗显眼 */
  left: 0;
  font-weight: 700; /* 标题加粗 */
  font-size: 1.4em; /* 小号字体 */
  background: #fff; /* 在下方显示 */
  padding-right: 12px; /* 右侧文字强替换 */
  color: #000000; /* 强制颜色替换 */
}

/* 内容段落：段落间距 */
.zhengce-content-paragraph {
  padding-top: 25px; /* 文字两端对齐 */
  text-align: justify; /* 正文段落行距调整 */
  font-size: 1.05em;
  line-height: 1.8;
}

.zhengce-list {
  padding-left: 2.5em; /* 统一列表样式（应用于各区块） */
  margin: 15px 0;     /* 导航链接样式 */
  list-style-type: disc; /* 确保列表项正常 */
}

.zhengce-list > li {
  margin-bottom: 14px; /* 调整列表项之间的间距 */
}

.zhengce-list > li:last-child {
  margin-bottom: 0; /* 移除最后一个的底部间距 */
}

/* 平板区间（768px~1024px） */
@media (max-width: 1024px) {
  .zhengce-content-wrapper {
    padding: 20px 15px;
  }
  .zhengce-section-subtitle {
    font-size: 1.25em;
    top: -18px; /* 手机小屏适配 */
  }
}

/* 手机区间（<768px） */
@media (max-width: 767px) {
  .zhengce-content-wrapper {
    padding: 15px; /* 窄屏内边距 */
  }
  .zhengce-main-title {
    font-size: 2.2em; /* 小标题 */
    margin-bottom: 50px;
  }
  .zhengce-section-subtitle {
    position: static; /* 表单提示定位 */
    margin-bottom: 10px; /* 平板适配 */
    padding: 0;
    background: none; /* 移除覆盖边框 */
  }
  .zhengce-content-paragraph {
	padding-top: 5px;  
    text-align: left; /* 列表项动画优化 */
    line-height: 1.7;
  }
  /* 列表间距优化 */
  .zhengce-list {
    padding-left: 1.2em; /* 导航链接样式 */
  }
  .zhengce-list > li {
    margin-bottom: 10px; /* 手机端微调 */
    font-size: 0.95em;   /* 手机端微调字号 */
  }
}

/* ===== Controller page top banner (2026-09-09, Amethyst-style centered title) ===== */
.kongzhiq-banner{position:relative;width:100%;height:360px;overflow:hidden;}
.kongzhiq-banner__bg-image{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:1;display:block;}
.kongzhiq-banner__gray-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.35);z-index:2;}
.kongzhiq-banner__title-container{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:3;pointer-events:none;}
.kongzhiq-banner__title-container h1{font-family:'Arial',sans-serif;font-size:48px;font-weight:600;color:#fff;text-align:center;letter-spacing:4px;text-shadow:2px 2px 8px rgba(0,0,0,0.5);margin:0;padding:0 20px;white-space:nowrap;}
@media (max-width:768px){.kongzhiq-banner{height:230px;}.kongzhiq-banner__title-container h1{font-size:32px;letter-spacing:3px;}}
@media (max-width:480px){.kongzhiq-banner{height:180px;}.kongzhiq-banner__title-container h1{font-size:26px;letter-spacing:2px;}}

/* ===== Controller AC 区大块分层（2026-09-09：一级 24px > 块标题 18px > 细分 h5 14px） ===== */
.kongzhiq-category-block{max-width:1160px;margin:0 auto;padding:0 20px;}
/* 相邻大块之间：分隔线 + 间距（块一 Proprietary 与 块二 Traditional 之间） */
.kongzhiq-category-block + .kongzhiq-category-block{margin-top:44px;padding-top:40px;border-top:1px solid #e5e7eb;}
/* AC 大块内层容器取消双重 padding：内容宽度与 DC 区/一级标题一致（1120px → 卡片 4 列 1:1 显示） */
.kongzhiq-category-block .kongzhiq-subcategory-wrap{padding:0;}
.kongzhiq-category-block .kongzhiq-model-grid{margin:0;padding:0;}
.kongzhiq-block-title{display:flex;align-items:center;gap:9px;font-size:18px;font-weight:600;color:#374151;letter-spacing:0.5px;margin:0 0 22px;}
/* DC 板块标题去下边框（单类型板块，保留底部留白） */
.kongzhiq-category-header--plain{border-bottom:none;}
.kongzhiq-block-title::before{content:'';width:20px;height:2px;border-radius:2px;background:#9ca3af;flex:none;}
@media (max-width:768px){.kongzhiq-block-title{font-size:16px;}}
@media (max-width:480px){.kongzhiq-category-block{padding:0 16px;}.kongzhiq-category-block + .kongzhiq-category-block{margin-top:32px;padding-top:30px;}}

/* ===== 波形模式 3x2 规格卡（2026-09-09：上排 icon+文案，下排标题+横线+参数） ===== */
.jishu-wave-card--spec{padding:26px 30px 30px;}
.jishu-wave-card--spec h4{font-size:18px;margin-bottom:10px;}
.jishu-wave-card--spec p{margin-bottom:0;}
.jishu-wave-card--spec .jishu-wave-specs{margin-top:22px;}
@media (max-width:768px){
  /* 单列时按 模式1上/模式1下/模式2上/... 顺序排列 */
  .jishu-wave-card:nth-child(2){order:2;}
  .jishu-wave-card:nth-child(3){order:4;}
  .jishu-wave-card:nth-child(4){order:1;}
  .jishu-wave-card:nth-child(5){order:3;}
  .jishu-wave-card:nth-child(6){order:5;}
}
